@import url('https://fonts.googleapis.com/css2?family=Golos+Text:wght@400;450;500;550;600&family=IBM+Plex+Mono:wght@400;500&display=swap');
:root{color-scheme:light;--paper:#eeede8;--ink:#333430;--muted:#85867d;--line:#d6d6ce;--mono:'IBM Plex Mono',monospace;--sans:'Golos Text',Arial,sans-serif;--accent:#dc754a}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,canvas:focus-visible{outline:2px solid #6b7567;outline-offset:6px}button[hidden],a[hidden],div[hidden]{display:none!important}::selection{background:#cbd4bd}
.exhibition{height:100svh;min-height:740px;display:flex;flex-direction:column;padding:0 48px;overflow:hidden}
.header{height:100px;flex:none;display:flex;justify-content:space-between;align-items:center;z-index:2}.brand{display:inline-flex;align-items:center}.brand img{width:130px;height:auto;filter:brightness(0);opacity:.8}.header-note{font-size:12px;letter-spacing:.01em;display:flex;align-items:center;gap:10px;color:#74766d}.live-dot{width:5px;height:5px;background:#8a9979;border-radius:50%}
main{position:relative;flex:1;min-height:0;display:flex;flex-direction:column;align-items:center}.stage{width:100%;position:relative;min-height:260px;flex:1}#scene{width:100%;height:100%;display:block;cursor:grab;touch-action:none;opacity:0;transition:opacity .8s}#scene.ready{opacity:1}#scene.dragging{cursor:grabbing}.scene-loader{position:absolute;left:50%;top:45%;width:38px;height:38px;margin:-19px;display:grid;place-items:center}.scene-loader span{width:22px;height:22px;border:1px solid #a9afa4;transform:rotate(30deg);animation:loading 1.8s ease-in-out infinite}.scene-loader.done{display:none}@keyframes loading{50%{transform:rotate(120deg);border-radius:6px;opacity:.35}100%{transform:rotate(210deg)}}
.reset-control{position:absolute;right:calc(50% - 270px);bottom:30px;border:1px solid #d5d7ce;background:#f5f4efbb;border-radius:50%;width:36px;height:36px;display:grid;place-items:center;transition:background .2s,transform .2s}.reset-control:hover{background:#fff;transform:rotate(-20deg)}.reset-control svg{width:17px;height:17px}
.project-info{height:132px;flex:none;text-align:center;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding-top:0;gap:12px}.info-kicker{font:9px var(--mono);letter-spacing:1.7px;color:var(--muted)}h1{font-size:25px;font-weight:450;letter-spacing:-.85px;margin:9px 0 8px;line-height:1.1}.project-info p{font-size:12px;color:#888a80;line-height:1.5;margin:0}.open-project{display:flex;align-items:center;gap:24px;background:#353a32;color:#fafbf7;border-radius:25px;padding:11px 19px;font-size:11px;transition:background .2s,transform .2s}.open-project:hover{background:#515d48;transform:translateY(-2px)}.open-project span{font-size:16px;line-height:12px}.project-info.selected h1{margin:6px 0}.project-info.selected{gap:10px}.project-info.selected .info-kicker{color:var(--accent)}
.project-dock{display:flex;align-items:center;justify-content:center;gap:4px;flex:none;padding:8px;background:#f6f5f1a6;border:1px solid #ffffffb0;box-shadow:0 5px 22px #333b2610,0 1px 1px #333b2607;border-radius:18px;margin:7px 0 28px;max-width:100%}.project-tab,.future-tab{border:0;background:transparent;display:flex;align-items:center;position:relative;transition:background .25s,box-shadow .25s,color .25s;border-radius:11px;height:49px}.project-tab{padding:0 19px;gap:18px;min-width:175px;justify-content:space-between}.project-tab:hover,.future-tab:hover{background:#ffffffa0}.project-tab[aria-pressed=true],.future-tab[aria-pressed=true]{background:#fff;box-shadow:0 2px 7px #444d3610}.tab-number{font:10px var(--mono);color:#989b91}.tab-name{font-size:12px;white-space:nowrap;font-weight:500}.project-dot{width:6px;height:6px;border-radius:50%;margin-left:9px}.orange{background:#dc754a}.violet{background:#9a89c8}.green{background:#86a96d}.dock-divider{height:24px;width:1px;background:var(--line);margin:0 7px}.future-tab{font:10px var(--mono);color:#9b9f93;width:37px;justify-content:center}
footer{height:62px;flex:none;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:20px;font:8px var(--mono);letter-spacing:1px;color:#898c80}.footer-center{display:flex;align-items:center;gap:18px}.footer-line{height:1px;width:30px;background:#b8bdaf}#face-count{color:#53594d}.fallback{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;color:#6c7860}.fallback-symbol{font-size:150px;font-weight:400;line-height:1}.fallback p{font-size:20px}.fallback span{font-size:12px;color:var(--muted)}.no-script{display:flex;gap:25px;padding:20px;font-size:13px}
@media(min-height:950px){.exhibition{padding:0 64px}.header{height:120px}.project-info{height:146px}.project-dock{margin-bottom:45px}footer{height:76px}}
@media(max-width:900px){.exhibition{padding:0 28px}.project-tab{min-width:145px;padding:0 13px;gap:10px}.project-dot{margin-left:1px}.future-tab{width:27px}.project-dock{gap:1px}.footer-center{gap:10px}.footer-line{width:14px}}
@media(max-width:680px){.exhibition{padding:0 22px;height:100svh;min-height:680px}.header{height:78px}.brand img{width:110px}.header-note{font-size:10px;max-width:135px;line-height:1.5;gap:7px}.live-dot{flex:none}.stage{min-height:260px;width:calc(100% + 44px)}.reset-control{right:23px;bottom:14px;width:32px;height:32px}.project-info{height:125px}h1{font-size:22px}.project-info p{font-size:11px}.project-dock{width:100%;border-radius:15px;flex-wrap:wrap;padding:6px;gap:3px;margin:10px 0 18px;max-width:430px}.project-tab{min-width:0;flex:1 1 29%;height:48px;gap:6px;padding:0 8px;justify-content:center}.tab-name{font-size:10px}.tab-number{font-size:8px}.project-dot{width:4px;height:4px;position:absolute;bottom:6px;left:50%;margin:0}.dock-divider{flex-basis:100%;height:1px;background:#dddfd5;margin:1px 8px 0}.future-tab{height:23px;width:38px;font-size:9px}footer{height:49px;font-size:7px;letter-spacing:.65px}.footer-center{display:none}.info-kicker{font-size:8px}.open-project{padding:10px 17px;font-size:10px}.no-script{flex-wrap:wrap}}
@media(max-height:720px) and (min-width:681px){.exhibition{min-height:600px}.header{height:70px}.project-info{height:122px}.project-dock{margin-bottom:18px}footer{height:42px}.stage{min-height:230px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
/* The fourth project and the sixth face are now part of the collection. */
.blue{background:#688ba4}.clock-tab{display:flex;align-items:center;justify-content:center;gap:12px;height:49px;padding:0 15px;border:0;border-radius:11px;background:transparent;color:#636b72;font-size:11px;white-space:nowrap;transition:background .25s,box-shadow .25s}.clock-tab:hover{background:#ffffffa0}.clock-tab[aria-pressed=true]{background:#fff;box-shadow:0 2px 7px #444d3610}.clock-tab svg{width:16px;height:16px;stroke:currentColor;stroke-width:1.15;stroke-linecap:round;stroke-linejoin:round}.clock-meta{display:flex;align-items:center;gap:12px;font:8px var(--mono);letter-spacing:1px;color:#7b8286}.clock-meta time{font:12px var(--mono);letter-spacing:1px;color:#525a61}.project-tab{min-width:152px;padding:0 15px;gap:12px}
@media(max-width:1050px) and (min-width:681px){.project-tab{min-width:122px;padding:0 10px;gap:8px}.tab-name{font-size:11px}.project-dot{margin-left:0}.clock-tab{padding:0 10px;gap:6px}.future-tab{width:25px}.dock-divider{margin:0 4px}.project-dock{gap:1px}}
@media(max-width:820px){.project-dock{flex-wrap:wrap;width:min(100%,520px)}.project-tab{flex:1 1 42%;min-width:0;justify-content:space-between;padding:0 16px;gap:12px}.dock-divider{flex-basis:100%;height:1px;margin:1px 8px 0}.future-tab{height:32px;width:42px}.clock-tab{height:32px;padding:0 16px}.project-dock{margin-bottom:18px}.project-dot{position:static;margin-left:4px;flex:none}.tab-name{font-size:11px}.tab-number{font-size:9px}.project-info{height:125px}}
@media(max-width:680px){.exhibition{min-height:710px}.project-tab{height:37px}.project-dot{width:5px;height:5px}.clock-tab svg{width:14px;height:14px}.clock-meta{gap:8px;font-size:7px}.clock-meta time{font-size:11px}}
/* Retro radio switches: a slanted shell, a brief scan burst, then a steady glow. */
.project-dock{gap:12px;padding:9px 13px;background:none;border:0;box-shadow:none;border-radius:0;overflow:visible}
.project-dock button{isolation:isolate;border:0;border-radius:0;background:transparent!important;box-shadow:none!important;height:49px;position:relative;transition:transform .2s ease,color .2s ease;color:#eeefee}
.project-dock button::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:8px;transform:skewX(-13deg);background:#292d34;border:1px solid #24282e;box-shadow:inset 0 1px #ffffff12,0 3px 0 #11151a0c;transition:background .24s ease,border-color .24s ease,box-shadow .24s ease}
.project-dock button:hover{transform:translateY(-2px)}
.project-dock button:hover::before{background:#353b45;border-color:#66707a}
.project-dock button[aria-pressed=true]{color:#242a30}
.project-dock button[aria-pressed=true]::before{background:var(--button-color);border-color:color-mix(in srgb,var(--button-color) 65%,white);box-shadow:0 0 9px color-mix(in srgb,var(--button-color) 50%,transparent),0 0 27px color-mix(in srgb,var(--button-color) 38%,transparent),inset 0 1px #ffffff6b}
.project-dock .tab-name,.clock-tab>span:not(.button-burst),.future-tab{font-family:var(--mono);font-size:11px;font-weight:500;font-style:italic}
.project-dock .tab-number{font:8px var(--mono);color:currentColor;opacity:.43}.project-dock .project-dot{width:4px;height:4px;opacity:.7}.project-dock [aria-pressed=true] .project-dot{background:currentColor}
.project-dock .dock-divider{width:1px;margin:0 5px;height:25px;opacity:.65}.project-dock .future-tab{color:#979da4;width:45px;font-size:10px}.project-dock .future-tab::before{background:#393d43}.project-dock .future-tab[aria-pressed=true]{color:#242a30}
.project-tab{min-width:157px;padding:0 14px}.clock-tab{padding:0 16px;gap:10px}.project-dock button:focus-visible{outline-color:var(--button-color);outline-offset:7px}
.button-burst{position:absolute;inset:-1px;pointer-events:none;overflow:hidden;border-radius:8px;transform:skewX(-13deg);opacity:0;z-index:2;color:var(--button-color)}
.button-burst svg{width:100%;height:100%;stroke:none}.button-burst path{fill:none;stroke:currentColor;stroke-width:4;stroke-dasharray:41 13 68 18 27 8;stroke-dashoffset:0}
.switching .button-burst{animation:signal-burst .76s steps(1,end) both}.switching .button-burst path{animation:scan-travel .76s linear both}.project-dock button.switching::before{animation:switch-power .76s both}.switching .tab-name{animation:label-lock .7s both}
@keyframes scan-travel{0%{stroke-dashoffset:220;transform:translateX(-28px)}30%{stroke-dashoffset:150;transform:translateX(20px)}70%{stroke-dashoffset:35;transform:translateX(-8px)}100%{stroke-dashoffset:-80;transform:translateX(0)}}
@keyframes signal-burst{0%{opacity:.2;clip-path:inset(60% 0 0)}12%{opacity:1;clip-path:inset(0)}25%{opacity:.8;clip-path:inset(0 0 25%)}40%{opacity:1;clip-path:inset(15% 0 0)}58%{opacity:.6;clip-path:inset(0)}76%{opacity:.3;clip-path:inset(0 0 60%)}100%{opacity:0;clip-path:inset(0)}}
@keyframes switch-power{0%,20%{background:#252a33;box-shadow:0 0 18px color-mix(in srgb,var(--button-color) 45%,transparent)}35%{background:color-mix(in srgb,var(--button-color) 40%,#252a33)}50%{background:#252a33}70%,100%{background:var(--button-color)}}
@keyframes label-lock{0%{opacity:.65;text-shadow:-2px 0 #8ddbea,2px 0 #cf817d}23%{transform:translateX(1px)}45%{transform:translateX(-1px);opacity:.9}75%,100%{transform:none;opacity:1;text-shadow:none}}
@media(max-width:1100px) and (min-width:821px){.project-tab{min-width:132px;padding:0 10px}.project-dock{gap:9px}.project-dock .tab-name{font-size:10px}.clock-tab{padding:0 12px;gap:7px}.project-dock .future-tab{width:35px}}
@media(max-width:820px){.project-dock{width:min(100%,500px);column-gap:15px;row-gap:12px;padding:8px 7px;margin-top:8px}.project-tab{flex:1 1 42%;min-width:0;padding:0 16px}.project-dock button{height:39px}.project-dock .dock-divider{flex-basis:100%;height:0;margin:0;opacity:0}.project-dock .future-tab{height:33px;width:52px;margin-top:-4px}.project-dock .clock-tab{height:33px;margin-top:-4px;min-width:108px}.project-dock .tab-name{font-size:11px}.project-dock .button-burst svg{height:100%;width:100%}.exhibition{min-height:745px}.project-dock .project-dot{width:4px;height:4px}}
@media(max-width:360px){.project-dock{column-gap:12px}.project-tab{padding:0 10px}.project-dock .tab-name{font-size:10px}.project-dock .tab-number{font-size:7px}}
@media(prefers-reduced-motion:reduce){.project-dock button:hover{transform:none}.button-burst{display:none}}
/* Four studio backgrounds, with one independent neon switch for each palette. */
:root{--reset-bg:#f5f4efbb;--reset-hover:#fff;--logo-color:#343630;--switch-shell:#d4d4cf;--switch-thumb:#eeeeea}
:root[data-theme=graphite]{color-scheme:dark;--paper:#14181e;--ink:#e8edf1;--muted:#919fae;--line:#303b46;--reset-bg:#252d37cc;--reset-hover:#364450;--logo-color:#e5eef4;--switch-shell:#22282f;--switch-thumb:#3b434d}


body{transition:background-color .65s ease,color .4s ease}.project-info p,.clock-meta,footer{color:var(--muted)}.clock-meta time{color:var(--ink)}.reset-control{border-color:var(--line);background:var(--reset-bg)}.reset-control:hover{background:var(--reset-hover)}footer{justify-content:flex-end}
.brand{position:relative;color:var(--logo-color);touch-action:none;user-select:none}.brand-source{display:block;width:130px;height:auto;overflow:visible}.brand-canvas{position:absolute;left:-48px;top:-48px;pointer-events:none}.signature-ready .brand-source{opacity:0}
.theme-picker{display:flex;gap:20px;align-items:center}.theme-switch{--neon:#b4d394;display:flex;flex-direction:column;align-items:center;gap:8px;padding:5px 3px;background:none;border:0;min-width:60px}
.theme-switch[data-theme-choice=graphite]{--neon:#7bdde8}
.neon-toggle{position:relative;display:block;width:60px;height:32px;border-radius:20px;background:var(--switch-shell);box-shadow:inset 2px 3px 6px #0003,inset -1px -1px 2px #fff3,0 1px 0 #ffffff20;transition:background .5s}
.neon-toggle svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;transform:rotate(180deg)}.neon-toggle rect{fill:none;stroke:var(--neon);stroke-width:1.7;stroke-dasharray:100;stroke-dashoffset:100;transition:stroke-dashoffset .65s cubic-bezier(.2,.8,.2,1),filter .4s;opacity:.4}
.toggle-thumb{position:absolute;left:6px;top:6px;width:20px;height:20px;border-radius:50%;background:linear-gradient(140deg,#ffffff18,#00000012),var(--switch-thumb);box-shadow:2px 3px 5px #0006,inset 1px 1px 1px #ffffff38;transition:transform .55s cubic-bezier(.22,1.45,.48,1),background .4s}
.theme-switch[aria-pressed=true] .toggle-thumb{transform:translateX(28px)}.theme-switch[aria-pressed=true] rect{stroke-dashoffset:0;opacity:1;filter:drop-shadow(0 0 2px var(--neon)) drop-shadow(0 0 5px var(--neon))}.theme-switch:hover .neon-toggle{box-shadow:inset 2px 3px 6px #0004,0 0 0 3px #ffffff14}
.theme-label{font:8px var(--mono);letter-spacing:.45px;color:var(--muted);transition:color .3s}.theme-switch[aria-pressed=true] .theme-label{color:var(--ink)}.theme-switch:focus-visible{border-radius:6px;outline-color:var(--ink);outline-offset:4px}
:root[data-theme=graphite] .project-dock button::before{border-color:#45505e;background:#272f3a;box-shadow:inset 0 1px #ffffff15,0 3px 9px #0004}
:root[data-theme=graphite] .project-dock button[aria-pressed=true]::before{background:var(--button-color);border-color:var(--button-color);box-shadow:0 0 12px color-mix(in srgb,var(--button-color) 35%,transparent),0 0 28px color-mix(in srgb,var(--button-color) 20%,transparent)}
:root[data-theme=graphite] .open-project{background:#d7e4e8;color:#23303a}:root[data-theme=graphite] .open-project:hover{background:#effcff}
@media(max-width:680px){.header{height:95px;gap:14px}.brand-source{width:100px}.theme-picker{gap:6px}.theme-switch{min-width:40px;padding:8px 0;gap:8px}.neon-toggle{width:40px;height:23px}.toggle-thumb{top:4px;left:4px;width:15px;height:15px}.theme-switch[aria-pressed=true] .toggle-thumb{transform:translateX(17px)}.theme-label{font-size:6px;letter-spacing:0}.theme-switch[data-theme-choice=rain] .theme-label{font-size:5.8px}.exhibition{min-height:760px}}
@media(prefers-reduced-motion:reduce){.brand-canvas{display:none}.signature-ready .brand-source{opacity:1}}
@media(max-width:680px){.theme-switch{min-width:44px}.theme-label,.theme-switch[data-theme-choice=rain] .theme-label{font-size:7px}}
@media(max-width:360px){.header{gap:8px}.brand-source{width:82px}.theme-picker{gap:3px}}
/* Backgrounds remain behind the complete interface and share the cube's perspective. */
body{isolation:isolate}#atmosphere{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:0}#atmosphere[hidden]{display:none}.exhibition{position:relative;z-index:1}
:root[data-theme=wave]{color-scheme:dark;--paper:#090812;--ink:#e8edf7;--muted:#a59cb8;--line:#45384f;--reset-bg:#30223bcc;--reset-hover:#44324e;--logo-color:#ede5fc;--switch-shell:#272230;--switch-thumb:#45404f}
:root[data-theme=rain]{color-scheme:dark;--paper:#090c0f;--ink:#e8edf1;--muted:#98a7af;--line:#354047;--reset-bg:#26343bcc;--reset-hover:#3b4c57;--logo-color:#e5eef4;--switch-shell:#242b31;--switch-thumb:#3d4850}
.theme-switch[data-theme-choice=wave]{--neon:#c68df3}.theme-switch[data-theme-choice=rain]{--neon:#8bbbcf}
.project-info:not(.selected){visibility:hidden;pointer-events:none}
:root[data-theme=wave] .project-dock button::before,:root[data-theme=rain] .project-dock button::before{border-color:#505363;box-shadow:inset 0 1px #ffffff1a,0 3px 10px #0005}
:root[data-theme=wave] .open-project,:root[data-theme=rain] .open-project{background:#d7e4e8;color:#23303a}
:root[data-theme=wave] footer,:root[data-theme=rain] footer{border-color:#ffffff17}
