:root{--bg:#060818;--bg2:#0a0f22;--surface:#0e1530;--surface2:#131c38;--border:#1f2f50;--border2:#263860;--g1:#ffffff1a;--g2:#ffffff26;--g3:#ffffff38;--g-border:#ffffff38;--g-border-hi:#ffffff61;--cyan:#18e8ff;--cyan2:#0ce;--violet:#b48eff;--green:#30f28a;--red:#ff3a5c;--amber:#ffcc2a;--pink:#ff6eb4;--text:#eef4ff;--text2:#c0d4f0;--text3:#8aaed0;--spec-top:#ffffff47;--spec-side:#ffffff1a;--font-display:"Space Grotesk", sans-serif;--font-heading:"Syne", sans-serif;--font-body:"Inter", "Space Grotesk", sans-serif;--font-mono:"IBM Plex Mono", monospace;--topbar-h:56px}body.light-mode{--bg:#e8eeff;--bg2:#dde6ff;--surface:#fff;--surface2:#f0f4ff;--border:#c0d0ee;--border2:#aabade;--cyan:#0090c8;--cyan2:#007aaa;--violet:#63c;--green:#185;--red:#c13;--amber:#a70;--pink:#a26;--text:#081428;--text2:#1e3a5c;--text3:#3d6080;--spec-top:#fff9;--spec-side:#ffffff4d}*{box-sizing:border-box}body{font-family:var(--font-body);background:var(--bg);color:var(--text);min-height:100vh;margin:0}h1,h2,.display{font-family:var(--font-heading)}.glass{background:var(--g1);border:1px solid var(--g-border);-webkit-backdrop-filter:blur(32px)saturate(180%);border-radius:20px}.glass-hi{background:var(--g2);border:1px solid var(--g-border-hi);-webkit-backdrop-filter:blur(48px)saturate(200%);border-radius:20px}.topbar{background:var(--g1);border-bottom:1px solid var(--border);-webkit-backdrop-filter:blur(32px);z-index:10;color:var(--text2);justify-content:space-between;align-items:center;padding:12px 20px;font-size:13.5px;display:flex;position:sticky;top:0}.topbar-actions{align-items:center;gap:8px;display:flex}.lb-nav-btn{background:var(--g1);border:1px solid var(--border);color:var(--text2);font-family:var(--font-body);cursor:pointer;border-radius:8px;padding:6px 12px;font-size:12.5px}.signout-btn{border:1px solid var(--border);color:var(--text2);font-family:var(--font-body);cursor:pointer;background:0 0;border-radius:8px;padding:6px 12px;font-size:12.5px}.kicked-banner{color:var(--red);text-align:center;cursor:pointer;background:#ff3a5c29;border-bottom:1px solid #ff3a5c59;padding:12px 20px;font-size:13.5px}.subject-card{--card-accent:var(--cyan);text-align:left;cursor:pointer;color:var(--text);font-family:var(--font-body);flex-direction:column;gap:10px;padding:18px;transition:transform .15s,border-color .15s;display:flex;position:relative;overflow:hidden}.subject-card:hover,.subject-card:focus-visible{border-color:var(--card-accent);outline:none;transform:translateY(-2px)}.subject-card:focus-visible{box-shadow:0 0 0 2px var(--card-accent)}.subject-card-top{justify-content:space-between;align-items:center;display:flex}.subject-card-emoji{font-size:28px;line-height:1}.subject-card-body{flex-direction:column;gap:2px;display:flex}.subject-card-name{font-family:var(--font-display);color:var(--text);font-size:16px;font-weight:600}.subject-card-desc{color:var(--text3);font-size:13px}.subject-card-trace{opacity:.7;width:100%;height:30px}.subject-card-trace svg{width:100%;height:100%}.trace-line{fill:none;stroke:var(--card-accent);stroke-width:1.5px;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:260;stroke-dashoffset:260px;animation:2.6s ease-in-out infinite trace-draw}@keyframes trace-draw{0%{stroke-dashoffset:260px;opacity:.2}45%{stroke-dashoffset:0;opacity:1}55%{stroke-dashoffset:0;opacity:1}to{stroke-dashoffset:-260px;opacity:.2}}@media (prefers-reduced-motion:reduce){.trace-line{stroke-dashoffset:0;opacity:.6;animation:none}}.subject-card-meta{font-family:var(--font-mono);color:var(--text3);gap:12px;font-size:11px;display:flex}.mastery-ring{width:40px;height:40px;position:relative}.mastery-ring svg{width:100%;height:100%;transform:rotate(-90deg)}.mastery-ring-bg{fill:none;stroke:var(--g1);stroke-width:3px}.mastery-ring-fg{fill:none;stroke:var(--card-accent);stroke-width:3px;stroke-linecap:round;transition:stroke-dasharray .4s}.mastery-ring-label{font-family:var(--font-mono);color:var(--text2);justify-content:center;align-items:center;font-size:10px;display:flex;position:absolute;inset:0}.dashboard{max-width:960px;margin:0 auto;padding:32px 20px 60px}.dashboard-header{margin-bottom:24px}.dashboard-title{font-family:var(--font-heading);margin:0 0 4px;font-size:1.8rem;font-weight:800}.dashboard-sub{color:var(--text3);margin:0;font-size:14px}.dashboard-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px;display:grid}.dashboard-loading{min-height:60vh;color:var(--text3);font-family:var(--font-body);justify-content:center;align-items:center;display:flex}.topic-picker{max-width:720px;margin:0 auto;padding:20px 20px 60px}.topic-back{color:var(--text3);font-family:var(--font-body);cursor:pointer;background:0 0;border:none;margin-bottom:8px;padding:8px 0;font-size:13.5px}.topic-back:hover{color:var(--text)}.topic-header{margin-bottom:20px}.topic-title{font-family:var(--font-heading);margin:0 0 4px;font-size:1.6rem;font-weight:800}.topic-sub{color:var(--text3);margin:0;font-size:13.5px}.topic-row{cursor:pointer;text-align:left;width:100%;color:var(--text);align-items:center;gap:14px;margin-bottom:10px;padding:14px 16px;transition:transform .15s,border-color .15s;display:flex}.topic-row:hover{border-color:var(--g-border-hi);transform:translate(2px)}.topic-row-all{border-color:#18e8ff4d}.topic-row-emoji{font-size:22px}.topic-row-body{flex-direction:column;flex:1;gap:2px;display:flex}.topic-row-name{font-family:var(--font-display);font-size:14.5px;font-weight:600}.topic-row-count{font-family:var(--font-mono);color:var(--text3);font-size:11.5px}.topic-row-arrow{color:var(--text3);font-size:20px}.quiz-screen{max-width:640px;margin:0 auto;padding:16px 16px 40px}.quiz-topbar{align-items:center;gap:12px;margin-bottom:12px;display:flex}.quiz-exit-btn{background:var(--g1);border:1px solid var(--border);width:34px;height:34px;color:var(--text2);cursor:pointer;border-radius:10px;flex-shrink:0;font-size:14px}.quiz-progress-wrap{background:var(--g1);border-radius:4px;flex:1;height:6px;overflow:hidden}.quiz-progress-fill{background:var(--cyan);height:100%;transition:width .25s}.quiz-score{font-family:var(--font-mono);color:var(--text2);flex-shrink:0;font-size:13px}.quiz-meta-row{justify-content:space-between;align-items:center;margin-bottom:12px;display:flex}.quiz-counter{font-family:var(--font-mono);color:var(--text3);font-size:12px}.quiz-badge{font-family:var(--font-body);color:var(--text2);background:var(--g1);border:1px solid var(--border);border-radius:20px;padding:4px 10px;font-size:11.5px}.quiz-card{margin-bottom:16px;padding:20px 18px}.quiz-question{font-family:var(--font-display);color:var(--text);margin:0 0 18px;font-size:16.5px;line-height:1.5}.quiz-options{flex-direction:column;gap:10px;display:flex}.opt-btn{background:var(--g1);border:1px solid var(--border);width:100%;color:var(--text);font-family:var(--font-body);text-align:left;cursor:pointer;border-radius:14px;align-items:center;gap:12px;padding:13px 14px;font-size:14px;transition:border-color .15s,background .15s;display:flex}.opt-btn:hover:not(:disabled){border-color:#00e5ff66}.opt-btn:disabled{cursor:default}.opt-btn.correct{color:var(--green);background:#30f28a24!important;border-color:#30f28a80!important}.opt-btn.wrong{color:var(--red);background:#ff3a5c1f!important;border-color:#ff3a5c73!important}.opt-label{border:1px solid var(--border2);width:26px;height:26px;font-family:var(--font-mono);border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;font-size:12px;display:flex}.opt-btn.correct .opt-label{background:var(--green);color:#000;border-color:var(--green)}.opt-btn.wrong .opt-label{background:var(--red);color:#fff;border-color:var(--red)}.opt-text{flex:1}.quiz-nav{gap:10px;display:flex}.quiz-nav-btn{background:var(--g1);border:1px solid var(--border);color:var(--text2);font-family:var(--font-body);cursor:pointer;border-radius:12px;flex:1;padding:13px;font-size:14px;font-weight:600}.quiz-nav-btn:disabled{opacity:.4;cursor:default}.quiz-nav-primary{background:var(--cyan);color:#04222b;border:none}.quiz-empty,.quiz-results{text-align:center;justify-content:center;align-items:center;min-height:60vh;padding:20px;display:flex}.quiz-results-card{max-width:340px;padding:32px 28px}.quiz-results-pct{font-family:var(--font-heading);color:var(--cyan);font-size:3rem;font-weight:800}.quiz-results-sub{color:var(--text3);margin:8px 0 24px;font-size:13.5px}.quiz-primary-btn,.quiz-back-btn{background:var(--cyan);color:#04222b;font-family:var(--font-body);cursor:pointer;border:none;border-radius:12px;padding:12px 24px;font-size:14px;font-weight:700}.lb-screen{max-width:640px;margin:0 auto;padding:16px 16px 40px}.lb-back{color:var(--text3);font-family:var(--font-body);cursor:pointer;background:0 0;border:none;margin-bottom:8px;padding:8px 0;font-size:13.5px}.lb-back:hover{color:var(--text)}.lb-header{margin-bottom:16px}.lb-title{font-family:var(--font-heading);margin:0 0 4px;font-size:1.6rem;font-weight:800}.lb-sub{color:var(--text3);margin:0;font-size:13.5px}.lb-tabs{background:var(--g1);border-radius:12px;gap:6px;margin-bottom:14px;padding:4px;display:flex}.lb-tab{color:var(--text3);font-family:var(--font-body);cursor:pointer;background:0 0;border:none;border-radius:9px;flex:1;padding:9px 0;font-size:13px;font-weight:600}.lb-tab.active{background:var(--g2);color:var(--text)}.lb-my-rank{border-color:#18e8ff59;justify-content:space-between;align-items:center;margin-bottom:14px;padding:14px 16px;display:flex}.lb-my-rank-label{color:var(--text3);font-size:12.5px;font-weight:600}.lb-my-rank-value{font-family:var(--font-mono);color:var(--cyan);font-size:16px;font-weight:700}.lb-my-rank-of{color:var(--text3);font-size:12px;font-weight:400}.lb-loading,.lb-empty{text-align:center;color:var(--text3);padding:40px 20px;font-size:13.5px}.lb-error{text-align:center;color:var(--red);background:#ff3a5c1a;border:1px solid #ff3a5c4d;border-radius:14px;padding:20px;font-size:13.5px}.lb-list{flex-direction:column;gap:8px;display:flex}.lb-row{align-items:center;gap:12px;padding:12px 16px;display:flex}.lb-row-me{background:#18e8ff14;border-color:#18e8ff73}.lb-rank{font-family:var(--font-mono);color:var(--text3);flex-shrink:0;width:32px;font-size:13px}.lb-name{font-family:var(--font-body);color:var(--text);text-overflow:ellipsis;white-space:nowrap;flex:1;font-size:14px;font-weight:600;overflow:hidden}.lb-value{font-family:var(--font-mono);color:var(--cyan);font-size:14px;font-weight:700}.auth-screen{background:radial-gradient(ellipse 80% 60% at 50% -10%, #18e8ff1a, transparent 60%), var(--bg);justify-content:center;align-items:center;min-height:100vh;padding:24px;display:flex}.auth-card{width:100%;max-width:400px;padding:28px 24px}.auth-tabs{background:var(--g1);border-radius:12px;gap:6px;margin-bottom:20px;padding:4px;display:flex}.auth-tab{color:var(--text3);font-family:var(--font-body);cursor:pointer;background:0 0;border:none;border-radius:9px;flex:1;padding:9px 0;font-size:13.5px;font-weight:600;transition:background .15s,color .15s}.auth-tab.active{background:var(--g2);color:var(--text)}.auth-title{font-family:var(--font-heading);margin:0 0 4px;font-size:1.5rem;font-weight:800}.auth-sub{color:var(--text3);margin:0 0 20px;font-size:13.5px}.auth-form{flex-direction:column;gap:14px;display:flex}.auth-field{flex-direction:column;gap:6px;display:flex}.auth-field label{color:var(--text2);font-size:12.5px;font-weight:600}.auth-field input,.auth-field select{background:var(--g1);border:1px solid var(--border);color:var(--text);font-family:var(--font-body);border-radius:10px;outline:none;padding:11px 12px;font-size:14.5px}.auth-field input:focus,.auth-field select:focus{border-color:var(--cyan)}.auth-pw-row{gap:8px;display:flex}.auth-pw-row input{flex:1}.auth-eye-btn{background:var(--g1);border:1px solid var(--border);cursor:pointer;border-radius:10px;width:42px;font-size:16px}.auth-msg{border-radius:10px;padding:9px 12px;font-size:13px}.auth-msg-error{color:var(--red);background:#ff3a5c1f;border:1px solid #ff3a5c4d}.auth-msg-success{color:var(--green);background:#30f28a1f;border:1px solid #30f28a4d}.auth-submit-btn{background:var(--cyan);color:#04222b;font-family:var(--font-body);cursor:pointer;border:none;border-radius:12px;margin-top:4px;padding:13px;font-size:14.5px;font-weight:700;transition:opacity .15s}.auth-submit-btn:disabled{opacity:.6;cursor:default}