*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--bg-primary:#1a1a1a;--bg-secondary:#242424;--bg-tertiary:#2e2e2e;--border-primary:#333;--border-secondary:#404040;--text-primary:#f0f0f0;--text-secondary:#a0a0a0;--text-tertiary:#6b6b6b;--accent-primary:#4a9eff;--accent-success:#4caf50;--accent-danger:#ef5350;--accent-warning:#ff9800;--accent-xp:gold;--pill-bg:#333;--pill-text:#ccc;--nav-bg:#1e1e1e;--nav-border:#2a2a2a;--input-bg:#2a2a2a;--input-border:#3a3a3a;--shadow:#0000004d}.light{--bg-primary:#f5f5f5;--bg-secondary:#fff;--bg-tertiary:#f0f0f0;--border-primary:#e5e5e5;--border-secondary:#d0d0d0;--text-primary:#1a1a1a;--text-secondary:#666;--text-tertiary:#999;--accent-primary:#2563eb;--accent-success:#388e3c;--accent-danger:#d32f2f;--accent-warning:#f57c00;--accent-xp:#c89600;--pill-bg:#e8e8e8;--pill-text:#555;--nav-bg:#fff;--nav-border:#e5e5e5;--input-bg:#fff;--input-border:#d0d0d0;--shadow:#00000014}html{font-size:15px}body{color:var(--text-primary);background:var(--bg-primary);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-weight:400;line-height:1.5}h1,h2,h3,h4,h5,h6{color:var(--text-primary);font-weight:600;line-height:1.3}a{color:var(--accent-primary);text-decoration:none}a:hover{text-decoration:underline}button{font-family:inherit;font-size:inherit;border:1px solid var(--border-primary);background:var(--bg-tertiary);color:var(--text-primary);cursor:pointer;border-radius:8px;padding:.5rem 1rem;transition:border-color .15s,background .15s}button:hover:not(:disabled){border-color:var(--border-secondary)}button:disabled{opacity:.5;cursor:default}input,select,textarea{font-family:inherit;font-size:inherit;background:var(--input-bg);color:var(--text-primary);border:1px solid var(--input-border);border-radius:8px;padding:.5rem .75rem}input:focus,select:focus,textarea:focus{border-color:var(--accent-primary);outline:none}.content{max-width:960px;margin:0 auto;padding:1.5rem 1rem}.card{background:var(--bg-secondary);border:1px solid var(--border-primary);box-shadow:0 1px 3px var(--shadow);border-radius:12px;padding:20px 24px}.info-card{background:var(--bg-tertiary);border:1px solid var(--border-primary);color:var(--text-secondary);border-radius:8px;padding:12px;font-size:.85rem;font-style:italic;line-height:1.5}.pill{background:var(--pill-bg);color:var(--pill-text);white-space:nowrap;border-radius:9999px;padding:.15rem .6rem;font-size:.75rem;font-weight:600;display:inline-block}.progress-bar{background:var(--bg-tertiary);border-radius:4px;height:8px;overflow:hidden}.progress-fill{border-radius:4px;height:100%;transition:width .3s}.btn-primary{background:var(--accent-primary);color:#fff;border:none;padding:.6rem 1.5rem;font-weight:600}.btn-primary:hover:not(:disabled){opacity:.9}.btn-outline{color:var(--accent-primary);border:1px solid var(--accent-primary);background:0 0}.btn-outline:hover:not(:disabled){background:var(--accent-primary);color:#fff}.navbar{z-index:100;background:var(--nav-bg);border-bottom:1px solid var(--nav-border);justify-content:space-between;align-items:center;height:56px;padding:0 24px;display:flex;position:sticky;top:0}.navbar a{color:var(--text-secondary);border-bottom:2px solid #0000;padding:.4rem 0;font-size:.9rem;transition:color .15s,border-color .15s}.navbar a:hover{color:var(--text-primary);text-decoration:none}.navbar a.active{color:var(--accent-primary);border-bottom-color:var(--accent-primary)}@keyframes fadeIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}