/* Shared shell, toolbar and controls. Scene renderers retain their own styles. */
@font-face{font-family:Inter;src:url('fonts/Inter-latin.woff2') format('woff2');font-weight:100 900;font-display:swap}
@font-face{font-family:Saans;src:url('fonts/saans.woff2') format('woff2');font-weight:300 900;font-display:swap}
:root{--edge:clamp(18px,2.4vw,32px);--controls-width:min(390px,calc(100vw - 2*var(--edge)));--controls-button-width:112px;--bg:#18181b;--ink:#f5f5f7;--grey:#a1a1aa;--track:#39393f;--fill:#52525b;--chip:#252528;--chip-hover:#333337;--text:#d4d4d8;--accent:#ff6363}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#000202}
body{font:400 14px/1.5 Inter,-apple-system,BlinkMacSystemFont,'Helvetica Neue',sans-serif;color:var(--ink);color-scheme:dark;-webkit-font-smoothing:antialiased}
[hidden]{display:none!important}button,input,select,a{-webkit-tap-highlight-color:transparent}button,input,select{font:inherit;color:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}button{background:none;border:0}button:disabled{cursor:default;opacity:.4}
:focus-visible{outline:2px solid #ff8585;outline-offset:3px;border-radius:5px}
#viewport,iframe{position:fixed;inset:0;width:100%;height:100%;border:0}
/* Toolbar: both outer edges line up with the control card. */
#switcher,#shared-toggle,#shell-fullscreen{position:fixed;top:max(var(--edge),env(safe-area-inset-top));z-index:50}
#switcher{right:calc(var(--edge) + var(--controls-button-width) + 70px);z-index:60}
#shared-toggle{right:calc(var(--edge) + 60px);width:var(--controls-button-width);display:flex;align-items:center;justify-content:center;gap:8px}
#shell-fullscreen{right:var(--edge);width:50px;padding:0;display:grid;place-items:center}
#visualiser-toggle,#shared-toggle,#shell-fullscreen{height:50px;border:1px solid #ffffff20;border-radius:10px;background:var(--chip);box-shadow:inset 0 1px 0 #ffffff08,0 3px 9px #0002;font-size:14px;font-weight:500;line-height:20px;letter-spacing:-.005em;transition:color .12s}
#visualiser{display:none}#visualiser-toggle{display:flex;align-items:center;justify-content:space-between;width:calc(var(--controls-width) - var(--controls-button-width) - 70px);gap:12px;padding:0 12px}
.visualiser-label{display:flex;align-items:center;gap:9px;min-width:0}#visualiser-toggle>.visualiser-label{flex:1}#visualiser-label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#visualiser-icon{display:flex}
.ui-icon,#shell-fullscreen svg{display:block;width:16px;height:16px;flex:0 0 16px;stroke-width:1.6}
#visualiser-toggle>svg{width:16px;height:16px;flex:0 0 16px;color:var(--grey);transition:transform .12s}#visualiser-toggle[aria-expanded=true]>svg{transform:rotate(180deg)}
#visualiser-toggle[aria-expanded=true],#shared-toggle[aria-expanded=true]{background:#303034;border-color:#ffffff38}
#visualiser-menu,#shared-panel{background:linear-gradient(150deg,#1d1d20,#161618);border:1px solid #ffffff1c;box-shadow:0 18px 50px #0005,inset 0 1px 0 #ffffff06;border-radius:14px}
#visualiser-menu{position:absolute;top:60px;left:0;width:100%;padding:5px;border-radius:12px}
#visualiser-menu [role=option]{width:100%;display:flex;align-items:center;justify-content:space-between;min-height:40px;padding:10px 12px;border-radius:7px;text-align:left;font-size:13px;line-height:20px;transition:color .12s}
#visualiser-menu .ui-icon{color:var(--grey)}#visualiser-menu [aria-selected=true]{background:#ffffff0c;color:#fff}#visualiser-menu [aria-selected=true]::after{content:'✓';color:var(--accent);font-size:13px}#visualiser-menu [aria-selected=true] .ui-icon{color:#ff9494}
/* Fixed footprint per visualiser; tab content scrolls within the card. */
#shared-panel{position:fixed;right:var(--edge);top:calc(var(--edge) + 66px);z-index:45;width:var(--controls-width);display:flex;flex-direction:column;padding:18px;max-height:calc(100dvh - 2*var(--edge) - 116px)}
.shared-header{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-shrink:0;padding-bottom:12px;margin-bottom:12px;border-bottom:1px solid #ffffff0d}
.shared-header h1{margin:0;font-size:18px;font-weight:600;letter-spacing:-.02em;line-height:28px}
#shared-close{flex-shrink:0;display:grid;place-items:center;width:28px;height:28px;padding:0;border:1px solid #ffffff10;border-radius:7px;background:#ffffff05;color:var(--grey);font-size:20px;line-height:1;transition:color .12s}
#shared-tabs{display:flex;flex-shrink:0;overflow-x:auto;scrollbar-width:none;padding:3px;gap:3px;border:1px solid #ffffff0b;border-radius:8px;background:#101012}
#shared-tabs::-webkit-scrollbar{display:none}#shared-tabs button{flex:1;padding:5px 8px;border-radius:5px;font-size:12px;line-height:18px;font-weight:500;color:#97979f;text-align:center;white-space:nowrap;transition:color .12s}
#shared-tabs button[aria-selected=true]{background:#2c2c30;color:#fafafa;box-shadow:0 1px 3px #0004,inset 0 1px 0 #ffffff0b}
#shared-body{overflow:auto;flex:1 1 auto;min-height:0;padding:18px 0 8px;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--fill) transparent}
#shared-body::-webkit-scrollbar{width:3px}#shared-body::-webkit-scrollbar-thumb{background:var(--fill);border-radius:3px}
#shared-footer{flex-shrink:0;border-top:1px solid #ffffff0d;margin-top:12px;padding-top:10px}
/* Fields and control groups. */
.control{margin:0 0 20px}.control:last-child{margin-bottom:4px}.control-title{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:24px}
.control label,.shared-select,.shared-check{font-size:13px;font-weight:450;line-height:20px;color:#e4e4e7}
#shared-panel output{font-size:11px;line-height:20px;font-variant-numeric:tabular-nums;min-width:48px;text-align:right;color:var(--grey)}
#shared-panel p{font-size:13px;line-height:1.6;color:var(--text)}#shared-panel .control p{margin:4px 0 12px}
#shared-panel .control p,#shared-panel .shared-note,#shared-panel .preset-note,#shared-panel .source-note,#shared-panel .source-status,#shared-panel .audio-mapping{font-size:12px;line-height:1.5;color:var(--grey)}
.range-ends{display:flex;justify-content:space-between;gap:12px;margin-top:7px;font-size:11px;line-height:16px;color:var(--grey)}
.presets{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.preset-note{margin:10px 0 20px}
.shared-actions,.audio-sources{display:grid;grid-template-columns:1fr 1fr;gap:10px}.shared-actions{margin-bottom:16px}.shared-actions:last-child{margin-bottom:0}
.shared-action{display:block;width:100%;margin-bottom:12px}.shared-action:last-child,.shared-actions .shared-action{margin-bottom:0}
.shared-action,.preset,.audio-sources button,.fog-command button,#shared-reset{height:44px;padding:0 12px;min-width:0;border:1px solid #ffffff14;border-radius:8px;background:var(--chip);box-shadow:inset 0 1px 0 #ffffff06;font-size:13px;font-weight:500;line-height:20px;transition:color .12s}
.preset{padding:0 8px}.preset.active,.audio-sources button.active,.shared-action[aria-pressed=true],#shared-randomise{background:#302224;border-color:#ff636338;color:#ffaaaa}
#shared-reset{width:100%;height:36px;color:var(--grey);font-size:12px;box-shadow:none}#shared-randomise{height:36px;margin-bottom:8px}#shared-panel[data-visualiser=signal] #shared-reset{height:32px}
.shared-check{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:42px;padding:10px 0}
.shared-select{display:block;margin-bottom:10px}.shared-select select{margin-top:6px}
#shared-panel select,.fog-command input{height:42px;min-width:0;padding:0 12px;background-color:#111113;color:var(--ink);border:1px solid #ffffff1c;border-radius:8px;box-shadow:inset 0 1px 3px #0002;font-size:13px;line-height:20px;transition:border-color .12s}
#shared-panel select{appearance:none;-webkit-appearance:none;display:block;width:100%;max-width:100%;padding-right:38px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23a1a1aa' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 6.5 3 3 3-3'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;background-size:16px;text-overflow:ellipsis}
#shared-panel option{background:#18181b;color:var(--ink)}.fog-command input::placeholder{color:var(--grey)}
#shared-panel input[type=range]{display:block;width:100%;height:4px;margin:0;appearance:none;border-radius:999px;cursor:pointer;background:linear-gradient(to right,var(--accent) 0 var(--progress,0%),var(--track) var(--progress,0%) 100%)}
#shared-panel input[type=range]::-webkit-slider-thumb{appearance:none;width:12px;height:12px;background:#f4f4f5;border:1px solid #fff;border-radius:50%;box-shadow:0 1px 4px #0008}
#shared-panel input[type=range]::-moz-range-thumb{width:12px;height:12px;background:#f4f4f5;border:1px solid #fff;border-radius:50%;box-shadow:0 1px 4px #0008}
#shared-panel input[type=checkbox]{appearance:none;-webkit-appearance:none;position:relative;flex:0 0 30px;width:30px;height:18px;margin:0;border:1px solid #ffffff20;border-radius:20px;background:#38383e;cursor:pointer;transition:color .12s}
#shared-panel input[type=checkbox]::after{content:'';position:absolute;left:2px;top:2px;width:12px;height:12px;border-radius:50%;background:#d4d4d8;box-shadow:0 1px 2px #0003;transition:transform .12s}
#shared-panel input[type=checkbox]:checked{background:var(--accent);border-color:var(--accent)}#shared-panel input[type=checkbox]:checked::after{transform:translateX(12px);background:white}
.fog-command{display:grid;grid-template-columns:1fr auto;gap:8px;margin-bottom:16px}.fog-command:last-child{margin-bottom:0}.fog-command input{width:100%}
.source-status{display:flex;gap:8px;margin-top:16px;overflow-wrap:anywhere}.source-note{margin:10px 0 20px}.audio-mapping{margin:0 0 16px}
.shared-source{display:block;margin:12px 0;font-size:12px;line-height:1.55;overflow-wrap:anywhere}#shared-panel #status{color:var(--grey);font-size:11px;margin-bottom:16px}
#shared-panel a{text-decoration:underline;text-decoration-color:var(--fill);text-underline-offset:3px}
#shared-panel h2{font-size:15px;font-weight:570;letter-spacing:-.01em;margin:24px 0 12px}#shared-body>section:first-child h2:first-child{margin-top:0}
.shared-key-list{display:grid;grid-template-columns:110px 1fr;gap:10px 12px;margin:0;font-size:13px;line-height:1.5}.shared-key-list dt,.shared-key-list dd{margin:0}.shared-key-list dd{color:var(--grey)}
kbd{display:inline-block;padding:3px 6px;border:1px solid #ffffff18;border-bottom-color:#ffffff24;border-radius:4px;background:#27272b;box-shadow:0 1px 2px #0003;font:450 10px/18px Inter,sans-serif;color:#c4c4cc}
.signal-visuals .control{margin-bottom:8px}.signal-visuals .control-title{min-height:20px;margin-bottom:4px}.signal-visuals .control p,.signal-visuals .range-ends,.signal-visuals .preset-note{display:none}.signal-visuals .presets{margin-bottom:12px}.signal-visuals section:last-child .control:last-child{margin-bottom:0}
/* Pointer states do not scale or move any control. */
@media(hover:hover){
 #visualiser-toggle:hover,#shared-toggle:hover,#shell-fullscreen:hover,.shared-action:hover,.preset:hover,.audio-sources button:hover,.fog-command button:hover,#shared-reset:hover{color:#ffaaaa}
 .preset.active:hover,.audio-sources button.active:hover,.shared-action[aria-pressed=true]:hover,#shared-randomise:hover{color:#ffc0c0}
 #shared-close:hover,#shared-tabs button:hover{color:#ffaaaa}
 #visualiser-menu [role=option]:hover,#visualiser-menu [role=option]:hover .ui-icon{color:#ffaaaa}
 #shared-panel a:hover{text-decoration-color:var(--ink)}
}
#visualiser-toggle:active,#shared-toggle:active,#shell-fullscreen:active,.shared-action:active,.preset:active,.audio-sources button:active,.fog-command button:active,#shared-reset:active{background:#35353a;border-color:#ffffff38}
#shared-panel button:disabled,#shared-panel button:disabled:hover{background:var(--chip);border-color:#ffffff14;color:var(--grey);cursor:default}
/* Caption and creator credit remain independent of the dark control surfaces. */
#sign-current{position:fixed;left:var(--edge);top:var(--edge);z-index:35;display:flex;align-items:center;gap:10px;min-height:50px;width:max-content;max-width:calc(100vw - 2*var(--edge) - 410px);pointer-events:none;color:var(--ink);text-shadow:0 1px 6px #0006}
#sign-name,#sign-meaning{display:block;margin:0;font-size:14px;line-height:20px;letter-spacing:-.005em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#sign-name{font-weight:550;flex:0 0 auto;max-width:45%}#sign-meaning{font-weight:400;flex:1 1 auto;min-width:0;color:#b6b6bf}
body[data-contrast=dark] #sign-current{color:#18181b;text-shadow:none}body[data-contrast=dark] #sign-meaning{color:#62626b}
#vw-home{position:fixed;right:max(var(--edge),env(safe-area-inset-right));bottom:max(var(--edge),env(safe-area-inset-bottom));z-index:100;margin:0;padding:0;height:50px;display:flex;align-items:center;align-content:center;justify-content:flex-end;flex-wrap:wrap;max-width:calc(100vw - 2*var(--edge));font:400 12px/1.3 Saans,sans-serif;color:#8e8e93;pointer-events:none}
#vw-home a{pointer-events:auto;color:inherit;white-space:nowrap}#vw-home a:hover,#vw-home a:focus-visible{text-decoration:underline;text-underline-offset:3px}#vw-home .vlogo{display:inline-block;width:7.83px;height:9px;margin:0 4px;vertical-align:0;fill:currentColor}body[data-contrast=dark] #vw-home{color:rgba(26,26,28,.65)}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
noscript article{position:fixed;z-index:100;inset:0;overflow:auto;background:#111113;color:#eee;padding:40px;line-height:1.7}
@media(max-width:600px){:root{--controls-button-width:104px}#shared-panel{padding:16px}#shared-tabs{gap:2px}#shared-tabs button{padding:5px 7px}#visualiser-toggle,#shared-toggle{font-size:13px}#sign-current{top:calc(var(--edge) + 60px);max-width:calc(100vw - 2*var(--edge))}body:has(#shared-toggle[aria-expanded=true]) #sign-current{display:none}}
@media(max-width:360px){:root{--controls-button-width:50px}#shared-toggle>span{display:none}#shared-toggle{gap:0}.shared-key-list{grid-template-columns:100px 1fr}.presets{gap:8px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important}}

/* Searchable descriptions are normal readable pages, separate from the artwork. */
html:has(.description-page),body.description-page{height:auto;min-height:100%;overflow:auto;background:#111113}
.project-page{max-width:780px;margin:auto;padding:48px 24px 64px}.project-home{font-size:13px;color:var(--grey)}.project-page h1{font-size:clamp(36px,7vw,58px);line-height:1.1;letter-spacing:-.04em;margin:48px 0 24px}.project-page h2{font-size:22px;font-weight:550;margin:40px 0 14px}.project-page p{color:#b6b6bf;font-size:16px;line-height:1.8}.project-page .project-lead{font-size:20px;line-height:1.6;color:#e4e4e7}.project-page a:hover{color:#fff;text-decoration:underline;text-underline-offset:4px}.project-launch{display:inline-flex;gap:24px;margin:20px 0;padding:12px 18px;border:1px solid #ffffff24;border-radius:8px;background:#252528}.project-nav{display:flex;flex-wrap:wrap;gap:12px 22px;margin:24px 0}.project-nav a{font-size:14px;text-decoration:underline;text-underline-offset:4px}.project-page footer{margin-top:56px;padding-top:20px;border-top:1px solid #ffffff15;color:var(--grey);font-size:13px}