:root{--bg:#08080a;--bg-card:#12121a;--bg-hover:#1a1a2e;--border:#2a2a3e;--text:#e4e4e7;--text-muted:#8b8b9e;--accent:#6366f1;--accent-hover:#818cf8;--green:#22c55e;--yellow:#eab308;--orange:#f97316;--red:#ef4444;--radius:12px;--shadow:0 4px 24px rgba(0,0,0,.3)}:root.light{--bg:#fff;--bg-card:#f8f9fa;--bg-hover:#f0f0f5;--border:#e2e2ea;--text:#18181b;--text-muted:#71717a;--shadow:0 4px 24px rgba(0,0,0,.08)}*{box-sizing:border-box;margin:0;padding:0}html{background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;scroll-behavior:smooth}body{line-height:1.6;min-height:100vh}a{color:var(--accent);text-decoration:none;transition:color .2s}a:hover{color:var(--accent-hover)}.container{margin:0 auto;max-width:1200px;padding:0 1rem}.btn{align-items:center;background:var(--bg-card);border:1px solid var(--border);border-radius:8px;color:var(--text);cursor:pointer;display:inline-flex;font-size:.875rem;gap:.5rem;padding:.5rem 1.25rem;transition:all .2s}.btn:hover{background:var(--bg-hover)}.btn-primary,.btn:hover{border-color:var(--accent)}.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover{background:var(--accent-hover)}.card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:1.5rem;transition:all .2s}.card:hover{border-color:var(--accent);box-shadow:var(--shadow)}.badge{border-radius:6px;display:inline-block;font-size:.75rem;font-weight:600;padding:.15rem .5rem}.badge-green{background:#22c55e26;color:var(--green)}.badge-yellow{background:#eab30826;color:var(--yellow)}.badge-orange{background:#f9731626;color:var(--orange)}.badge-red{background:#ef444426;color:var(--red)}.badge-accent{background:#6366f126;color:var(--accent)}.grade{font-size:1.5rem;font-weight:800;text-align:center;width:2.5rem}.grade-s{color:var(--green)}.grade-a{color:#4ade80}.grade-b{color:var(--yellow)}.grade-c{color:var(--orange)}.grade-d{color:#fb923c}.grade-f{color:var(--red)}input,select,textarea{background:var(--bg);border:1px solid var(--border);border-radius:8px;color:var(--text);font-size:.875rem;outline:none;padding:.5rem .75rem;transition:border-color .2s}input:focus,select:focus,textarea:focus{border-color:var(--accent)}table{border-collapse:collapse;width:100%}td,th{border-bottom:1px solid var(--border);padding:.75rem 1rem;text-align:left}th{color:var(--text-muted);font-size:.8rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase}.page-header{padding:3rem 0 2rem;text-align:center}.page-header h1{background:linear-gradient(135deg,var(--accent),#a78bfa);-webkit-background-clip:text;font-size:2.25rem;font-weight:800;margin-bottom:.5rem;-webkit-text-fill-color:transparent;background-clip:text}.page-header p{color:var(--text-muted);font-size:1.1rem;margin:0 auto;max-width:600px}.grid-2{display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}.grid-3{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}.grid-3,.grid-4{display:grid;gap:1rem}.grid-4{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.flex{display:flex}.flex-center{justify-content:center}.flex-between,.flex-center{align-items:center;display:flex}.flex-between{justify-content:space-between}.gap-1{gap:.5rem}.gap-2{gap:1rem}.gap-3{gap:1.5rem}.text-center{text-align:center}.text-muted{color:var(--text-muted)}.text-sm{font-size:.875rem}.font-bold{font-weight:700}.mt-1{margin-top:.5rem}.mt-2{margin-top:1rem}.mt-3{margin-top:1.5rem}.mb-2{margin-bottom:1rem}.mb-3{margin-bottom:1.5rem}@media(max-width:768px){.page-header h1{font-size:1.5rem}.container{padding:0 .75rem}.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}}