:root{
  --bg:#f6f5f1; --surface:#ffffff; --ink:#1d2330; --muted:#5d6676; --line:#dcdad2;
  --accent:#1f4e8c; --accent-ink:#ffffff; --ok:#1d7a46; --ok-bg:#e4f3ea; --bad:#b3261e; --bad-bg:#fbe7e5;
  --key-bg:#eef3fb; --formula-bg:#f3f0e7; --trap-bg:#fdf1e1; --trap-line:#c77700;
  --radius:10px; --shadow:0 1px 2px rgba(0,0,0,.06);
  color-scheme:light;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#12151b; --surface:#1b2029; --ink:#e7e9ee; --muted:#9aa3b2; --line:#2e3542;
  --accent:#7fb0f0; --accent-ink:#0f1520; --ok:#6fd39b; --ok-bg:#163222; --bad:#ff8a80; --bad-bg:#3a1a18;
  --key-bg:#1a2433; --formula-bg:#25231c; --trap-bg:#2f2414; --trap-line:#e0a040; color-scheme:dark;
}}
:root[data-theme="dark"]{
  --bg:#12151b; --surface:#1b2029; --ink:#e7e9ee; --muted:#9aa3b2; --line:#2e3542;
  --accent:#7fb0f0; --accent-ink:#0f1520; --ok:#6fd39b; --ok-bg:#163222; --bad:#ff8a80; --bad-bg:#3a1a18;
  --key-bg:#1a2433; --formula-bg:#25231c; --trap-bg:#2f2414; --trap-line:#e0a040; color-scheme:dark;
}
*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--bg);color:var(--ink);font:16px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;-webkit-text-size-adjust:100%}
button{font:inherit;color:inherit;cursor:pointer}
.top{position:sticky;top:0;z-index:5;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 16px;padding-top:max(10px,env(safe-area-inset-top));background:var(--surface);border-bottom:1px solid var(--line)}
.brand{background:none;border:0;font-weight:700;font-size:17px;padding:0;white-space:nowrap}
nav{flex-wrap:nowrap}
nav button{border:1px solid var(--line);background:var(--surface);border-radius:8px;padding:6px 10px;font-size:.92rem;white-space:nowrap}
.brand span{font-weight:400;color:var(--muted)}
nav{display:flex;gap:4px}
.btn{border:1px solid var(--line);background:var(--surface);border-radius:8px;padding:7px 12px}
.btn.primary{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
.btn:disabled{opacity:.45;cursor:default}
.ghost{color:var(--muted)}
main{max-width:860px;margin:0 auto;padding:16px 16px 80px}
h1{font-size:1.45rem;margin:.4em 0 .6em}
.muted{color:var(--muted)} .center{text-align:center}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px;box-shadow:var(--shadow)}
.grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
.mod h3{margin:0 0 2px;font-size:1.02rem}
.mod .code{font-size:.78rem;color:var(--muted);letter-spacing:.04em}
.bar{height:6px;background:var(--line);border-radius:4px;overflow:hidden;margin:10px 0 6px}
.bar i{display:block;height:100%;background:var(--ok)}
.stats{font-size:.85rem;color:var(--muted)}
.row{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.row .btn{flex:1 1 auto}
.qhead{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:.85rem;color:var(--muted);margin-bottom:8px}
.qtext{font-size:1.08rem;font-weight:600;margin:0 0 12px;white-space:pre-line}
.fig{margin:0 0 12px}
.fig img{max-width:100%;height:auto;border:1px solid var(--line);border-radius:6px;background:#fff;cursor:zoom-in}
.opts{display:grid;gap:8px}
.opt{display:flex;gap:10px;align-items:flex-start;text-align:left;width:100%;border:1px solid var(--line);background:var(--surface);border-radius:8px;padding:11px 12px}
.opt b{flex:0 0 auto;width:1.6em;height:1.6em;border-radius:50%;border:1px solid var(--line);display:inline-flex;align-items:center;justify-content:center;font-size:.85rem}
.opt.sel{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent) inset}
.opt.ok{background:var(--ok-bg);border-color:var(--ok)}
.opt.bad{background:var(--bad-bg);border-color:var(--bad)}
.verdict{margin:12px 0 0;font-weight:700}
.verdict.ok{color:var(--ok)} .verdict.bad{color:var(--bad)}
.flagbtn{background:none;border:1px solid var(--line);border-radius:6px;padding:3px 8px;font-size:.8rem}
.flagbtn.on{border-color:var(--trap-line);color:var(--trap-line)}
.navq{display:flex;justify-content:space-between;gap:8px;margin-top:14px}
.dots{display:flex;flex-wrap:wrap;gap:4px;margin:10px 0}
.dots button{width:28px;height:28px;border-radius:6px;border:1px solid var(--line);background:var(--surface);font-size:.72rem;padding:0}
.dots .ans{background:var(--key-bg)} .dots .cur{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent) inset}
.dots .ok{background:var(--ok-bg);border-color:var(--ok)} .dots .bad{background:var(--bad-bg);border-color:var(--bad)}
.timer{font-variant-numeric:tabular-nums}
form.login{max-width:360px;margin:8vh auto}
label{display:block;font-size:.9rem;margin:10px 0 4px}
input,select{width:100%;font:inherit;padding:9px 10px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--ink)}
.err{color:var(--bad);font-size:.9rem;min-height:1.2em}
.result{font-size:2rem;font-weight:700}
.pass{color:var(--ok)} .fail{color:var(--bad)}
table.list{width:100%;border-collapse:collapse;font-size:.9rem}
table.list td{border-top:1px solid var(--line);padding:6px 4px;vertical-align:top}
/* Guias */
.guide{line-height:1.65}
.guide h2{font-size:1.25rem;margin:1.8em 0 .5em;padding-top:.3em;border-top:1px solid var(--line)}
.guide h3{font-size:1.05rem;margin:1.4em 0 .4em}
.guide table{border-collapse:collapse;width:100%;font-size:.92rem;margin:.6em 0;display:block;overflow-x:auto}
.guide th,.guide td{border:1px solid var(--line);padding:6px 8px;text-align:left;vertical-align:top}
.guide thead th{background:var(--key-bg)}
.guide .intro{font-size:1.05rem;color:var(--muted)}
.guide .key,.guide .formula,.guide .trap{border-radius:8px;padding:10px 14px;margin:.8em 0}
.guide .key{background:var(--key-bg);border-left:4px solid var(--accent)}
.guide .formula{background:var(--formula-bg);border-left:4px solid var(--muted);font-variant-numeric:tabular-nums}
.guide .trap{background:var(--trap-bg);border-left:4px solid var(--trap-line)}
.guide .key::before{content:"Memorizar";display:block;font-size:.75rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--accent);margin-bottom:4px}
.guide .formula::before{content:"Fórmula / método";display:block;font-size:.75rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);margin-bottom:4px}
.guide .trap::before{content:"Armadilha de exame";display:block;font-size:.75rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--trap-line);margin-bottom:4px}
.guide .qrefs{font-size:.82rem;color:var(--muted)}
.guide .qrefs a{color:var(--accent);text-decoration:none;margin-right:4px}
.guide .flag{background:#fff59d;color:#000;padding:0 3px;border-radius:3px}
.toc{columns:2 220px;font-size:.92rem;padding-left:1.2em}
.toc a{color:var(--accent);text-decoration:none}
#lightbox{position:fixed;inset:0;background:rgba(0,0,0,.85);display:flex;align-items:center;justify-content:center;z-index:20;padding:12px}
#lightbox[hidden]{display:none}
#lightbox img{max-width:100%;max-height:100%;background:#fff}