:root{--color-bg:#29292c;--color-surface:#3a3a3d;--color-surface-raised:#4a4a4e;--color-text:#fff;--color-text-muted:#99a;--color-accent:#6c9eff;--color-success:#4caf7d;--color-error:#e06060;--color-gold:#f0c040;--color-prestige:#a855f7;--radius-card:12px;--radius-btn:8px;--spacing-xs:4px;--spacing-sm:8px;--spacing-md:16px;--spacing-lg:24px;--spacing-xl:40px}*,:before,:after{box-sizing:border-box}html{height:100%}body{background-color:var(--color-bg);height:100%;color:var(--color-text);-webkit-font-smoothing:antialiased;margin:0;padding:0;font-family:Arial,sans-serif;overflow:hidden}#root{flex-direction:column;height:100svh;display:flex;overflow:hidden}.btn{padding:12px var(--spacing-lg);border-radius:var(--radius-btn);cursor:pointer;-webkit-user-select:none;user-select:none;border:none;justify-content:center;align-items:center;font-family:inherit;font-size:1rem;font-weight:600;transition:opacity .15s,transform 80ms cubic-bezier(.4,0,.2,1),background-color .15s;display:inline-flex}.btn:active{transform:scale(.95)}.btn-primary{background-color:var(--color-accent);color:#fff}.btn-primary:hover{opacity:.9}.btn-ghost{background-color:var(--color-surface);color:var(--color-text)}.btn-ghost:hover{background-color:var(--color-surface-raised)}.home-page{height:100%;padding:96px var(--spacing-md) var(--spacing-xl);align-items:center;gap:var(--spacing-xl);flex-direction:column;display:flex;overflow-y:auto}.home-hero{text-align:center;align-items:center;gap:var(--spacing-md);padding:0 var(--spacing-md);flex-direction:column;width:100%;max-width:540px;display:flex;position:relative}.home-hero__bg{color:var(--color-accent);opacity:.04;pointer-events:none;-webkit-user-select:none;user-select:none;letter-spacing:-2px;justify-content:center;align-items:center;gap:32px;font-size:5rem;font-weight:800;display:flex;position:absolute;inset:0;overflow:hidden}.home-hero__eyebrow{letter-spacing:3.5px;text-transform:uppercase;color:var(--color-accent);margin:0;font-size:.72rem;font-weight:700}.home-hero__title{flex-direction:column;align-items:center;gap:6px;margin:0;line-height:.95;display:flex}.home-hero__title-math{letter-spacing:-4px;color:var(--color-text);font-size:clamp(4rem,16vw,6.5rem);font-weight:800}.home-hero__title-domain{letter-spacing:0;color:var(--color-accent);opacity:.75;font-size:clamp(1.1rem,4vw,1.6rem);font-weight:600}.home-hero__sub{color:var(--color-text-muted);max-width:300px;margin:0;font-size:.95rem;line-height:1.6}.home-tools{gap:var(--spacing-md);flex-direction:column;width:100%;max-width:640px;display:flex}.home-tools__label{letter-spacing:3px;text-transform:uppercase;color:var(--color-text-muted);margin:0;font-size:.72rem;font-weight:700}.grid-tools{gap:var(--spacing-md);grid-template-columns:1fr;width:100%;display:grid}.tool-card{align-items:center;gap:var(--spacing-md);background-color:var(--color-surface);border-radius:var(--radius-card);padding:20px var(--spacing-lg);cursor:pointer;text-align:left;color:var(--color-text);border:1px solid #ffffff0d;grid-template-columns:auto 1fr auto;width:100%;font-family:inherit;transition:background-color .15s,border-color .2s,box-shadow .2s,transform .12s;display:grid}.tool-card:hover{background-color:var(--color-surface-raised);border-color:#6c9eff47;transform:translateY(-1px);box-shadow:0 0 0 1px #6c9eff1f,0 8px 24px #0000004d}.tool-card:active{box-shadow:none;transform:scale(.98)translateY(0)}.tool-card-icon{width:52px;height:52px;color:var(--color-accent);background:linear-gradient(135deg,#6c9eff26 0%,#6c9eff0f 100%);border:1px solid #6c9eff2e;border-radius:12px;flex-shrink:0;justify-content:center;align-items:center;font-size:1.6rem;font-weight:700;display:flex}.tool-card-body{flex-direction:column;gap:5px;min-width:0;display:flex}.tool-card-name{letter-spacing:-.2px;font-size:1.05rem;font-weight:700}.tool-card-desc{color:var(--color-text-muted);font-size:.85rem;line-height:1.4}.tool-card-stats{color:var(--color-accent);opacity:.7;margin-top:2px;font-size:.75rem;font-weight:600}.tool-card-arrow{color:var(--color-text-muted);opacity:.35;flex-shrink:0;font-size:1.1rem;transition:opacity .15s,transform .15s}.tool-card:hover .tool-card-arrow{opacity:.8;transform:translate(3px)}.setup-view{height:100%;padding:var(--spacing-md) var(--spacing-md) var(--spacing-lg);flex-direction:column;align-items:center;display:flex;overflow:hidden}.setup-back{padding:var(--spacing-sm) var(--spacing-md);align-self:flex-start;font-size:.9rem}.setup-header{text-align:center;margin:var(--spacing-lg) 0;flex-shrink:0}.setup-title{margin:0 0 var(--spacing-sm);font-size:1.75rem;font-weight:700}.setup-subtitle{color:var(--color-text-muted);margin:0;font-size:.95rem}.op-grid{gap:var(--spacing-md);flex-shrink:0;grid-template-columns:1fr 1fr;width:100%;max-width:320px;display:grid}.op-toggle{justify-content:center;align-items:center;gap:var(--spacing-xs);background-color:var(--color-surface);height:100px;color:var(--color-text-muted);border-radius:var(--radius-card);cursor:pointer;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;border:2px solid #0000;flex-direction:column;font-family:inherit;transition:background-color .15s,border-color .15s,color .15s,transform .1s;display:flex}.op-toggle:hover{background-color:var(--color-surface-raised)}.op-toggle:active{transform:scale(.96)}.op-toggle--active{border-color:var(--color-accent);color:var(--color-text);background-color:#6c9eff1f}.op-toggle-symbol{color:inherit;font-size:2rem;font-weight:700;line-height:1}.op-toggle--active .op-toggle-symbol{color:var(--color-accent)}.op-toggle-label{letter-spacing:.3px;font-size:.8rem;font-weight:600}.setup-start{width:100%;max-width:320px;margin-top:auto;padding:16px;font-size:1.05rem}.setup-start:disabled{opacity:.35;cursor:default}.question-view{height:100%;padding:var(--spacing-lg) var(--spacing-md) var(--spacing-md);flex-direction:column;align-items:center;display:flex;overflow:hidden}.question-header{flex-shrink:0;align-items:center;width:100%;max-width:320px;display:flex}.question-progress--center{text-align:center;flex:1}.question-header-spacer{flex-shrink:0;width:72px}.question-exit{padding:var(--spacing-sm) var(--spacing-md);font-size:.9rem}.question-progress{color:var(--color-text-muted);letter-spacing:1px;font-size:.9rem;font-weight:600}.question-progress-sep{opacity:.5;margin:0 4px}.question-text{letter-spacing:-1px;text-align:center;flex:1;align-items:center;font-size:clamp(2.5rem,10vw,4rem);font-weight:700;display:flex}.question-bottom{align-items:center;gap:var(--spacing-md);flex-direction:column;flex-shrink:0;width:100%;max-width:320px;display:flex}.answer-display{background-color:var(--color-surface);border-radius:var(--radius-card);width:100%;height:68px;padding:var(--spacing-sm) var(--spacing-lg);letter-spacing:3px;flex-shrink:0;justify-content:center;align-items:center;font-size:2.25rem;font-weight:600;transition:background-color .2s,color .2s;display:flex}.answer-display--correct{color:var(--color-success);background-color:#4caf7d26}.answer-display--wrong{color:var(--color-error);background-color:#e0606026}.answer-placeholder{color:var(--color-text-muted);letter-spacing:0}.feedback-message{letter-spacing:.2px;justify-content:center;align-items:center;height:1.6em;font-size:1.1rem;font-weight:600;display:flex}.feedback--correct{color:var(--color-success)}.feedback--wrong{color:var(--color-error)}.keypad-wrap{flex-shrink:0;width:100%;transition:opacity .15s}.keypad-wrap--hidden{opacity:.25;pointer-events:none}.keypad{gap:var(--spacing-sm);flex-direction:column;width:100%;display:flex}.keypad-row{gap:var(--spacing-sm);grid-template-columns:repeat(3,1fr);display:grid}.keypad-btn{background-color:var(--color-surface-raised);height:72px;color:var(--color-text);border-radius:var(--radius-btn);cursor:pointer;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;border:none;justify-content:center;align-items:center;font-family:inherit;font-size:1.5rem;font-weight:600;transition:background-color .1s,transform 80ms;display:flex}.keypad-btn:not(:disabled):active{background-color:var(--color-surface);transform:scale(.92)}.keypad-btn--confirm{background-color:var(--color-accent);color:#fff}.keypad-btn--confirm:not(:disabled):active{background-color:var(--color-accent);opacity:.8}.keypad-btn--backspace{color:var(--color-text-muted)}.keypad-btn:disabled{cursor:default}.results-view{height:100%;padding:var(--spacing-lg) var(--spacing-md);align-items:center;gap:var(--spacing-sm);flex-direction:column;display:flex;overflow-y:auto}.results-score{align-items:baseline;gap:var(--spacing-sm);flex-shrink:0;display:flex}.results-score-number{color:var(--color-accent);font-size:5rem;font-weight:800;line-height:1}.results-score-divider,.results-score-total{color:var(--color-text-muted);font-size:3rem;font-weight:700}.results-pct{color:var(--color-text-muted);flex-shrink:0;font-size:1rem}.results-message{flex-shrink:0;font-size:1.4rem;font-weight:700}.results-breakdown{gap:var(--spacing-xs);flex-direction:column;width:100%;max-width:400px;display:flex}.result-row{align-items:center;gap:var(--spacing-sm);padding:10px var(--spacing-md);border-radius:8px;grid-template-columns:22px 1fr auto;font-size:.95rem;display:grid}.result-row--correct{background-color:#4caf7d14}.result-row--wrong{background-color:#e0606014}.result-row--correct .result-indicator{color:var(--color-success)}.result-row--wrong .result-indicator{color:var(--color-error)}.result-question{font-weight:600}.result-answer{color:var(--color-text-muted);text-align:right}.result-row--correct .result-answer{color:var(--color-success)}.result-row--wrong .result-answer{color:var(--color-error)}.results-actions{gap:var(--spacing-md);padding-bottom:var(--spacing-sm);flex-shrink:0;display:flex}.level-fab{z-index:100;background-color:var(--color-surface);pointer-events:none;border-radius:50%;justify-content:center;align-items:center;width:64px;height:64px;display:flex;position:fixed;top:16px;right:16px}.level-fab__badge{background-color:var(--color-success);color:#fff;border:2px solid var(--color-bg);border-radius:50%;justify-content:center;align-items:center;width:20px;height:20px;font-size:.6rem;font-weight:700;display:flex;position:absolute;bottom:0;right:0}@media (width>=1024px){.grid-tools{grid-template-columns:repeat(auto-fill,minmax(360px,1fr))}}@keyframes card-enter{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}@keyframes view-enter{0%{opacity:0;transform:translate(18px)}to{opacity:1;transform:translate(0)}}@keyframes answer-correct{0%{transform:scale(1)}35%{transform:scale(1.045)}to{transform:scale(1)}}@keyframes answer-shake{0%,to{transform:translate(0)}18%{transform:translate(-7px)}36%{transform:translate(7px)}54%{transform:translate(-5px)}72%{transform:translate(5px)}90%{transform:translate(-2px)}}@keyframes fab-pulse{0%{filter:drop-shadow(0 0 0px var(--color-accent))}45%{filter:drop-shadow(0 0 10px var(--color-accent))}to{filter:drop-shadow(0 0 0px var(--color-accent))}}@keyframes toast-in{0%{opacity:0;transform:translate(110%)scale(.88)}to{opacity:1;transform:translate(0)scale(1)}}@keyframes toast-out{0%{opacity:1;transform:translate(0)scale(1)}to{opacity:0;transform:translate(110%)scale(.88)}}@keyframes overlay-enter{0%{opacity:0}to{opacity:1}}@keyframes overlay-content-enter{0%{opacity:0;transform:scale(.78)translateY(24px)}to{opacity:1;transform:scale(1)translateY(0)}}@keyframes spark{0%{transform:rotate(var(--spark-angle,0deg)) translateY(0px) scale(1.2);opacity:1}to{transform:rotate(var(--spark-angle,0deg)) translateY(-90px) scale(0);opacity:0}}@keyframes spark-prestige{0%{transform:rotate(var(--spark-angle,0deg)) translateY(0px) scale(1.2);opacity:1}to{transform:rotate(var(--spark-angle,0deg)) translateY(-110px) scale(0);opacity:0}}@keyframes hero-enter{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.home-hero{animation:.4s ease-out both hero-enter}.home-tools{animation:.4s ease-out .1s both hero-enter}.tool-card{animation:.32s ease-out both card-enter;animation-delay:calc(var(--stagger-index,0) * 65ms)}.setup-view,.question-view,.results-view{animation:.22s ease-out both view-enter}.answer-display--correct{animation:.38s ease-out answer-correct}.answer-display--wrong{animation:.42s ease-out answer-shake}.progress-arc{transition:stroke-dashoffset .6s cubic-bezier(.4,0,.2,1)}.level-fab--pulse{animation:.65s ease-out fab-pulse}.toast-container{z-index:200;pointer-events:none;flex-direction:column;align-items:flex-end;gap:8px;display:flex;position:fixed;top:92px;right:16px}.toast{background-color:var(--color-surface-raised);color:var(--color-text);pointer-events:auto;border:1px solid #ffffff12;border-radius:999px;align-items:center;gap:6px;max-width:220px;padding:8px 12px;font-size:.85rem;font-weight:700;animation:.28s cubic-bezier(.34,1.56,.64,1) both toast-in;display:flex;box-shadow:0 4px 16px #0006}.toast--xp-gain{color:var(--color-accent);background-color:#6c9eff2e;border-color:#6c9eff40}.toast--dismissing{animation:.22s ease-in forwards toast-out}.toast__icon{font-size:.9rem}.toast__message{letter-spacing:.2px;flex:1}.toast__close{color:inherit;opacity:.5;cursor:pointer;background:0 0;border:none;padding:0 2px;font-family:inherit;font-size:1rem;line-height:1}.toast__close:hover{opacity:1}.overlay{z-index:500;cursor:pointer;justify-content:center;align-items:center;animation:.2s ease-out both overlay-enter;display:flex;position:fixed;inset:0}.overlay--level-up{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:radial-gradient(#6c9eff2e 0%,#29292cf5 70%)}.overlay--prestige{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:radial-gradient(#a855f738 0%,#140f1ef7 65%)}.overlay__content{text-align:center;cursor:default;border-radius:24px;flex-direction:column;align-items:center;gap:12px;width:calc(100% - 48px);max-width:340px;padding:48px 40px 40px;animation:.38s cubic-bezier(.34,1.56,.64,1) 50ms both overlay-content-enter;display:flex;position:relative}.overlay--level-up .overlay__content{background-color:#3a3a3deb;border:1px solid #6c9eff4d;box-shadow:0 0 60px #6c9eff26,0 24px 48px #00000080}.overlay--prestige .overlay__content{background-color:#1c142af2;border:1px solid #a855f766;box-shadow:0 0 80px #a855f733,0 24px 48px #0009}.overlay__burst{pointer-events:none;width:0;height:0;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.overlay__spark{background:var(--color-accent);border-radius:50%;width:7px;height:7px;animation:.7s cubic-bezier(.25,.46,.45,.94) .12s both spark;position:absolute;top:-3px;left:-3px}.overlay__spark--prestige{background:var(--color-gold);width:8px;height:8px;animation:.85s cubic-bezier(.25,.46,.45,.94) .1s both spark-prestige}.overlay__eyebrow{letter-spacing:3px;text-transform:uppercase;color:var(--color-accent);margin:0;font-size:.8rem;font-weight:700}.overlay__eyebrow--prestige{color:var(--color-prestige);letter-spacing:4px}.overlay__number{letter-spacing:-2px;color:var(--color-text);margin:0;font-size:5.5rem;font-weight:800;line-height:1}.overlay__number--prestige{letter-spacing:4px;color:var(--color-gold);text-shadow:0 0 24px #f0c04066;font-size:3rem}.overlay__sub{color:var(--color-text-muted);margin:0;font-size:.9rem;line-height:1.5}.overlay__cta{margin-top:8px;padding:12px 32px;font-size:.95rem}.overlay__cta--prestige{background:linear-gradient(135deg, var(--color-prestige), #7c3aed);color:#fff;letter-spacing:.5px;border:none;font-weight:700}.overlay__cta--prestige:hover{opacity:.9}