:root{
  --bg:#FFF9EE; --ink:#1A1A1A; --accent:#14532D; --accent-ink:#FFFFFF;
  --card:#FFFFFF; --line:#14532D; --found1:#FFE9A8; --found2:#CDEAC0; --found3:#FBD9C0; --found4:#CFE3F5;
  --cell: clamp(20px, 6.1vw, 44px);
  --cellfont: clamp(15px, 4.4vw, 32px);
}
body.ts-large{ --cell: clamp(22px, 6.6vw, 48px); --cellfont: clamp(17px, 5vw, 36px); }
body.ts-small{ --cell: clamp(18px, 5.6vw, 40px); --cellfont: clamp(13px, 4vw, 28px); }
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);
  font-family:Verdana, Geneva, "Segoe UI", Arial, sans-serif; font-size:19px; line-height:1.5;}
.topbar{display:flex;align-items:center;justify-content:space-between;gap:8px;
  background:var(--accent);color:#fff;padding:10px 12px;position:sticky;top:0;z-index:5}
.brand{font-weight:bold;font-size:22px;letter-spacing:.3px}
.topbtn{background:#fff;color:var(--accent);border:0;border-radius:10px;
  font-size:17px;font-weight:bold;padding:10px 14px;min-height:48px;cursor:pointer}
main{max-width:760px;margin:0 auto;padding:18px 14px 60px}
h1{font-size:30px;margin:10px 0 6px}
h2{font-size:24px;margin:26px 0 10px}
.sub{font-size:20px;margin:4px 0 14px}
.note{background:#FFF3D6;border:2px solid #B98A1B;border-radius:12px;padding:12px 14px;font-size:18px;margin:14px 0}
.bigbtn{display:block;width:100%;background:var(--accent);color:var(--accent-ink);border:0;border-radius:14px;
  font-size:22px;font-weight:bold;padding:16px;margin:10px 0;min-height:60px;cursor:pointer}
.bigbtn.secondary{background:#fff;color:var(--accent);border:3px solid var(--accent)}
.plist{display:grid;grid-template-columns:repeat(auto-fill,minmax(132px,1fr));gap:10px}
.pbtn{background:var(--card);border:3px solid var(--line);border-radius:14px;padding:12px 8px;cursor:pointer;
  min-height:76px;text-align:center;color:var(--ink)}
.pbtn .n{font-size:24px;font-weight:bold;display:block}
.pbtn .t{font-size:14px;display:block;line-height:1.25}
.pbtn.done{background:var(--found2)}
.pbtn.locked{opacity:.75;border-style:dashed}
.pbtn .lock{font-size:20px}
.home-actions{margin-top:24px}
.fineprint{font-size:15px;margin-top:30px}
.grid{display:grid;grid-template-columns:repeat(15,var(--cell));gap:2px;justify-content:center;
  margin:14px auto;touch-action:none;user-select:none;-webkit-user-select:none}
.cell{width:var(--cell);height:var(--cell);display:flex;align-items:center;justify-content:center;
  font-size:var(--cellfont);font-weight:bold;background:#fff;border:2px solid #9DB8A4;border-radius:6px}
.cell.sel{background:#BFD9FF;border-color:#14532D}
.cell.f1{background:var(--found1)} .cell.f2{background:var(--found2)}
.cell.f3{background:var(--found3)} .cell.f4{background:var(--found4)}
.cell.hintflash{background:#FF9D9D;border-color:#B91C1C}
.words{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:6px 14px}
.words li{font-size:20px;font-weight:bold;padding:6px 4px}
.words li.found{text-decoration:line-through;opacity:.55;font-weight:normal}
.play-actions{display:flex;gap:10px}
.play-actions .bigbtn{flex:1}
.complete{background:var(--found2);border:3px solid var(--accent);border-radius:14px;padding:16px;text-align:center;margin:20px 0}
.complete-text{font-size:24px;font-weight:bold;margin:6px 0 12px}
.howtext p{font-size:20px}
.ticks{list-style:none;padding:0;font-size:20px}
.ticks li{padding:4px 0}
a{color:var(--accent);font-weight:bold}

[hidden]{display:none !important}
