:root{--bg:#fbf7f2;--fg:#1d2233;--muted:#666d80;--card:#fff;--line:#e6e0d6;--ink:#1f2a5c;--acc:#f08a4b;--acc2:#ffd39a;--ok:#1f8a4c;--bad:#c23b3b;--hard:#b7791f;--easy:#2b6cb0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Noto Sans","Noto Sans Arabic","Noto Sans Devanagari","Noto Sans Thai",sans-serif}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--fg);line-height:1.55;font-size:16px;overflow-wrap:anywhere}
a{color:var(--ink)}
.wrap{max-width:920px;margin:0 auto;padding:12px 16px calc(24px + env(safe-area-inset-bottom))}
.top{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:6px 0 10px;border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:8px;text-decoration:none;color:var(--ink);font-size:1.2rem}
.wm{font-weight:800;letter-spacing:-.01em}.wm-of{color:var(--muted);font-weight:500}
.langsel{display:flex;align-items:center;gap:6px;font-size:.9rem;color:var(--muted)}
select,input,textarea,button{font:inherit}
select,input[type=number],input[type=time],textarea{border:1px solid var(--line);border-radius:8px;padding:6px 8px;background:#fff;color:var(--fg);max-width:100%}
.hero{padding:18px 0 6px}.hero h1{font-size:clamp(1.45rem,4.5vw,2.1rem);line-height:1.2;margin:.2em 0;color:var(--ink)}.hero p{margin:.3em 0;color:#3b4256}
.app{margin:10px 0 28px;min-height:420px}
.tabs{display:flex;gap:6px;margin:6px 0 12px;border-bottom:1px solid var(--line)}
.tabs a{padding:8px 12px;text-decoration:none;color:var(--muted);border-bottom:3px solid transparent;font-weight:600}
.tabs a.on{color:var(--ink);border-color:var(--acc)}
.banner{background:#fff3e6;border:1px solid var(--acc2);border-radius:10px;padding:10px 12px;margin:0 0 12px}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:0 0 12px}
.stats div{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:10px;text-align:center}
.stats b{display:block;font-size:1.4rem;color:var(--ink)}.stats span{font-size:.8rem;color:var(--muted)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:9px 14px;border-radius:10px;border:1px solid var(--ink);background:var(--ink);color:#fff;text-decoration:none;font-weight:600;cursor:pointer;min-height:42px}
.btn.ghost{background:#fff;color:var(--ink)}.btn.danger{background:#fff;color:var(--bad);border-color:var(--bad)}
.btn.big{display:flex;width:100%;font-size:1.05rem;padding:12px;margin:8px 0}
.btn.file{position:relative}
.lnk{color:var(--ink);font-weight:600}
.levels{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 4px}
.chip{border:1px solid var(--line);background:#fff;border-radius:999px;padding:6px 12px;cursor:pointer;color:var(--fg)}
.chip.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.muted{color:var(--muted)}.small{font-size:.85rem}.center{text-align:center}
.decks-h{margin:18px 0 8px;font-size:1.15rem}
.decks{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px}
.deck{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:12px}
.deck-h{display:flex;justify-content:space-between;align-items:baseline;gap:8px}.deck h3{margin:0;font-size:1.02rem}
.deck-s{margin:4px 0 10px;font-size:.88rem;color:var(--muted)}
.deck-b{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.deck-b .btn{min-height:38px;padding:6px 12px}
.study-h{display:flex;justify-content:space-between;align-items:center;gap:8px;margin:0 0 10px;flex-wrap:wrap}
.pill{background:#eef0f8;color:var(--ink);border-radius:999px;padding:2px 10px;font-weight:600;font-size:.9rem}
.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:18px;box-shadow:0 2px 10px rgba(31,42,92,.06)}
.fc{min-height:260px;position:relative;text-align:center;display:flex;flex-direction:column;justify-content:center}
.fc.back{justify-content:flex-start}
.tag{position:absolute;top:10px;inset-inline-start:12px;background:var(--acc2);color:#6b3a10;border-radius:6px;padding:1px 8px;font-size:.78rem;font-weight:700}
.word{font-size:clamp(2rem,9vw,2.8rem);margin:.2em 0 .1em;color:var(--ink);letter-spacing:-.01em}
.ph{color:var(--muted);margin:0 0 8px;font-size:1.05rem}
.icon{border:1px solid var(--line);background:#fff;border-radius:999px;width:38px;height:38px;cursor:pointer;vertical-align:middle}.icon.sm{width:30px;height:30px;font-size:.8rem}
.ans{text-align:start;border-top:1px dashed var(--line);margin-top:10px;padding-top:12px}
.def{font-size:1.1rem;margin:.2em 0}.tr{font-size:1.05rem;color:#3b4256;margin:.3em 0}
.ex{font-style:italic;color:#3b4256;margin:.6em 0 .2em}.ex-tr{color:var(--muted);margin:0 0 .4em;font-size:.95rem}
.note{display:block;margin-top:10px;font-size:.85rem;color:var(--muted)}.note textarea{width:100%;margin-top:4px}
.grades{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:14px 0 4px}
.g{border:2px solid;border-radius:12px;background:#fff;padding:10px 4px;cursor:pointer;min-height:58px;display:flex;flex-direction:column;align-items:center;justify-content:center}
.g small{color:var(--muted);font-size:.8rem}
.g-again{border-color:var(--bad);color:var(--bad)}.g-hard{border-color:var(--hard);color:var(--hard)}.g-good{border-color:var(--ok);color:var(--ok)}.g-easy{border-color:var(--easy);color:var(--easy)}
.done{text-align:center;padding:30px 10px}
.opts{list-style:none;padding:0;margin:12px 0;display:grid;gap:8px;text-align:start}
.opt{width:100%;text-align:start;border:1px solid var(--line);background:#fff;border-radius:10px;padding:10px 12px;cursor:pointer;color:var(--fg)}
.opt.ok{border-color:var(--ok);background:#e8f6ee}.opt.bad{border-color:var(--bad);background:#fbeaea}
.fb.ok{color:var(--ok);font-weight:700}.fb.bad{color:var(--bad);font-weight:700}.score{font-size:1.3rem;font-weight:700}
.settings h3{margin:18px 0 6px}.row{display:flex;align-items:center;gap:8px;margin:8px 0;flex-wrap:wrap}.row.wrap{gap:8px}
.flash{background:#e8f6ee;border:1px solid #b9e2c9;border-radius:8px;padding:8px 10px}
.prose{max-width:760px}.prose h2{color:var(--ink);margin-top:1.6em}
.toplinks{columns:2;padding-inline-start:1.2em}
.credits{font-size:.9rem;padding-inline-start:1.2em}
.crumbs{margin:10px 0}
.cta{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.cta .btn.big{width:auto;display:inline-flex;margin:0}
.tablewrap{overflow-x:auto;margin:14px 0;border:1px solid var(--line);border-radius:10px;background:#fff}
table.words{border-collapse:collapse;width:100%;font-size:.92rem}
.words th,.words td{padding:7px 9px;border-bottom:1px solid var(--line);text-align:start;vertical-align:top}
.words th{background:#f3efe8;position:sticky;top:0}.words td.ph{color:var(--muted);white-space:nowrap}
.ad{margin:22px 0;padding:6px;border:1px solid var(--line);border-radius:8px;background:#fff;min-height:0}
.ad-label{display:block;font-size:.7rem;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:4px}
body[data-route=study] .ad,body[data-route=quiz] .ad{display:none!important}
.foot{border-top:1px solid var(--line);margin-top:30px;padding-top:12px;color:var(--muted);font-size:.9rem}
.foot .disc{font-size:.85rem}
@media (max-width:560px){.stats{grid-template-columns:repeat(2,1fr)}.toplinks{columns:1}.wrap{padding:10px 12px}.words th:nth-child(2),.words td:nth-child(2){display:none}}
/* Print / save as PDF (topic + level pages): clean word table, no nav, buttons or ads */
@media print{
  @page{margin:14mm}
  body{background:#fff!important;color:#000}
  header.top,.crumbs,.cta,.ad,.adsbygoogle,footer.foot,.others,.practice,.intro,.langsel,.print-btn{display:none!important}
  .wrap{max-width:none;padding:0;margin:0}
  .prose h1{font-size:16pt;margin:0 0 6pt}
  .wl-h{font-size:12pt;margin:0 0 6pt}
  .tablewrap{overflow:visible;border:0;border-radius:0;margin:0}
  table.words{font-size:9.5pt}
  .words th{position:static;background:#eee!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .words thead{display:table-header-group}
  .words th{white-space:nowrap;word-break:normal;overflow-wrap:normal}
  .words tr{break-inside:avoid;page-break-inside:avoid}
  .words th,.words td{padding:3pt 5pt;border-bottom:1px solid #999}
  .words td:first-child,.words th:first-child,.words td:last-child,.words th:last-child{white-space:nowrap;word-break:normal;overflow-wrap:normal}
  #credits,.credits{font-size:8pt}
  .credits a{color:#000;text-decoration:none}
}
