:root{
  --bg:#f7f4ec;
  --surface:#ffffff;
  --ink:#172033;
  --muted:#687086;
  --accent:#245c4f;
  --accent-soft:#e4efe9;
  --border:#dfe3e6;
  --radius:18px;
}
*{box-sizing:border-box}
body{
  margin:0;
  font-family:Tahoma,Arial,sans-serif;
  background:var(--bg);
  color:var(--ink);
  line-height:1.7;
}
button,a{font:inherit}
.app-shell{width:min(1050px,92%);margin:0 auto;padding:32px 0 64px}
.hero{padding:28px 0 18px}
.hero h1{font-size:clamp(2rem,5vw,3.4rem);margin:.2rem 0}
.eyebrow,.muted{color:var(--muted)}
.progress-card{
  display:grid;gap:14px;background:var(--surface);border:1px solid var(--border);
  border-radius:var(--radius);padding:20px;margin:12px 0 28px
}
.progress-card strong{display:block;font-size:1.2rem}
.progress-track{height:10px;background:#edf0f1;border-radius:999px;overflow:hidden}
.progress-track span{display:block;height:100%;width:0;background:var(--accent);transition:width .3s ease}
.curriculum-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px}
.card{
  background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);
  padding:18px;text-decoration:none;color:inherit;display:block
}
.card:hover,.card:focus-visible{border-color:var(--accent);outline:3px solid var(--accent-soft);outline-offset:2px}
.badge{display:inline-block;background:var(--accent-soft);color:var(--accent);padding:2px 9px;border-radius:999px;font-size:.85rem}
.card h3{margin:10px 0 4px}
.card p{margin:0;color:var(--muted)}
.card.disabled{opacity:.58;cursor:not-allowed}
@media(max-width:520px){.app-shell{width:94%;padding-top:18px}}

.lesson-head{margin-bottom:18px}
.lesson-actions{display:flex;gap:10px;flex-wrap:wrap;margin:18px 0}
.primary-btn,.secondary-btn,.choice-btn{
  border-radius:14px;min-height:46px;padding:10px 16px;border:1px solid var(--border);
  cursor:pointer;font-weight:700
}
.primary-btn{background:var(--accent);color:#fff;border-color:var(--accent)}
.secondary-btn,.choice-btn{background:var(--surface);color:var(--ink)}
.primary-btn.small,.secondary-btn.small{min-height:40px;padding:8px 12px}
.choice-list{display:grid;gap:10px;margin:18px 0}
.choice-btn{text-align:right}
.choice-btn.correct{border-color:#24845b;background:#e7f5ed}
.choice-btn.wrong{border-color:#b84b4b;background:#faeaea}
.choice-btn:disabled{cursor:default}
.question-meta{display:flex;justify-content:space-between;gap:10px;color:var(--muted);font-size:.92rem}
.question-text{font-size:1.35rem;line-height:1.9;margin:18px 0}
.mini-progress{height:8px;background:#edf0f1;border-radius:999px;overflow:hidden;margin:12px 0 20px}
.mini-progress span{display:block;height:100%;background:var(--accent)}
.feedback{margin-top:16px;padding:14px;border-radius:14px;background:var(--accent-soft);min-height:0}
.topic-list{margin-top:24px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{background:var(--surface);border:1px solid var(--border);padding:6px 10px;border-radius:999px}
.score-circle{
  width:112px;height:112px;border-radius:50%;display:grid;place-items:center;margin:8px auto 18px;
  background:var(--accent-soft);color:var(--accent);font-size:1.8rem;font-weight:800
}
.skill-breakdown{display:grid;gap:8px;margin:18px 0}
.skill-row{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--border)}
.result-note{margin-top:14px}

.lesson-summary{background:var(--accent-soft);border-radius:var(--radius);padding:16px 18px}
.lesson-menu{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px;margin:18px 0}
.menu-card,.vocab-card{
  min-height:110px;border:1px solid var(--border);border-radius:16px;background:var(--surface);
  color:var(--ink);padding:16px;text-align:right;cursor:pointer
}
.menu-card strong,.vocab-card strong{display:block;font-size:1.08rem;margin-bottom:6px}
.menu-card span,.vocab-card span{color:var(--muted);font-size:.92rem}
.menu-card:hover,.menu-card:focus-visible,.vocab-card:hover,.vocab-card:focus-visible{
  border-color:var(--accent);outline:3px solid var(--accent-soft);outline-offset:2px
}
.vocab-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px}
.vocab-card.revealed{background:var(--accent-soft)}
.idea-list{display:grid;gap:10px}
.idea-item{display:flex;align-items:flex-start;gap:12px;border-bottom:1px solid var(--border);padding:10px 0}
.idea-item>span{display:grid;place-items:center;min-width:32px;height:32px;border-radius:50%;background:var(--accent-soft);color:var(--accent);font-weight:800}
.idea-item p{margin:0}
.hidden-feedback{display:none}

.audio-panel{border:1px solid var(--border);border-radius:var(--radius);padding:16px 18px;background:var(--surface)}
.audio-panel h2{margin-top:0}
.lesson-audio{width:100%;margin-top:8px}
