@import url("./archive-study.css");
.hero { min-height:0; }
.cast {position:relative}
.cast figure {height:clamp(370px,72svh,850px)}
.cast video {height:100%; width:100%; object-fit:contain; object-position:center;}
.hero-foot {padding:12px 0 22px; justify-content:flex-end}
.hero .hero-foot h1 {position:absolute;top:68px;left:4.5%;z-index:3;pointer-events:none;font-size:clamp(46px,7.5vw,130px);color:#f4f1e9;mix-blend-mode:difference}
.disc-print {position:absolute;width:100%;left:0;top:0;transform:none;filter:brightness(0);opacity:.83;mix-blend-mode:multiply}
.editorial-room {display:grid;grid-template-columns:minmax(0,1fr) minmax(80px,12%);gap:3vw;padding:2vh 5vw;box-sizing:border-box;perspective:none}
#portraitStage {height:100%;width:100%;min-height:0;object-fit:contain}
#editorialStills {position:static;display:grid;grid-template-rows:repeat(4,minmax(0,1fr));gap:10px}
#editorialStills button {min-height:0;padding:4px;opacity:.6;border:1px solid transparent}
#editorialStills button[aria-pressed=true] {opacity:1;border-color:#c8c6c0}
#editorialStills img {width:100%;height:100%;object-fit:contain}
@media(max-width:700px){.editorial-room{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) 15%;}.editorial-room #editorialStills{grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:1fr}.hero .hero-foot h1{font-size:13vw}}

:root { --bg:#000; }
.statement,.space-preview,.editorial-room,.archive-bar,.cast figure {background:#000}
.cast {gap:0}
.hero::before,.cast figure::after {content:none}
.cast figcaption {background:transparent}
.cast video {mask-image:linear-gradient(to right,transparent,#000 3%,#000 97%,transparent),linear-gradient(to bottom,transparent,#000 2%,#000 98%,transparent);mask-composite:intersect}
#intro[hidden] {display:none}
#intro .silver-loader {height:min(clamp(312px,54vh,540px),95vw,calc(100svh - 145px));width:auto;object-fit:contain}

/* Pressed polycarbonate disc, with a reflective data band and clear hub. */
.disc {
  isolation:isolate;
  background:
    radial-gradient(circle,transparent 0 20%,#ffffff40 20.2%,transparent 20.7% 67.8%,#393b40 68.1%,#e2e2e0 69.1%,#555960 69.8%,transparent 70.5%),
    repeating-radial-gradient(circle,transparent 0 1.1px,#e4ecff0d 1.4px,transparent 2.1px),
    conic-gradient(from 12deg,#777c84 0deg,#31353b 31deg,#606671 48deg,#a1b1b9 60deg,#c3bdc4 65deg,#bec2ba 71deg,#85888a 81deg,#44474b 113deg,#adafae 146deg,#e6e7e4 161deg,#8a8e91 177deg,#4c5058 202deg,#34373b 215deg,#97959d 240deg,#bcc2cd 249deg,#bbc9c2 255deg,#9c9993 264deg,#4c4e55 297deg,#b1b6b8 329deg,#e0e2df 342deg,#777c84 360deg);
  box-shadow:inset 0 0 0 1px #e6e7e3aa,inset 0 -3px 3px #22262a,0 2px 1px #5a5e60,0 9px 16px #0009;
}
.disc::before {
  content:"";position:absolute;inset:36%;border-radius:50%;
  background:radial-gradient(circle,transparent 0 36%,#989da280 38%,#282c30aa 42%,#92989b70 46%,#34383dc9 61%,#85888baa 65%,#c5c8ca8a 68%,#505459 70%,transparent 71%);
  pointer-events:none;
}
.disc::after {inset:44.5%;border:1px solid #a3a6a899;background:#000;box-shadow:0 1px 2px #141719,0 -1px 1px #e8ececcc}

.cast video[src="assets/turn-sync-2.mp4"] {
  filter: brightness(1.035) contrast(1.08);
}

.cast-stage {position:relative}
.hero .cast-stage h1 {position:absolute;z-index:3;left:1%;top:82%;transform:translateY(-50%);pointer-events:none;color:#f4f1e9;mix-blend-mode:difference;font-size:clamp(46px,7.5vw,130px)}

.space-section {padding-inline:0}
.space-section>.section-top {padding-inline:4%}
.space-preview {height:100svh;min-height:0;isolation:isolate;overflow:hidden}
.space-preview>img {height:100%;min-height:0;max-height:none;opacity:1;filter:brightness(.19)}
.space-preview::after {content:"";position:absolute;inset:0;pointer-events:none;background:url("SILMARI_V11/previews/02_V11_after.png") center/cover;opacity:0;mask-image:radial-gradient(ellipse 285px 225px at var(--spot-x,50%) var(--spot-y,50%),#000 0%,#000d 23%,transparent 100%)}
.space-preview.reveal::after {opacity:.8}
.space-caption {z-index:1}
#roomCover {position:absolute;inset:66px 0 0;display:grid;place-items:center;background:linear-gradient(#000a,#000b),url("SILMARI_V11/previews/02_V11_after.png") center/cover;pointer-events:none}
#roomCover[hidden],#roomCover.failed picture {display:none}
#roomCover.failed {background-image:url("SILMARI_V11/previews/02_V11_after.png")}
#roomCover img {width:min(24vw,134px);mix-blend-mode:screen}
#roomCover picture {mix-blend-mode:screen}
#roomMessage {z-index:2;background:#000a;padding:.5em .8em}

#roomCover.failed {display:block;overflow:hidden;pointer-events:auto;touch-action:none;cursor:grab;background:#000}
#roomCover.failed:active {cursor:grabbing}
.room-photo-surface {position:absolute;inset:-12%;background:url("assets/lower-mirror-silk.svg") center / cover no-repeat,url("SILMARI_V11/previews/02_V11_after.png") center / cover no-repeat;transform-origin:center}
#roomCover .room-photo-mark {position:absolute;width:clamp(46px,7%,105px);height:auto;transform:translate(-50%,-50%) scale(var(--stamp-scale,1.57));pointer-events:none;filter:brightness(.92);mix-blend-mode:soft-light;opacity:.95}
#roomMessage {pointer-events:none}

#roomCover:not(.failed) {background:#050505}
#roomCover:not(.failed) img {width:min(30vw,200px)}
#roomCover:not([hidden]):not(.failed) + #roomMessage {bottom:auto;top:calc(50% + min(17vw,114px) + 32px);left:0;width:100%;text-align:center;background:none;letter-spacing:.12em}

#crawlLoader {width:min(100%,1000px);max-height:68dvh;object-fit:contain;mask-image:radial-gradient(ellipse,#000 44%,transparent 74%)}
#roomCover.failed #crawlLoader {display:none}
#roomCover:has(#crawlLoader):not(.failed) + #roomMessage {top:auto;bottom:9%}

#roomCover .entry-film {position:absolute;inset:0;display:grid;place-items:center;background:#050505;z-index:1;pointer-events:none}
#roomCover .entry-film[hidden] {display:none}
#roomCover .entry-film #crawlLoader {display:block}
#roomCover.room-ready {background:transparent}

/* Feather all four edges of the low-angle shot into the room. */
#roomCover .entry-film #crawlLoader {
  mask-image:linear-gradient(to right,transparent,#000 12%,#000 88%,transparent),
             linear-gradient(to bottom,transparent,#000 18%,#000 72%,transparent);
  mask-composite:intersect;
}

.orbit-photo img[src^="assets/art-8"] {object-fit:contain}

.orbit-photo {left:var(--orbit-x);top:var(--orbit-y)}
.orbit-photo:is(:hover,:focus-visible) {
  --preview-size:min(480px,76vw,68svh);
  --edge:calc(var(--preview-size) / 2 + 4px);
  width:var(--preview-size);height:var(--preview-size);
  left:clamp(var(--edge),var(--orbit-x),calc(100% - var(--edge)));
  top:clamp(var(--edge),var(--orbit-y),calc(100% - var(--edge)));
  transform:translate(-50%,-50%) !important;
  transition:box-shadow .2s;
}
.orbit-photo:is(:hover,:focus-visible) img {object-fit:contain}

#archive[open] #archiveContent {animation:none}
#archive .archive-grid img {height:auto}
@media(prefers-reduced-motion:no-preference) {
  #archive[open] .archive-grid figure:first-child {animation:album-lead-in 180ms ease-out}
  @keyframes album-lead-in {from {opacity:.85;transform:translateY(4px)}}
}

#viewer .beat-toggle {position:absolute;top:25px;left:4%;z-index:1}
.beat-toggle {font-size:10px;letter-spacing:.08em}
