@import"https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,700;9..144,900&family=Nunito:wght@400;600;700;800;900&family=Caveat:wght@600;700&family=DM+Mono:wght@400;500&display=swap";*{box-sizing:border-box;margin:0;padding:0}:root{--radius-sm: 10px;--radius: 18px;--radius-lg: 28px;--radius-pill: 999px;--shadow-soft: 0 12px 32px -10px rgba(0,0,0,.18), 0 2px 6px -2px rgba(0,0,0,.08);--t-fast: .14s;--t-spring: .48s;--ease-spring: cubic-bezier(.34, 1.56, .64, 1);--ease-out-soft: cubic-bezier(.22, 1, .36, 1);--bg: #1B1530;--bg-tint: #25204A;--surface: #2E2952;--surface-2: #3A3568;--ink: #FFF3E4;--ink-soft: #D9C9D8;--muted: #8E85A8;--line: transparent;--primary: #FF8A5C;--primary-ink: #1B1530;--secondary: #FFB97A;--tertiary: #FFD86B;--accent: #E27387;--correct: #6FCB8E;--correct-bg: #1F3528;--incorrect: #F77272;--incorrect-bg: #3A1F22;--warn: #F4A261;--font-display: "Fraunces", Georgia, serif;--font-body: "Nunito", system-ui, sans-serif;--font-mono: "DM Mono", ui-monospace, monospace;--font-hand: "Caveat", cursive;--outline-width: 0px;--shadow-pop: 0 14px 28px -10px rgba(0,0,0,.6), 0 4px 8px -4px rgba(0,0,0,.4);--shadow-pop-sm: 0 6px 14px -6px rgba(0,0,0,.5);--noise-opacity: .04}html,body{height:100%}body{margin:0;font-family:var(--font-body);background:var(--bg);color:var(--ink);font-weight:600;line-height:1.5;overflow:hidden;-webkit-font-smoothing:antialiased;transition:background var(--t-fast) ease,color var(--t-fast) ease}body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:999;opacity:var(--noise-opacity, 0);mix-blend-mode:multiply;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 0.5 0'/></filter><rect width='200' height='200' filter='url(%23n)'/></svg>")}#app{height:100vh;width:100vw;overflow:auto;position:relative;z-index:1}h1,h2,h3{font-family:var(--font-display);font-weight:900;letter-spacing:-.02em;line-height:1.1;text-wrap:balance;margin:0}p{margin:0}h1{line-height:1.08}.font-hand{font-family:var(--font-hand);font-weight:700}.font-mono{font-family:var(--font-mono);font-weight:500}.btn{--btn-bg: var(--surface);--btn-fg: var(--ink);display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:14px 22px;font:inherit;font-weight:800;font-size:15px;background:var(--btn-bg);color:var(--btn-fg);border:var(--outline-width) solid var(--line);border-radius:var(--radius-pill);box-shadow:var(--shadow-pop-sm);cursor:pointer;transition:transform .12s var(--ease-out-soft),box-shadow .12s var(--ease-out-soft),background .16s ease;user-select:none;-webkit-tap-highlight-color:transparent;text-decoration:none}.btn:hover{transform:translateY(-1px);box-shadow:0 10px 22px -10px #0000008c,0 3px 6px -3px #0006}.btn:active,.btn.is-pressed{transform:translateY(2px) scale(.985);box-shadow:0 2px 6px -3px #00000080;transition-duration:60ms}.btn:disabled,.btn[aria-disabled=true]{opacity:.5;cursor:not-allowed}.btn-primary{--btn-bg: var(--primary);--btn-fg: var(--primary-ink)}.btn-secondary{--btn-bg: var(--secondary);--btn-fg: var(--ink)}.btn-tertiary{--btn-bg: var(--tertiary);--btn-fg: var(--ink)}.btn-ghost{--btn-bg: transparent;box-shadow:none;border-color:transparent}.btn-ghost:hover{background:var(--surface-2);transform:none;box-shadow:none}.btn-ghost:active{transform:scale(.96)}.btn-sm{padding:8px 14px;font-size:13px}.btn-lg{padding:18px 30px;font-size:17px}.btn-xl{padding:22px 36px;font-size:20px}.card{background:var(--surface);border:var(--outline-width) solid var(--line);border-radius:var(--radius-lg);padding:24px;box-shadow:var(--shadow-pop);transition:transform var(--t-fast) var(--ease-out-soft),box-shadow var(--t-fast) var(--ease-out-soft)}.card-tap{cursor:pointer}.card-tap:hover{transform:translate(-2px,-3px);box-shadow:0 9px 0 var(--line)}.card-tap:active{transform:translateY(4px);box-shadow:0 2px 0 var(--line)}.chip{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;font-size:12px;font-weight:800;letter-spacing:.02em;text-transform:uppercase;border-radius:var(--radius-pill);background:var(--surface-2);color:var(--ink-soft);border:var(--outline-width) solid var(--line)}.chip-primary{background:var(--primary);color:var(--primary-ink)}.chip-secondary{background:var(--secondary);color:var(--ink)}.chip-tertiary{background:var(--tertiary);color:var(--ink)}.chip-correct{background:var(--correct-bg);color:var(--correct);border-color:var(--correct)}.chip-wrong{background:var(--incorrect-bg);color:var(--incorrect);border-color:var(--incorrect)}.bar{height:18px;background:var(--surface-2);border:var(--outline-width) solid var(--line);border-radius:var(--radius-pill);overflow:hidden;position:relative}.bar-fill{height:100%;background:var(--primary);border-radius:var(--radius-pill);transform-origin:left center;transition:width .8s var(--ease-out-soft),background .2s ease;position:relative}.bar-fill:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.35) 50%,transparent 100%);background-size:200% 100%;animation:shimmer 2.4s linear infinite}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}@keyframes pop-in{0%{transform:translateY(8px);opacity:0}to{transform:translateY(0);opacity:1}}.pop-in{animation:pop-in .36s var(--ease-out-soft) both}@keyframes squish{0%{transform:translateY(0)}50%{transform:translateY(2px) scaleY(.97)}to{transform:translateY(0)}}.squish{animation:squish .22s var(--ease-out-soft)}@keyframes wiggle{0%,to{transform:rotate(0)}30%{transform:rotate(-3deg)}70%{transform:rotate(3deg)}}.wiggle{animation:wiggle .52s ease-in-out}@keyframes shake{0%,to{transform:translate(0)}20%,60%{transform:translate(-3px)}40%,80%{transform:translate(3px)}}.shake{animation:shake .36s ease-in-out}@keyframes breathe{0%,to{transform:translateY(0) scale(1)}50%{transform:translateY(-2px) scale(1.015,.985)}}.float-y,.breathe{animation:breathe 4.4s ease-in-out infinite}@keyframes jump-cheer{0%,to{transform:translateY(0) rotate(0)}35%{transform:translateY(-10px) rotate(-3deg)}60%{transform:translateY(0) rotate(2deg)}80%{transform:translateY(-3px) rotate(0)}}.jump-cheer{animation:jump-cheer 1.6s var(--ease-out-soft) infinite}@keyframes head-shake{0%,to{transform:rotate(0)}50%{transform:rotate(-2deg)}}.head-shake{animation:head-shake 2.4s ease-in-out infinite}@keyframes wave-body{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-2px) rotate(-2deg)}}.wave-body{animation:wave-body 2.6s ease-in-out infinite}@keyframes dance{0%,to{transform:translate(0) rotate(-2deg)}50%{transform:translate(2px,-3px) rotate(3deg)}}.dance{animation:dance 1.6s ease-in-out infinite}@keyframes yawn-breathe{0%,to{transform:scale(1)}50%{transform:scale(1.025,.975)}}.yawn-breathe{animation:yawn-breathe 4s ease-in-out infinite}@keyframes droop{0%,to{transform:translateY(1px) rotate(0)}50%{transform:translateY(3px) rotate(-1deg)}}.droop{animation:droop 3.4s ease-in-out infinite}@keyframes fire-vibe{0%,to{transform:translateY(-1px) rotate(-1deg)}50%{transform:translateY(-4px) rotate(1deg)}}.fire-vibe{animation:fire-vibe .9s ease-in-out infinite}@keyframes ready-hop{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}.ready-hop{animation:ready-hop 1.1s var(--ease-out-soft) infinite}@keyframes drip{0%{transform:translateY(0);opacity:0}20%{opacity:1}to{transform:translateY(18px);opacity:0}}.drip{animation:drip 1.4s ease-in infinite}@keyframes shine{0%,to{opacity:.4}50%{opacity:1}}.shine{animation:shine 1.2s ease-in-out infinite}@keyframes sparkle-pop{0%,to{transform:scale(.8);opacity:.6}50%{transform:scale(1.2);opacity:1}}.sparkle-pop{animation:sparkle-pop 1.4s ease-in-out infinite;transform-origin:center}@keyframes spin-slow{to{transform:rotate(360deg)}}.spin-slow{animation:spin-slow 18s linear infinite}@keyframes leaf-drift{0%{transform:translateY(-24px) rotate(0);opacity:0}10%{opacity:1}to{transform:translate(var(--cx, 0px),110vh) rotate(var(--cr, 360deg));opacity:0}}.leaf-drift{animation:leaf-drift var(--cd, 2.8s) cubic-bezier(.3,.4,.5,1) forwards}.row{display:flex}.col{display:flex;flex-direction:column}.stack-tight>*+*{margin-top:8px}.stack>*+*{margin-top:16px}.stack-lg>*+*{margin-top:28px}.center{display:flex;align-items:center;justify-content:center}.scroll-y{overflow-y:auto}.scroll-y::-webkit-scrollbar{width:8px}.scroll-y::-webkit-scrollbar-thumb{background:var(--ink-soft);border-radius:4px}input[type=checkbox],input[type=radio]{accent-color:var(--primary)}::selection{background:var(--primary);color:var(--primary-ink)}:focus-visible{outline:3px dashed var(--accent);outline-offset:3px;border-radius:4px}@media (max-width: 720px){body{font-size:15px}.btn{padding:12px 18px;font-size:14px}.btn-sm{padding:7px 12px;font-size:12px}.btn-lg{padding:14px 22px;font-size:15px}.btn-xl{padding:16px 24px;font-size:16px}.card{padding:18px;border-radius:22px}.chip{padding:5px 10px;font-size:11px}}@media (max-width: 480px){.card{padding:14px;border-radius:18px}}@supports (padding: max(0px)){#app{padding-top:env(safe-area-inset-top);padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right);padding-bottom:env(safe-area-inset-bottom)}}