@font-face{font-family:Tektur;src:url('/assets/fonts/Tektur.ttf') format('truetype');font-weight:400 900;font-display:swap}
*{box-sizing:border-box}
[hidden]{display:none!important}
:root{color-scheme:dark}
body{margin:0;background:#18191d;color:#dcdee3;font-family:Tektur,Arial,sans-serif;font-synthesis:none;min-height:100svh}
.backdrop{position:fixed;inset:0;z-index:-1;background:#25252d}
.backdrop video{width:100%;height:100%;object-fit:cover;opacity:.7}
.backdrop::after{content:'';position:absolute;inset:0;background:#11121a30}
main{display:flex;flex-direction:column;align-items:center;min-height:calc(100svh - 72px);padding:clamp(64px,12svh,128px) 16px 64px}
h1{font-size:clamp(52px,7.3vw,108px);font-weight:650;letter-spacing:.045em;line-height:1;margin:0;white-space:nowrap;color:#d7d8dc}
.cabinet{position:relative;isolation:isolate;width:min(480px,100%);aspect-ratio:16/9;margin-top:clamp(64px,10svh,104px);flex-shrink:0}
.cabinet canvas{position:absolute;top:0;left:0;display:block;width:100%;height:100%;pointer-events:none}
.drawer{position:absolute;left:4.167%;width:91.666%;height:23.704%;min-height:44px;display:flex;align-items:center;justify-content:center;transform:translateY(-50%);color:#dddfe4;font-size:22px;font-weight:550;letter-spacing:.035em;line-height:1;text-decoration:none;white-space:nowrap;background:transparent;border:0;outline-offset:3px;-webkit-tap-highlight-color:transparent}
.drawer[data-drawer='0']{top:19.259%}.drawer[data-drawer='1']{top:50%}.drawer[data-drawer='2']{top:80.741%}
.drawer:hover{color:#f1f2f4}.drawer:focus-visible{outline:2px solid #cbd0d9;color:#f1f2f4}.drawer:active{color:#fff}


footer{min-height:72px;display:flex;gap:24px;justify-content:flex-end;align-items:center;padding:8px 32px max(16px,env(safe-area-inset-bottom));font-size:14px}
footer a{color:inherit;text-decoration:none;min-height:44px;display:flex;align-items:center}footer a:first-child{margin-right:auto}footer a:hover{text-decoration:underline}
@media(max-width:720px){main{padding-top:max(56px,10svh);padding-bottom:40px}h1{font-size:clamp(52px,17vw,96px);letter-spacing:.01em}.cabinet{width:min(352px,100%);margin-top:clamp(64px,12svh,112px)}.drawer{font-size:18px;letter-spacing:.025em}footer{justify-content:center;gap:0;padding-inline:16px;font-size:12px}footer a{justify-content:center;flex:1}footer a:first-child{margin:0}}
@media(forced-colors:active){.cabinet canvas,.backdrop{display:none}.cabinet{border:1px solid ButtonText}.drawer{border:1px solid ButtonText;color:ButtonText}}
/* Open archive drawers: fixed casing; only the document well scrolls. */
.section-open{overflow:hidden}
.section-open::before{content:'';position:fixed;inset:0;background:#11121b60;z-index:4;pointer-events:none}
.section-panel{position:fixed;z-index:5;inset:32px 0;margin:auto;width:min(880px,calc(100% - 48px));height:min(760px,calc(100dvh - 64px));display:grid;grid-template-rows:80px minmax(0,1fr);padding:0 16px 16px;background:#25262c;isolation:isolate}
.panel-geometry{position:absolute;inset:0;z-index:-1;width:100%;height:100%;pointer-events:none}
.window-bar{position:relative;display:flex;align-items:center;justify-content:flex-end;gap:16px;padding:0 12px;min-width:0}
.window-bar h2{position:absolute;left:44px;right:112px;text-align:left;font-size:24px;letter-spacing:.035em;font-weight:550;color:#e1e2e7;margin:0;line-height:1.15}
.back-button{display:flex;align-items:center;justify-content:center;width:80px;height:44px;flex-shrink:0;font-size:15px;font-weight:550;text-decoration:none;color:#dddfe4;background:transparent;outline-offset:3px}
.back-button:hover{color:#f1f2f4;text-decoration:none}.back-button:focus-visible{outline:2px solid #cbd0d9}
.document-well{min-width:0;min-height:0;padding:12px;display:flex;background:transparent}
.window-content{position:relative;overflow:auto;width:100%;min-width:0;min-height:0;scrollbar-width:none;overscroll-behavior:contain;color:#d3d5dd;outline-offset:-4px;padding-bottom:16px}
.window-content::-webkit-scrollbar{display:none}
.window-content:focus-visible{outline:none}
.window-content:focus-visible::before{content:'';position:sticky;top:0;display:block;width:20px;height:2px;background:#cbd0d9;margin-bottom:-2px}
.profile-section,.archive-series{padding:26px 32px}
.profile-section h3,.archive-heading h3{font-size:16px;font-weight:550;letter-spacing:.025em;line-height:1.4;color:#e1e2e7;margin:0 0 20px}
.biography p{font-size:16px;line-height:1.65;max-width:720px;margin:0 0 16px}
.biography p:last-child{margin-bottom:0}
.macro-divider{height:1px;margin:0 32px;background:#4e525b}
.profile-list{list-style:none;padding:0;margin:0}
.profile-list li{display:grid;grid-template-columns:5ch minmax(0,1fr);gap:24px;padding:15px 0;border-bottom:1px solid #3e424b;font-size:16px;line-height:1.5}
.profile-list li:last-child{border:0}
.profile-list time{white-space:nowrap;color:#aeb4c0}
.profile-list small{display:block;color:#aeb4c0;font-size:16px;line-height:1.5;margin-top:5px}
.archive-heading h3{font-size:16px}
.archive-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:24px;min-height:56px;padding:14px 12px;text-decoration:none;border-top:1px solid #3e424b;font-size:16px;line-height:1.5;color:#d3d5dd}
.archive-row:last-child{border-bottom:1px solid #3e424b}.archive-index{display:none}.archive-action{font-size:16px;color:#aeb4c0;white-space:nowrap}
.archive-row:hover,.music-content a:hover{color:#fff;background:#353942}
.archive-row:focus-visible,.music-content a:focus-visible{outline:2px solid #cbd0d9;outline-offset:-2px}
.music-panel{width:min(640px,calc(100% - 48px));height:376px;max-height:calc(100dvh - 64px)}
.music-content{padding:0 24px}
.music-content a{display:flex;align-items:center;min-height:64px;font-size:16px;line-height:1.3;text-decoration:none;color:#d3d5dd;padding:12px 8px;border-bottom:1px solid #3e424b}
.music-content a:last-child{border:0}
@media(max-width:720px){
 .section-panel{inset:16px 0;width:calc(100% - 24px);height:calc(100svh - 32px);grid-template-rows:72px minmax(0,1fr);padding:0 12px 12px}
 .window-bar{padding-left:8px;gap:8px}.window-bar h2{left:24px;right:96px;font-size:clamp(16px,3.6vw,22px)}.back-button{width:68px;font-size:14px}
 .profile-section,.archive-series{padding:22px 16px}.macro-divider{margin-inline:16px}
 .document-well{padding:8px}
 .profile-section h3,.archive-heading h3{font-size:15px;line-height:1.5}.biography p{font-size:15px;line-height:1.65}
 .profile-list li{gap:12px;font-size:15px;line-height:1.5}.profile-list small{font-size:15px}
 .archive-heading h3{font-size:15px}.archive-row{font-size:15px;gap:12px;min-height:60px}.archive-action{font-size:15px}
 .music-panel{height:356px;max-height:calc(100svh - 32px)}.music-content{padding-inline:12px}.music-content a{font-size:15px}
}
@media(forced-colors:active){.panel-geometry{display:none}.section-panel{background:Canvas;border:1px solid ButtonText}.back-button{border:1px solid ButtonText}.window-content,.window-bar h2,.back-button{color:CanvasText}}



.back-arrow{display:block;width:28px;height:24px;fill:none;stroke:currentColor;stroke-width:2.5;stroke-linecap:square;stroke-linejoin:miter;pointer-events:none}

.music-panel .window-bar h2{left:44px}
@media(max-width:720px){.music-panel .window-bar h2{left:28px}}

/* Archive hierarchy uses spacing rather than rule dividers. */
.macro-divider{display:none}
.profile-list li,.archive-row,.archive-row:last-child,.music-content a{border:0}
.archive-row{position:relative;isolation:isolate;padding-inline:0;background:transparent}
.archive-row::before{content:'';position:absolute;inset:0 -12px;z-index:-1;background:transparent;pointer-events:none}
.archive-row:hover{background:transparent}
.archive-row:hover::before{background:#353942}
.archive-row:focus-visible{outline:none}
.archive-row:focus-visible::before{outline:2px solid #cbd0d9;outline-offset:-2px}
.profile-section+.profile-section,.archive-series+.archive-series{padding-top:38px}
.music-content a{padding-inline:0}
.music-panel .window-bar h2{left:36px}
@media(max-width:720px){.music-panel .window-bar h2{left:20px}}



/* Group separators: a restrained index stroke and recessed continuation. */
.macro-divider{display:block;position:relative;height:2px;margin:18px 32px;background:none}
.macro-divider::before{content:'';position:absolute;left:0;top:0;width:24px;height:2px;background:#777d86}
.macro-divider::after{content:'';position:absolute;left:34px;right:0;top:0;height:1px;background:linear-gradient(90deg,#444a54,#343a43 75%,transparent);box-shadow:0 1px 0 #101216}
.music-content a{position:relative;isolation:isolate;padding-inline:12px;background:transparent}
.music-content a::before{content:'';position:absolute;inset:4px 0;z-index:-1;background:transparent;pointer-events:none}
.music-content a:hover{background:transparent}
.music-content a:hover::before{background:#353942}
.music-content a:focus-visible{outline:none}
.music-content a:focus-visible::before{outline:2px solid #cbd0d9;outline-offset:-2px;background:#353942}
.music-panel .window-bar h2{left:48px}
@media(max-width:720px){.macro-divider{margin-inline:16px}.music-panel .window-bar h2{left:32px}}

.window-content:focus-visible::before{content:none}

/* Archive category labels sit in shallow, recessed strips. */
.macro-divider{display:none}
.profile-section h3,.archive-heading h3{display:block;margin:0 0 22px;padding:10px 12px;background:#282c33;color:#d5d8de;border-top:1px solid #101318;border-bottom:1px solid #424852;box-shadow:inset 0 1px 2px #15181d80;font-size:16px;font-weight:550;line-height:1.45;letter-spacing:.025em}
.profile-section,.archive-series{padding-top:24px;padding-bottom:24px}
.archive-single{padding-top:18px;padding-bottom:18px}
@media(max-width:720px){.profile-section h3,.archive-heading h3{font-size:15px;padding:9px 10px;margin-bottom:18px}.profile-section,.archive-series{padding-top:20px;padding-bottom:20px}}

.profile-section h3,.archive-heading h3{margin-inline:-12px}
@media(max-width:720px){.profile-section h3,.archive-heading h3{margin-inline:-10px}}

.profile-section h3,.archive-heading h3{margin-right:-32px}
@media(max-width:720px){.profile-section h3,.archive-heading h3{margin-right:-12px}}

/* Selection fields terminate at the same right edge as the return control. */
.archive-row::before{right:-32px}
.music-content a::before{right:-24px}
@media(max-width:720px){.archive-row::before{right:-12px}.music-content a::before{right:-8px}}

.music-content a{justify-content:space-between;gap:24px}
.music-name{min-width:0}
.music-action{flex-shrink:0;font-size:16px;line-height:1.5;color:#aeb4c0;white-space:nowrap}
@media(max-width:720px){.music-content a{gap:12px}.music-action{font-size:15px}}

/* Keep the action label and its selection field on the return-control edge. */
.music-content a{margin-right:-24px;padding-right:0}
.music-content a::before{right:0}
@media(max-width:720px){.music-content a{margin-right:-8px}.music-content a::before{right:0}}

/* Matte silver lettering keeps the live type and its sharp silhouette. */
@supports (background-clip:text) or (-webkit-background-clip:text){
 h1{background-image:linear-gradient(#cbd0d6e8,#cbd0d6e8),url('/assets/ui/continuous-worn-steel.png');background-size:100% 100%,260px 260px;background-position:center,35% 42%;background-repeat:no-repeat,repeat;-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;filter:drop-shadow(1px 2px 0 #101319d9)}
}
@media(forced-colors:active){h1{background:none;color:CanvasText;-webkit-text-fill-color:CanvasText;filter:none}}

/* Recessed category plates, subdued to the document surface. */
.profile-section h3,.archive-heading h3{background:linear-gradient(180deg,#22262d 0%,#292e36 100%);border:0;box-shadow:inset 0 1px 0 #0c0f14,inset 1px 0 0 #12161c,inset -1px 0 0 #303640,inset 0 -1px 0 #444b56;padding-block:11px;color:#d5d8df}
@media(max-width:720px){.profile-section h3,.archive-heading h3{padding-block:10px}}

/* Readable fallback when WebGL is unavailable. */
.no-webgl .cabinet{background:#333740;border:2px solid #717780}
.no-webgl .drawer{background:#41464e;box-shadow:inset 0 1px #737984,inset 0 -2px #14171d}
.no-webgl .drawer:hover,.no-webgl .drawer:focus-visible{background:#626873}
.no-webgl .section-panel{background:#50545d}
.no-webgl .document-well{background:#191b20}
.no-webgl .back-button{background:#191b20}
.no-webgl .back-button:hover{background:#2c3038}
.utility-page main{justify-content:center;min-height:100svh;padding:40px 24px;gap:28px}
.utility-page p{max-width:640px;line-height:1.6;text-align:center}
.utility-page .utility-link{color:#dcdee3;background:#292e36;padding:16px 24px;text-decoration:none;box-shadow:inset 0 1px #454c57,inset 0 -2px #111419}
.utility-page .utility-link:hover{background:#404650}
@media(max-height:500px) and (min-width:721px){main{padding-top:28px;padding-bottom:24px}.cabinet{margin-top:28px;width:400px}h1{font-size:64px}}

@media(max-width:720px){.cabinet{min-height:186px}}
