:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--paper:#100e0c;--text:#f3e9dc;--muted:#c8bbaa;--faint:#9e8f7d;--hairline:#e7c7a32b;font-synthesis:none;color:var(--text);background:var(--paper);scroll-behavior:smooth;font-family:system-ui,-apple-system,Segoe UI,sans-serif}*,:before,:after{box-sizing:border-box}body{min-height:100svh;margin:0;overflow-x:hidden}a{color:inherit;text-decoration:none}a:hover{text-underline-offset:5px;text-decoration:underline}button,input{font:inherit}button,a,input{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,input:focus-visible{outline-offset:5px;outline:2px solid #f5c98d}button{cursor:pointer}button:disabled,input:disabled{opacity:.45;cursor:default}#stage{pointer-events:none;z-index:0;opacity:0;width:100%;height:100%;transition:opacity 1s;position:fixed;inset:0}body[data-state=live] #stage,body[data-state=paused] #stage{opacity:1;pointer-events:auto;cursor:grab}body[data-state=live] #stage:active,body[data-state=paused] #stage:active{cursor:grabbing}.intro,.floating-card,.section-heading,.note,footer,.wordmark,nav{pointer-events:auto}.page-shade{z-index:1;pointer-events:none;background:linear-gradient(90deg,#100e0ce6 0%,#100e0c8a 27%,#0000 60%),linear-gradient(#0000 75%,#100e0c66);position:fixed;inset:0}.skip-link{background:var(--paper);z-index:10;padding:15px;position:fixed;top:8px;left:8px;transform:translateY(-200%)}.skip-link:focus{transform:none}.site-header,main{z-index:2;position:relative}.site-header{justify-content:space-between;align-items:center;padding:32px 5vw;display:flex}.wordmark{letter-spacing:5px;flex-direction:column;gap:6px;padding:9px 12px;font-size:24px;font-weight:600;display:flex}.wordmark:hover{text-decoration:none}.wordmark span{letter-spacing:1.7px;color:var(--faint);font:9px ui-monospace,SF Mono,monospace}nav{color:var(--muted);gap:30px;padding:13px 20px;font-size:12px;display:flex}.experiment{min-height:max(740px,100svh - 119px);padding:38px 8vw 145px;position:relative}.intro{width:-moz-fit-content;width:fit-content;position:relative}.eyebrow{letter-spacing:2px;width:-moz-fit-content;width:fit-content;color:var(--muted);margin:0 0 32px;font:10px/1.6 ui-monospace,SF Mono,monospace}.tiny-sun{color:#ff762a;margin-right:10px;font-size:16px}.tiny-sun,.note-number,.scroll-link>[data-flow-accent]{display:inline-block}.flow-accent{position:relative}.flow-accent-canvas{pointer-events:none;-webkit-user-select:none;user-select:none;position:absolute;top:-4px;left:-4px}.flow-accent-active{color:#0000!important;text-shadow:none!important}.flow-accent-active[data-flow-shape=circle]{background:0 0!important}h1{letter-spacing:-.075em;margin:0;font-size:clamp(90px,11.5vw,170px);font-weight:450;line-height:.98}h1 span{margin-bottom:21px;display:table}h1 span:nth-child(2){color:#f36628;margin-left:8vw}.description{width:-moz-fit-content;width:fit-content;color:var(--muted);margin:34px 0 26px;font-size:14px;line-height:1.8}.scroll-link{align-items:center;gap:30px;padding:12px 0;font-size:11px;display:inline-flex}.glass-surface{border:1px solid var(--hairline);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#3e302966;border-radius:22px;box-shadow:0 18px 70px #0002}body[data-state=live] .glass-surface,body[data-state=paused] .glass-surface{-webkit-backdrop-filter:none;backdrop-filter:none;background:#17110b35}.floating-card{z-index:3;will-change:transform;width:290px;position:absolute;top:125px;right:9vw}.drag-handle{border:0;border-bottom:1px solid var(--hairline);letter-spacing:1px;width:100%;color:var(--muted);cursor:grab;touch-action:none;background:0 0;border-radius:22px 22px 0 0;justify-content:space-between;align-items:center;padding:15px 18px;font:9px ui-monospace,SF Mono,monospace;display:flex}.drag-handle:active{cursor:grabbing}.card-content{padding:28px}.card-symbol{color:#f36628;text-shadow:0 0 30px #f3662845;font-size:55px;line-height:1;display:inline-block}.card-content h2{letter-spacing:-1.6px;margin:24px 0 18px;font-size:34px;font-weight:450;line-height:1.12}.card-content p{color:var(--muted);margin:0 0 25px;font-size:13px;line-height:1.7}.card-rule{background:var(--hairline);height:1px;margin-bottom:18px}.card-footnote{letter-spacing:1.2px;color:var(--muted);font:8px ui-monospace,SF Mono,monospace}.experiment-caption{letter-spacing:1px;color:var(--faint);justify-content:space-between;gap:24px;font:9px ui-monospace,SF Mono,monospace;display:flex;position:absolute;bottom:100px;left:8vw;right:8vw}.explanation{min-height:100svh;padding:90px 8vw 170px}.section-heading h2{letter-spacing:-.06em;width:-moz-fit-content;width:fit-content;margin:0;font-size:clamp(48px,6.5vw,94px);font-weight:450;line-height:1.04}.notes{grid-template-columns:repeat(3,1fr);align-items:start;gap:30px;margin:75px 0 90px;display:grid}.note{border-radius:18px;min-height:250px;padding:28px}.note-number{letter-spacing:1.4px;color:#fa6326;font:9px ui-monospace,SF Mono,monospace}.note h3{letter-spacing:-.7px;margin:20px 0 14px;font-size:22px;font-weight:500}.note p{color:var(--muted);margin:0;font-size:13px;line-height:1.75}.note button{color:var(--text);text-underline-offset:4px;background:0 0;border:0;margin-top:20px;padding:0;font-size:11px;text-decoration:underline}.notes.rearranged .note:first-child{order:3}.notes.rearranged .note:nth-child(2){order:1}.notes.rearranged .note:nth-child(3){order:2}footer{color:var(--muted);justify-content:space-between;gap:24px;font-size:11px;line-height:1.7;display:flex}.toolbar{z-index:5;border:1px solid var(--hairline);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#17130fe8;border-radius:16px;flex-wrap:wrap;justify-content:center;align-items:center;gap:24px;width:max-content;max-width:calc(100% - 32px);padding:13px 20px;display:flex;position:fixed;bottom:24px;left:50%;transform:translate(-50%);box-shadow:0 8px 40px #0003}.live-status{white-space:nowrap;color:var(--muted);align-items:center;gap:11px;font:10px ui-monospace,SF Mono,monospace;display:flex}.live-status div{flex-direction:column;gap:4px;display:flex}#detail{color:var(--faint);font-size:9px}.live-status i{background:#ff6c2a;border-radius:50%;flex-shrink:0;width:7px;height:7px;box-shadow:0 0 14px #f3662866}body[data-state=paused] .live-status i{box-shadow:none}body[data-state=fallback] .live-status i{background:var(--faint);box-shadow:none}.slider-control{color:var(--muted);align-items:center;gap:9px;font-size:11px;display:flex}.slider-control input{accent-color:#f36628;width:76px}.slider-control output{width:3ch;color:var(--text);font:10px ui-monospace,monospace}.toolbar-controls{gap:7px;display:flex}.toolbar button{border:1px solid var(--hairline);color:var(--text);background:#ffffff08;border-radius:8px;padding:8px 12px;font-size:11px}.toolbar button:hover:not(:disabled){background:#ffffff15}@media (min-width:1500px){.floating-card{width:320px;top:160px;right:13vw}.experiment{padding-top:60px}}@media (max-width:900px){.site-header{padding:22px 5vw}nav{gap:18px;padding-right:0}.experiment{padding:38px 6vw 130px}h1{font-size:clamp(88px,14vw,125px)}.floating-card{width:245px;top:170px;right:5vw}.card-content{padding:24px}.card-content h2{font-size:29px}.description{font-size:13px}.explanation{padding-left:6vw;padding-right:6vw}.notes{gap:16px}.note{padding:21px}.toolbar{gap:15px}.live-status{font-size:9px}#detail{font-size:8px}}@media (max-width:640px){.site-header{padding:22px 6vw}.wordmark{padding:0;font-size:22px}.wordmark span{letter-spacing:1.1px;font-size:7px}nav{gap:16px;font-size:11px}nav a:first-child{display:none}.experiment{min-height:1100px;padding-top:40px}.eyebrow{letter-spacing:1.5px;font-size:8px}h1{font-size:clamp(86px,21vw,130px)}h1 span:nth-child(2){margin-left:14vw}.description{margin-top:28px}.floating-card{width:260px;top:565px;right:12vw}.experiment-caption{font-size:7px;line-height:1.6;bottom:100px;left:6vw;right:6vw}.experiment-caption span{max-width:45%}.explanation{padding-top:45px;padding-bottom:190px}.section-heading h2{font-size:clamp(45px,11vw,64px)}.notes{grid-template-columns:1fr;gap:18px;margin:45px 0 55px}.note{min-height:0;padding:28px}.note h3{font-size:24px}.note p{font-size:14px}footer{flex-direction:column;gap:12px}.toolbar{gap:12px 18px;width:calc(100% - 24px);max-width:440px;padding:13px 14px;bottom:12px}.live-status{justify-content:center;width:100%}.live-status div{flex-direction:row;align-items:center;gap:8px}.slider-control{gap:5px;font-size:10px}.slider-control input{width:55px}.toolbar button{padding:7px 9px;font-size:10px}.toolbar-controls{gap:5px}}@media (prefers-reduced-motion:reduce){:root{scroll-behavior:auto}#stage{transition:none}}:root{--paper:#100809;--text:#f4efed;--muted:#bba9aa;--faint:#927b7e;--hairline:#d4b4b224;background:var(--paper)}::selection{color:#100809;background:#e9aa5c}main,.site-header{pointer-events:auto}#stage{z-index:0}body[data-state=live] #stage,body[data-state=paused] #stage{pointer-events:none;cursor:default}.still{object-fit:cover;object-position:62% center;filter:brightness(.35)saturate(1.1);z-index:0;width:100%;height:100%;position:fixed;inset:0}body[data-state=live] .still,body[data-state=paused] .still{display:none}.page-shade{background:linear-gradient(90deg,#100809e0 0%,#10080980 30%,#0000 63%),linear-gradient(#0000 65%,#100809b0)}body[data-state=fallback]{background:var(--paper)}.site-header{padding-top:30px;padding-bottom:30px}.wordmark{letter-spacing:4px;font-size:22px}.hero{min-height:max(780px,100svh - 118px);padding:38px 8vw 150px;position:relative}.eyebrow>span{color:#e9aa5c;margin-right:10px;font-size:16px}h1{flex-direction:column;width:max-content;font-size:clamp(88px,11.1vw,164px);display:flex}@property --brass-phase{syntax:"<percentage>";inherits:false;initial-value:50%}h1 span:nth-child(2){color:#e9aa5c;background:linear-gradient(155deg, #cf7c2d calc(var(--brass-phase) - .4em), #ffd590 calc(var(--brass-phase) - .15em), #fffef8 var(--brass-phase), #ffd590 calc(var(--brass-phase) + .15em), #cf7c2d calc(var(--brass-phase) + .4em));-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 20px #f58d2425);-webkit-background-clip:text;background-clip:text;align-self:flex-end;margin-bottom:calc(21px - .2em);margin-left:0;padding-bottom:.2em;animation:5s linear infinite brass-flow}@keyframes brass-flow{0%{--brass-phase:8%}to{--brass-phase:92%}}body[data-state=paused] h1 span:nth-child(2){animation-play-state:paused}@media (prefers-reduced-motion:reduce){h1 span:nth-child(2){animation:none}}.description{line-height:1.85}.action-control{margin:0 0 12px}.action-control[hidden]{display:none}.action-cue{color:var(--text);font:inherit;cursor:pointer;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:linear-gradient(115deg,#4b2a1b80,#180c0eeb);border:1px solid #e9aa5c45;border-radius:12px;align-items:center;gap:13px;padding:13px 15px;font-size:12px;transition:border-color .2s,box-shadow .2s;display:inline-flex;position:relative;overflow:hidden;box-shadow:0 8px 28px #0003}.action-cue:hover{border-color:#e9aa5ca0;box-shadow:0 8px 30px #0004,0 0 24px #dc8c1712}.action-cue:focus-visible{outline-offset:5px;outline:2px solid #ffe4b4}.action-icon{color:#ffd08c}#action-label{text-align:left;min-width:6.5em}.action-cue kbd{color:#d4b78f;letter-spacing:.5px;border:1px solid #e9aa5c30;border-radius:5px;margin-left:14px;padding:5px 7px;font:9px ui-monospace,monospace}.action-cue kbd span{color:#927b7e;margin-left:7px}.action-cue:after{content:"";height:2px;transform:scaleX(var(--action-progress,0));transform-origin:0;background:linear-gradient(90deg,#bd6a29,#fff3cf);position:absolute;inset:auto 0 0}.action-cue[data-playing=true] .action-icon{filter:drop-shadow(0 0 6px #ffc775)}.action-hint{color:var(--faint);letter-spacing:.3px;margin:10px 0 0;font:9px ui-monospace,monospace}.scroll-link span{color:#e9aa5c}.watch-note{border-left:1px solid #e9aa5c70;width:205px;padding-left:22px;position:absolute;bottom:190px;right:9vw}.note-mark{color:#e9aa5c;font-size:40px;line-height:1}.watch-note p{color:var(--text);margin:22px 0;font-size:14px;line-height:1.7}.micro{letter-spacing:1.4px;color:#d8a568;font:9px ui-monospace,SF Mono,monospace}.scene-caption{letter-spacing:1px;color:var(--faint);justify-content:space-between;gap:24px;font:9px ui-monospace,SF Mono,monospace;display:flex;position:absolute;bottom:110px;left:8vw;right:8vw}.explanation{background:linear-gradient(#0000,#100809bb 22%,#100809f5)}.explanation h2{letter-spacing:-.06em;margin:0;font-size:clamp(48px,6.5vw,94px);font-weight:450;line-height:1.04}.notes article{border:1px solid var(--hairline);background:#190c0ea8;border-radius:2px;min-height:245px;padding:28px}.notes h3{letter-spacing:-.6px;margin:22px 0 16px;font-size:22px;font-weight:500;line-height:1.2}.notes p{color:var(--muted);margin:0;font-size:13px;line-height:1.8}.toolbar{border-color:var(--hairline);background:#140b0ded;gap:18px}.live-status{font-size:10px}.live-status i{background:#e9aa5c;box-shadow:0 0 14px #e9aa5c66}body[data-state=live] .live-status i{animation:none}.range-control,.select-control,.check-control{color:var(--muted);white-space:nowrap;align-items:center;gap:8px;font-size:11px;display:inline-flex}.range-control input{accent-color:#e9aa5c;width:65px;margin:0}.range-control output{width:3ch;color:var(--text);font:10px ui-monospace,monospace}.check-control{padding:0}.check-control input{accent-color:#e9aa5c}.toolbar-buttons{gap:7px;display:flex}.toolbar select{max-width:115px}.toolbar input:disabled,.toolbar select:disabled{opacity:.45}@media (max-width:1050px){.toolbar{gap:13px}.live-status{justify-content:center;width:100%}.live-status div{flex-direction:row;align-items:center;gap:10px}h1{font-size:clamp(88px,12vw,134px)}.watch-note{width:180px;bottom:170px;right:6vw}}@media (max-width:650px){.site-header{padding:22px 6vw}.wordmark{font-size:21px}.wordmark span{letter-spacing:.8px;font-size:6px}nav{flex-shrink:0;gap:13px;padding:12px 0;font-size:10px}.hero{min-height:1100px;padding:38px 6vw 200px}h1{font-size:clamp(80px,20vw,120px)}.description{margin-top:28px;font-size:13px}.watch-note{width:205px;top:720px;bottom:auto;right:8vw}.watch-note p{margin:15px 0;font-size:13px}.note-mark{font-size:30px}.scene-caption{font-size:7px;line-height:1.7;bottom:105px;left:6vw;right:6vw}.scene-caption span{max-width:47%}.explanation{padding-bottom:240px}.explanation h2{font-size:clamp(44px,10.5vw,64px)}.notes article{min-height:0}.notes p{font-size:14px}.toolbar{gap:10px 12px;padding:12px}.live-status{font-size:9px}.live-status #detail{font-size:8px}.range-control,.select-control,.check-control{gap:6px;font-size:10px}.range-control input{width:52px}.toolbar select{padding:6px 8px;font-size:10px}.toolbar button{padding:7px 9px}}
