/* minimal excerpt for v5 since full CSS was long in previous step; ensure clickable nav, teacher table, and layout */
:root{ --bg:#f6fbff; --panel:#ffffff; --ink:#0e2433; --muted:#5b7b99; --brand:#3a86ff; --shadow:0 12px 28px rgba(9,30,66,0.10); }
body{margin:0;padding:0;font-family:Poppins,system-ui,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:var(--ink);background:var(--bg)}
.app-header{position:sticky;top:0;z-index:3;display:flex;align-items:center;gap:14px;justify-content:space-between;padding:10px 16px;background:rgba(255,255,255,.85);backdrop-filter:blur(8px);border-bottom:1px solid #e6eef8}
.brand{display:flex;gap:10px;align-items:center}
.crest{width:44px;height:44px;border-radius:12px;background:#fff;padding:4px;box-shadow:0 8px 18px rgba(9,30,66,0.08)}
.subtitle{margin:0;color:var(--muted);font-size:12px}
.top-nav{display:flex;gap:10px;align-items:center}
.top-nav .nav-link{cursor:pointer;font-weight:700;border:1px solid #d1e4fb;background:#fff;border-radius:10px;padding:6px 10px}
.controls{display:flex;gap:8px;align-items:center}
button, select, input{border:1px solid #cfe2f7;background:#fff;color:var(--ink);padding:10px 12px;border-radius:12px;box-shadow:0 8px 18px rgba(9,30,66,0.08);font-weight:600;cursor:pointer}
button.accent{background:var(--brand);border-color:var(--brand);color:#001b2e}
button.secondary{background:#fff;border-color:#d4e6fb}
label.upload{display:inline-block;cursor:pointer}
#main{max-width:980px;margin:22px auto;padding:0 16px;position:relative;z-index:1}
.panel{background:rgba(255,255,255,.94);border:1px solid #e6eef8;border-radius:20px;box-shadow:0 12px 28px rgba(9,30,66,0.10);padding:18px;margin-bottom:16px}
.section-title{margin:0 0 10px 0;cursor:pointer}
.section-title:hover{color:var(--brand)}
.profile-left{display:flex;gap:16px;align-items:flex-start}
.avatar{font-size:40px;background:#fff;border-radius:14px;padding:10px;box-shadow:0 8px 18px rgba(9,30,66,0.08)}
.profile-right{display:flex;gap:14px;align-items:stretch}
.stat{background:#f8fbff;border:1px solid #e6eef8;border-radius:14px;padding:10px 12px;min-width:120px;text-align:center}
.stat strong{font-size:20px}
.muted{color:var(--muted)}
.xp-bar{width:260px;height:12px;border-radius:999px;background:#e7f1fb;border:1px solid #d1e4fb;overflow:hidden;margin-top:8px}
.xp-fill{height:100%;width:0;background:var(--brand);transition:width .4s}
.calendar{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.calendar .day{background:#fff;border:1px solid #e6eef8;border-radius:10px;padding:10px;text-align:center;color:#5b7b99}
.calendar .day.on{background:#d1f7d6;border-color:#a2e3ad;color:#0a6e1f}
.calendar .day.today{border-color:var(--brand)}
.card{position:relative;border:1px dashed #d7e7fb;border-radius:16px;padding:24px;min-height:180px;background:linear-gradient(180deg,#fff, #f4f9ff)}
#options-list{list-style:none;margin:0;padding:0;display:grid;gap:10px}
#options-list li{border:1px solid #d3e6fb;border-radius:12px;padding:12px;background:#fff;display:flex;justify-content:space-between;align-items:center}
#options-list li.correct{background:#e7f7ed;border-color:#b6ebc8}
#options-list li.incorrect{background:#fdecec;border-color:#f5b7b7}
#input-wrap input{width:100%;padding:12px;border:1px solid #d3e6fb;border-radius:12px;font-weight:600}
.explanation{margin-top:10px;padding:10px;border-left:4px solid var(--brand);background:rgba(124,197,255,0.15);border-radius:8px}
#progress-bar{width:220px;height:10px;background:#e7f1fb;border-radius:999px;overflow:hidden;border:1px solid #d1e4fb}
#progress-fill{height:100%;width:0;background:var(--brand);transition:width .35s ease}
#score-chip{font-weight:800;border:1px solid #d1e4fb;padding:6px 10px;border-radius:999px;background:#fff}
.chip{border:1px solid #d1e4fb;background:#fff;border-radius:999px;padding:6px 10px;font-weight:700}
.stars{display:flex;gap:4px}
.stars .star{filter:grayscale(1);opacity:.4}
.stars .star.on{filter:none;opacity:1}
.teacher table{width:100%;border-collapse:collapse}
.teacher th,.teacher td{border:1px solid #e6eef8;padding:8px;text-align:left}
.teacher th{background:#f8fbff}