:root{color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:#07070d;color:#f7f1ff;font-synthesis:none;text-rendering:geometricPrecision;--bg: #07070d;--panel: rgba(20, 20, 34, .72);--panel-strong: rgba(27, 27, 45, .92);--line: rgba(158, 252, 255, .22);--cyan: #9efcff;--violet: #d9b8ff;--rose: #ff9cb4;--green: #b7ffb7;--muted: #bdb7d0;--dim: #77718a;--shadow: 0 24px 80px rgba(0, 0, 0, .42)}*{box-sizing:border-box}html{background:radial-gradient(circle at 20% 0%,rgba(158,252,255,.12),transparent 28rem),radial-gradient(circle at 80% 10%,rgba(217,184,255,.14),transparent 32rem),var(--bg)}body{margin:0;min-width:320px;min-height:100vh}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.55}.app-shell{width:min(1480px,calc(100% - 32px));margin:0 auto;padding:32px 0 56px}.hero{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(280px,.7fr);gap:24px;align-items:stretch;min-height:340px}.hero-copy,.lab-panel,.mode-card,.science-note{border:1px solid var(--line);background:linear-gradient(180deg,#ffffff14,#ffffff06),var(--panel);box-shadow:var(--shadow);backdrop-filter:blur(18px)}.hero-copy{border-radius:34px;padding:clamp(28px,6vw,72px);position:relative;overflow:hidden}.hero-copy:after{content:"";position:absolute;inset:auto -20% -45% 20%;height:220px;background:radial-gradient(circle,rgba(158,252,255,.15),transparent 65%);pointer-events:none}.eyebrow{text-transform:uppercase;letter-spacing:.14em;color:var(--cyan);font-size:.74rem;font-weight:800;margin:0 0 12px}h1{font-size:clamp(3rem,8vw,7.4rem);line-height:.86;letter-spacing:-.08em;margin:0;max-width:920px}.lede{color:var(--muted);font-size:clamp(1rem,2.4vw,1.35rem);line-height:1.55;max-width:760px}.hero-badges,.run-stats,.hero-badges span{display:flex;flex-wrap:wrap;gap:10px}.hero-badges span,.pill{border:1px solid rgba(255,255,255,.14);background:#ffffff0f;border-radius:999px;padding:8px 12px;color:#fff;font-size:.8rem}.creator-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}.social-link,.support-link{display:inline-flex;align-items:center;justify-content:center;border:1px solid rgba(158,252,255,.34);border-radius:999px;padding:11px 15px;color:#f7f1ff;background:#9efcff14;text-decoration:none;font-weight:900}.support-link{border-color:transparent;color:#061014;background:linear-gradient(135deg,var(--cyan),var(--green))}.hero-orb{border-radius:34px;min-height:320px;position:relative;overflow:hidden;border:1px solid rgba(255,255,255,.12);background:radial-gradient(circle at 50% 50%,rgba(248,241,255,.95) 0 12%,transparent 12.5%),conic-gradient(from 140deg,#9efcffe6,#d9b8ff2e,#ff9cb494,#9efcffe6)}.hero-orb:before{content:"";position:absolute;inset:14%;border:1px solid rgba(7,7,13,.46);border-radius:50%;box-shadow:inset 0 0 56px #07070da6,0 0 120px #9efcff59}.hero-orb span{position:absolute;inset:34%;border-radius:50%;background:#07070d;box-shadow:0 0 30px #000c}.mode-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:24px 0}.mode-card{text-align:left;border-radius:24px;padding:20px;color:inherit;transition:transform .2s ease,border-color .2s ease,background .2s ease}.mode-card:hover,.mode-card.active{transform:translateY(-2px);border-color:#9efcffb3;background:linear-gradient(180deg,#9efcff1f,#ffffff08),var(--panel-strong)}.mode-card span{color:var(--cyan);font-weight:900;letter-spacing:.08em;text-transform:uppercase;font-size:.76rem}.mode-card strong{display:block;margin:10px 0;font-size:1.15rem}.mode-card small{color:var(--muted);line-height:1.45}.science-note{border-radius:22px;padding:16px 18px;color:var(--muted);margin-bottom:24px}.science-note strong{color:#fff}.workspace-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(360px,.9fr);gap:24px;align-items:start}.side-stack{display:grid;gap:24px}.lab-panel{border-radius:28px;padding:clamp(18px,3vw,28px)}.panel-header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px}.panel-header h2,.complete-slate h2,.results-panel h2{margin:0;font-size:clamp(1.4rem,4vw,2.4rem);letter-spacing:-.04em}.primary-button,.ghost-button,.choice-button{border:1px solid rgba(255,255,255,.16);color:#061014;background:linear-gradient(135deg,var(--cyan),#f8f1ff);border-radius:999px;padding:12px 18px;font-weight:900;box-shadow:0 12px 40px #9efcff29}.primary-button.wide{width:100%;margin-top:12px}.ghost-button{background:#ffffff0f;color:#fff;box-shadow:none}.meter-stack{margin:16px 0 24px}.meter-row{display:flex;justify-content:space-between;color:var(--muted);font-size:.86rem;margin-bottom:8px}.meter{height:10px;border-radius:999px;background:#ffffff14;overflow:hidden;border:1px solid rgba(255,255,255,.08)}.meter span{display:block;height:100%;background:linear-gradient(90deg,var(--violet),var(--cyan));transition:width .3s ease}.run-stats{color:var(--dim);font-size:.82rem;justify-content:space-between;margin-top:8px}.start-slate,.complete-slate,.empty-map{min-height:360px;border:1px dashed rgba(255,255,255,.18);border-radius:24px;display:grid;place-items:center;text-align:center;padding:32px;color:var(--muted)}.start-slate h3,.complete-slate h2{color:#fff;margin:12px 0 0}.threshold-glyph{width:96px;height:96px;border-radius:50%;border:1px solid rgba(158,252,255,.5);background:radial-gradient(circle,#fff 0 12%,transparent 13%),conic-gradient(from 20deg,transparent,rgba(158,252,255,.8),transparent,rgba(217,184,255,.6),transparent);box-shadow:0 0 55px #9efcff47}.stimulus-card{min-height:410px;border-radius:26px;background:radial-gradient(circle at 50% 0%,rgba(158,252,255,.08),transparent 55%),#00000030;border:1px solid rgba(255,255,255,.12);padding:clamp(18px,3vw,28px);display:grid;gap:24px;align-content:center}.prompt-block{text-align:center}.prompt-block h2{margin:0;font-size:clamp(1.5rem,4vw,3.1rem);letter-spacing:-.06em}.hint{color:var(--muted);margin-bottom:0}kbd{border:1px solid rgba(255,255,255,.18);border-bottom-width:3px;border-radius:7px;padding:1px 6px;background:#ffffff14}.color-stage,.contrast-stage,.answer-row{display:grid;grid-template-columns:1fr auto 1fr;gap:clamp(14px,3vw,28px);align-items:center}.swatch,.contrast-panel{border:1px solid rgba(255,255,255,.14);min-height:clamp(140px,24vw,230px);border-radius:28px;box-shadow:inset 0 0 50px #00000038,0 18px 60px #0000002e}.choice-swatch:hover,.contrast-panel:hover,.choice-button:hover{outline:2px solid rgba(158,252,255,.6);transform:translateY(-1px)}.reference-column{display:grid;justify-items:center;gap:10px;color:var(--muted);font-size:.78rem;text-transform:uppercase;letter-spacing:.12em}.reference-swatch{width:84px;height:84px;border-radius:50%;border:1px solid rgba(255,255,255,.18);box-shadow:0 0 40px #ffffff1a}.contrast-stage{grid-template-columns:1fr 1fr}.pitch-card{justify-items:center}.tone-orbit{width:210px;height:210px;border-radius:50%;position:relative;display:grid;place-items:center;background:radial-gradient(circle,rgba(158,252,255,.08),transparent 60%)}.tone-ring{width:150px;height:150px;border-radius:50%;border:1px solid rgba(158,252,255,.4);animation:breathe 1.2s infinite ease-in-out}.tone-dot{position:absolute;width:30px;height:30px;border-radius:50%;background:var(--cyan);box-shadow:0 0 24px var(--cyan)}.tone-dot-a{left:34px;top:90px}.tone-dot-b{right:34px;top:90px;background:var(--violet);box-shadow:0 0 24px var(--violet)}.answer-row{grid-template-columns:repeat(2,minmax(0,1fr));width:100%}.choice-button{min-height:68px}.feedback{min-height:28px;text-align:center;color:var(--dim);margin-top:12px}.feedback.correct{color:var(--green)}.feedback.wrong{color:var(--rose)}.result-copy,.commons-note,.microcopy{color:var(--muted);line-height:1.55}.consent-line{border:1px solid rgba(183,255,183,.26);background:#b7ffb712;color:#e9ffe9;border-radius:16px;padding:12px 14px;line-height:1.45;margin:16px 0}.turnstile-wrap{min-height:76px;display:flex;align-items:center;justify-content:center}.error-note{color:#ffd2dc;background:#ff9cb41a;border:1px solid rgba(255,156,180,.25);border-radius:14px;padding:10px 12px}.histogram{width:100%;color:var(--cyan);overflow:visible}.axis{stroke:#fff3}.median-line{stroke:#fff;stroke-width:2;stroke-dasharray:4 5}.you-line{stroke:var(--rose);stroke-width:3}.axis-label{fill:var(--dim);font-size:10px}.axis-label.end{text-anchor:end}.percentile-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:12px 0}.metric-card{border:1px solid rgba(255,255,255,.12);background:#ffffff0b;border-radius:16px;padding:12px}.metric-card span{display:block;color:var(--dim);font-size:.78rem;text-transform:uppercase;letter-spacing:.1em}.metric-card strong{display:block;margin-top:6px;font-size:.98rem}.app-footer{color:var(--dim);text-align:center;margin-top:32px}.app-footer a{color:var(--cyan);font-weight:900;text-decoration:none}.app-footer a:hover{text-decoration:underline}@keyframes breathe{0%,to{transform:scale(.92);opacity:.6}50%{transform:scale(1.05);opacity:1}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}@media(max-width:980px){.hero,.workspace-grid,.mode-strip,.color-stage{grid-template-columns:1fr}.reference-column{order:-1}}@media(max-width:560px){.app-shell{width:min(100% - 18px,1480px);padding-top:12px}.hero-copy,.lab-panel{border-radius:22px}.answer-row,.contrast-stage{grid-template-columns:1fr}.panel-header{align-items:flex-start;flex-direction:column}}