:root{color-scheme:light dark;--bg: #f6f7f9;--bg-elevated: #ffffff;--bg-inset: #eef0f4;--ink: #1a1d21;--ink-soft: #5c6470;--ink-faint: #8a92a0;--line: #e2e5ea;--brand: #2563eb;--brand-strong: #1d4ed8;--brand-soft: #dbeafe;--ok: #059669;--ok-soft: #d1fae5;--ok-glow: rgba(5, 150, 105, .18);--warn: #d97706;--warn-soft: #fef3c7;--bad: #dc2626;--bad-soft: #fee2e2;--bad-glow: rgba(220, 38, 38, .18);--radius: 14px;--radius-sm: 10px;--shadow: 0 1px 2px rgba(16, 24, 40, .06), 0 8px 24px -12px rgba(16, 24, 40, .14);--shadow-lg: 0 2px 6px rgba(16, 24, 40, .08), 0 12px 32px -8px rgba(16, 24, 40, .18);--mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;--ease-out: cubic-bezier(.16, 1, .3, 1);--ease-bounce: cubic-bezier(.34, 1.56, .64, 1)}@media(prefers-color-scheme:dark){:root{--bg: #0f1115;--bg-elevated: #171a21;--bg-inset: #1e222b;--ink: #e8eaee;--ink-soft: #9aa3b2;--ink-faint: #6b7280;--line: #262b35;--brand: #3b82f6;--brand-strong: #60a5fa;--brand-soft: #1e3a5f;--ok: #34d399;--ok-soft: #0b3b2e;--ok-glow: rgba(52, 211, 153, .15);--warn: #fbbf24;--warn-soft: #42300b;--bad: #f87171;--bad-soft: #4a1620;--bad-glow: rgba(248, 113, 113, .15)}}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--ink);line-height:1.55;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-feature-settings:"cv02","cv03","cv04","cv11"}.app{max-width:980px;margin:0 auto;padding:20px 20px 80px;min-height:100%}.topbar{display:flex;align-items:center;gap:10px;padding:6px 0 18px}.brand{display:flex;align-items:center;gap:10px;font-weight:700;font-size:18px;letter-spacing:-.025em}.brand .logo{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,var(--brand),var(--brand-strong));color:#fff;transition:transform .2s var(--ease-out)}.brand:hover .logo{transform:rotate(-4deg) scale(1.05)}.brand small{display:block;font-weight:500;font-size:12px;color:var(--ink-soft)}.topbar .spacer{flex:1}.chip{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;background:var(--bg-inset);color:var(--ink-soft);font-size:12px;font-weight:600;transition:background .15s ease,transform .1s var(--ease-out)}.chip:hover{background:var(--line)}.nav{display:flex;gap:6px;margin:0 0 22px;padding:4px;background:var(--bg-inset);border-radius:12px;overflow-x:auto}.nav button{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;background:transparent;color:var(--ink-soft);font:inherit;font-size:13px;font-weight:600;padding:8px 14px;border-radius:9px;cursor:pointer;white-space:nowrap;display:inline-flex;align-items:center;gap:6px;transition:background .15s ease,color .15s ease,box-shadow .2s var(--ease-out),transform .1s var(--ease-out)}.nav button:active{transform:scale(.97)}.nav button.active{background:var(--bg-elevated);color:var(--ink);box-shadow:var(--shadow)}.card{background:var(--bg-elevated);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px;transition:box-shadow .2s ease,transform .2s var(--ease-out)}.card.hoverable:hover{box-shadow:var(--shadow-lg);transform:translateY(-1px)}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}.stat{padding:14px 16px}.stat .label{font-size:11px;color:var(--ink-soft);font-weight:700;text-transform:uppercase;letter-spacing:.06em}.stat .value{font-size:30px;font-weight:800;margin-top:2px;font-variant-numeric:tabular-nums;letter-spacing:-.03em}.stat .sub{font-size:12px;color:var(--ink-faint);margin-top:2px}h1{font-size:22px;font-weight:800;margin:0 0 4px;letter-spacing:-.03em;line-height:1.2}h2{font-size:16px;font-weight:700;margin:0 0 12px;letter-spacing:-.015em}p{margin:0 0 12px;color:var(--ink-soft);line-height:1.6}button.primary{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;background:var(--brand);color:#fff;font:inherit;font-weight:600;font-size:14px;padding:11px 18px;border-radius:11px;cursor:pointer;display:inline-flex;align-items:center;gap:8px;transition:transform .2s var(--ease-bounce),background .15s ease,box-shadow .15s ease}button.primary:hover{background:var(--brand-strong);box-shadow:0 2px 8px #2563eb40}button.primary:active{transform:scale(.93);box-shadow:0 0 0 4px var(--brand-soft)}button.primary:disabled{opacity:.45;cursor:not-allowed;transform:none}button.ghost{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid var(--line);background:var(--bg-elevated);color:var(--ink);font:inherit;font-weight:600;font-size:14px;padding:10px 16px;border-radius:11px;cursor:pointer;display:inline-flex;align-items:center;gap:8px;transition:transform .2s var(--ease-bounce),background .15s ease,border-color .15s ease}button.ghost:hover{background:var(--bg-inset);border-color:var(--ink-faint)}button.ghost:active{transform:scale(.93);box-shadow:0 0 0 3px var(--brand-soft)}button:disabled{opacity:.45;cursor:not-allowed}input[type=text]{font:inherit;font-size:15px;padding:11px 14px;border-radius:11px;border:1.5px solid var(--line);background:var(--bg-elevated);color:var(--ink);width:100%;transition:border-color .15s ease,box-shadow .15s ease}input[type=text]:hover{border-color:var(--ink-faint)}input[type=text]:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}.badge{display:inline-block;padding:2px 9px;border-radius:999px;font-size:11px;font-weight:700;letter-spacing:.03em}.badge.brand{background:var(--brand-soft);color:var(--brand-strong)}.badge.ok{background:var(--ok-soft);color:var(--ok)}.badge.warn{background:var(--warn-soft);color:var(--warn)}.badge.bad{background:var(--bad-soft);color:var(--bad)}.study-stage{max-width:640px;margin:0 auto}.meta-line{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13px;color:var(--ink-soft);margin-bottom:14px}.prompt-pill{font-size:12px;font-weight:700;padding:3px 10px;border-radius:999px;background:var(--brand-soft);color:var(--brand-strong);transition:background .2s ease}.frame-stem{font-size:19px;font-weight:600;line-height:1.4;letter-spacing:-.01em;margin:10px 0 18px;min-height:80px}.prompt-box{margin:0 0 18px;padding:14px 16px;border-radius:var(--radius-sm);background:var(--bg-inset);border-left:3px solid var(--brand);font-size:15px;color:var(--ink-soft);animation:slideInLeft .25s var(--ease-out)}.prompt-box .pl{display:block;font-size:11px;font-weight:700;color:var(--brand);text-transform:uppercase;letter-spacing:.05em;margin-bottom:4px}.response-row{display:flex;gap:10px;align-items:flex-start}.response-row input{flex:1}.response-row button{flex-shrink:0}.latency-row{font-size:12px;color:var(--ink-faint);margin-top:10px;font-variant-numeric:tabular-nums}.result-banner{padding:16px 18px;border-radius:var(--radius-sm);margin-bottom:16px;display:flex;gap:12px;align-items:flex-start;animation:feedbackPop .3s var(--ease-bounce)}.result-banner.ok{background:var(--ok-soft);color:var(--ok);box-shadow:0 0 0 2px var(--ok-glow)}.result-banner.bad{background:var(--bad-soft);color:var(--bad);box-shadow:0 0 0 2px var(--bad-glow);animation:feedbackShake .35s var(--ease-out)}.result-banner .why{margin-top:6px;font-size:14px;line-height:1.5;color:var(--ink)}.result-banner .correct-answer{font-weight:600}.result-banner .citations{margin-top:10px;padding-top:8px;border-top:1px solid var(--line);font-size:12px}.result-banner .citations-label{font-weight:700;text-transform:uppercase;letter-spacing:.05em;font-size:10px;color:var(--ink-soft)}.result-banner .citations ul{margin:4px 0 0;padding-left:16px;color:var(--ink-soft);line-height:1.45}.result-banner .citations li{margin-bottom:2px}.session-summary{text-align:center;padding:30px 20px}.session-summary .big{font-size:44px;font-weight:800;letter-spacing:-.04em}.safmeds-stage{max-width:720px;margin:0 auto}.timer-display{font-size:40px;font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:-.03em;text-align:center;margin:4px 0 12px;transition:color .2s ease}.timer-display.running{color:var(--warn);animation:timerPulse 1s ease-in-out infinite}.safmeds-card-face{background:var(--bg-elevated);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:28px 24px;min-height:180px;display:grid;place-items:center;text-align:center;cursor:pointer;-webkit-user-select:none;user-select:none;transition:transform .15s var(--ease-out),box-shadow .2s ease,border-color .15s ease}.safmeds-card-face:hover{box-shadow:var(--shadow-lg);transform:translateY(-1px)}.safmeds-card-face:active{transform:scale(.99)}.safmeds-card-face .front{font-size:22px;font-weight:700;letter-spacing:-.01em}.safmeds-card-face .back{font-size:18px;color:var(--brand);font-weight:600}.safmeds-card-face.flash-ok{border-color:var(--ok);box-shadow:0 0 0 3px var(--ok-glow)}.safmeds-card-face.flash-bad{border-color:var(--bad);box-shadow:0 0 0 3px var(--bad-glow)}.tally{display:flex;justify-content:center;gap:26px;margin:16px 0;font-variant-numeric:tabular-nums}.tally .count{font-size:28px;font-weight:800;letter-spacing:-.03em;transition:transform .2s var(--ease-bounce)}.tally .count.bump{transform:scale(1.2)}.tally .count.ok{color:var(--ok)}.tally .count.bad{color:var(--bad)}.tally .lbl{font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-faint);font-weight:700}.verdict{text-align:center;padding:24px}.verdict .aim{font-size:15px;margin-top:8px;color:var(--ink-soft)}.chart-wrap{overflow-x:auto}.chart-wrap svg{min-width:560px}.chart-legend{display:flex;gap:18px;font-size:12px;color:var(--ink-soft);margin-bottom:8px}.chart-legend .swatch{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px}.domain-block{margin-bottom:16px}.domain-head{display:flex;align-items:center;gap:10px;margin-bottom:8px}.domain-head .title{font-weight:700;font-size:14px}.domain-head .weight{font-size:12px;color:var(--ink-faint);margin-left:auto;white-space:nowrap}.task-row{display:flex;align-items:flex-start;gap:10px;padding:8px 6px;border-radius:8px;transition:background .12s ease}.task-row:hover{background:var(--bg-inset)}.task-row .code{font-family:var(--mono);font-size:12px;color:var(--brand);font-weight:700;width:40px;flex-shrink:0;padding-top:1px}.task-row .text{font-size:14px;color:var(--ink-soft);flex:1}.task-row .done{flex-shrink:0}.bar-track{height:6px;border-radius:999px;background:var(--bg-inset);overflow:hidden}.bar-fill{height:100%;border-radius:999px;background:var(--brand);transition:width .5s var(--ease-out)}.onboard{max-width:460px;margin:8vh auto 0;text-align:center}.onboard .card{text-align:left}.onboard .logo-big{width:64px;height:64px;border-radius:18px;display:grid;place-items:center;margin:0 auto 14px;background:linear-gradient(135deg,var(--brand),var(--brand-strong));color:#fff;animation:floatIn .5s var(--ease-bounce)}.cert-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:14px 0 18px}.cert-opt{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1.5px solid var(--line);background:var(--bg-elevated);border-radius:11px;padding:12px 8px;cursor:pointer;font:inherit;font-weight:700;color:var(--ink-soft);transition:transform .2s var(--ease-bounce),border-color .15s ease,background .15s ease,box-shadow .15s ease}.cert-opt:hover{border-color:var(--ink-faint);background:var(--bg-inset)}.cert-opt:active{transform:scale(.93);box-shadow:0 0 0 3px var(--brand-soft)}.cert-opt.selected{border-color:var(--brand);color:var(--brand);background:var(--brand-soft);box-shadow:0 0 0 2px #2563eb1f}.small-note{font-size:12px;color:var(--ink-faint);margin-top:12px;text-align:center}.empty-state{text-align:center;padding:40px 20px;color:var(--ink-soft)}.muted{color:var(--ink-faint)}.mono{font-family:var(--mono)}.row-between{display:flex;align-items:center;justify-content:space-between;gap:10px}.spinner{width:18px;height:18px;border:2px solid var(--line);border-top-color:var(--brand);border-radius:50%;animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@keyframes fadeIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}@keyframes slideInLeft{0%{opacity:0;transform:translate(-8px)}to{opacity:1;transform:none}}@keyframes feedbackPop{0%{opacity:0;transform:scale(.95)}50%{transform:scale(1.015)}to{opacity:1;transform:none}}@keyframes feedbackShake{0%,to{transform:translate(0)}15%{transform:translate(-4px)}30%{transform:translate(4px)}45%{transform:translate(-3px)}60%{transform:translate(2px)}75%{transform:translate(-1px)}}@keyframes timerPulse{0%,to{opacity:1}50%{opacity:.7}}@keyframes floatIn{0%{opacity:0;transform:translateY(12px) scale(.9)}to{opacity:1;transform:none}}@keyframes countBump{0%{transform:scale(1)}40%{transform:scale(1.25)}to{transform:scale(1)}}@keyframes streakBounce{0%{transform:translateY(0)}30%{transform:translateY(-6px)}50%{transform:translateY(0)}70%{transform:translateY(-3px)}to{transform:translateY(0)}}.fade-in{animation:fadeIn .25s var(--ease-out)}.bump{animation:countBump .3s var(--ease-bounce)}.streak-bounce{animation:streakBounce .4s var(--ease-bounce)}@keyframes clickerPress{0%{transform:scale(1)}40%{transform:scale(.96)}70%{transform:scale(1.015)}to{transform:scale(1)}}@keyframes clickerGlow{0%{box-shadow:0 0 0 0 var(--brand)}35%{box-shadow:0 0 20px 6px var(--brand-soft)}to{box-shadow:var(--shadow)}}@keyframes clickerRing{0%{box-shadow:0 0 0 0 var(--ok-glow)}40%{box-shadow:0 0 0 6px var(--ok-glow)}to{box-shadow:0 0 0 0 transparent}}.clicker-active{animation:clickerPress .25s var(--ease-bounce),clickerGlow .4s ease-out}.clicker-active .result-banner.ok{animation:clickerRing .35s ease-out}@keyframes streakDotPulse{0%,to{r:3.5;opacity:1}50%{r:5;opacity:.7}}.streak-meter{display:inline-flex;align-items:center;vertical-align:middle}.streak-meter-svg{display:block;border-radius:6px;background:var(--bg);border:1px solid var(--line)}.streak-meter .streak-dot{animation:streakDotPulse .8s ease-in-out infinite}.streak-phase-0 .streak-meter-svg{border-color:var(--ink-faint)}.streak-phase-1 .streak-meter-svg{border-color:var(--brand);box-shadow:0 0 8px var(--brand-soft)}.streak-phase-2 .streak-meter-svg{border-color:var(--ok);box-shadow:0 0 12px var(--ok-glow)}.clicker-active .streak-meter{animation:clickerPress .25s var(--ease-bounce)}.color-spectrum-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;max-width:360px;margin:0 auto}.color-swatch{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:2.5px solid transparent;background:var(--bg-elevated);border-radius:14px;padding:0;cursor:pointer;aspect-ratio:1;position:relative;display:grid;place-items:center;transition:transform .2s var(--ease-bounce),border-color .2s ease,box-shadow .2s ease}.color-swatch:hover{transform:scale(1.06);box-shadow:0 2px 12px #0000001f}.color-swatch:active{transform:scale(.96)}.color-swatch .swatch-fill{width:72%;height:72%;border-radius:10px;background:var(--swatch-color);transition:transform .2s var(--ease-bounce),box-shadow .2s ease}.color-swatch.selected{border-color:var(--swatch-ring);box-shadow:0 0 0 3px color-mix(in srgb,var(--swatch-ring) 25%,transparent)}.color-swatch.selected .swatch-fill{transform:scale(.88);box-shadow:0 2px 8px color-mix(in srgb,var(--swatch-ring) 40%,transparent)}.swatch-rank{position:absolute;top:5px;right:5px;width:20px;height:20px;border-radius:50%;background:var(--swatch-color);color:#fff;font-size:11px;font-weight:800;display:grid;place-items:center;line-height:1;box-shadow:0 1px 4px #0003}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:grid;place-items:center;z-index:200;animation:fadeIn .2s ease}.modal-card{background:var(--bg-elevated);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-lg);padding:28px 24px;max-width:480px;width:calc(100% - 32px);animation:floatIn .3s var(--ease-bounce)}.modal-card h2{margin-bottom:6px}.modal-card .tier-option{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1.5px solid var(--line);background:var(--bg-elevated);border-radius:11px;padding:14px 16px;cursor:pointer;font:inherit;text-align:left;width:100%;margin-bottom:8px;display:flex;align-items:center;gap:12px;transition:border-color .15s ease,background .15s ease,box-shadow .15s ease}.modal-card .tier-option:hover{border-color:var(--ink-faint);background:var(--bg-inset)}.modal-card .tier-option.selected{border-color:var(--brand);background:var(--brand-soft);box-shadow:0 0 0 2px #2563eb1f}.modal-card .tier-icon{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;flex-shrink:0;font-size:18px}.modal-card .tier-label{font-weight:700;font-size:14px;color:var(--ink)}.modal-card .tier-desc{font-size:12px;color:var(--ink-soft);margin-top:2px}