:root{
  --bg:#fff;--fg:#111;--muted:#666;--card:#fff;--border:#ddd;--input:#fff;
  --btn:#16a34a;--btn-fg:#fff;--sec:#eee;--sec-fg:#111;
  --badge50:#dcfce7;--badge150:#fef9c3;--badge300:#ffead5;--badge500:#fbcfe8;
  font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
}
html[data-theme="dark"]{
  --bg:#0f1414;--fg:#e8ece8;--muted:#9aa39a;--card:#171d1d;--border:#2a3333;--input:#101616;
  --btn:#22c55e;--btn-fg:#06210f;--sec:#243030;--sec-fg:#e8ecec;
  --badge50:#14532d;--badge150:#713f12;--badge300:#7c2d12;--badge500:#831843;
}
body{background:var(--bg);color:var(--fg);margin:0}
.wrap{max-width:720px;margin:auto;padding:16px}
header h1{margin:.2em 0;font-size:1.5em}header p{color:var(--muted);margin:.2em 0 1em}
.card{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:12px;margin:10px 0}
label{display:block;margin:.5em 0 .2em;font-weight:600}input,select,button{font-size:1em;padding:.5em;width:100%;box-sizing:border-box;background:var(--input);color:var(--fg);border:1px solid var(--border);border-radius:8px}
input[type=range],input[type=radio],input[type=checkbox]{width:auto}
.row{display:flex;gap:8px}.row>*{flex:1}
button{background:var(--btn);color:var(--btn-fg);border:0;border-radius:10px;cursor:pointer;margin-top:.6em;font-weight:600}
button.secondary{background:var(--sec);color:var(--sec-fg)}
button:disabled{opacity:.5;cursor:default}
.tabs{display:flex;gap:8px;margin:8px 0}
.tabs button{margin-top:0}
.tabs button.active{outline:2px solid var(--btn)}
.topbar{display:flex;align-items:center;gap:8px;justify-content:space-between}
#btn-theme{width:auto;white-space:nowrap}
.mission{display:flex;gap:8px;align-items:flex-start;border:1px solid var(--border);border-radius:10px;padding:8px;margin:6px 0;background:var(--card)}
.mission.done{opacity:.65}
.mission.done .mtitle{text-decoration:line-through}
.badge{font-size:.75em;font-weight:700;border-radius:20px;padding:2px 8px;white-space:nowrap;color:inherit}
.p50{background:var(--badge50)}.p150{background:var(--badge150)}.p300{background:var(--badge300)}.p500{background:var(--badge500)}
.qr-stage{background:#f5f5f5;text-align:center;padding:80px 16px;margin:16px 0;border-radius:12px;color-scheme:light}
#qr{background:#fff;padding:16px;border-radius:8px;display:inline-block;color-scheme:light;forced-color-adjust:none}
#qr canvas,#qr img{max-width:100%;width:250px;height:auto}.muted{color:var(--muted);font-size:.9em}
.quiz-opts{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.quiz-opts button{width:auto;margin-top:0}
.edit-row{display:flex;gap:6px;margin:6px 0;align-items:center}
.edit-row input{flex:1}
.edit-row select{width:90px}
.small{font-size:.85em}
.locked{opacity:.6}
.score-row{display:flex;gap:12px;align-items:baseline;justify-content:space-between;flex-wrap:wrap}
.score-row #score{margin:.4em 0}
.p500{background:#fbbf24;color:#713f12}
.warn{background:#FFEA00;color:#713f12}
html[data-theme="dark"] .p500{background:#fbbf24;color:#713f12}
.inline-radios{display:flex;gap:16px;align-items:center}
.inline-radios label{display:inline-flex;gap:6px;align-items:center;margin:0;font-weight:400}
#btn-theme,#btn-settings{width:auto;white-space:nowrap}
#settings{position:fixed;top:0;right:0;height:100%;width:min(320px,92vw);background:var(--card);border-left:1px solid var(--border);box-shadow:-8px 0 24px rgba(0,0,0,.15);padding:16px;transform:translateX(105%);transition:transform .2s ease;z-index:50;overflow:auto}
#settings.open{transform:none}
#settings-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.3);z-index:40}
.play-sticky{position:sticky;top:0;background:var(--card);z-index:5;padding:8px 0;border-bottom:1px solid var(--border)}
#missions input[type=checkbox]{width:32px;height:32px;flex:none}
#missions button,.quiz-opts button{min-height:44px}
#golden-progress{margin:.2em 0;font-weight:600}