/* A single full-viewport film: navigation, typography and actions share the image. */
.ocean-theme .topbar { position: fixed; inset: 0 0 auto; width: 100%; min-height: 84px; padding: 16px clamp(22px,2.8vw,44px); border: 0; box-shadow: none; background: #0b172ae6; transition: background .35s,backdrop-filter .35s; }
.ocean-theme.header-over-media .topbar { background: transparent; backdrop-filter: none; -webkit-backdrop-filter: none; }
.ocean-theme .brand { gap: 0; }
.ocean-theme .brand-mark,.ocean-theme .brand-divider,.ocean-theme .brand-caption { display: none; }
.ocean-theme .brand-name { font-size: 18px; font-weight: 600; letter-spacing: .25em; color: #fff; }
.ocean-theme .main-nav { margin-left: 58px; margin-right: auto; gap: 30px; }
.ocean-theme .main-nav a { color: #ffffffe0; font-size: 12px; font-weight: 400; }
.ocean-theme .main-nav a:hover,.ocean-theme .main-nav a[aria-current] { color: #fff; }
.ocean-theme .main-nav a[aria-current]::after { height: 1px; box-shadow: none; background: #ffffffb3; }
.ocean-theme .top-actions { margin-left: auto; gap: 6px; }
.ocean-theme .top-actions > .icon-button { color: #ffffffd9; }
.ocean-theme .top-actions .header-cta { background: transparent; box-shadow: none; border: 0; border-radius: 0; color: #fff; padding-inline: 8px; margin: 0 6px; }
.ocean-theme .top-actions .header-cta:hover { background: transparent; box-shadow: none; transform: none; }
.ocean-theme .hero { --hero-edge: clamp(22px,2.8vw,44px); height: 100svh; min-height: 540px; width: 100%; max-width: none; margin: 0; padding: 0; display: block; background: #0b1930; }
.ocean-theme .hero::after,.ocean-theme .hero-aura { display: none; }
.ocean-theme .hero-stage { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; border: 0; border-radius: 0; mask-image: none; -webkit-mask-image: none; }
.ocean-theme .hero-stage > .hero-poster,.ocean-theme .hero-stage > .hero-video { inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 56% 42%; filter: none; transform: none; opacity: 1; }
.ocean-theme .stage-wash { z-index: 2; background: linear-gradient(180deg,#020a195c 0%,transparent 27%,transparent 43%,#020b1b45 62%,#020b1bcb 100%); }
.ocean-theme .stage-edition,.ocean-theme .stage-bottom { display: none; }
.ocean-theme .hero-copy { position: absolute; z-index: 4; inset: 0; width: 100%; padding: 0; }
.ocean-theme .hero .eyebrow { position: absolute; top: calc(var(--header-height,84px) + 30px); left: var(--hero-edge); margin: 0; color: #ffffffbc; font-size: 10px; letter-spacing: .13em; font-weight: 400; }
.ocean-theme .hero .eyebrow-star,.ocean-theme .hero .eyebrow-rule { display: none; }
.ocean-theme .hero h1 { position: absolute; left: var(--hero-edge); right: 260px; bottom: 187px; margin: 0; max-width: none; color: #fff; font-size: clamp(36px,4.1vw,64px); line-height: 1.18; font-weight: 400; letter-spacing: -.035em; text-shadow: 0 2px 24px #00000025; }
.ocean-theme .hero h1 > span { display: inline-block; }
.ocean-theme .hero-description { position: absolute; left: var(--hero-edge); bottom: 128px; margin: 0; color: #ffffffc4; font-size: 12px; line-height: 1.9; text-shadow: 0 1px 15px #00000040; }
.ocean-theme .hero-actions { position: absolute; right: var(--hero-edge); bottom: 132px; display: flex; flex-direction: column; align-items: flex-end; gap: 14px; margin: 0; }
.ocean-theme .hero-actions .button-primary { min-height: 54px; padding: 0; gap: 24px; color: #fff; background: transparent; border: 0; border-radius: 0; box-shadow: none; font-size: 13px; font-weight: 400; }
.ocean-theme .hero-actions .button-primary > span { display: grid; gap: 5px; }
.ocean-theme .hero-actions .button-primary small { color: #ffffff8c; font-size: 10px; font-weight: 400; }
.ocean-theme .hero-actions .button-primary > svg { box-sizing: content-box; width: 22px; height: 22px; padding: 16px; border: 1px solid #ffffff7d; border-radius: 50%; transition: transform .3s,background .3s; }
.ocean-theme .hero-actions .button-primary:hover { transform: none; background: transparent; box-shadow: none; }
.ocean-theme .hero-actions .button-primary:hover > svg { transform: rotate(45deg); background: #ffffff18; }
.ocean-theme .hero .listen-button { min-height: 34px; color: #ffffffad; font-size: 10px; gap: 9px; }
.ocean-theme .hero .listen-icon { width: 28px; height: 28px; border-color: #ffffff50; }
.ocean-theme .hero .listen-icon svg { width: 12px; height: 12px; }
.ocean-theme .hero-facts { position: absolute; left: var(--hero-edge); bottom: 42px; display: flex; align-items: center; gap: 32px; margin: 0; }
.ocean-theme .hero-facts > div { display: flex; flex-direction: row; align-items: baseline; gap: 8px; }
.ocean-theme .hero-facts strong { font-size: 14px; color: #ffffffcf; letter-spacing: 0; }
.ocean-theme .hero-facts span:not(.fact-divider) { font-size: 9px; color: #ffffff8c; }
.ocean-theme .hero-facts .fact-divider { display: none; }
.ocean-theme .hero-scroll { position: absolute; bottom: 37px; right: var(--hero-edge); display: inline-flex; margin: 0; font-size: 9px; color: #ffffffa8; }
.ocean-theme .hero-media-control { top: auto; bottom: 37px; right: calc(var(--hero-edge) + 165px); padding: 8px 0; min-height: 32px; border: 0; border-radius: 0; background: transparent; backdrop-filter: none; -webkit-backdrop-filter: none; font-size: 9px; color: #ffffffb3; }
.ocean-theme .hero-media-control:hover { background: transparent; color: #fff; }
.ocean-theme .hero .button-primary:focus-visible { outline: 2px solid white; outline-offset: 6px; }
.site-refreshed.ocean-theme.header-over-hero .atmosphere-toggle { top: calc(var(--header-height,84px) + 16px); right: clamp(22px,2.8vw,44px); bottom: auto; left: auto; background: transparent; backdrop-filter: none; -webkit-backdrop-filter: none; border-color: transparent; box-shadow: none; color: #ffffffb3; }
@media(max-width:1100px) {
 .ocean-theme .main-nav { margin-left: 30px; gap: 22px; }
 .ocean-theme .hero h1 { right: 240px; font-size: 44px; }
}
@media(max-width:960px) {
 .ocean-theme .topbar { min-height: 74px; padding-block: 12px; }
 .ocean-theme .main-nav { margin: 0; background: #071221f5; backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); }
 .ocean-theme .main-nav.open { gap: 10px; padding: 18px var(--hero-edge,22px); }
 .ocean-theme .main-nav a { border: 0; }
}
@media(max-width:700px) {
 .ocean-theme .hero { min-height: 540px; }
 .ocean-theme .hero-stage > .hero-poster,.ocean-theme .hero-stage > .hero-video { object-position: 55% center; }
 .ocean-theme .stage-wash { background: linear-gradient(180deg,#020a196b 0%,transparent 25%,transparent 38%,#020b1b66 62%,#020b1be0 100%); }
 .ocean-theme .hero .eyebrow { top: calc(var(--header-height,68px) + 24px); font-size: 8px; letter-spacing: .11em; }
 .ocean-theme .hero h1 { left: var(--hero-edge); right: var(--hero-edge); bottom: 251px; font-size: clamp(30px,7.7vw,46px); line-height: 1.2; }
 .ocean-theme .hero h1 > span { display: block; }
 .ocean-theme .hero-description { bottom: 190px; font-size: 11px; line-height: 1.8; }
 .ocean-theme .hero-actions { left: var(--hero-edge); right: var(--hero-edge); bottom: 101px; flex-direction: row; justify-content: space-between; align-items: center; gap: 16px; }
 .ocean-theme .hero-actions .button-primary { gap: 14px; font-size: 12px; }
 .ocean-theme .hero-actions .button-primary > svg { width: 18px; height: 18px; padding: 13px; }
 .ocean-theme .hero-actions .button-primary small { font-size: 9px; }
 .ocean-theme .hero-facts { bottom: max(29px,env(safe-area-inset-bottom)); gap: 20px; }
 .ocean-theme .hero-facts > div { flex-direction: column; gap: 2px; }
 .ocean-theme .hero-facts strong { font-size: 14px; }
 .ocean-theme .hero-facts span:not(.fact-divider) { font-size: 8px; }
 .ocean-theme .hero-media-control { bottom: max(26px,env(safe-area-inset-bottom)); right: var(--hero-edge); }
 .ocean-theme .hero-scroll { display: none; }
}
@media(max-width:520px) {
 .ocean-theme .topbar { min-height: 68px; padding-inline: 18px; gap: 8px; }
 .ocean-theme .brand-name { font-size: 16px; letter-spacing: .17em; }
 .ocean-theme .top-actions { gap: 1px; }
 .ocean-theme .top-actions > .icon-button { width: 34px; flex-basis: 34px; }
 .ocean-theme .top-actions .header-cta { display: none; }
 .ocean-theme .main-nav.open { grid-template-columns: repeat(3,1fr); }
}
@media(max-height:600px) and (min-width:701px) {
 .ocean-theme .hero { min-height: 100svh; }
 .ocean-theme .hero h1 { font-size: 34px; bottom: 160px; }
 .ocean-theme .hero-description { bottom: 106px; }
 .ocean-theme .hero-actions { bottom: 108px; }
 .ocean-theme .hero-facts { bottom: 24px; }
 .ocean-theme .hero-scroll,.ocean-theme .hero-media-control { bottom: 19px; }
}
@media(prefers-reduced-motion:reduce) { .ocean-theme .topbar,.ocean-theme .hero * { animation: none !important; transition: none !important; } }

/* One continuous sea. Fade the media itself so its edge shares the page background. */
.ocean-theme .hero { background: transparent; }
.ocean-theme .hero-stage {
 -webkit-mask-image: linear-gradient(to bottom,#000 0%,#000 58%,#000e 72%,#0007 88%,transparent 100%);
 mask-image: linear-gradient(to bottom,#000 0%,#000 58%,#000e 72%,#0007 88%,transparent 100%);
}
.ocean-theme .hero-stage > .hero-poster,.ocean-theme .hero-stage > .hero-video { transform: translate3d(0,var(--hero-drift,0px),0) scale(1.045); }
.ocean-theme .tide-divider { min-height: 64px; background: none; border: 0; }
.ocean-theme .tide-line { opacity: .18; }
.site-refreshed.ocean-theme :is(.schedule-section,.community-section,.gallery-section,.fan-intro) { background: transparent; border: 0; box-shadow: none; }
.ocean-theme .music-inner { background: transparent; border-color: transparent; box-shadow: none; border-radius: 0; padding-block: 20px; }
.ocean-theme .music-section { margin-bottom: 44px; }
.ocean-theme .workspace { padding-bottom: 32px; }
.ocean-theme :is(.schedule-inner,.community-inner,.fan-intro-inner) { padding-block: 32px; }
.ocean-theme #gallery .gallery-inner { padding-top: 32px; padding-bottom: 24px; }
.ocean-theme .note-universe { background: radial-gradient(ellipse at 50% 48%,#b2c9e509,transparent 70%); border: 0; border-radius: 0; }
/* The archive remains full-frame, with feathered edges behind its overlay controls. */
#gallery .archive-cinema { background: transparent; }
#gallery .archive-picture { -webkit-mask-image: none; mask-image: none; }
/* Paint the edge fade directly instead of masking a full-screen blurred layer. */
#gallery .archive-picture::after { background: linear-gradient(180deg,#09162d 0%,#02071255 12%,transparent 30%,#030b1938 57%,#09162d 100%); }
.ocean-theme .footer { border-top-color: transparent; }
.ocean-theme .reveal-ready { transform: translateY(18px); transition: opacity .85s ease,transform 1.1s cubic-bezier(.16,1,.3,1); }
.ocean-theme .reveal-ready.is-visible { transform: none; }

/* Light lead-in / semibold subject: hierarchy without oversized block headings. */
.site-refreshed.ocean-theme .section-heading h2 { font-weight: 600; font-size: clamp(28px,3.2vw,44px); letter-spacing: -.035em; line-height: 1.45; color: #e7effa; }
.site-refreshed.ocean-theme .section-heading h2 .heading-soft { font-weight: 350; }
.ocean-theme .music-copy h2 { font-weight: 600; }
.ocean-theme .music-copy h2 > span { font-weight: 400; }
.ocean-theme :where(h1,h2,h3,h4,p,span,strong,small,a,button,summary,label,li,dt,dd,time,legend,td) { transition: color .22s ease,text-shadow .22s ease; }
/* Delegated pointer/focus feedback also covers dynamically loaded songs and albums. */
.ocean-theme :is(.text-hovered,.text-focused),
.ocean-theme :is(.text-hovered,.text-focused) :where(span,strong,small,time,em,b) { color: #d0ecff !important; -webkit-text-fill-color: currentColor; text-shadow: 0 0 1px #e7f5ff,0 0 13px #9dccff8c !important; }
.ocean-theme :is(.text-hovered,.text-focused).text-ink,
.ocean-theme :is(.text-hovered,.text-focused).text-ink :where(span,strong,small,time,em,b) { color: #07172f !important; text-shadow: 0 0 10px #ffffffa6 !important; }
.ocean-theme :is(a,button,summary):focus-visible { outline: 2px solid #b9ddff; outline-offset: 5px; }
@media(max-width:700px) {
 .ocean-theme .hero-stage { -webkit-mask-image: linear-gradient(to bottom,#000 0%,#000 55%,#000b 76%,transparent 100%); mask-image: linear-gradient(to bottom,#000 0%,#000 55%,#000b 76%,transparent 100%); }
 .ocean-theme .music-section { margin-bottom: 28px; }
 .ocean-theme .tide-divider { min-height: 48px; }
 .ocean-theme .workspace { padding-bottom: 22px; }
 .ocean-theme :is(.schedule-inner,.community-inner,.fan-intro-inner),.ocean-theme #gallery .gallery-inner { padding-top: 24px; padding-bottom: 24px; }
 .site-refreshed.ocean-theme .section-heading h2 { font-size: 26px; }
 .ocean-theme .music-inner { padding-inline: 0; }
}
.ocean-theme.motion-paused .hero-stage > .hero-poster,.ocean-theme.motion-paused .hero-stage > .hero-video { transform: none; }
@media(prefers-reduced-motion:reduce) {
 .ocean-theme .hero-stage > .hero-poster,.ocean-theme .hero-stage > .hero-video { transform: none; }
 .ocean-theme .reveal-ready { opacity: 1; transform: none; transition: none; }
 .ocean-theme :where(h1,h2,h3,h4,p,span,strong,small,a,button,summary,label,li,dt,dd,time,legend,td) { transition: none; }
}

/* The visible hero is a full-resolution canvas; its decoder never enters the DOM. */
#heroCanvas { pointer-events: none; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; }
.ocean-theme .hero-stage > #heroCanvas:not([data-ready]) { opacity: 0; }