:root{
  --bg:#0f172a; --panel:#111827; --card:#f8fafc; --ink:#111827; --muted:#475569;
  --accent:#2563eb; --accent-2:#0f766e; --ok:#166534; --bad:#b91c1c; --soft:#e0f2fe; --line:#cbd5e1;
}
*{box-sizing:border-box} body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;background:linear-gradient(135deg,#0f172a,#1e293b);color:var(--ink);}
.topbar{display:flex;justify-content:space-between;gap:1rem;align-items:center;padding:2rem;max-width:1100px;margin:0 auto;color:white}
h1{font-size:clamp(2rem,5vw,4rem);line-height:1;margin:.15rem 0}.subtitle{font-size:1.15rem;color:#cbd5e1;max-width:720px}.eyebrow{text-transform:uppercase;letter-spacing:.12em;font-weight:800;color:#38bdf8;font-size:.82rem;margin:0 0 .35rem}.score-card{background:white;color:#111827;border-radius:18px;padding:1rem 1.25rem;min-width:120px;text-align:center;box-shadow:0 18px 40px rgba(0,0,0,.25)}.score-card span{display:block;color:#64748b;font-size:.85rem}.score-card strong{font-size:1.6rem}
main{max-width:1100px;margin:0 auto;padding:0 1rem 2rem}.card{background:var(--card);border-radius:24px;padding:1.5rem;margin:1rem 0;box-shadow:0 20px 55px rgba(0,0,0,.25);border:1px solid rgba(255,255,255,.65)}.intro{display:grid;grid-template-columns:180px 1fr;gap:1.5rem;align-items:center}.chips{display:flex;flex-wrap:wrap;gap:.5rem}.chips span{background:#dbeafe;color:#1e3a8a;padding:.45rem .7rem;border-radius:999px;font-weight:700}.icon-scene{height:140px;border-radius:20px;background:#dbeafe;position:relative;overflow:hidden}.desk{position:absolute;left:24px;right:24px;bottom:25px;height:18px;background:#64748b;border-radius:12px}.book{position:absolute;left:45px;bottom:47px;width:70px;height:45px;background:#f97316;border-radius:6px;transform:rotate(-5deg)}.phone{position:absolute;right:45px;bottom:47px;width:34px;height:62px;background:#111827;border-radius:9px;border:4px solid #334155}
.activity-nav{display:grid;grid-template-columns:repeat(4,1fr);gap:.7rem;margin:1rem 0}.nav-btn,button{font:inherit}.nav-btn{border:2px solid transparent;background:#e2e8f0;color:#0f172a;border-radius:16px;padding:1rem;font-weight:800;cursor:pointer}.nav-btn.active,.nav-btn:focus{background:#38bdf8;border-color:white;outline:3px solid rgba(56,189,248,.25)}.activity{display:none}.activity.active{display:block}.section-title h2{font-size:2rem;margin:.2rem 0}.section-title p:last-child{color:var(--muted);font-size:1.05rem}.game-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem}.word-card{border:2px solid var(--line);border-radius:20px;padding:1rem;background:white}.visual{height:120px;border-radius:16px;background:#e2e8f0;display:grid;place-items:center;margin-bottom:.8rem}.visual svg{width:86px;height:86px}.word-card h3{margin:.2rem 0 1rem;font-size:1.05rem;color:#334155}.options{display:grid;gap:.5rem}.option{border:2px solid #cbd5e1;background:#f8fafc;border-radius:14px;padding:.75rem;cursor:pointer;font-weight:800}.option:hover,.option:focus{border-color:var(--accent);outline:none}.option.correct{background:#dcfce7;border-color:#22c55e;color:#14532d}.option.wrong{background:#fee2e2;border-color:#ef4444;color:#7f1d1d}.feedback{font-weight:800;min-height:1.5rem}.sentence-box,.reading-box{background:white;border:2px solid #e2e8f0;border-radius:20px;padding:1rem}.prompt{font-size:1.1rem}.sentence-target{min-height:62px;border:2px dashed #94a3b8;border-radius:16px;padding:.8rem;display:flex;gap:.5rem;flex-wrap:wrap;background:#f8fafc}.word-bank{display:flex;flex-wrap:wrap;gap:.6rem;margin:1rem 0}.word-chip{border:0;border-radius:14px;background:#dbeafe;color:#1e3a8a;padding:.8rem 1rem;font-weight:900;cursor:pointer}.placed{background:#e0f2fe;border-radius:12px;padding:.6rem .8rem;font-weight:900}.actions{display:flex;gap:.7rem;flex-wrap:wrap}.primary,.secondary{border:0;border-radius:14px;padding:.85rem 1rem;font-weight:900;cursor:pointer}.primary{background:var(--accent);color:white}.secondary{background:#e2e8f0;color:#111827}.quiz{display:grid;gap:1rem;margin-top:1rem}.question{background:white;border:2px solid #e2e8f0;border-radius:18px;padding:1rem}.question p{font-weight:900}.writing-grid{display:grid;gap:1rem}.writing-grid label{display:grid;gap:.35rem;font-weight:900}.writing-grid input{font:inherit;border:2px solid #cbd5e1;border-radius:14px;padding:.9rem;background:white}.student-card{margin-top:1rem;background:#ecfeff;border:2px solid #06b6d4;border-radius:18px;padding:1rem;font-size:1.1rem}footer{color:#cbd5e1;text-align:center;padding:1rem 1rem 2rem}
@media (max-width:760px){.topbar{display:block;padding:1.2rem}.score-card{text-align:left;margin-top:1rem}.intro{grid-template-columns:1fr}.activity-nav{grid-template-columns:1fr}.section-title h2{font-size:1.55rem}.card{padding:1rem;border-radius:18px}}