:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--paper:#05050a;--plate:#06060cc4;--text:#eeedf7;--muted:#b0aec8;--faint:#827f9c;--hairline:#ffffff1f;--control:#ffffff10;--hue:#ff5a5a;font-synthesis:none;color:var(--text);background:var(--paper);scroll-behavior:smooth;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}*,:before,:after{box-sizing:border-box}body{min-height:100svh;margin:0;overflow-x:hidden}::selection{background:var(--hue);color:var(--paper)}a{color:inherit;text-decoration:none}a:hover{text-underline-offset:4px;text-decoration:underline}a:focus-visible,button:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid var(--hue);outline-offset:4px}#stage{z-index:-1;pointer-events:none;position:fixed;inset:0}body[data-state=fallback] #stage{display:none}body[data-state=fallback]{background:radial-gradient(circle at 50% 17%, #e8ecff 0 2%, #ff5a5a40 6%, transparent 20%), radial-gradient(circle at 14% 62%, #ff5a5a55 0 3vh, transparent calc(3vh + 1px)), radial-gradient(circle at 31% 36%, #ff8a4a44 0 2.6vh, transparent calc(2.6vh + 1px)), radial-gradient(circle at 66% 72%, #ff5a8a44 0 3.4vh, transparent calc(3.4vh + 1px)), radial-gradient(circle at 84% 30%, #ff6a5a3a 0 2.8vh, transparent calc(2.8vh + 1px)), var(--paper);background-attachment:fixed}.plate{background:var(--plate);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:10px}.site-header{justify-content:space-between;align-items:center;gap:24px;padding:32px 5vw;display:flex}.wordmark{letter-spacing:-.6px;flex-direction:column;gap:4px;padding:9px 12px;font-size:21px;font-weight:700;display:flex}.wordmark span{letter-spacing:2.4px;color:var(--faint);font-size:10px;font-weight:600}nav{border:1px solid var(--hairline);border-radius:999px;flex-wrap:wrap;gap:4px;padding:4px;font-size:14px;display:flex}nav a{border-radius:999px;padding:8px 14px}nav a:hover{background:var(--control);text-decoration:none}.experiment{min-height:calc(100svh - 110px);padding:8vh 5vw 120px;position:relative}.intro{max-width:680px}.eyebrow{letter-spacing:2.4px;color:var(--hue);margin:0 0 24px;padding:6px 10px;font-size:11px;font-weight:600;display:inline-block}h1{letter-spacing:-.05em;flex-wrap:wrap;gap:.12em .22em;margin:0 0 28px;font-size:clamp(60px,10vw,136px);font-weight:800;line-height:.92;display:flex}h1 span{border-radius:14px;padding:.02em .1em .08em}.description{color:var(--muted);margin:0 0 36px;padding:14px 18px;font-size:18px;line-height:1.55;display:inline-block}.button{border:1px solid var(--hairline);border-radius:999px;align-items:center;gap:8px;padding:14px 22px;font-size:15px;font-weight:600;display:inline-flex}.button:hover{border-color:var(--hue);text-decoration:none}.experiment-caption{border-top:1px solid var(--hairline);letter-spacing:2px;color:var(--faint);justify-content:space-between;gap:16px;padding-top:14px;font-size:10px;font-weight:600;display:flex;position:absolute;bottom:130px;left:5vw;right:5vw}.explanation{padding:12vh 5vw 180px}.section-heading h2{letter-spacing:-.04em;border-radius:14px;margin:0 0 56px;padding:8px 14px;font-size:clamp(38px,5.5vw,72px);line-height:1;display:inline-block}.notes{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;margin-bottom:96px;display:grid}.note{border:1px solid var(--hairline);border-radius:18px;padding:26px 24px}.note-number{letter-spacing:2px;color:var(--hue);font-size:10px;font-weight:600}.note h3{letter-spacing:-.02em;margin:16px 0 10px;font-size:22px}.note p{color:var(--muted);margin:0;font-size:15px;line-height:1.6}.explanation footer{color:var(--faint);flex-wrap:wrap;justify-content:space-between;gap:16px;font-size:13px;display:flex}.explanation footer>*{padding:8px 12px}.toolbar{z-index:10;border:1px solid var(--hairline);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#07070df2;border-radius:14px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px 24px;max-width:1100px;margin:0 auto;padding:12px 16px;font-size:13px;display:flex;position:fixed;bottom:16px;left:16px;right:16px}.live-status{align-items:center;gap:12px;display:flex}.live-status i{background:var(--hue);width:10px;height:10px;box-shadow:0 0 12px var(--hue);border-radius:50%}body[data-state=paused] .live-status i,body[data-state=fallback] .live-status i{box-shadow:none}.live-status div{flex-direction:column;gap:2px;display:flex}#hue-name{color:var(--faint);font-size:11px}.toolbar-controls{flex-wrap:wrap;align-items:center;gap:8px 14px;display:flex}.toolbar button,.toolbar select{border:1px solid var(--hairline);background:var(--control);color:var(--text);font:inherit;cursor:pointer;border-radius:8px;padding:7px 12px}.toolbar button:hover:not(:disabled),.toolbar select:hover{border-color:#ffffff40}.toolbar button:disabled{opacity:.45;cursor:default}.select-control,.range-control{color:var(--muted);align-items:center;gap:8px;display:flex}.range-control input{width:110px;accent-color:var(--hue)}output{min-width:3.2em;color:var(--text);font-variant-numeric:tabular-nums}@media (max-width:1000px){.experiment-caption{margin-top:48px;position:static}}@media (max-width:700px){.site-header{flex-direction:column;align-items:flex-start;padding:20px 16px}.experiment,.explanation{padding-left:16px;padding-right:16px}.notes{grid-template-columns:1fr}.experiment-caption{flex-direction:column}.toolbar{bottom:8px;left:8px;right:8px}}@media (prefers-reduced-motion:reduce){:root{scroll-behavior:auto}}