*{box-sizing:border-box}:root{--bg:#0b1020;--panel:rgba(18,26,52,.88);--panel-2:#151f3d;--line:rgba(255,255,255,.11);--text:#f8f9ff;--muted:#aab2cc;--purple:#8d7dff;--purple-2:#b6a9ff;--teal:#2ed2b3;--coral:#ff765f;--yellow:#ffd166}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--bg);color:var(--text);font-family:"DM Sans",sans-serif}button,input{font:inherit}.app-shell{width:100vw;height:100vh;padding:clamp(10px,1.4vw,20px);display:grid;grid-template-rows:auto minmax(0,1fr);gap:clamp(10px,1.3vw,18px);background:radial-gradient(circle at 8% 12%,rgba(71,205,185,.16),transparent 28%),radial-gradient(circle at 91% 10%,rgba(130,102,255,.25),transparent 32%),linear-gradient(135deg,#0a0f1d,#101833 60%,#0c1328)}.topbar{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:2px 4px}.eyebrow,.kicker{margin:0 0 4px;text-transform:uppercase;letter-spacing:.13em;font-size:10px;font-weight:800;color:var(--purple-2)}h1,h2,h3,p{margin-top:0}h1{font:800 clamp(25px,3vw,38px)/1 Manrope,sans-serif;letter-spacing:-.045em;margin:0}.learning-goal{margin:0;display:flex;align-items:center;gap:12px;max-width:560px;padding:9px 13px;border:1px solid var(--line);border-radius:13px;background:rgba(255,255,255,.045);font-size:12px;color:var(--muted)}.learning-goal strong{color:#d7d0ff;white-space:nowrap}.workspace{min-height:0;display:grid;grid-template-columns:minmax(0,1.45fr) minmax(310px,.72fr);gap:clamp(10px,1.3vw,18px)}.panel{min-width:0;min-height:0;border:1px solid var(--line);border-radius:22px;background:linear-gradient(145deg,rgba(24,34,67,.93),rgba(13,20,42,.94));box-shadow:0 22px 60px rgba(0,0,0,.24);overflow:hidden}.population-panel{padding:clamp(14px,1.8vw,24px);display:grid;grid-template-rows:auto auto minmax(145px,1fr) auto minmax(104px,.42fr);gap:clamp(8px,1vh,13px)}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:15px}.panel-heading h2{font:800 clamp(17px,2vw,25px)/1.14 Manrope,sans-serif;margin:0;letter-spacing:-.025em}.truth-pill{display:flex;align-items:center;gap:10px;padding:8px 11px;border-radius:12px;background:rgba(46,210,179,.1);border:1px solid rgba(46,210,179,.28);white-space:nowrap}.truth-pill span{font-size:10px;color:#9edfd2}.truth-pill strong{font:800 20px Manrope,sans-serif;color:#66e5cc}.legend{display:flex;gap:15px;flex-wrap:wrap;color:var(--muted);font-size:10px}.legend span{display:flex;align-items:center;gap:6px}.legend-dot,.legend-ring{width:10px;height:10px;border-radius:50%;display:inline-block}.legend-dot.yes{background:var(--teal)}.legend-dot.no{background:var(--coral)}.legend-ring{border:2px solid #fff}.population-wrap{min-height:0;display:grid;place-items:stretch;background:rgba(6,10,24,.35);border:1px solid rgba(255,255,255,.07);border-radius:16px;padding:clamp(8px,1.2vw,16px)}.zones{display:grid;grid-template-columns:repeat(5,1fr);gap:clamp(5px,1vw,12px);min-height:0}.zone{min-width:0;display:grid;grid-template-rows:auto minmax(0,1fr);gap:6px;padding:7px;border-radius:12px;background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.055)}.zone-label{text-align:center;font-size:10px;font-weight:800;color:#d8dcf0}.people{min-height:0;display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(10,1fr);gap:clamp(2px,.45vw,6px);align-items:center;justify-items:center}.person{width:min(76%,22px);aspect-ratio:1;border-radius:50%;background:var(--person-color);box-shadow:0 3px 9px color-mix(in srgb,var(--person-color) 25%,transparent);position:relative;transition:transform .2s,outline-color .2s,opacity .2s}.person.sampled{outline:2px solid #fff;outline-offset:2px;transform:scale(1.06);z-index:1}.person.unsampled{opacity:.28}.zone-rates{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;font-size:10px;color:var(--muted);text-align:center}.zone-rates b{color:var(--text)}.distribution{min-height:0;border-top:1px solid var(--line);padding-top:10px;display:grid;grid-template-rows:auto minmax(60px,1fr);gap:5px}.distribution-head{display:flex;align-items:end;justify-content:space-between;gap:12px}.distribution h3,.challenge h3{font:800 14px Manrope,sans-serif;margin:0}.distribution-head>p{font-size:10px;color:var(--muted);margin:0;text-align:right}.number-line{position:relative;min-height:66px;margin:0 11px}.number-line:before{content:"";position:absolute;left:0;right:0;bottom:18px;height:2px;background:linear-gradient(90deg,#58617d,#9ba5c5)}.truth-line{position:absolute;top:0;bottom:16px;width:2px;background:var(--yellow);z-index:1}.truth-line span{position:absolute;top:0;left:5px;font-size:9px;color:var(--yellow);font-weight:700}.sample-dots{position:absolute;inset:4px 0 22px}.estimate-dot{position:absolute;width:8px;height:8px;border-radius:50%;background:var(--purple-2);transform:translateX(-50%);box-shadow:0 0 0 2px rgba(12,17,34,.75)}.ticks{position:absolute;left:0;right:0;bottom:0;display:flex;justify-content:space-between;color:#818ba8;font-size:9px}.control-panel{padding:clamp(12px,1.4vw,19px);display:flex;flex-direction:column;gap:clamp(9px,1.2vh,14px)}.control-section{display:grid;gap:9px}.step-label{display:flex;align-items:center;gap:9px}.step-label>span,.step-number{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:8px;background:rgba(141,125,255,.18);color:#c7bdff;font-size:11px;font-weight:800}.step-label strong,.size-row strong{font-size:13px}.step-label small{display:block;color:var(--muted);font-size:10px;margin-top:1px}.method-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.method{border:1px solid var(--line);border-radius:11px;padding:8px 5px;color:var(--muted);background:rgba(255,255,255,.025);cursor:pointer;transition:.2s}.method span{display:block;font-size:11px;font-weight:700}.method small{font-size:8px}.method:hover,.method:focus-visible{border-color:rgba(182,169,255,.55);outline:0}.method.active{background:linear-gradient(135deg,rgba(141,125,255,.27),rgba(46,210,179,.11));border-color:#8d7dff;color:#fff}.size-row{display:flex;justify-content:space-between;align-items:center}.size-row label{display:flex;align-items:center;gap:8px}.size-row output{font-size:11px;color:#c9c1ff;font-weight:700}.sample-size-section input{width:100%;accent-color:var(--purple);cursor:pointer}.range-labels{display:flex;justify-content:space-between;font-size:8px;color:#7f89a8}.action-row{display:grid;grid-template-columns:1fr auto;gap:7px}.primary,.secondary{border:0;border-radius:12px;color:#fff;font-weight:800;cursor:pointer;min-height:40px}.primary{display:flex;align-items:center;justify-content:center;gap:10px;background:linear-gradient(135deg,#7968ed,#9a79f2);box-shadow:0 10px 24px rgba(120,103,237,.25)}.primary kbd{font-size:8px;font-family:inherit;padding:3px 5px;border-radius:5px;background:rgba(255,255,255,.16)}.secondary{padding:0 14px;background:#24304f;border:1px solid var(--line)}.primary:hover,.secondary:hover,.primary:focus-visible,.secondary:focus-visible{filter:brightness(1.1);outline:2px solid rgba(255,255,255,.35);outline-offset:2px}.result-card{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:11px 12px;border-radius:15px;background:linear-gradient(135deg,rgba(46,210,179,.09),rgba(141,125,255,.1));border:1px solid rgba(129,205,211,.18)}.result-card p{font-size:9px;color:var(--muted);margin:0 0 2px}.result-card strong{font:800 clamp(20px,2vw,28px) Manrope,sans-serif}.error-copy{text-align:right}.interpretation{grid-column:1/-1!important;margin-top:3px!important;padding-top:7px;border-top:1px solid rgba(255,255,255,.08);line-height:1.35}.challenge{margin-top:auto;padding:11px 12px;border:1px solid var(--line);border-radius:15px;background:rgba(255,255,255,.025)}.challenge-heading{display:flex;align-items:center;justify-content:space-between;gap:8px}.challenge-heading>span{display:grid;place-items:center;width:25px;height:25px;border-radius:50%;background:rgba(255,209,102,.12);color:var(--yellow);font-weight:800}.challenge-options{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-top:9px}.challenge-options button{padding:7px 2px;border-radius:9px;border:1px solid var(--line);background:#1c2745;color:#d9dded;font-size:10px;font-weight:700;cursor:pointer}.challenge-options button:hover,.challenge-options button:focus-visible{border-color:#b6a9ff;outline:0}.challenge-options button.correct{background:rgba(46,210,179,.17);border-color:var(--teal);color:#8bead7}.challenge-options button.incorrect{background:rgba(255,118,95,.14);border-color:var(--coral)}.challenge-feedback{margin:7px 0 0;font-size:9px;color:var(--muted);min-height:12px;line-height:1.3}
@media(max-width:780px){.app-shell{padding:9px;gap:8px}.topbar{min-height:51px}.learning-goal{max-width:55%;padding:7px 9px;font-size:9px;line-height:1.25}.learning-goal strong{display:none}.workspace{grid-template-columns:1fr;grid-template-rows:minmax(0,1.12fr) minmax(0,.88fr);gap:8px}.panel{border-radius:17px}.population-panel{padding:11px;grid-template-rows:auto auto minmax(125px,1fr) auto minmax(76px,.36fr);gap:6px}.panel-heading h2{font-size:15px}.truth-pill{padding:6px 8px}.truth-pill span{display:none}.truth-pill strong{font-size:18px}.population-wrap{padding:6px}.zone{padding:4px;gap:3px}.legend{font-size:8px;gap:9px}.person{width:min(72%,18px)}.distribution{padding-top:6px}.distribution-head>p{font-size:8px}.number-line{min-height:50px}.control-panel{padding:10px;display:grid;grid-template-columns:1.08fr .92fr;grid-template-rows:auto auto 1fr;gap:8px}.control-section:first-child{grid-column:1/-1}.method-tabs{gap:5px}.method{padding:5px}.method small{display:none}.sample-size-section{align-content:start}.action-row{align-content:start}.primary,.secondary{min-height:36px;font-size:11px}.primary kbd{display:none}.result-card{grid-column:1;align-self:stretch;padding:8px 10px}.result-card strong{font-size:20px}.challenge{grid-column:2;grid-row:3;margin:0;padding:8px 9px}.challenge h3{font-size:11px}.challenge-options{margin-top:6px}.challenge-options button{font-size:8px;padding:5px 1px}.challenge-feedback{font-size:8px;margin-top:4px}.kicker{font-size:8px}.step-label small{display:none}}
@media(max-width:430px){h1{font-size:23px}.learning-goal{font-size:8px}.zone-rates{font-size:8px}.population-panel{grid-template-rows:auto auto minmax(118px,1fr) auto minmax(70px,.32fr)}.population-wrap{border-radius:11px}.zones{gap:3px}.zone{border-radius:8px}.person{outline-offset:1px}.control-panel{grid-template-columns:1fr 1fr}.step-label strong,.size-row strong{font-size:11px}.method span{font-size:9px}.size-row output{font-size:9px}.range-labels span:nth-child(2){display:none}.result-card p{font-size:8px}.interpretation{font-size:8px!important}.distribution h3{font-size:11px}}
@media(max-height:680px) and (min-width:781px){.app-shell{padding:9px;gap:8px}.topbar{min-height:44px}.learning-goal{padding:6px 9px}.population-panel{padding:12px;grid-template-rows:auto auto minmax(130px,1fr) auto 95px;gap:6px}.control-panel{padding:10px;gap:7px}.method{padding:5px}.action-row button{min-height:34px}.challenge{padding:8px 10px}.challenge-options{margin-top:6px}.result-card{padding:8px 10px}.person{width:min(68%,18px)}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}