:root{--bg:#0D1117;--surface:#161B22;--surface-2:#1C2230;--border:#30363D;--border-soft:#252B34;--accent:#22D3EE;--accent-rgb:34,211,238;--grand:#8B5CF6;--grand-rgb:139,92,246;--correct:#10B981;--correct-rgb:16,185,129;--incorrect:#EF4444;--incorrect-rgb:239,68,68;--text:#E6EDF3;--dim:#8B949E;--dim-2:#6E7681;--mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;--ui:"Inter",system-ui,-apple-system,sans-serif;--motion:1;--radius:14px;--maxw:1180px}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body{font-family:var(--ui);background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden}#root{min-height:100vh;position:relative;z-index:1}::selection{background:rgba(var(--accent-rgb),.28);color:#fff}*::-webkit-scrollbar{width:10px;height:10px}*::-webkit-scrollbar-track{background:transparent}*::-webkit-scrollbar-thumb{background:#21262d;border-radius:8px;border:2px solid var(--bg)}*::-webkit-scrollbar-thumb:hover{background:#2d333b}.bg-layer{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}.bg-grid{position:absolute;inset:-2px;background-image:linear-gradient(rgba(var(--accent-rgb),.05) 1px,transparent 1px),linear-gradient(90deg,rgba(var(--accent-rgb),.05) 1px,transparent 1px);background-size:46px 46px;mask-image:radial-gradient(ellipse 90% 70% at 50% 0%,#000 30%,transparent 78%);-webkit-mask-image:radial-gradient(ellipse 90% 70% at 50% 0%,#000 30%,transparent 78%);animation:gridDrift calc(34s / var(--motion,1)) linear infinite;opacity:calc(.5 + var(--motion,1) * .28)}.bg-glow{position:absolute;width:60vw;height:60vw;border-radius:50%;filter:blur(90px);opacity:calc(.12 * var(--motion,1))}.bg-glow.a{top:-22vw;left:-12vw;background:rgba(var(--accent-rgb),.55);animation:floatA calc(26s / var(--motion,1)) ease-in-out infinite}.bg-glow.b{bottom:-26vw;right:-14vw;background:rgba(var(--grand-rgb),.45);animation:floatB calc(32s / var(--motion,1)) ease-in-out infinite}@keyframes gridDrift{to{background-position:46px 46px,46px 46px}}@keyframes floatA{50%{transform:translate(6vw,4vw)}}@keyframes floatB{50%{transform:translate(-5vw,-3vw)}}.motion-off .bg-grid,.motion-off .bg-glow{animation:none!important}.mono{font-family:var(--mono)}.cursor{display:inline-block;width:.58em;height:1.02em;margin-left:.06em;background:var(--accent);transform:translateY(.12em);animation:blink 1.05s steps(1) infinite;border-radius:1px}@keyframes blink{50%{opacity:0}}.motion-off .cursor{animation:none}.eyebrow{font-family:var(--mono);font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--accent);font-weight:600}.dim{color:var(--dim)}.btn{font-family:var(--ui);font-weight:600;font-size:15px;border:1px solid transparent;border-radius:11px;padding:13px 22px;cursor:pointer;transition:.18s ease;display:inline-flex;align-items:center;gap:9px;line-height:1;white-space:nowrap;-webkit-tap-highlight-color:transparent}.btn:active{transform:translateY(1px)}.btn-primary{background:var(--accent);color:#06222a;box-shadow:0 0 rgba(var(--accent-rgb),.45)}.btn-primary:hover{box-shadow:0 8px 30px -8px rgba(var(--accent-rgb),.7);filter:brightness(1.06)}.btn-grand{background:var(--grand);color:#fff}.btn-grand:hover{box-shadow:0 8px 30px -8px rgba(var(--grand-rgb),.75);filter:brightness(1.07)}.btn-ghost{background:transparent;color:var(--text);border-color:var(--border)}.btn-ghost:hover{border-color:var(--accent);color:var(--accent);background:rgba(var(--accent-rgb),.06)}.btn-lg{padding:16px 28px;font-size:16px;border-radius:13px}.btn:disabled{opacity:.4;cursor:not-allowed}.surface{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius)}.tag{font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.04em;padding:3px 8px;border-radius:6px;text-transform:lowercase;border:1px solid}.tag.easy{color:#3dd68c;border-color:#3dd68c59;background:#3dd68c14}.tag.medium{color:#e3b341;border-color:#e3b34159;background:#e3b34114}.tag.hard{color:#f77;border-color:#ff777759;background:#ff777714}.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}.center-screen{min-height:100vh;display:flex;flex-direction:column}.topbar{position:sticky;top:0;z-index:30;backdrop-filter:blur(12px);background:#0d1117b8;border-bottom:1px solid var(--border-soft)}.topbar-inner{height:62px;display:flex;align-items:center;justify-content:space-between;max-width:var(--maxw);margin:0 auto;padding:0 24px}.logo{font-family:var(--mono);font-weight:700;font-size:19px;letter-spacing:-.01em;display:inline-flex;align-items:center;cursor:pointer;color:var(--text)}.logo b{color:var(--accent);font-weight:700}@keyframes riseIn{0%{transform:translateY(14px)}to{transform:none}}.rise{animation:riseIn .5s cubic-bezier(.16,1,.3,1) both}.q-enter{animation:qIn .42s cubic-bezier(.16,1,.3,1) both}.q-exit{animation:qOut .26s ease-in both}@keyframes qIn{0%{transform:translate(26px)}to{transform:none}}@keyframes qOut{to{opacity:0;transform:translate(-22px)}}.motion-off .q-enter,.motion-off .q-exit,.motion-off .rise{animation:none}@keyframes pop{0%{transform:scale(.78)}55%{transform:scale(1.16)}to{transform:scale(1)}}.pop{animation:pop .42s cubic-bezier(.18,1.5,.4,1) both}.motion-off .pop{animation:none}.exp-collapse{display:grid;grid-template-rows:0fr;transition:grid-template-rows .42s cubic-bezier(.16,1,.3,1),opacity .3s ease;opacity:0}.exp-collapse.open{grid-template-rows:1fr;opacity:1}.exp-collapse>div{overflow:hidden;min-height:0}.motion-off .exp-collapse{transition:none}@media(max-width:760px){.split-grid{grid-template-columns:1fr!important}}@media(max-width:820px){.results-hero{grid-template-columns:1fr!important}}a{color:var(--accent)}input,button,textarea{font-family:inherit}