@import url("https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700;800&family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@500;600&display=swap");:root{--bg:#f6f9ff;--surface:#fff;--ink:#0f1a2e;--ink-dim:#4c5c78;--ink-faint:#93a0b8;--blue-700:#1d4ed8;--blue-600:#2563eb;--blue-500:#3b82f6;--blue-100:#dbeafe;--sky-400:#38bdf8;--line:#e3ebfa;--line-bright:#bfdbfe;--shadow-sm:0 1px 3px rgba(15,26,46,.05);--shadow-md:0 12px 32px -12px rgba(29,78,216,.16);--shadow-lg:0 28px 64px -18px rgba(29,78,216,.22)}*{box-sizing:border-box}body,html{margin:0;padding:0;min-height:100%;background:var(--bg);color:var(--ink);font-family:Inter,system-ui,-apple-system,sans-serif;-webkit-font-smoothing:antialiased;position:relative;overflow-x:hidden}body:before{z-index:-2;background:radial-gradient(800px 520px at 8% -10%,rgba(59,130,246,.12),transparent 60%),radial-gradient(700px 560px at 100% 10%,rgba(56,189,248,.1),transparent 55%),radial-gradient(800px 500px at 50% 115%,rgba(29,78,216,.08),transparent 60%),var(--bg)}body:after,body:before{content:"";position:fixed;inset:0}body:after{z-index:-1;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:60px 60px;-webkit-mask-image:radial-gradient(ellipse 75% 60% at 50% 0,#000 5%,transparent 70%);mask-image:radial-gradient(ellipse 75% 60% at 50% 0,#000 5%,transparent 70%);opacity:.55}a{color:inherit;text-decoration:none}h1,h2,h3{font-family:Space Grotesk,sans-serif;letter-spacing:-.015em;font-weight:700}.mono{font-family:JetBrains Mono,monospace}.floating-orb{position:fixed;border-radius:50%;filter:blur(60px);z-index:-1;pointer-events:none;animation:floatOrb 12s ease-in-out infinite}.orb-1{width:340px;height:340px;top:-80px;right:-100px;background:radial-gradient(circle,rgba(59,130,246,.22),transparent 70%);animation-delay:0s}.orb-2{width:300px;height:300px;bottom:-100px;left:-80px;background:radial-gradient(circle,rgba(56,189,248,.18),transparent 70%);animation-delay:-6s}@keyframes floatOrb{0%,to{transform:translate(0) scale(1)}50%{transform:translate(20px,-24px) scale(1.08)}}.shell{padding:0 20px 100px}.shell,.topbar{max-width:760px;margin:0 auto;position:relative;z-index:1}.topbar{padding:26px 20px}.brand,.topbar{display:flex;align-items:center;gap:10px}.brand{font-family:Space Grotesk,sans-serif;font-weight:800;font-size:17px}.brand-icon{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:linear-gradient(135deg,var(--sky-400),var(--blue-600));color:#fff;box-shadow:var(--shadow-md)}.hero{text-align:center;padding:50px 0 40px}.hero-badge{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:600;color:var(--blue-700);background:rgba(59,130,246,.08);border:1px solid rgba(59,130,246,.2);padding:7px 15px;border-radius:999px;margin-bottom:22px}.hero h1{font-size:clamp(30px,5.6vw,46px);line-height:1.12;margin:0 0 16px}.hero h1 .accent{background:linear-gradient(120deg,var(--blue-600),var(--sky-400) 75%);-webkit-background-clip:text;background-clip:text;color:transparent}.hero p{color:var(--ink-dim);font-size:15.5px;max-width:520px;margin:0 auto;line-height:1.65}.stat-row{display:flex;gap:12px;justify-content:center;margin-top:30px;flex-wrap:wrap}.stat-chip{display:flex;flex-direction:column;align-items:center;gap:4px;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:14px 22px;box-shadow:var(--shadow-sm);min-width:100px}.stat-chip .stat-value{font-family:Space Grotesk,sans-serif;font-weight:800;font-size:20px;color:var(--blue-700)}.stat-chip .stat-label{font-size:11.5px;color:var(--ink-faint);font-weight:600}.nb-card{background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:26px;box-shadow:var(--shadow-md);position:relative;overflow:hidden}.nb-card:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--blue-500),var(--sky-400))}.btn-primary{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:15px 26px;border:none;border-radius:14px;background:linear-gradient(135deg,var(--blue-600),var(--sky-400));color:#fff;font-size:15px;font-weight:700;cursor:pointer;transition:transform .2s cubic-bezier(.16,1,.3,1),box-shadow .2s ease;box-shadow:0 10px 26px -6px rgba(37,99,235,.45)}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 16px 34px -6px rgba(37,99,235,.55)}.btn-primary:active{transform:translateY(0)}.btn-primary:disabled{opacity:.5;cursor:not-allowed;transform:none}.btn-secondary{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 20px;border:1.5px solid var(--line);border-radius:12px;background:var(--surface);color:var(--ink);font-size:14px;font-weight:600;cursor:pointer;transition:border-color .2s ease,transform .15s ease}.btn-secondary:hover{border-color:var(--line-bright);transform:translateY(-1px)}.progress-track{height:8px;background:var(--blue-100);overflow:hidden}.progress-fill,.progress-track{border-radius:999px;position:relative}.progress-fill{height:100%;background:linear-gradient(90deg,var(--blue-500),var(--sky-400));transition:width .4s cubic-bezier(.16,1,.3,1)}.progress-fill:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,hsla(0,0%,100%,.5),transparent);animation:shimmer 1.6s ease-in-out infinite}@keyframes shimmer{0%{transform:translateX(-100%)}to{transform:translateX(100%)}}.progress-meta{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;font-size:13px;color:var(--ink-dim);font-weight:600}.timer-ring-wrap{position:relative;width:56px;height:56px}.timer-ring-wrap svg{transform:rotate(-90deg)}.timer-ring-bg{stroke:var(--blue-100)}.timer-ring-fg{stroke:var(--blue-600);transition:stroke-dashoffset 1s linear,stroke .3s ease}.timer-ring-fg.urgent{stroke:#f97316}.timer-ring-text{position:absolute;inset:0;display:grid;place-items:center;font-family:JetBrains Mono,monospace;font-weight:700;font-size:14px;color:var(--ink)}.category-tag{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:700;padding:5px 12px;border-radius:999px;background:var(--blue-100);color:var(--blue-700);text-transform:uppercase;letter-spacing:.03em}.question-header{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:20px}.question-text{font-size:18px;font-weight:700;line-height:1.5;margin-top:14px;color:var(--ink)}.option-grid{display:grid;grid-gap:11px;gap:11px;margin-top:22px}.option-btn{display:flex;align-items:center;gap:13px;padding:15px 17px;border:1.5px solid var(--line);border-radius:14px;background:var(--surface);font-size:14.5px;font-weight:600;color:var(--ink);cursor:pointer;text-align:left;transition:border-color .2s ease,background .2s ease,transform .15s ease}.option-btn:hover{border-color:var(--line-bright);background:#f8fbff;transform:translateX(3px)}.option-btn.selected{border-color:var(--blue-500);background:var(--blue-100)}.option-btn.correct{border-color:#16a34a;background:#f0fdf4}.option-btn.wrong{border-color:#dc2626;background:#fef2f2}.option-letter{display:grid;place-items:center;width:28px;height:28px;min-width:28px;border-radius:8px;background:var(--blue-100);color:var(--blue-700);font-family:JetBrains Mono,monospace;font-weight:700;font-size:12.5px}.option-btn.selected .option-letter{background:var(--blue-600);color:#fff}.result-hero{text-align:center;padding:20px 0 10px}.score-ring-wrap{position:relative;width:180px;height:180px;margin:0 auto 20px}.score-ring-wrap svg{transform:rotate(-90deg)}.score-ring-text{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}.score-ring-number{font-family:Space Grotesk,sans-serif;font-weight:800;font-size:42px;color:var(--blue-700);line-height:1}.score-ring-label{font-size:11.5px;color:var(--ink-faint);font-weight:600;margin-top:4px;text-transform:uppercase;letter-spacing:.04em}.percentile-badge{display:inline-flex;align-items:center;gap:7px;font-size:13.5px;font-weight:700;padding:8px 18px;border-radius:999px;background:linear-gradient(135deg,rgba(59,130,246,.1),rgba(56,189,248,.1));border:1px solid var(--line-bright);color:var(--blue-700);margin-top:12px}.metric-grid{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:12px;gap:12px;margin-top:26px}.metric-box{background:var(--bg);border:1px solid var(--line);border-radius:14px;padding:16px 12px;text-align:center}.metric-box .metric-value{font-family:Space Grotesk,sans-serif;font-weight:800;font-size:22px;color:var(--ink)}.metric-box .metric-label{font-size:11px;color:var(--ink-faint);font-weight:600;margin-top:4px}.category-breakdown{margin-top:26px;display:grid;grid-gap:12px;gap:12px}.category-row{display:flex;align-items:center;gap:12px}.category-row-label{width:90px;font-size:13px;font-weight:700;color:var(--ink-dim);text-transform:capitalize}.category-row-track{flex:1 1;height:10px;background:var(--blue-100);border-radius:999px;overflow:hidden}.category-row-fill{height:100%;background:linear-gradient(90deg,var(--blue-500),var(--sky-400));border-radius:999px;transition:width .6s cubic-bezier(.16,1,.3,1)}.category-row-value{width:42px;text-align:right;font-size:13px;font-weight:700;color:var(--ink)}.disclaimer-box{margin-top:24px;padding:14px 16px;border-radius:14px;background:#fffbeb;border:1px solid #fde68a;color:#92400e;font-size:12.5px;line-height:1.6;display:flex;gap:10px;align-items:flex-start}.disclaimer-box svg{flex-shrink:0;margin-top:1px;color:#d97706}.code-block{position:relative;background:#0f1a2e;border-radius:12px;padding:16px 44px 16px 16px;overflow-x:auto}.code-block pre{margin:0;font-family:JetBrains Mono,monospace;font-size:12.5px;line-height:1.6;color:#bfdbfe;white-space:pre}.code-copy-btn{position:absolute;top:10px;right:10px;display:grid;place-items:center;width:28px;height:28px;border:none;border-radius:7px;background:hsla(0,0%,100%,.08);color:#bfdbfe;cursor:pointer;transition:background .2s ease}.code-copy-btn:hover{background:hsla(0,0%,100%,.16)}.endpoint-line{display:flex;align-items:center;gap:10px;margin-top:10px}.endpoint-line code{font-size:13.5px;color:var(--ink);background:var(--bg);padding:5px 10px;border-radius:8px;border:1px solid var(--line)}.method-badge{font-family:JetBrains Mono,monospace;font-size:11px;font-weight:700;padding:5px 10px;border-radius:7px;color:#fff}.method-badge.get{background:#16a34a}.method-badge.post{background:var(--blue-600)}.doc-label{font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;margin:6px 0 8px}.doc-label,.doc-note{color:var(--ink-faint)}.doc-note{font-size:12.5px;margin-top:6px}.error-code-badge{font-family:JetBrains Mono,monospace;font-size:12px;font-weight:700;padding:4px 9px;border-radius:7px;background:#fef2f2;color:#b91c1c;min-width:38px;text-align:center}code.mono{background:var(--blue-100);padding:2px 6px;border-radius:5px;font-size:.92em}.user-chip{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600;background:var(--surface);border:1px solid var(--line);padding:7px 12px 7px 14px;border-radius:999px;box-shadow:var(--shadow-sm)}.icon-btn-sm{display:grid;place-items:center;width:20px;height:20px;border:none;border-radius:6px;background:var(--blue-100);color:var(--blue-700);cursor:pointer}.icon-btn{display:grid;place-items:center;width:42px;height:42px;min-width:42px;border:1.5px solid var(--line);border-radius:12px;background:var(--surface);cursor:pointer;transition:border-color .2s ease}.icon-btn:hover{border-color:var(--line-bright)}.input-with-icon{position:relative;display:flex;align-items:center}.input-with-icon svg{position:absolute;left:14px;color:var(--ink-faint);pointer-events:none}.input-with-icon input{width:100%;padding:13px 14px 13px 42px;border:1.5px solid var(--line);border-radius:12px;font-size:14.5px;background:var(--bg);color:var(--ink);transition:border-color .2s ease,background .2s ease}.input-with-icon input:focus{outline:none;border-color:var(--blue-500);background:var(--surface)}.inline-error{margin-top:8px;font-size:12.5px;color:#b91c1c;font-weight:600}.level-grid{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:10px;gap:10px;margin-top:22px}.level-card{display:flex;flex-direction:column;align-items:center;gap:4px;padding:16px 10px;border:2px solid var(--line);border-radius:16px;background:var(--surface);cursor:pointer;transition:border-color .2s ease,transform .15s ease,box-shadow .2s ease}.level-card:hover{transform:translateY(-2px);border-color:var(--level-color)}.level-card.active{border-color:var(--level-color);background:color-mix(in srgb,var(--level-color) 8%,#fff);box-shadow:0 8px 20px -8px color-mix(in srgb,var(--level-color) 40%,transparent)}.level-card-label{font-family:Space Grotesk,sans-serif;font-weight:800;font-size:15px;color:var(--level-color)}.level-card-desc{font-size:10.5px;color:var(--ink-faint);text-align:center;font-weight:600;line-height:1.3}@media (max-width:480px){.level-grid{grid-template-columns:1fr}}.leaderboard-list{display:grid;grid-gap:8px;gap:8px}.leaderboard-row{display:flex;align-items:center;gap:12px;padding:10px 14px;border-radius:12px;background:var(--bg);border:1px solid var(--line)}.leaderboard-row.me{border-color:var(--blue-500);background:var(--blue-100)}.rank-badge{display:grid;place-items:center;width:26px;height:26px;min-width:26px;border-radius:8px;font-size:12px;font-weight:800;background:var(--blue-100);color:var(--blue-700)}.rank-badge.rank-1{background:#fef3c7;color:#92400e}.rank-badge.rank-2{background:#e5e7eb;color:#4b5563}.rank-badge.rank-3{background:#fed7aa;color:#9a3412}.leaderboard-name{flex:1 1;font-size:13.5px;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.leaderboard-score{font-family:JetBrains Mono,monospace;font-size:13px;font-weight:700;color:var(--blue-700)}.rank-announcement{display:inline-flex;align-items:center;gap:7px;margin-top:10px;padding:8px 16px;border-radius:999px;background:#fef3c7;color:#92400e;font-size:12.5px;font-weight:700}.skip-btn{display:flex;align-items:center;justify-content:center;gap:7px;width:100%;margin-top:16px;padding:11px;border:1.5px dashed var(--line-bright);border-radius:12px;background:transparent;color:var(--ink-faint);font-size:13px;font-weight:600;cursor:pointer;transition:border-color .2s ease,color .2s ease}.skip-btn:hover{border-color:var(--blue-500);color:var(--blue-600)}.skip-btn:disabled{opacity:.4;cursor:not-allowed}.shape-grid{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:10px;gap:10px;margin-top:6px}.shape-grid.dense{grid-template-columns:repeat(5,1fr);gap:8px}.shape-cell{display:grid;place-items:center;aspect-ratio:1;border:1.5px solid var(--line);border-radius:12px;background:var(--surface);cursor:pointer;transition:border-color .2s ease,background .2s ease,transform .15s ease}.shape-cell:hover:not(.static){border-color:var(--line-bright);transform:scale(1.04)}.shape-cell.selected{border-color:var(--blue-500);background:var(--blue-100)}.shape-cell.static{cursor:default;background:var(--bg)}.shape-cell.question-mark{font-family:Space Grotesk,sans-serif;font-weight:800;font-size:22px;color:var(--ink-faint);background:var(--bg)}.shape-sequence-row{display:flex;gap:8px;align-items:center;overflow-x:auto;padding-bottom:4px}.shape-sequence-row .shape-cell{min-width:52px;width:52px}.spin{animation:spin .8s linear infinite}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.pulse{animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.6}}@media (max-width:480px){.metric-grid{grid-template-columns:1fr 1fr 1fr}.metric-box .metric-value{font-size:17px}}@media (prefers-reduced-motion:reduce){*,:after,:before{animation-duration:.001ms!important;transition-duration:.001ms!important}}a:focus-visible,button:focus-visible{outline:2px solid var(--blue-500);outline-offset:2px}