html {
    background: #020a12;
    overflow-x: hidden
}

body,
body.board-body,
body:has(.live-page),
.live-page {
    background: transparent
}

.sea-bg {
    position: fixed;
    inset: 0;
    z-index: -1;
    overflow: hidden;
    pointer-events: none;
    background: radial-gradient(120% 70% at 50% -10%, #0f4a6b 0%, #072b44 28%, #041a2c 55%, #020a12 100%);
}

.sea-bg>* {
    position: absolute
}

.sea-tint {
    inset: 0;
    background: radial-gradient(60% 40% at 15% 85%, rgba(20, 120, 140, .18), transparent 70%), radial-gradient(55% 40% at 88% 75%, rgba(40, 60, 160, .2), transparent 70%);
}

.sea-canvas {
    inset: 0;
    width: 100%;
    height: 100%;
    display: block
}

.sea-bottom {
    left: 0;
    right: 0;
    bottom: 0;
    height: 45%;
    background: linear-gradient(to bottom, transparent, rgba(2, 8, 14, .85));
}

.sea-side {
    inset: 0;
    background: linear-gradient(to right, rgba(2, 8, 14, .55) 0%, transparent 18%, transparent 82%, rgba(2, 8, 14, .55) 100%);
}

.sea-center {
    inset: 0;
    background: radial-gradient(ellipse 50% 70% at 50% 45%, rgba(2, 10, 18, .45), transparent 75%);
}

.sea-bar {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    pointer-events: none
}

.member-bar {
    background: radial-gradient(120% 70% at 50% -10%, #0f4a6b 0%, #072b44 28%, #041a2c 55%, #020a12 100%);
}

.gnb {
    background: radial-gradient(120% 70% at 50% -10%, #0f4a6b 0%, #072b44 28%, #041a2c 55%, #020a12 100%);
}
