/* Alpha Bend — giao diện. Một cột: thanh trên (xu, cài đặt) → thử thách ngày → nhóm màn → kiểu chơi → độ khó → chọn màn → lưới → từ cần tìm */
:root{
  --bg:#EDF1EC; --surface:#F8FAF6; --ink:#1E2B26; --muted:#5E6E67; --line:#C9D3CC;
  --accent:#1E7558; --accent-ink:#FFFFFF; --sel:#E2B33C;
  --w1:#2E8B6A; --w2:#C2553F; --w3:#3D6FB0; --w4:#9A5BA8; --w5:#C68A1E; --w6:#3E8F9C;
  --tile:#FFFFFF; --tile-ink:#1E2B26; --tile-shadow:rgba(30,43,38,.12); --veil:rgba(255,255,255,.66); --gold:#B7861B; --scrim:rgba(14,21,18,.55);
  --f-display:"Lora",Georgia,"Times New Roman",serif;
  --f-body:"Be Vietnam Pro",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#141B18; --surface:#1C2521; --ink:#E6EEE9; --muted:#9AABA3; --line:#33423B;
  --accent:#4DBB92; --accent-ink:#0E1512; --sel:#E8BE52;
  --w1:#3FA982; --w2:#D96B54; --w3:#5B8FD6; --w4:#B57AC4; --w5:#D9A23A; --w6:#55AFBC;
  --tile:#26322D; --tile-ink:#EEF4F0; --tile-shadow:rgba(0,0,0,.35); --veil:rgba(18,26,22,.58); --gold:#E8BE52; --scrim:rgba(0,0,0,.6); color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#141B18; --surface:#1C2521; --ink:#E6EEE9; --muted:#9AABA3; --line:#33423B;
  --accent:#4DBB92; --accent-ink:#0E1512; --sel:#E8BE52;
  --w1:#3FA982; --w2:#D96B54; --w3:#5B8FD6; --w4:#B57AC4; --w5:#D9A23A; --w6:#55AFBC;
  --tile:#26322D; --tile-ink:#EEF4F0; --tile-shadow:rgba(0,0,0,.35); --veil:rgba(18,26,22,.58); --gold:#E8BE52; --scrim:rgba(0,0,0,.6); color-scheme:dark}
*{box-sizing:border-box}
body{background:var(--bg);color:var(--ink);font-family:var(--f-body);font-size:15px;
  padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));
  padding-block:16px 28px;-webkit-tap-highlight-color:transparent}
.app{max-width:460px;margin:0 auto;display:flex;flex-direction:column;gap:16px}
header{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
h1{font-family:var(--f-display);font-weight:600;font-size:1.6rem;margin:0;letter-spacing:-.01em}
h1 i{color:var(--accent);font-weight:500}
.levels{display:flex;gap:6px;flex-wrap:wrap}
.lv{width:34px;height:34px;border-radius:50%;border:1.5px solid var(--line);background:transparent;color:var(--ink);
  font:600 .9rem var(--f-body);cursor:pointer;position:relative}
.lv[aria-current="true"]{border-color:var(--accent);background:var(--accent);color:var(--accent-ink)}
.lv.done:not([aria-current="true"])::after{content:"";position:absolute;right:-1px;top:-1px;width:9px;height:9px;border-radius:50%;background:var(--accent);border:2px solid var(--bg)}
.lv:focus-visible,.btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.mode{display:flex;gap:4px;padding:4px;border-radius:12px;background:var(--surface);border:1px solid var(--line)}
.mode button{flex:1;height:36px;border:none;border-radius:9px;background:transparent;color:var(--muted);font:600 .9rem var(--f-body);cursor:pointer}
.mode button[aria-pressed="true"]{background:var(--accent);color:var(--accent-ink)}
.mode button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.mode small{font-weight:500;opacity:.8;margin-left:4px}
.theme{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.theme .label{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:600}
.theme .name{font-family:var(--f-display);font-style:italic;font-size:1.25rem;font-weight:500}
.theme .count{font-size:.85rem;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}
.current{height:44px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.35rem;letter-spacing:.08em;
  border-radius:12px;background:var(--surface);border:1px solid var(--line);transition:background .2s,color .2s}
.current.ok{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
.current.empty{color:var(--muted);font-weight:500;font-size:.9rem;letter-spacing:0}
@keyframes shake{25%{transform:translateX(-6px)}50%{transform:translateX(6px)}75%{transform:translateX(-3px)}}
.board-wrap{position:relative;touch-action:none;user-select:none;-webkit-user-select:none}
.board{display:grid;gap:var(--gap);position:relative;z-index:1;perspective:700px}
.cell{aspect-ratio:1;max-width:100%;border-radius:12px;background:var(--tile);color:var(--tile-ink);display:flex;align-items:center;justify-content:center;
  font-weight:700;font-size:clamp(1rem,6.2vw,1.6rem);box-shadow:0 1px 0 var(--line),0 2px 6px var(--tile-shadow);
  transition:background .15s,color .15s,transform .1s;cursor:pointer}
.cell.multi{font-size:clamp(.85rem,5vw,1.3rem);letter-spacing:.02em}
.cell{position:relative}
.cell .badge{position:absolute;top:3px;right:5px;font-size:.62rem;font-weight:700;line-height:1;color:var(--muted);font-variant-numeric:tabular-nums}
.cell.found .badge{color:rgba(255,255,255,.9)}
.cell.full .badge{opacity:.45}
.cell.sel .badge{color:#2A1E00}
.cell.hole{background:transparent;box-shadow:none;cursor:default}
.cell.sel{background:var(--sel);color:#2A1E00;transform:scale(.95)}
.cell.found{color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.65)}
@keyframes unfold{0%{transform:perspective(900px) rotateX(75deg) scale(.6);opacity:0}60%{transform:perspective(900px) rotateX(-8deg) scale(1.03);opacity:1}100%{transform:none;opacity:1}}
.cell.pop{animation:flip3d .62s cubic-bezier(.2,.8,.25,1.25) both;animation-delay:var(--d,0ms)}
@keyframes flip3d{0%{transform:rotateY(-180deg) scale(.7);filter:brightness(1.8)}55%{transform:rotateY(14deg) scale(1.12) translateZ(30px);filter:brightness(1.25)}100%{transform:none;filter:none}}
.board-wrap.win3d .board{animation:tilt3d 1.3s ease both}
@keyframes tilt3d{0%{transform:none}35%{transform:perspective(900px) rotateX(18deg) rotateZ(-2deg) scale(.94)}70%{transform:perspective(900px) rotateX(-6deg) scale(1.03)}100%{transform:none}}
.current.bad, .cell.shake{animation:shake .32s}
#fx{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:50}
.tools{display:flex;gap:8px;flex-wrap:wrap}
.tool{flex:1;min-width:96px;height:38px;border-radius:10px;border:1.5px solid var(--line);background:var(--surface);color:var(--ink);font:600 .82rem var(--f-body);cursor:pointer}
.tool[aria-pressed="true"]{border-color:var(--accent);color:var(--accent)}
.tool:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.cell.hint{box-shadow:0 0 0 3px var(--sel),0 2px 6px var(--tile-shadow)}
svg.lines{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;overflow:visible}
svg.lines polyline{fill:none;stroke-linecap:round;stroke-linejoin:round}
.words{display:flex;flex-direction:column;gap:8px}
.word{display:flex;align-items:center;gap:10px;min-height:36px}
.slots{display:flex;gap:4px;flex-wrap:wrap}
.slot{min-width:28px;height:30px;padding:0 4px;border-radius:6px;border:1.5px dashed var(--line);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.95rem}
.slot.rev{border-style:solid;color:#fff}
.slot.peek{border-style:solid;border-color:var(--sel)}
.actions{display:flex;gap:8px;flex-wrap:wrap}
.btn{flex:1;min-width:120px;height:44px;border-radius:12px;border:1.5px solid var(--line);background:var(--surface);color:var(--ink);font:600 .95rem var(--f-body);cursor:pointer}
.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.win{border-radius:14px;background:var(--surface);border:1px solid var(--line);padding:16px;display:flex;flex-direction:column;gap:10px;text-align:center}
.win h2{font-family:var(--f-display);font-weight:600;margin:0;font-size:1.3rem}
.win p{margin:0;color:var(--muted)}
.rules{font-size:.85rem;color:var(--muted);line-height:1.55;max-width:65ch;margin:0}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ---------- Thanh trên ---------- */
.topbar{display:flex;align-items:center;gap:8px}
.topbar h1{margin-right:auto}
.chip{display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 12px;border-radius:18px;border:1.5px solid var(--line);background:var(--surface);color:var(--ink);font:700 .9rem var(--f-body);cursor:pointer;font-variant-numeric:tabular-nums;white-space:nowrap}
.chip .coin{width:16px;height:16px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#FFE9A6,var(--gold) 70%);box-shadow:inset 0 -1px 0 rgba(0,0,0,.2)}
.iconbtn{width:36px;height:36px;border-radius:50%;border:1.5px solid var(--line);background:var(--surface);color:var(--ink);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;position:relative;padding:0}
.iconbtn svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.iconbtn .dot{position:absolute;top:-2px;right:-2px;width:10px;height:10px;border-radius:50%;background:var(--w2);border:2px solid var(--bg)}
.chip:focus-visible,.iconbtn:focus-visible,.tool:focus-visible,.sheet button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.coins-bump{animation:bump .5s ease}
@keyframes bump{40%{transform:scale(1.18)}}
.daily-banner{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;background:var(--surface);border:1px solid var(--line);cursor:pointer;text-align:left;color:var(--ink);font:inherit;width:100%}
.daily-banner b{font-family:var(--f-display);font-weight:600;font-size:1.05rem}
.daily-banner span{color:var(--muted);font-size:.85rem}
.daily-banner .streak{margin-left:auto;font-weight:700;color:var(--w5);white-space:nowrap}
.daily-banner[aria-current="true"]{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent) inset}
.hintrow{display:flex;gap:8px;flex-wrap:wrap}
.hintrow .btn small{display:block;font-weight:500;font-size:.75rem;opacity:.8}
.btn .price{display:inline-flex;align-items:center;gap:4px}
/* ---------- Bảng trượt (cửa hàng, cài đặt, độ khó, định nghĩa) ---------- */
.sheet-wrap{position:fixed;inset:0;z-index:40;background:var(--scrim);display:flex;align-items:flex-end;justify-content:center}
.sheet{width:100%;max-width:520px;max-height:86vh;overflow:auto;background:var(--bg);border-radius:20px 20px 0 0;
  padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));
  padding-block:18px calc(20px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:14px;animation:sheetIn .28s ease both}
@keyframes sheetIn{from{transform:translateY(40px);opacity:0}}
.sheet-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.sheet h2{font-family:var(--f-display);font-weight:600;margin:0;font-size:1.3rem}
.sheet h3{margin:6px 0 0;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border-radius:12px;background:var(--surface);border:1px solid var(--line)}
.row .txt{min-width:0}
.row .txt b{display:block}
.row .txt span{color:var(--muted);font-size:.85rem}
.row .btn{flex:0 0 auto;min-width:96px;height:38px}
.seg{display:flex;gap:4px;padding:4px;border-radius:12px;background:var(--surface);border:1px solid var(--line)}
.seg button{flex:1;height:34px;border:none;border-radius:9px;background:transparent;color:var(--muted);font:600 .88rem var(--f-body);cursor:pointer}
.seg button[aria-pressed="true"]{background:var(--accent);color:var(--accent-ink)}
.note{font-size:.8rem;color:var(--muted);margin:0;line-height:1.5}
/* ---------- Quảng cáo thử (web / bản chơi thử) ---------- */
.ad-mock{position:fixed;inset:0;z-index:70;background:#111;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;text-align:center;padding:24px}
.ad-mock .tag{font-size:.75rem;letter-spacing:.12em;text-transform:uppercase;opacity:.7}
.ad-mock .box{width:min(320px,90%);aspect-ratio:16/10;border-radius:14px;background:linear-gradient(135deg,#2E8B6A,#3D6FB0);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.2rem}
.ad-mock button{height:40px;padding:0 18px;border-radius:20px;border:1px solid rgba(255,255,255,.5);background:transparent;color:#fff;font:600 .9rem var(--f-body);cursor:pointer}
.ad-mock button:disabled{opacity:.5;cursor:default}
.toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:80;background:var(--ink);color:var(--bg);padding:10px 16px;border-radius:12px;font-weight:600;font-size:.9rem;max-width:calc(100% - 32px);text-align:center;animation:sheetIn .25s ease both}
.coin-sm{display:inline-block;width:14px;height:14px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#FFE9A6,var(--gold) 70%);vertical-align:-2px}
.newdot{flex:0 0 auto;width:10px;height:10px;border-radius:50%;background:var(--w2)}
.btn:disabled{opacity:.5;cursor:default}
.diffbtn{flex:0 0 auto;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:1px;padding:4px 12px;border-radius:12px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font:600 .85rem var(--f-body);cursor:pointer;max-width:44%;text-align:left}
.diffbtn .lbl{font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.diffbtn #diffSummary{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.diffbtn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.word .cat{font-size:.72rem;color:var(--muted);border:1px solid var(--line);border-radius:999px;padding:2px 8px;white-space:nowrap;max-width:45%;overflow:hidden;text-overflow:ellipsis}
.word .info{flex:0 0 auto;width:26px;height:26px;border-radius:50%;border:1.5px solid var(--line);background:var(--surface);color:var(--ink);font:700 .8rem var(--f-body);cursor:pointer;padding:0;display:inline-flex;align-items:center;justify-content:center}
.word .info:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.word .info.fresh{border-color:var(--accent);color:var(--accent);animation:qpulse 1.2s ease-in-out 3}
@keyframes qpulse{50%{transform:scale(1.25);box-shadow:0 0 0 6px color-mix(in srgb,var(--accent) 22%,transparent)}}
.sheet .def{margin:0;font-size:1.05rem;line-height:1.6;max-width:60ch}
.packs{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch}
.packchip{flex:0 0 auto;scroll-snap-align:start;display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:8px 12px;border-radius:12px;border:1.5px solid var(--line);background:var(--surface);color:var(--ink);font:600 .88rem var(--f-body);cursor:pointer;text-align:left}
.packchip small{font-weight:500;font-size:.72rem;color:var(--muted);font-variant-numeric:tabular-nums}
.packchip[aria-pressed="true"]{border-color:var(--accent);background:var(--accent);color:var(--accent-ink)}
.packchip[aria-pressed="true"] small{color:var(--accent-ink);opacity:.85}
.packchip:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* ---------- Chống tràn chữ (đặt cuối để ghi đè) ---------- */
.btn,.mode button,.seg button,.chip,.packchip,.diffbtn,.daily-banner,.row .txt{min-width:0;overflow-wrap:anywhere;line-height:1.25}
.btn{height:auto;min-height:44px;padding:8px 12px;white-space:normal}
.mode button,.seg button{flex:1 1 0;height:auto;min-height:38px;padding:6px 8px;white-space:normal}
.row .btn{flex:0 1 auto;min-height:38px;min-width:72px;max-width:45%}
.diffbtn{width:100%;max-width:none;flex-direction:row;align-items:center;justify-content:space-between;gap:12px;padding:10px 14px}
.diffbtn #diffSummary{white-space:normal;text-align:right;overflow:visible;min-width:0}
.levels{flex-wrap:nowrap;overflow-x:auto;padding:4px 2px 6px;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch}
.lv{flex:0 0 auto;scroll-snap-align:center}
.current{height:auto;min-height:44px;padding:6px 12px;text-align:center;overflow-wrap:anywhere;line-height:1.25}
.current.msg{font-size:.95rem;letter-spacing:0;font-weight:600}
.theme > div:first-child{min-width:0}
.theme .name{overflow-wrap:anywhere}
.word{flex-wrap:wrap;row-gap:6px}
.slots{flex:1 1 auto;min-width:0}
.word .cat{max-width:60%}
.packchip{max-width:72vw;white-space:normal}
.topbar h1{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.chip{flex:0 0 auto}
.cell{overflow:hidden}
.hintrow .btn,.win .actions .btn,.actions .btn{flex:1 1 140px;min-width:0}
@media (max-width:400px){
  .slot{min-width:22px;height:28px;font-size:.85rem;padding:0 2px}
  .mode button,.seg button{font-size:.82rem;padding:6px 4px}
  .btn{font-size:.9rem}
}
.word .meta{display:flex;align-items:center;gap:6px;margin-left:auto;min-width:0;max-width:100%}
.word .meta .cat{max-width:none;min-width:0}

/* ================= Giao diện từng bước (v2) ================= */
.screen{display:flex;flex-direction:column;gap:16px}
.topbar .title{font-family:var(--f-display);font-weight:600;font-size:1.25rem;margin:0 auto 0 0;min-width:0;overflow-wrap:anywhere;line-height:1.2}
.iconbtn{flex:0 0 auto}
.eyebrow{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:700}
.btn.big{min-height:52px;font-size:1.05rem;border-radius:14px;width:100%}
.linkbtn{background:none;border:none;color:var(--accent);font:600 .92rem var(--f-body);cursor:pointer;padding:8px;min-height:40px;align-self:center;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.linkbtn:focus-visible,.card:focus-visible,.node:focus-visible,.switch:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.meter{display:block;height:6px;border-radius:3px;background:color-mix(in srgb,var(--line) 70%,transparent);overflow:hidden}
.meter span{display:block;height:100%;border-radius:3px;background:var(--accent);transition:width .4s}

/* Trang chủ */
.hero{display:flex;flex-direction:column;gap:8px;padding:20px 18px 12px;border-radius:20px;background:var(--surface);border:1px solid var(--line);box-shadow:0 6px 24px var(--tile-shadow)}
.hero h2{font-family:var(--f-display);font-weight:600;font-size:1.45rem;line-height:1.25;margin:0;text-wrap:balance;overflow-wrap:anywhere}
.hero p{margin:0;color:var(--muted);font-size:.92rem;overflow-wrap:anywhere}
.hero .meter{margin:6px 0 10px}
.card{display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:14px;border-radius:16px;background:var(--surface);border:1px solid var(--line);color:var(--ink);font:inherit;text-align:left;cursor:pointer;min-width:0;overflow-wrap:anywhere;line-height:1.3}
.card b{font-weight:700;font-size:1rem}
.card small{color:var(--muted);font-size:.82rem}
.card.daily{flex-direction:row;align-items:center;gap:12px}
.card.daily .ico{flex:0 0 auto;width:40px;height:40px;border-radius:12px;display:flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--w5) 22%,transparent);color:var(--w5);font-size:1.2rem}
.card .txt{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.card.daily .streak{flex:0 0 auto;font-weight:700;color:var(--w5);font-size:.85rem;white-space:nowrap}
.card.daily.done{opacity:.75}
.card.daily.done .ico{background:color-mix(in srgb,var(--accent) 22%,transparent);color:var(--accent)}
.cards2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
h3.section{margin:4px 0 -6px;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.linkbtn.center{align-self:center}

/* Danh sách */
.list{display:flex;flex-direction:column;gap:12px}
.card.wide{display:grid;grid-template-columns:1fr auto;align-items:center;gap:8px 12px}
.card.wide .meter{grid-column:1/-1}
.card.wide .count{grid-row:1;grid-column:2;font-variant-numeric:tabular-nums;color:var(--muted);font-weight:600;font-size:.85rem}
.chapter{display:flex;flex-direction:column;gap:10px;margin-bottom:10px}
.chapter-head h3{font-family:var(--f-display);font-weight:600;font-size:1.2rem;margin:2px 0}
.nodes{display:flex;flex-direction:column;gap:6px}
.node{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:12px;background:var(--surface);border:1px solid var(--line);color:var(--ink);font:inherit;text-align:left;cursor:pointer;min-height:52px}
.node .num{flex:0 0 auto;width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.82rem;border:1.5px solid var(--line);font-variant-numeric:tabular-nums}
.node .txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px;overflow-wrap:anywhere;line-height:1.3}
.node .txt small{color:var(--muted);font-size:.78rem}
.node .state{flex:0 0 auto;width:22px;height:22px;color:var(--muted)}
.node .state svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.node.done .num{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.node.done .state{color:var(--accent)}
.node.next{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent) inset}
.node.next .state{color:var(--accent)}
.node.next .state svg{fill:currentColor;stroke:none}
.node.locked{opacity:.55;cursor:default}

/* Màn chơi */
.gtitle{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.2}
.gtitle small{color:var(--muted);font-size:.75rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gtitle b{font-family:var(--f-display);font-style:italic;font-weight:500;font-size:1.15rem;overflow-wrap:anywhere}
.wordshead{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:-8px}
.wordshead span:first-child{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:700}
.wordshead .count{font-size:.85rem;color:var(--muted);font-variant-numeric:tabular-nums}
.board.tiny{max-width:320px;margin:0 auto;width:100%}
.coach{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:14px;background:color-mix(in srgb,var(--sel) 22%,var(--surface));border:1px solid var(--sel);animation:sheetIn .3s ease both}
.coach p{margin:0;flex:1;font-weight:600;line-height:1.4}
.coach .linkbtn{flex:0 0 auto;color:var(--muted)}
.ghost{position:absolute;left:0;top:0;width:44px;height:44px;margin:-10px 0 0 -10px;z-index:3;pointer-events:none;border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.95) 0 30%,rgba(255,255,255,.35) 31% 60%,transparent 61%);box-shadow:0 0 0 2px var(--sel);opacity:0}

/* Hộp thắng */
.modal{position:fixed;inset:0;z-index:45;background:var(--scrim);display:flex;align-items:center;justify-content:center;padding:24px 16px;animation:fadeIn .25s ease both}
@keyframes fadeIn{from{opacity:0}}
.modal .win{width:100%;max-width:360px;padding:24px 20px 12px;gap:12px;border-radius:20px;background:var(--bg);animation:popIn .35s cubic-bezier(.2,.8,.25,1.2) both}
@keyframes popIn{from{transform:scale(.9);opacity:0}}
.modal .win h2{font-size:1.5rem}
.modal .win p{overflow-wrap:anywhere}

/* Bảng trượt: công tắc, bước hướng dẫn */
.switch{flex:0 0 auto;width:48px;height:28px;border-radius:14px;border:none;background:var(--line);position:relative;cursor:pointer;padding:0;transition:background .2s}
.switch::after{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.3);transition:transform .2s}
.switch[aria-checked="true"]{background:var(--accent)}
.switch[aria-checked="true"]::after{transform:translateX(20px)}
.howstep{display:flex;gap:12px;align-items:flex-start}
.howstep .num{flex:0 0 auto;width:28px;height:28px;border-radius:50%;background:var(--accent);color:var(--accent-ink);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.85rem}
.howstep .txt{display:flex;flex-direction:column;gap:2px;line-height:1.45;min-width:0}
.howstep .txt span{color:var(--muted);font-size:.9rem}
.sheet .lead{margin:0;font-size:1rem;line-height:1.6}
.sheet .cat{font-size:.72rem;color:var(--muted);border:1px solid var(--line);border-radius:999px;padding:2px 8px}
#listFilter .mode{margin-bottom:-4px}
.sheet > .sheet-body > .btn.primary{width:100%;flex:none;margin-top:4px}
.sheet-body{display:flex;flex-direction:column;gap:12px}

/* ================= Hành trình kiểu bản đồ: mỗi chương một vùng đất (v9) ================= */
/* Màu theo chương lấy từ một sắc độ --h; độ sáng đổi theo giao diện sáng/tối qua các biến --wl-* */
:root{--h:150;--wl-bg:92%;--wl-surf:97%;--wl-line:80%;--wl-a:32%;--wl-muted:36%;--wl-tint:88%;--star:#E3A21A;--star-off:rgba(120,120,120,.28);--hard:#C2433A}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--wl-bg:9%;--wl-surf:13%;--wl-line:25%;--wl-a:62%;--wl-muted:68%;--wl-tint:17%;--star:#F2C14E;--star-off:rgba(255,255,255,.18);--hard:#E0675C}}
:root[data-theme="dark"]{--wl-bg:9%;--wl-surf:13%;--wl-line:25%;--wl-a:62%;--wl-muted:68%;--wl-tint:17%;--star:#F2C14E;--star-off:rgba(255,255,255,.18);--hard:#E0675C}
:root[data-ch]{--bg:hsl(var(--h) 26% var(--wl-bg));--surface:hsl(var(--h) 30% var(--wl-surf));--line:hsl(var(--h) 18% var(--wl-line));
  --accent:hsl(var(--h) 55% var(--wl-a));--muted:hsl(var(--h) 12% var(--wl-muted))}
.world,.hero,.intro-art{--wa:hsl(var(--h) 55% var(--wl-a));--wtint:hsl(var(--h) 40% var(--wl-tint))}
.motif{position:fixed;inset:0;z-index:0;pointer-events:none;background:var(--accent);opacity:.09;
  -webkit-mask-image:var(--motif);mask-image:var(--motif);-webkit-mask-size:96px 96px;mask-size:96px 96px}
.app{position:relative;z-index:1}
.wicon{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.patterned{position:relative;overflow:hidden;isolation:isolate}
/* Trang chủ: thẻ Hành trình mang màu của chương hiện tại */
.hero{position:relative;overflow:hidden;isolation:isolate;background:var(--wtint);border-color:color-mix(in srgb,var(--wa) 35%,transparent)}
.hero::before,.world-head::before,.intro-art::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--wa);opacity:.1;
  -webkit-mask-image:var(--motif);mask-image:var(--motif);-webkit-mask-size:96px 96px;mask-size:96px 96px}
.hero-top{display:flex;gap:14px;align-items:center}
.hero-art{flex:none;width:64px;height:64px;border-radius:18px;background:var(--wa);color:var(--accent-ink);display:flex;align-items:center;justify-content:center;box-shadow:0 4px 0 color-mix(in srgb,var(--wa) 70%,#000)}
.hero-art svg{width:38px;height:38px}
.hero-txt{min-width:0;display:flex;flex-direction:column;gap:2px}
.hero .eyebrow{color:var(--wa)}
.hero-prog{display:flex;align-items:center;gap:10px;margin:8px 0 6px}
.hero-prog .meter{flex:1;margin:0}
.hero-prog .meter span{background:var(--wa)}
.hero-prog span:last-child{font-size:.8rem;color:var(--muted);font-weight:600;white-space:nowrap;font-variant-numeric:tabular-nums}
.hero .btn.primary{background:var(--wa);border-color:var(--wa)}
.hero .linkbtn{color:var(--wa)}
/* Bản đồ */
.world{display:flex;flex-direction:column;gap:4px;margin-bottom:8px}
.world-head{position:relative;overflow:hidden;isolation:isolate;display:flex;align-items:center;gap:12px;padding:16px;border-radius:20px;background:var(--wtint);border:1px solid color-mix(in srgb,var(--wa) 30%,transparent)}
.world-head .wicon{flex:none;width:46px;height:46px;color:var(--wa)}
.world-head .txt{flex:1;min-width:0}
.world-head .eyebrow{color:var(--wa)}
.world-head h3{font-family:var(--f-display);font-weight:600;font-size:1.3rem;margin:2px 0;overflow-wrap:anywhere}
.world-head p{margin:0;font-size:.85rem;color:var(--muted);line-height:1.4}
.wstat{flex:none;display:flex;flex-direction:column;align-items:flex-end;gap:2px;font-variant-numeric:tabular-nums}
.wstat b{color:var(--star);font-size:.95rem}
.wstat span{font-size:.75rem;color:var(--muted);white-space:nowrap}
.world.locked .world-head{filter:grayscale(.85);opacity:.75}
.map{position:relative}
.trail{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.trail path{fill:none;stroke:var(--wa);stroke-width:7;stroke-linecap:round;stroke-dasharray:.1 16;opacity:.45;vector-effect:non-scaling-stroke}
.world.locked .trail path{stroke:var(--line);opacity:.8}
.mnode{position:absolute;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:3px;background:none;border:none;padding:0;cursor:pointer;color:var(--ink);font:inherit}
.mnode .disc{width:54px;height:54px;border-radius:50%;display:flex;align-items:center;justify-content:center;font:800 1.05rem var(--f-body);font-variant-numeric:tabular-nums;
  background:var(--surface);border:3px solid var(--wa);color:var(--wa);box-shadow:0 4px 0 color-mix(in srgb,var(--wa) 55%,transparent)}
.mnode .disc svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.mnode.done .disc{background:var(--wa);color:var(--accent-ink);box-shadow:0 4px 0 color-mix(in srgb,var(--wa) 65%,#000)}
.mnode.next .disc{width:66px;height:66px;font-size:1.25rem;background:var(--wa);color:var(--accent-ink);box-shadow:0 5px 0 color-mix(in srgb,var(--wa) 65%,#000),0 0 0 6px color-mix(in srgb,var(--wa) 25%,transparent);animation:nodePulse 1.6s ease-in-out infinite}
@keyframes nodePulse{50%{box-shadow:0 5px 0 color-mix(in srgb,var(--wa) 65%,#000),0 0 0 12px color-mix(in srgb,var(--wa) 10%,transparent)}}
.mnode.locked{cursor:default}
.mnode.locked .disc{border-color:var(--line);color:var(--muted);box-shadow:0 4px 0 var(--line)}
.mnode.boss .disc{width:64px;height:64px;border-width:4px;border-style:double}
.mnode.boss.locked .disc{border-style:double}
.mnode .tag{font-size:.68rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#fff;background:var(--hard);padding:2px 8px;border-radius:999px}
.stars{display:flex;gap:2px}
.stars i,.winstars i{display:block;width:14px;height:14px;background:var(--star-off);clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%)}
.stars i.on,.winstars i.on{background:var(--star)}
.winstars{display:flex;justify-content:center;gap:8px;margin-bottom:-4px}
.winstars i{width:44px;height:44px}
.winstars i:nth-child(2){transform:translateY(-10px);width:52px;height:52px}
.winstars i.on{animation:starIn .5s cubic-bezier(.2,.8,.3,1.4) both}
.winstars i:nth-child(2).on{animation-delay:.15s}.winstars i:nth-child(3).on{animation-delay:.3s}
@keyframes starIn{from{transform:scale(0) rotate(-40deg)}}
.winstars i:nth-child(2).on{animation-name:starIn2}
@keyframes starIn2{from{transform:translateY(-10px) scale(0) rotate(-40deg)}to{transform:translateY(-10px)}}
.intro-art{position:relative;overflow:hidden;isolation:isolate;height:120px;border-radius:18px;background:var(--wtint);display:flex;align-items:center;justify-content:center;color:var(--wa)}
.intro-art svg{width:64px;height:64px}
.sheet h3 + .lead{margin-top:-6px}
.slot.mystery{min-width:44px;border-style:dashed;color:var(--muted);font-weight:700}
/* Cấp độ màn (v11): nhãn Khó / Siêu khó trên bản đồ và trong màn chơi */
:root{--superhard:#7A3FD1}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--superhard:#B48CFF}}
:root[data-theme="dark"]{--superhard:#B48CFF}
.gname{display:flex;align-items:center;gap:8px;min-width:0}
.gchip{flex:none;font-size:.68rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#fff;padding:2px 8px;border-radius:999px;background:var(--hard);font-style:normal}
.gchip.superhard,.mnode.superhard .tag{background:var(--superhard)}
.mnode.hard .disc,.mnode.superhard .disc{border-width:4px;border-style:double}
.mnode.hard:not(.locked):not(.done):not(.next) .disc{border-color:var(--hard);color:var(--hard)}
.mnode.superhard:not(.locked):not(.done):not(.next) .disc{border-color:var(--superhard);color:var(--superhard)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .gchip.superhard,:root:not([data-theme="light"]) .mnode.superhard .tag{color:#1A0F33}}
:root[data-theme="dark"] .gchip.superhard,:root[data-theme="dark"] .mnode.superhard .tag{color:#1A0F33}
/* Chữ trên ô và ô trống: font có chân (Bitter) để I có chân, Ị không bị nhầm với dấu chấm than */
:root{--f-tile:"Bitter","Roboto Slab",Georgia,serif}
.cell,.slot,.current:not(.empty):not(.msg){font-family:var(--f-tile);font-weight:800}
.cell{padding-top:2px}
.cell{font-size:clamp(1.1rem,6.9vw,1.8rem)}
/* Thành tích (v17): đồng hồ trong màn chơi và bảng điểm ở hộp thắng */
.whr{display:flex;align-items:baseline;gap:10px}
.clock{font-size:.85rem;color:var(--muted);font-variant-numeric:tabular-nums;font-weight:600}
.clock.over{color:var(--hard)}
.perf{display:flex;flex-direction:column;gap:6px;padding:10px 12px;border-radius:14px;background:var(--surface);border:1px solid var(--line);text-align:left}
.prow{display:flex;justify-content:space-between;gap:12px;font-size:.88rem;color:var(--muted)}
.prow b{color:var(--ink);font-variant-numeric:tabular-nums;text-align:right}
.prow.good b{color:var(--accent)}
.prow.coins b{color:var(--gold)}
.precord{align-self:center;font-weight:800;font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;color:#fff;background:var(--star);padding:3px 10px;border-radius:999px}
.wordshead .whr span{letter-spacing:0;text-transform:none}
/* Xem lại lời giải màn đã giải (v18) */
.review{display:flex;flex-direction:column;gap:10px;padding:14px 16px;border-radius:16px;background:var(--surface);border:1px solid var(--line)}
.rv-top{display:flex;align-items:center;gap:10px}
.rvstars i{width:18px;height:18px}
.review p{margin:0;font-size:.9rem;color:var(--muted);font-variant-numeric:tabular-nums}
.rv-btns{display:flex;gap:8px;flex-wrap:wrap}
.rv-btns .btn{flex:1 1 130px;min-width:0}
/* Hướng dẫn nhỏ cho từng chế độ (v19): làm tối màn hình, khoanh sáng phần đang nói tới */
.tour{position:fixed;inset:0;z-index:65}
.tour.nospot{background:rgba(10,15,20,.62)}
.tour-spot{position:fixed;border-radius:16px;box-shadow:0 0 0 9999px rgba(10,15,20,.62);outline:3px solid var(--sel);outline-offset:2px;transition:left .25s,top .25s,width .25s,height .25s;pointer-events:none}
.tour-card{position:fixed;left:max(16px,env(safe-area-inset-left,0px));right:max(16px,env(safe-area-inset-right,0px));max-width:420px;margin:0 auto;
  background:var(--bg);color:var(--ink);border-radius:18px;padding:16px;display:flex;flex-direction:column;gap:6px;box-shadow:0 12px 40px rgba(0,0,0,.35);animation:sheetIn .25s ease both}
.tour-step{font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--accent)}
.tour-step:empty{display:none}
.tour-title{font-family:var(--f-display);font-weight:600;font-size:1.15rem}
.tour-text{margin:0;line-height:1.5;font-size:.95rem}
.tour-btns{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:6px}
.tour-btns .btn{flex:0 1 auto;min-width:120px;margin-left:auto}
/* vòng sáng quanh nút cần bấm trong màn tập */
.spot{position:relative;z-index:2;animation:spotPulse 1.2s ease-in-out infinite;outline:3px solid var(--sel);outline-offset:3px}
@keyframes spotPulse{50%{outline-offset:7px;outline-color:color-mix(in srgb,var(--sel) 40%,transparent)}}

/* Ô xám (ô chặn) như trò Wend (v26): khối xám liền nhau; ô càng nhiều thì màn càng dễ */
:root{--gap:8px;--block:#C3CAC5}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--block:#3A4440}}
:root[data-theme="dark"]{--block:#3A4440}
:root[data-ch]{--block:hsl(var(--h) 10% calc(var(--wl-tile, 78%)))}
@media (prefers-color-scheme:dark){:root[data-ch]:not([data-theme="light"]){--block:hsl(var(--h) 10% 24%)}}
:root[data-ch][data-theme="dark"]{--block:hsl(var(--h) 10% 24%)}
.cell.hole{background:var(--block)!important;box-shadow:none;cursor:default;position:relative;z-index:0}
.cell.hole.jr{border-top-right-radius:0;border-bottom-right-radius:0}
.cell.hole.jb{border-bottom-left-radius:0;border-bottom-right-radius:0}
.cell.hole.jl{border-top-left-radius:0;border-bottom-left-radius:0}
.cell.hole.jt{border-top-left-radius:0;border-top-right-radius:0}

/* v27: nút trong hàng Cài đặt/Cửa hàng không xuống dòng, không tràn chữ */
.row .txt{flex:1 1 auto}
.row .btn{flex:0 0 auto;height:auto;min-height:38px;max-width:none;white-space:nowrap;overflow-wrap:normal;padding:8px 16px}

/* v31: số giao được hé lộ nhờ gợi ý (màn Siêu khó) */
.cell .badge.revealed{color:#1b1b1b;background:#E8BE52;border-radius:6px;padding:2px 4px;top:2px;right:2px;animation:badgePop .35s ease-out}
.cell.found .badge.revealed{color:#1b1b1b}
@keyframes badgePop{0%{transform:scale(.3);opacity:0}70%{transform:scale(1.2)}100%{transform:scale(1);opacity:1}}
@media (prefers-reduced-motion:reduce){.cell .badge.revealed{animation:none}}

/* ================= v35 Phong cách đồ chơi 3D: khối bo tròn, mặt trên sáng, cạnh dưới đậm, bóng mềm ================= */
/* Màu --t-* do scene.js đặt theo vùng đất (cỏ, đá, cát, viền sân…). Bảng chữ, nút, thẻ là những khối kem nổi trên nền cỏ. */
:root:root{
  --t-ground:#B6D957; --t-patch:#C6E46C; --t-accent:#4E9F2E; --t-edge:#357A1C; --t-rim:#F08B3C; --t-rim2:#C4652A; --t-arena:#CDE88A; --t-sand:#EBCD9C;
  --bg:var(--t-ground); --surface:#FFFCF1; --ink:#22321A; --muted:#56664A; --line:rgba(70,60,30,.16);
  --accent:var(--t-accent); --accent-ink:#FFFFFF; --edge:var(--t-edge); --shade:#DCD3B4; --tile:#FFFCF1; --tile-ink:#22321A; --tile-edge:#D8CFAE;
  --block:var(--t-sand); --gap:7px; --sel:#FFC83D;
  --f-display:"Baloo 2","Be Vietnam Pro",system-ui,sans-serif;
  --drop:0 10px 18px rgba(40,50,10,.18);
}
@media (prefers-color-scheme:dark){:root:root:not([data-theme="light"]){
  --bg:color-mix(in srgb,var(--t-ground) 28%,#0C130A); --surface:#28331F; --ink:#EEF5E4; --muted:#ABB99C; --line:rgba(255,255,255,.12);
  --shade:#141B0F; --tile:#334029; --tile-ink:#F2F7EA; --tile-edge:#1B2314; --block:color-mix(in srgb,var(--t-sand) 30%,#14180F); --drop:0 10px 18px rgba(0,0,0,.4)}}
:root:root[data-theme="dark"]{
  --bg:color-mix(in srgb,var(--t-ground) 28%,#0C130A); --surface:#28331F; --ink:#EEF5E4; --muted:#ABB99C; --line:rgba(255,255,255,.12);
  --shade:#141B0F; --tile:#334029; --tile-ink:#F2F7EA; --tile-edge:#1B2314; --block:color-mix(in srgb,var(--t-sand) 30%,#14180F); --drop:0 10px 18px rgba(0,0,0,.4)}
body{background:var(--bg)}
/* phong cảnh: nền cỏ lặp lại + bốn góc đá, cây */
.motif{display:none!important}
.scene{position:fixed;inset:0;z-index:0;pointer-events:none;background-size:240px 240px;overflow:hidden}
.scene .sc{position:absolute;width:min(46vw,230px);aspect-ratio:220/260}
.scene .sc svg{width:100%;height:100%;display:block}
.scene .sc-tl{left:0;top:0}.scene .sc-tr{right:0;top:0}.scene .sc-bl{left:0;bottom:0}.scene .sc-br{right:0;bottom:0}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .scene{filter:brightness(.4) saturate(.85)}}
:root[data-theme="dark"] .scene{filter:brightness(.4) saturate(.85)}
@media (min-width:700px){.scene .sc{width:min(30vw,340px)}}

/* chữ hiển thị: tròn, dày */
h1,.hero h2,.sheet h2,.tour-title,.world-head h3,.chapter-head h3,.topbar .title,.gtitle b,.theme .name,.modal .win h2{font-family:var(--f-display);font-weight:800;font-style:normal;letter-spacing:0}
h1 i{font-style:normal;color:var(--accent)}
.gtitle b{font-size:1.2rem;line-height:1.15}

/* khối kem nổi: thẻ, hàng cài đặt, bảng thông tin */
.card,.hero,.node,.row,.review,.perf,.current,.coach,.world-head,.modal .win,.tour-card,.word .cat,.diffbtn,.packchip{border:none!important;box-shadow:0 5px 0 var(--shade),var(--drop)}
.card,.hero,.node,.row,.review,.current,.coach,.world-head,.packchip{background:var(--surface)}
.card,.hero,.world-head,.review,.modal .win,.tour-card{border-radius:20px}
.perf{box-shadow:inset 0 3px 0 var(--line);background:color-mix(in srgb,var(--shade) 35%,var(--surface))}
.hero{background:var(--surface)}
.hero::before,.world-head::before,.intro-art::before{display:none}
.sheet{background:var(--surface);box-shadow:0 -6px 0 var(--shade),0 -10px 30px rgba(0,0,0,.2)}
.modal .win{background:var(--surface)}
.tour-card{background:var(--surface)}
.current{border-radius:16px}
.current.ok{background:var(--accent);box-shadow:0 5px 0 var(--edge),var(--drop)}
.current.empty{color:var(--muted)}

/* thanh trên: tiêu đề nằm trên bảng gỗ kem để đọc rõ trên nền cảnh */
.topbar{background:var(--surface);border-radius:20px;padding:8px 8px 8px 14px;box-shadow:0 5px 0 var(--shade),var(--drop)}
.topbar h1{font-size:1.55rem;line-height:1}
.chip,.iconbtn{border:none;background:color-mix(in srgb,var(--shade) 45%,var(--surface));box-shadow:inset 0 -3px 0 var(--shade)}
.chip .coin{width:18px;height:18px;background:radial-gradient(circle at 35% 30%,#FFF1B8,#F2B630 55%,#C98A12 100%);box-shadow:inset 0 -2px 0 rgba(0,0,0,.18)}

/* nút: khối bấm lún xuống */
.btn{border:none;border-radius:16px;font-family:var(--f-display);font-weight:800;font-size:1.02rem;background:var(--surface);color:var(--ink);
  box-shadow:0 5px 0 var(--shade),0 8px 12px rgba(0,0,0,.1);transition:transform .08s,box-shadow .08s;position:relative;top:0}
.btn.primary{background:var(--accent);color:var(--accent-ink);box-shadow:0 5px 0 var(--edge),0 8px 14px rgba(0,0,0,.16);text-shadow:0 1px 0 rgba(0,0,0,.18)}
.btn:active:not(:disabled){transform:translateY(4px);box-shadow:0 1px 0 var(--shade)}
.btn.primary:active:not(:disabled){box-shadow:0 1px 0 var(--edge)}
.row .btn,.card .btn{box-shadow:0 4px 0 var(--shade)}
.row .btn.primary{box-shadow:0 4px 0 var(--edge)}
.linkbtn{color:var(--accent);font-family:var(--f-display);font-weight:800}
.hero .btn.primary{background:var(--wa,var(--accent));box-shadow:0 5px 0 var(--wedge,var(--edge)),0 8px 14px rgba(0,0,0,.16)}
.meter{height:10px;border-radius:5px;background:color-mix(in srgb,var(--shade) 70%,transparent);box-shadow:inset 0 2px 0 rgba(0,0,0,.08)}
.meter span{border-radius:5px;background:linear-gradient(var(--accent),var(--edge))}

/* sân chơi: nền cỏ sáng, tường cam bao quanh như sân đấu */
.board{padding:10px;border-radius:22px;background:var(--t-arena);border:7px solid var(--t-rim);
  box-shadow:0 7px 0 var(--t-rim2),0 16px 26px rgba(40,40,10,.25),inset 0 4px 0 rgba(0,0,0,.08)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .board{background:color-mix(in srgb,var(--t-arena) 22%,#11170D);border-color:color-mix(in srgb,var(--t-rim) 75%,#000);box-shadow:0 7px 0 color-mix(in srgb,var(--t-rim2) 60%,#000),0 16px 26px rgba(0,0,0,.45)}}
:root[data-theme="dark"] .board{background:color-mix(in srgb,var(--t-arena) 22%,#11170D);border-color:color-mix(in srgb,var(--t-rim) 75%,#000);box-shadow:0 7px 0 color-mix(in srgb,var(--t-rim2) 60%,#000),0 16px 26px rgba(0,0,0,.45)}
/* ô chữ: khối bo tròn, cạnh dưới đậm; ô đã giải mang màu từ và vẫn giữ cạnh khối */
.cell{border-radius:13px;background:var(--tile);color:var(--tile-ink);
  box-shadow:inset 0 -5px 0 var(--tile-edge),0 3px 0 rgba(0,0,0,.12),0 5px 8px rgba(0,0,0,.12);padding-bottom:4px}
.cell.found{color:#fff;text-shadow:0 2px 0 rgba(0,0,0,.2);box-shadow:inset 0 -5px 0 rgba(0,0,0,.2),0 3px 0 rgba(0,0,0,.15),0 5px 8px rgba(0,0,0,.12)}
.cell.sel{background:var(--sel);color:#3A2600;transform:translateY(3px);box-shadow:inset 0 -2px 0 #D99A12,0 1px 0 rgba(0,0,0,.12)}
.cell.hint{box-shadow:inset 0 -5px 0 var(--tile-edge),0 0 0 3px var(--sel),0 5px 8px rgba(0,0,0,.12)}
.cell .badge{top:4px;right:5px;font-family:var(--f-display);font-weight:800;font-size:.72rem}
/* ô trống trong sân: lối cát lún xuống, liền nhau thành mảng */
.cell.hole{background:var(--block)!important;box-shadow:inset 0 4px 0 rgba(0,0,0,.08);transform:none}
#lines polyline{stroke-opacity:.5}

/* danh sách từ: một tấm bảng kem */
.wordshead{background:var(--surface);border-radius:20px 20px 0 0;padding:12px 14px 6px;margin-bottom:-16px!important;position:relative;z-index:1}
.words{background:var(--surface);border-radius:0 0 20px 20px;padding:8px 14px 14px;box-shadow:0 5px 0 var(--shade),var(--drop)}
.slot{border-radius:8px;border-width:2px;background:color-mix(in srgb,var(--shade) 25%,transparent)}
.slot.rev{border:none;box-shadow:inset 0 -3px 0 rgba(0,0,0,.2);text-shadow:0 1px 0 rgba(0,0,0,.2)}
.word .info{border:none;background:color-mix(in srgb,var(--shade) 45%,var(--surface));box-shadow:inset 0 -2px 0 var(--shade);font-family:var(--f-display);font-weight:800}
.hintrow .btn{background:var(--surface)}

/* bản đồ Hành trình: đá tròn nổi, lối đi bằng cát */
.world-head{background:var(--surface)}
.world-head .wicon{background:var(--wa);color:#fff;border-radius:16px;padding:9px;box-shadow:0 4px 0 var(--wedge,var(--edge));width:52px;height:52px}
.trail path{stroke:var(--t-sand);opacity:1;stroke-width:14;stroke-dasharray:none}
.world.locked .trail path{stroke:color-mix(in srgb,var(--t-sand) 50%,#999)}
.mnode .disc{border:none;background:var(--surface);color:var(--wa);font-family:var(--f-display);font-weight:800;font-size:1.15rem;
  box-shadow:inset 0 -5px 0 var(--shade),0 4px 0 rgba(0,0,0,.15),0 8px 12px rgba(0,0,0,.15)}
.mnode.done .disc{background:var(--wa);color:#fff;text-shadow:0 1px 0 rgba(0,0,0,.2);box-shadow:inset 0 -5px 0 var(--wedge,var(--edge)),0 4px 0 rgba(0,0,0,.15),0 8px 12px rgba(0,0,0,.15)}
.mnode.next .disc{background:var(--sel);color:#3A2600;box-shadow:inset 0 -6px 0 #D99A12,0 0 0 6px rgba(255,255,255,.55),0 8px 14px rgba(0,0,0,.2)}
@keyframes nodePulse{50%{transform:translateY(-4px)}}
.mnode.next .disc{animation:nodePulse 1.4s ease-in-out infinite}
.mnode.locked .disc{background:color-mix(in srgb,var(--surface) 55%,#9AA0A3);color:#7B8286;box-shadow:inset 0 -5px 0 rgba(0,0,0,.15),0 4px 0 rgba(0,0,0,.1)}
.mnode.hard:not(.locked):not(.done):not(.next) .disc,.mnode.superhard:not(.locked):not(.done):not(.next) .disc{border:3px solid var(--hard)}
.mnode.superhard:not(.locked):not(.done):not(.next) .disc{border-color:var(--superhard)}
.mnode.boss .disc{border:4px solid var(--t-rim)!important}
.intro-art{background:var(--wpatch,var(--t-arena));color:var(--wa)}
.hero-art{background:var(--wa,var(--accent));box-shadow:0 5px 0 var(--wedge,var(--edge))}
.hero-prog .meter span{background:linear-gradient(var(--wa,var(--accent)),var(--wedge,var(--edge)))}

/* nhãn, công tắc, thông báo */
.gchip,.mnode .tag,.precord{box-shadow:0 2px 0 rgba(0,0,0,.2);font-family:var(--f-display)}
.switch{box-shadow:inset 0 2px 0 rgba(0,0,0,.12)}
.switch::after{box-shadow:0 2px 0 rgba(0,0,0,.2)}
.toast{border-radius:16px;box-shadow:0 5px 0 rgba(0,0,0,.25);font-family:var(--f-display);font-weight:700}
h3.section,.eyebrow{font-family:var(--f-display);font-weight:800;letter-spacing:.08em}
h3.section{color:var(--ink);text-shadow:0 1px 0 rgba(255,255,255,.35)}
.clock,.wordshead .count{font-family:var(--f-display);font-weight:700}
.note{color:var(--ink)}
@media (prefers-reduced-motion:reduce){.mnode.next .disc{animation:none}.btn{transition:none}}
.word .cat{box-shadow:0 2px 0 var(--shade);background:color-mix(in srgb,var(--shade) 30%,var(--surface))}
.gtitle b{font-size:1.1rem}

/* v36: chỉnh theo góp ý — nút Gợi ý thẳng hàng; tiêu đề có dấu không chồng chữ; ô chữ hoà vào nền, bỏ tường cam */
#hintBtn{display:flex;align-items:center;justify-content:center;gap:10px;line-height:1}
#hintBtn > span,.btn .price{line-height:1;display:inline-flex;align-items:center}
.btn .price{gap:5px;padding:4px 10px 4px 6px;border-radius:999px;background:color-mix(in srgb,var(--shade) 45%,transparent)}
.btn .price .coin-sm{flex:none}
/* Baloo 2 có dấu tiếng Việt cao: chừa đủ khoảng dòng để dấu (Ể, Ỗ…) không chạm dòng trên */
.gtitle{gap:3px}
.gtitle small{line-height:1.35}
.gtitle b{line-height:1.35;padding-top:2px}
h1,.hero h2,.world-head h3,.chapter-head h3,.sheet h2,.tour-title,.modal .win h2,.topbar .title{line-height:1.3}
.topbar h1{line-height:1.3}
/* sân chơi: một mảng cỏ sáng hơn, không viền; ô chữ cùng tông cỏ, cạnh khối xanh đậm */
:root:root{--tile:color-mix(in srgb,var(--t-arena) 38%,#FFFDF0);--tile-edge:color-mix(in srgb,var(--t-fol2) 45%,var(--t-arena));--tile-ink:#2A3B1C}
@media (prefers-color-scheme:dark){:root:root:not([data-theme="light"]){--tile:color-mix(in srgb,var(--t-arena) 16%,#273120);--tile-edge:color-mix(in srgb,var(--t-fol2) 30%,#11170D);--tile-ink:#EEF5E4}}
:root:root[data-theme="dark"]{--tile:color-mix(in srgb,var(--t-arena) 16%,#273120);--tile-edge:color-mix(in srgb,var(--t-fol2) 30%,#11170D);--tile-ink:#EEF5E4}
.board,:root .board{border:none!important;background:color-mix(in srgb,var(--t-arena) 70%,var(--t-ground));border-radius:24px;padding:12px;
  box-shadow:inset 0 3px 0 rgba(0,0,0,.06),0 0 0 1px rgba(0,0,0,.03)!important}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .board{background:color-mix(in srgb,var(--t-arena) 12%,#141B10)}}
:root[data-theme="dark"] .board{background:color-mix(in srgb,var(--t-arena) 12%,#141B10)}
.cell{box-shadow:inset 0 -4px 0 var(--tile-edge),0 2px 0 rgba(0,0,0,.06),0 4px 6px rgba(0,0,0,.06)}
.cell.hint{box-shadow:inset 0 -4px 0 var(--tile-edge),0 0 0 3px var(--sel)}
/* Baloo 2 có khoảng trên/dưới chữ lớn và dấu cao: chỉ dùng cho tiêu đề lớn, đủ khoảng dòng;
   chữ nhỏ cạnh nhau (tiêu đề màn chơi, nút, nhãn) dùng Be Vietnam Pro — font làm cho tiếng Việt, dấu không chồng dòng */
.gtitle b{font-family:var(--f-body);font-weight:800;line-height:1.35;padding-top:0}
.btn,.linkbtn,.gchip,.mnode .tag,.precord,.toast,h3.section,.eyebrow,.clock,.wordshead .count,.word .info,.cell .badge{font-family:var(--f-body)}
.mnode .disc{font-family:var(--f-body)}
h1,.hero h2,.world-head h3,.chapter-head h3,.sheet h2,.tour-title,.modal .win h2,.topbar .title{line-height:1.4}

/* v37: ô bí ẩn — hộp gỗ có dấu "?", mở ra khi giải xong từ đi qua ô này */
.cell.crate{background:
  linear-gradient(90deg,transparent 46%,rgba(90,50,20,.35) 46% 54%,transparent 54%),
  repeating-linear-gradient(180deg,#D49A5C 0 30%,#B97C40 30% 34%),
  #C88B4E !important;
  box-shadow:inset 0 0 0 4px #8E5629,inset 0 -6px 0 #6E3F1C,0 3px 0 rgba(0,0,0,.15),0 5px 8px rgba(0,0,0,.15);color:#FFF3D6}
.cell.crate .q{font-family:var(--f-display);font-weight:800;font-size:1.25em;line-height:1;text-shadow:0 2px 0 #6E3F1C,0 0 6px rgba(0,0,0,.25);
  background:#8E5629;border-radius:50%;width:1.35em;height:1.35em;display:flex;align-items:center;justify-content:center;padding-top:.08em}
.cell.crate.sel{transform:translateY(3px);filter:brightness(1.12)}
.cell.crate-open{animation:crateOpen .6s cubic-bezier(.2,.8,.3,1.3)}
@keyframes crateOpen{0%{transform:scale(.6) rotate(-8deg)}60%{transform:scale(1.15) rotate(3deg)}100%{transform:none}}
@media (prefers-reduced-motion:reduce){.cell.crate-open{animation:none}}

/* v38: chế độ nhà phát triển */
.devnum,.devcode{font:700 1.05rem var(--f-body);color:var(--ink);background:var(--tile);border:none;border-radius:12px;padding:8px 10px;box-shadow:inset 0 2px 0 rgba(0,0,0,.1)}
.devnum{width:84px;flex:0 0 auto;text-align:center}
.devcode{width:100%;letter-spacing:.3em;text-align:center;font-size:1.3rem}

/* v39: từ cuối cùng — cả bàn gợn sóng lan từ ô vừa nối, bàn rung nhẹ */
.cell.wave{animation:tileWave .5s cubic-bezier(.3,1.6,.5,1) var(--wd,0ms) both}
@keyframes tileWave{0%{transform:none}40%{transform:translateY(-9px) scale(1.08);filter:brightness(1.25)}100%{transform:none}}
.board-wrap.shake{animation:boardShake .35s ease-out}
@keyframes boardShake{20%{transform:translate(-3px,1px)}40%{transform:translate(3px,-1px)}60%{transform:translate(-2px,0)}80%{transform:translate(1px,0)}}
@media (prefers-reduced-motion:reduce){.cell.wave,.board-wrap.shake{animation:none}}
/* Sổ từ, huy hiệu */
.card.wide.dim{opacity:.6}
.bookword{display:flex;flex-direction:column;gap:2px;padding:10px 12px;border-radius:14px;background:color-mix(in srgb,var(--shade) 30%,var(--surface));box-shadow:inset 0 -3px 0 var(--shade)}
.bookword b{font-family:var(--f-tile);font-weight:800;letter-spacing:.04em}
.bookword span{color:var(--muted);font-size:.9rem;line-height:1.4}
.card.badge{grid-template-columns:auto 1fr auto}
.card.badge .medal{grid-row:1;font-size:1.7rem;line-height:1;filter:grayscale(1);opacity:.55}
.card.badge.got .medal{filter:none;opacity:1}
.card.badge .meter{grid-column:1/-1}
.card.badge.got .count{color:var(--accent);font-weight:800}
.prow.chest b{color:var(--gold)}
#winShare{background:var(--sel);color:#3A2600;box-shadow:0 5px 0 #D99A12,0 8px 12px rgba(0,0,0,.12)}
.card.badge .medal{grid-column:1;grid-row:1}
.card.badge .txt{grid-column:2;grid-row:1;text-align:left}
.card.badge .count{grid-column:3;grid-row:1}
.card.badge .meter{grid-row:2}
/* v40: ô gợi ý đã thuộc một từ giải trước (ô dùng chung) vẫn có viền vàng */
.cell.found.hint{box-shadow:inset 0 -5px 0 rgba(0,0,0,.2),0 0 0 3px var(--sel),0 5px 8px rgba(0,0,0,.12)}

/* v42: Thác chữ — chữ đổ theo hàng, kéo thẳng ngang/dọc để nối từ; thác chậm lại khi đang kéo */
.card.rush .ico{font-size:1.35rem;background:color-mix(in srgb,var(--w3) 22%,transparent);color:var(--w3)}
.card.rush .streak{color:var(--w3)}
.rush-hud{display:flex;align-items:center;gap:10px;margin:2px 0 8px;padding:8px 14px;border-radius:16px;background:var(--surface);box-shadow:0 4px 0 var(--shade),var(--drop)}
.rush-time{flex:1;height:12px;border-radius:99px;background:color-mix(in srgb,var(--shade) 60%,transparent);overflow:hidden;box-shadow:inset 0 2px 0 rgba(0,0,0,.08)}
.rush-time span{display:block;height:100%;width:100%;border-radius:99px;background:var(--accent);transition:width .1s linear}
.rush-time.low span{background:var(--w2)}
.rush-sec{font-family:var(--f-body);font-weight:800;font-size:1.25rem;min-width:2ch;text-align:right;font-variant-numeric:tabular-nums}
.rush-time.low + .rush-sec{color:var(--w2)}
.rush-score{font-family:var(--f-body);font-weight:700;font-size:.9rem;color:var(--muted);white-space:nowrap;min-width:5.5ch;text-align:right}
.rush-wrap{position:relative;touch-action:none;user-select:none;-webkit-user-select:none;border-radius:24px;padding:8px;
  background:color-mix(in srgb,var(--t-arena,#CFE6A8) 70%,var(--t-ground,#9CC86A));box-shadow:inset 0 3px 0 rgba(0,0,0,.06);transition:filter .25s}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .rush-wrap{background:color-mix(in srgb,var(--t-arena,#CFE6A8) 12%,#141B10)}}
:root[data-theme="dark"] .rush-wrap{background:color-mix(in srgb,var(--t-arena,#CFE6A8) 12%,#141B10)}
.rush-field{position:relative;width:100%;aspect-ratio:7/8;overflow:hidden;border-radius:16px;touch-action:none;
  -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 18px,#000 calc(100% - 10px),transparent 100%);mask-image:linear-gradient(to bottom,transparent 0,#000 18px,#000 calc(100% - 10px),transparent 100%)}
.rush-wrap.slow{filter:saturate(.8) brightness(1.03)}
.rush-wrap.slow::after{content:"";position:absolute;inset:0;border-radius:24px;box-shadow:inset 0 0 0 3px color-mix(in srgb,var(--sel) 70%,transparent);pointer-events:none}
.cell.rtile{position:absolute;left:0;top:0;width:calc(var(--rh,48px) - 6px);height:calc(var(--rh,48px) - 6px);margin:3px;aspect-ratio:auto;
  font-size:calc(var(--rh,48px) * .44);border-radius:11px;transition:background .12s,color .12s;will-change:transform;cursor:pointer}
.cell.rtile.sel{transform:none}
.cell.rtile.rpop{background:var(--wc,var(--accent));color:#fff;animation:rpop .42s cubic-bezier(.3,1.5,.5,1) both;pointer-events:none}
@keyframes rpop{0%{scale:1}35%{scale:1.18}100%{scale:.2;opacity:0}}
@media (prefers-reduced-motion:reduce){.cell.rtile.rpop{animation:none;opacity:0}}
.rush-intro{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:16px;border-radius:24px;background:color-mix(in srgb,var(--bg) 55%,transparent);backdrop-filter:blur(2px)}
.rush-card{background:var(--surface);border-radius:20px;padding:18px 18px 14px;max-width:320px;display:flex;flex-direction:column;gap:8px;box-shadow:0 5px 0 var(--shade),var(--drop)}
.rush-card b{font-family:var(--f-display);font-size:1.4rem;line-height:1.4}
.rush-card ul{margin:0;padding-left:1.1em;display:flex;flex-direction:column;gap:4px;font-size:.92rem;line-height:1.4}
.rush-card small{color:var(--muted);font-weight:600}
.rush-card small:empty{display:none}
.rush-found{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px;min-height:30px}
.rush-found.end{justify-content:center;max-height:150px;overflow:auto;margin:4px 0 10px}
.rchip{padding:4px 10px;border-radius:99px;background:var(--wc,var(--accent));color:#fff;font-family:var(--f-body);font-weight:700;font-size:.82rem;
  box-shadow:inset 0 -3px 0 rgba(0,0,0,.18);animation:badgePop .3s ease-out;white-space:nowrap}
.rush-note{display:block;color:var(--muted);margin-bottom:8px;line-height:1.35}
.rush-note:empty{display:none}
#rushCur.dup{color:var(--muted)}
/* v43: Thác chữ — đường nối gấp khúc, chọn tốc độ, màn trong Hành trình */
.rush-wrap .rush-line{position:absolute;left:8px;top:8px;width:calc(100% - 16px);height:calc(100% - 16px);pointer-events:none;overflow:visible;z-index:2}
.rush-line polyline{fill:none;stroke:var(--sel);stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-opacity:.55}
.rush-tag{font-family:var(--f-body);font-weight:800;font-size:.8rem;padding:2px 8px;border-radius:99px;background:color-mix(in srgb,var(--w3) 18%,transparent);color:var(--w3)}
.rush-score{display:flex;flex-direction:column;align-items:flex-end;line-height:1.15}
.rush-coins{display:flex;align-items:center;gap:3px;font-size:.75rem;color:var(--w5);font-weight:800}
.rspeed-lbl{font-family:var(--f-body);font-weight:700;font-size:.8rem;color:var(--muted);margin-top:2px}
.rspeeds{display:flex;gap:8px}
.rspeed{flex:1;display:flex;flex-direction:column;align-items:center;gap:1px;padding:8px 4px;border-radius:14px;border:2px solid var(--line);background:var(--surface);color:var(--ink);font:inherit;cursor:pointer;min-width:0}
.rspeed b{font-family:var(--f-body);font-size:1.1rem;line-height:1.2}
.rspeed small{font-size:.72rem;color:var(--muted);white-space:nowrap}
.rspeed.on{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 14%,var(--surface))}
.rspeed:disabled{cursor:default;opacity:1}
.mnode.rush:not(.locked):not(.done):not(.next) .disc{border:3px solid var(--w3);color:var(--w3)}
.mnode.rush .tag{background:var(--w3);color:#fff}
#rushEnd .winstars{margin-bottom:4px}
/* v44: Thác chữ — giây thưởng: thanh thời gian loé xanh */
.rush-time.plus{animation:rushPlus .7s ease-out}
@keyframes rushPlus{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--accent) 80%,transparent)}40%{box-shadow:0 0 0 6px color-mix(in srgb,var(--accent) 35%,transparent)}100%{box-shadow:0 0 0 0 transparent}}
@media (prefers-reduced-motion:reduce){.rush-time.plus{animation:none}}
/* v45: Thác chữ — màu hỗn loạn, tốc độ ×4 */
.cell.rtile.chaos{background:var(--rc);color:var(--rci);box-shadow:inset 0 -4px 0 color-mix(in srgb,var(--rc) 65%,#000),0 2px 0 rgba(0,0,0,.08);transition:background .45s,color .45s}
.cell.rtile.chaos.sel{background:var(--sel);color:#3A2600;outline:3px solid #fff;outline-offset:-3px;transition:none}
.cell.rtile.chaos.rpop{background:var(--wc,var(--accent));color:#fff}
.rspeeds .rspeed{padding:8px 2px}
.rchaos{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:14px;border:2px solid var(--line);background:var(--surface);color:var(--ink);font:inherit;text-align:left;cursor:pointer}
.rchaos .sw{display:grid;grid-template-columns:1fr 1fr;gap:2px;width:26px;height:26px;flex:0 0 auto}
.rchaos .sw i{border-radius:4px}
.rchaos .sw i:nth-child(1){background:#E8534A}.rchaos .sw i:nth-child(2){background:#4B8FE0}.rchaos .sw i:nth-child(3){background:#F4D348}.rchaos .sw i:nth-child(4){background:#8E6BD8}
.rchaos .txt{flex:1;display:flex;flex-direction:column;min-width:0;line-height:1.25}
.rchaos b{font-family:var(--f-body);font-size:.92rem}
.rchaos small{font-size:.74rem;color:var(--muted)}
.rchaos .tg{flex:0 0 auto;width:38px;height:22px;border-radius:99px;background:var(--line);position:relative;transition:background .2s}
.rchaos .tg::after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#fff;transition:transform .2s;box-shadow:0 1px 2px rgba(0,0,0,.2)}
.rchaos.on{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,var(--surface))}
.rchaos.on .tg{background:var(--accent)}
.rchaos.on .tg::after{transform:translateX(16px)}
.rchaos:disabled{cursor:default}
.rchaos:disabled .tg{display:none}
.rush-coins{color:var(--w5)}
.rush-intro{overflow:auto;align-items:safe center}
.rush-card{gap:6px;padding:16px 16px 12px}
.rush-card ul{font-size:.88rem;gap:3px}
.rush-intro{overflow:visible;bottom:auto;min-height:100%;z-index:5;align-items:flex-start;padding-top:12px}
/* v47: màn chơi vừa một màn hình điện thoại — danh sách từ xếp nhiều từ một dòng, bàn chơi tự co (fitBoard trong game.js) */
#scrGame{gap:10px}
#scrGame .board-wrap{margin-inline:auto;width:100%}
.words{flex-direction:row;flex-wrap:wrap;gap:8px 18px;align-items:center;padding:8px 14px 12px}
.word{flex:0 1 auto;flex-wrap:wrap;gap:6px;min-height:28px;max-width:100%}
.word .slots{flex:0 1 auto;gap:3px}
.word .slot{min-width:22px;height:26px;font-size:.85rem;padding:0 2px;border-radius:6px}
.word .meta{margin-left:0;gap:4px}
.word .info{width:22px;height:22px;font-size:.72rem}
.word .cat{font-size:.68rem;padding:1px 7px}
.wordshead{padding:10px 14px 4px}
#scrGame .current{min-height:40px}
#scrRush .rush-wrap{margin-inline:auto;width:100%}
#scrRush{gap:10px}
/* ô nhỏ (màn hẹp) không bị tròn: bo góc theo cỡ ô */
.board .cell{border-radius:clamp(8px,24%,13px)}
/* thẻ giới thiệu Thác chữ: hộp nổi giữa màn hình, luôn nằm gọn trong màn hình (không phải kéo) */
.rush-intro{position:fixed;inset:0;min-height:0;z-index:30;align-items:center;justify-content:center;padding:12px;border-radius:0;
  background:color-mix(in srgb,var(--bg) 45%,transparent);backdrop-filter:blur(3px)}
.rush-card{max-height:calc(100dvh - 24px);overflow:auto;width:100%;max-width:360px}
@media (max-height:720px){
  .rush-card{gap:5px;padding:14px 14px 12px}
  .rush-card b{font-size:1.2rem}
  .rush-card ul{font-size:.82rem;gap:2px;line-height:1.35}
  .rspeed{padding:5px 2px}
  .rspeed b{font-size:1rem}
  .rchaos{padding:6px 8px}
}
.rush-card .rchaos b{font-family:var(--f-body);font-size:.92rem;line-height:1.3}
.rush-card .rspeed b{font-family:var(--f-body);font-size:1.05rem;line-height:1.2}
.word .slot.wpill{min-width:0;padding:0 10px;letter-spacing:.04em;white-space:nowrap;color:#fff;border-radius:99px}
.word .slot.wpill{height:26px;font-size:.8rem;padding:0 9px}
/* khung xem lại gọn để vừa màn hình */
#scrGame .review{padding:10px 14px;gap:6px}
#scrGame .review .rv-top{gap:8px}
#scrGame .review .rv-top b{font-size:.98rem}
#scrGame .review .rvstars i{width:20px;height:20px}
#scrGame .review p{margin:0;font-size:.8rem;line-height:1.3}
#scrGame .review .rv-btns{gap:8px}
#scrGame .review .rv-btns .btn{padding-top:9px;padding-bottom:9px;min-height:0}
/* v48: phần tử con trong ô (dấu ? hộp gỗ, số giao) không bắt chạm — kéo qua hộp gỗ được */
.cell > *{pointer-events:none}
/* v50: cỡ chữ theo cỡ ô (không theo bề rộng màn hình) — khi bàn chơi co nhỏ, chữ có dấu (Ộ, Ỡ, Ẩ…) không bị cắt,
   số giao không đè lên chữ. --cell = bề rộng một ô, tính từ bề rộng bàn chơi (container query units). */
.board{container-type:inline-size}
.board .cell{--cell:calc((100cqw - (var(--cols, 6) - 1) * var(--gap, 7px)) / var(--cols, 6));
  font-size:calc(var(--cell) * .46);line-height:1;padding-top:0;padding-bottom:calc(var(--cell) * .07)}
.board .cell.multi{font-size:calc(var(--cell) * .36)}
.board .cell .badge{font-size:calc(var(--cell) * .2);top:calc(var(--cell) * .06);right:calc(var(--cell) * .08)}
.board .cell.crate .q{font-size:1.15em}
/* màn trộn chủ đề: nhãn chủ đề nhỏ nằm trên các ô chữ → mỗi từ hẹp lại, xếp được nhiều từ một dòng */
.word.hascat{flex-direction:column;align-items:flex-start;gap:2px;flex-wrap:nowrap}
.word.hascat .meta{order:-1}
.word.hascat .cat{font-size:.64rem;padding:0 6px;box-shadow:none;line-height:1.5}
.board .cell{font-size:calc(var(--cell) * .6);padding-bottom:calc(var(--cell) * .08)}
.board .cell.multi{font-size:calc(var(--cell) * .45)}
.board .cell .badge{font-size:max(8px, calc(var(--cell) * .24));top:calc(var(--cell) * .05);right:calc(var(--cell) * .07)}
/* ô trống trong danh sách từ: nhỏ gọn (chỉ để biết độ dài từ) */
.word .slots{gap:2px}
.word .slot:not(.wpill){min-width:17px;height:22px;padding:0 1px;border-radius:5px;border-width:1.5px;font-size:.78rem}
.words{gap:6px 14px}
.word{box-sizing:border-box}
/* v51: chữ hai dấu chồng (Ẳ, Ẩ, Ấ, Ẫ, Ế, Ổ…) cao hơn chữ thường: thu nhỏ và hạ thấp để dấu trên cùng không chạm/tràn mép ô */
.board .cell.tall{font-size:calc(var(--cell) * .5);padding-top:calc(var(--cell) * .12);padding-bottom:0}
.board .cell.multi.tall{font-size:calc(var(--cell) * .4)}
.cell.rtile.tall{font-size:calc(var(--rh,48px) * .37);padding-top:calc(var(--rh,48px) * .1)}
/* v52: tiêu đề màn chơi — nhãn độ khó lên dòng nhỏ phía trên; tên chủ đề có cả dòng riêng, không ngắt giữa từ, tối đa 2 dòng */
.gtitle .gsub{display:flex;align-items:center;gap:6px;min-width:0}
.gtitle .gsub small{flex:0 1 auto;min-width:0}
.gtitle .gsub .gchip{flex:0 0 auto;font-size:.62rem;padding:1px 7px;line-height:1.4}
.gtitle b#themeName{overflow-wrap:normal;word-break:normal;hyphens:none;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:1.05rem;line-height:1.3}
.gtitle b#themeName{-webkit-line-clamp:unset;display:block}
/* nhãn độ khó trong dòng nhỏ: chữ màu, không phải viên thuốc */
.gtitle .gsub .gchip{background:none!important;padding:0;font-size:.7rem;letter-spacing:.05em;color:var(--hard);box-shadow:none}
.gtitle .gsub .gchip.superhard{color:var(--superhard)}
.gtitle .gsub .gchip::before{content:"·";color:var(--muted);margin-right:6px;font-weight:700}
/* v55: nhãn cấp Khó/Siêu khó trong Thác chữ */
.rush-card .rtitle{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.rush-card .rgrade{font-size:.68rem}
.rush-tag.tough{background:color-mix(in srgb,var(--superhard) 16%,transparent);color:var(--superhard)}
/* v56: ô chữ — mọi chữ CÙNG cỡ và CÙNG đường chân chữ (như chữ in), có dấu hay không.
   Chân chữ đặt ở 68% chiều cao ô; phía trên đủ chỗ cho dấu chồng cao nhất (Ẳ, Ẫ ≈ 1,15em trên chân chữ),
   phía dưới đủ chỗ cho dấu nặng (Ộ, Ụ). Cỡ chữ 0,52 × ô. Bỏ cách thu nhỏ riêng chữ hai dấu (.tall).
   Số học (font Bitter: ascent 0,935 / descent 0,265 em; line-height 1 → chân chữ cách đỉnh dòng 0,835em):
   padding-top = 0,68·ô − 0,835·0,52·ô ≈ 0,246·ô. */
.board .cell, .board .cell.tall{
  font-size:calc(var(--cell) * .52); line-height:1;
  align-items:flex-start; padding:calc(var(--cell) * .246) 0 0;
}
.board .cell.multi, .board .cell.multi.tall{font-size:calc(var(--cell) * .4); padding-top:calc(var(--cell) * .3)}
.board .cell.crate{align-items:center;padding:0 0 calc(var(--cell) * .06)}
/* Thác chữ: cùng nguyên tắc, tính theo cỡ viên chữ (--rh − 6px) */
.cell.rtile, .cell.rtile.tall{
  --t:calc(var(--rh, 48px) - 6px);
  font-size:calc(var(--t) * .52); line-height:1; align-items:flex-start; padding:calc(var(--t) * .246) 0 0;
}
/* v56: danh sách từ gọn khi màn hình quá thấp (fitBoard thêm lớp .tight) */
.words.tight{gap:4px 12px;padding-top:6px;padding-bottom:8px}
.words.tight .word.hascat{flex-direction:row;align-items:center;gap:6px}
.words.tight .word.hascat .cat{max-width:40%;overflow:hidden;text-overflow:ellipsis}
.words.tight .word .slot{height:22px;min-width:19px;font-size:.78rem}
.words.tight .word.hascat .meta{flex:0 0 auto;max-width:9.5em}
.words.tight .word.hascat .cat{max-width:9.5em}
/* ===== v57: Thác chữ thành một dòng thác thật ===== */
/* khung = vách đá (khối đồ chơi), lòng khung = dòng nước chảy; chữ là các khối gỗ nổi trôi theo nước */
.rush-wrap{--w-top:#5CC0EA;--w-bot:#2A78B4;--w-edge:#1F5F94;--stone:#A3ADB2;--stone-d:#7D878C;
  background:linear-gradient(180deg,#B9C2C6,var(--stone) 30%,var(--stone-d));box-shadow:0 5px 0 #6A7378,var(--drop),inset 0 2px 0 rgba(255,255,255,.35)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .rush-wrap{--w-top:#2D7FAE;--w-bot:#14405F;--w-edge:#0E2F47;--stone:#59636A;--stone-d:#434C52;
  background:linear-gradient(180deg,#6A747A,var(--stone) 30%,var(--stone-d));box-shadow:0 5px 0 #2E353A,var(--drop)}}
:root[data-theme="dark"] .rush-wrap{--w-top:#2D7FAE;--w-bot:#14405F;--w-edge:#0E2F47;--stone:#59636A;--stone-d:#434C52;
  background:linear-gradient(180deg,#6A747A,var(--stone) 30%,var(--stone-d));box-shadow:0 5px 0 #2E353A,var(--drop)}
.rush-field{-webkit-mask-image:none;mask-image:none;border-radius:14px;
  background:linear-gradient(90deg,var(--w-edge) 0,transparent 14%,transparent 86%,var(--w-edge) 100%),linear-gradient(180deg,var(--w-top),var(--w-bot));
  box-shadow:inset 0 3px 6px rgba(0,0,0,.25)}
.rwater{position:absolute;left:0;right:0;top:0;height:calc(100% + 320px);background-repeat:repeat;background-size:160px 320px;pointer-events:none;will-change:transform}
.rwater.w1{opacity:.9}
.rwater.w2{opacity:.85;background-position:57px 0}
/* gờ thác: nước tràn qua mép đá, sáng bọt trắng */
.rlip{position:absolute;left:0;right:0;top:0;height:22px;z-index:1;pointer-events:none;
  background:linear-gradient(180deg,rgba(235,250,255,.95) 0,rgba(210,242,255,.6) 30%,rgba(210,242,255,0) 100%)}
/* chân thác: bọt trắng sủi lên, chữ lao vào bọt rồi biến mất */
.rfoam{position:absolute;left:-10px;right:-10px;bottom:0;height:calc(var(--rh,48px) * .42);z-index:1;pointer-events:none;
  background:radial-gradient(circle at 10px 70%,#fff 0 7px,transparent 8px) 0 0/28px 100% repeat-x,
             radial-gradient(circle at 6px 85%,rgba(255,255,255,.9) 0 9px,transparent 10px) 13px 0/34px 100% repeat-x,
             linear-gradient(180deg,rgba(255,255,255,0),rgba(240,250,255,.92) 75%);
  animation:rfoam 1.4s linear infinite}
.rfoam::before{content:"";position:absolute;inset:-14px 0 40% 0;
  background:radial-gradient(circle,rgba(255,255,255,.75) 0 2px,transparent 3px) 0 0/22px 14px,radial-gradient(circle,rgba(255,255,255,.5) 0 1.5px,transparent 2.5px) 9px 5px/17px 11px;
  animation:rspray 1.1s linear infinite}
@keyframes rfoam{to{background-position:28px 0,-21px 0,0 0}}
@keyframes rspray{0%{transform:translateY(8px);opacity:0}30%{opacity:1}100%{transform:translateY(-10px);opacity:0}}
@media (prefers-reduced-motion:reduce){.rfoam,.rfoam::before{animation:none}}
/* khối chữ nổi: kem sáng, viền dưới hơi lạnh, bóng đổ xuống nước để tách khỏi nền */
.cell.rtile{background:#FFF9EA;color:#22321A;
  box-shadow:inset 0 -4px 0 #CBD7DC,0 3px 0 rgba(8,40,70,.28),0 7px 10px rgba(5,30,60,.35);transition:background .12s,color .12s}
.cell.rtile.sel{background:var(--sel);color:#3A2600;box-shadow:inset 0 -4px 0 color-mix(in srgb,var(--sel) 70%,#000),0 0 0 3px #fff,0 6px 12px rgba(5,30,60,.45);z-index:2}
/* màu hỗn loạn: mỗi khối có viền sáng + bóng đậm, luôn tách khỏi nước và khỏi khối bên cạnh dù trùng màu */
.cell.rtile.chaos{box-shadow:inset 0 -4px 0 color-mix(in srgb,var(--rc) 62%,#000),0 0 0 2px rgba(255,255,255,.9),0 7px 10px rgba(5,30,60,.45)}
.cell.rtile.chaos.sel{background:var(--sel);color:#3A2600;box-shadow:inset 0 -4px 0 color-mix(in srgb,var(--sel) 70%,#000),0 0 0 3px #fff,0 0 0 6px #22321A,0 6px 12px rgba(5,30,60,.45);outline:none}
.rush-wrap.slow{filter:none}
.rush-wrap.slow .rwater{opacity:.6}
.rchaos .sw i:nth-child(2){background:#D85BA8}
.cell.rtile,.cell.rtile.tall{--t:calc(var(--rh,48px) * .82);width:var(--t);height:var(--t);margin:calc(var(--rh,48px) * .09);border-radius:calc(var(--t) * .24)}
.rwater.w1{opacity:1}
.rwater.w2{opacity:1}
/* v61: lưới lớn và màn hình chật */
.board-wrap.dense .board{--gap:4px;padding:8px}
.board-wrap.dense .board .cell{--gap:4px}
#scrGame.compact .current{min-height:32px;padding:3px 10px}
#scrGame.compact .words{padding-top:4px;padding-bottom:6px;gap:3px 10px}
#scrGame.compact .words .word .slot{height:19px;min-width:16px;font-size:.72rem}
#scrGame.compact .words .word .cat{font-size:.6rem}
/* danh sách gọn mức 2: lưới 2 cột, nhãn chủ đề nhỏ nằm trên ô, từ dài chiếm cả dòng */
#scrGame.compact .words{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}
#scrGame.compact .words > .word{min-width:0!important;flex-direction:column;align-items:flex-start;gap:1px}
#scrGame.compact .words > .word.long{grid-column:1/-1}
#scrGame.compact .words > .word .slots{flex-wrap:nowrap;gap:2px}
#scrGame.compact .words > .word.hascat .meta{order:-1;max-width:100%}
#scrGame.compact .words > .word.hascat .cat{max-width:100%;padding:0 5px;line-height:1.35}
#scrGame.compact .words .word .slot:not(.wpill){min-width:0;width:15px}
#scrGame.compact .words{row-gap:3px!important;padding-top:2px}
#scrGame.compact .words > .word.hascat .cat{font-size:.58rem;line-height:1.15;padding:0 4px;box-shadow:none}
#scrGame.compact .words .word .wpill{height:20px;font-size:.72rem;padding:0 7px;line-height:20px}
#scrGame.compact .words .word .info{width:20px;height:20px;min-width:20px;font-size:.7rem}
#scrGame.compact .words > .word{flex-direction:row;flex-wrap:wrap;align-items:center}
#scrGame.compact .words > .word.hascat{flex-direction:column;align-items:flex-start}
#scrGame.compact .topbar{padding-top:4px;padding-bottom:4px}
#scrGame.compact .topbar .iconbtn{width:40px;height:40px}
#scrGame.compact .hintrow .btn{padding-top:6px;padding-bottom:6px;min-height:0}
#scrGame.compact .wordshead{padding:6px 14px 2px}
#scrGame.compact .words{padding-top:13px!important}
#scrGame.compact .current{min-height:28px;padding:2px 10px}
#scrGame.compact .words .word .slot{height:18px}
/* v62: thanh tiêu đề (nút quay lại) luôn dính ở mép trên khi cuộn danh sách dài (Hành trình, gói chủ đề…) */
.screen > .topbar{position:sticky;top:max(8px, env(safe-area-inset-top, 0px));z-index:30}
/* ===== v64: lưới phẳng kiểu E3 =====
   Một tấm liền (nền đặt trên .board-wrap, khung gỗ theo màu vùng đất), các ô không còn là khối riêng mà cách nhau bằng vạch mờ.
   Từ đã tìm: dải màu rực bo tròn chạy qua các ô (SVG #lines nằm giữa nền tấm và chữ), chữ đen đậm, mũi tên hướng đọc, huy hiệu chữ đầu. */
:root{--k1:#FF7452;--k2:#22C3A6;--k3:#A38BFF;--k4:#5BA3F5;--k5:#F276C0;--k6:#7BCB4E;--grid-line:rgba(80,70,40,.16)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--grid-line:rgba(255,255,255,.12)}}
:root[data-theme="dark"]{--grid-line:rgba(255,255,255,.12)}
.board-wrap.flat{background:var(--tile);border-radius:22px;border:5px solid color-mix(in srgb,var(--t-rim,#B8763A) 45%,#5B4632);
  box-shadow:0 6px 0 color-mix(in srgb,var(--t-rim2,#8E5626) 45%,#3E2F1F),0 12px 20px rgba(40,50,20,.2);overflow:hidden;box-sizing:border-box}
.board-wrap.flat .board.flat,.board-wrap.dense .board.flat,:root .board.flat{--gap:0px;gap:0!important;padding:0!important;background:transparent!important;border:none!important;
  border-radius:0!important;box-shadow:none!important}
.board.flat .cell{border-radius:0!important;box-shadow:none!important;transform:none!important;color:var(--tile-ink);text-shadow:none}
.board.flat .cell.found{color:#141414;font-weight:800}
.board.flat .cell.sel{color:#3A2600}
.board.flat .cell.found .badge{color:rgba(20,20,20,.75)}
.board.flat .cell.hint{box-shadow:inset 0 0 0 3px var(--sel)!important}
.board.flat .cell.hole{background:repeating-linear-gradient(135deg,color-mix(in srgb,var(--block) 92%,#000) 0 6px,color-mix(in srgb,var(--block) 82%,#000) 6px 12px)!important;
  box-shadow:inset 0 4px 0 rgba(0,0,0,.12)!important}
.board.flat .cell.crate{background:#B57A45!important;box-shadow:inset 0 0 0 3px #8A5530,inset 0 -5px 0 #8A5530!important}
.board-wrap.flat svg.lines{z-index:0}
.board-wrap.flat .board.flat{position:relative;z-index:1}
/* thắng màn: cả tấm nảy nhẹ (không nghiêng riêng lớp chữ, để chữ không lệch khỏi dải màu) */
.board-wrap.flat.win3d .board{animation:none}
.board-wrap.flat.win3d{animation:flatWin .7s cubic-bezier(.3,1.5,.5,1)}
@keyframes flatWin{0%{transform:scale(1)}35%{transform:scale(1.035)}100%{transform:scale(1)}}
@media (prefers-reduced-motion:reduce){.board-wrap.flat.win3d{animation:none}}
/* nhãn từ đã tìm trong danh sách: màu rực, chữ đen */
.word .slot.wpill,.slot.rev{color:#141414;text-shadow:none}
.board-wrap.flat #lines polyline{stroke-opacity:1}
.word .slot.wpill,.words .word .slot.wpill,.slot.rev{color:#141414!important;text-shadow:none!important}
/* v65: lớp dải màu phủ khít bàn chơi (vẽ theo đơn vị ô); góc tấm lưới vuông vắn — ô ở góc không bị cắt cong */
.board-wrap.flat{border-radius:10px}
.board-wrap.flat svg.lines{inset:0;width:100%;height:100%;overflow:hidden}
.board.flat{display:grid;grid-auto-rows:1fr}
.board.flat .cell{aspect-ratio:1;width:100%;max-width:none;margin:0;min-width:0}

/* ===== v66: bỏ E3 — lưới phẳng giữ nguyên (ô liền kề, vạch mờ), quay lại bộ màu cũ =====
   Ô đã tìm tô kín màu từ (--w1…--w6), chữ trắng; ô đang chọn tô kín vàng; ô gợi ý viền vàng đủ 4 cạnh.
   Lớp SVG #lines nằm TRÊN ô (vạch mờ, mũi tên nhỏ, chấm chữ đầu) và không bắt chạm. */
.board-wrap.flat svg.lines{z-index:2;pointer-events:none}
.board.flat .cell{background-color:transparent}
.board.flat .cell:not(.found):not(.hole):not(.crate):not(.sel){background:transparent!important}
.board.flat .cell.found{color:#fff!important;font-weight:800;text-shadow:0 1px 2px rgba(0,0,0,.28)}
.board.flat .cell.found .badge{color:rgba(255,255,255,.92)}
.board.flat .cell.sel{background:var(--sel)!important;color:#3A2600!important;text-shadow:none}
.board.flat .cell.hint{box-shadow:inset 0 0 0 3px #FFC83D!important}
.board.flat .cell.hole{background:var(--block)!important;box-shadow:inset 0 3px 0 rgba(0,0,0,.08)!important}
.word .slot.wpill,.words .word .slot.wpill,.slot.rev{color:#fff!important;text-shadow:0 1px 2px rgba(0,0,0,.25)!important}
/* giải xong một từ: loé sáng nhanh (không xoay, không thả sao) */
.board.flat .cell.glow{animation:wordGlow .48s ease-out}
@keyframes wordGlow{0%{filter:brightness(1)}25%{filter:brightness(1.45) saturate(1.1)}100%{filter:brightness(1)}}
@media (prefers-reduced-motion:reduce){.board.flat .cell.glow{animation:none}}
/* v67: số giao trong ô lùi vào trong viền nét đứt; ô đã đủ từ đi qua thì ẩn số (không cần nữa) */
.board.flat .cell .badge{top:calc(var(--cell,48px)*.12);right:calc(var(--cell,48px)*.13)}
.board.flat .cell .badge.revealed{top:calc(var(--cell,48px)*.1);right:calc(var(--cell,48px)*.11)}
.board.flat .cell.full .badge{display:none}
/* ===== v70: lưới lớn trên máy thấp — làm gọn phần còn lại thay vì thu nhỏ lưới (game.js setLean / fitBoard stage) =====
   Thanh chữ đang kéo nổi đè lên thanh tiêu đề (ẩn khi trống); nút Gợi ý thành nút nhỏ cạnh số từ. */
#scrGame.lean > .topbar{position:sticky}
#scrGame.lean .topbar .current{position:absolute;inset:4px 4px;z-index:5;min-height:0;height:auto;margin:0;border-radius:16px;
  display:flex;align-items:center;justify-content:center;font-size:1.45rem;padding:0 12px;pointer-events:none;
  background:var(--surface);box-shadow:0 4px 0 var(--edge,rgba(0,0,0,.12)),0 8px 18px rgba(0,0,0,.18)}
#scrGame.lean .topbar .current.empty{display:none}
#scrGame.lean .topbar .current.ok{background:var(--accent);color:var(--accent-ink)}
#scrGame.lean .wordshead{align-items:center}
#scrGame.lean .wordshead .hintrow{display:flex;flex:none;order:3;margin-left:2px}
#scrGame.lean .wordshead .hintrow[hidden]{display:none}
#scrGame.lean .wordshead .hintrow .btn{flex:none;min-height:0;height:34px;padding:0 10px 0 12px;font-size:.88rem;border-radius:999px;gap:6px;
  letter-spacing:0;text-transform:none;color:var(--ink,inherit);box-shadow:0 3px 0 var(--edge,rgba(0,0,0,.12))}
#scrGame.lean .wordshead .hintrow .btn span{font-size:inherit;letter-spacing:0;text-transform:none;color:inherit;font-weight:700}
#scrGame.lean .wordshead .hintrow .price{padding:2px 8px}
/* ===== v72: ô dạng nút N5 (bảng thiết kế "Nối Chữ – phương án ô chữ") =====
   Nút ngà dính liền nhau (không khe), không lộ thân dưới: chỉ vát nhẹ trong mép ô + bóng mờ. Chữ đen ở mọi trạng thái.
   Đã chọn: tô kín màu từ (--w1…--w6, độ đậm như N2); ô giao chia chéo hai màu; đang kéo: vàng, hơi lún; gợi ý: viền vàng 4 cạnh.
   Ô trống: lộ nền khay. Bỏ vạch kẻ lưới (các nút tự phân ô). */
:root{--tray:#D8CCAE;--nut:#FFF8EA;--nut-ink:#1F1A14;--nut-sel:#FFD45C;
  --nut-bevel:inset 0 2px 2px rgba(255,255,255,.6),inset 0 -3px 3px rgba(90,60,20,.22),inset 2px 0 2px rgba(255,255,255,.25),inset -2px 0 2px rgba(90,60,20,.12),0 1px 2px rgba(40,30,10,.25)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--tray:#3A3325}}
:root[data-theme="dark"]{--tray:#3A3325}
.board-wrap.flat{background:var(--tray);padding:4px}
.board-wrap.flat svg.lines{inset:4px;width:calc(100% - 8px);height:calc(100% - 8px)}
.board.flat .cell{border-radius:16%!important;box-shadow:var(--nut-bevel)!important;color:var(--nut-ink)!important;text-shadow:none!important}
.board.flat .cell:not(.found):not(.hole):not(.crate):not(.sel){background:var(--nut)!important}
.board.flat .cell.found{color:var(--nut-ink)!important;text-shadow:none!important}
.board.flat .cell.found .badge,.board.flat .cell .badge{color:rgba(31,26,20,.7)}
.board.flat .cell.sel{background:var(--nut-sel)!important;color:var(--nut-ink)!important;transform:scale(.95)!important;
  box-shadow:inset 0 2px 4px rgba(150,100,0,.35),inset 0 -2px 2px rgba(255,255,255,.35)!important}
.board.flat .cell.hint{box-shadow:inset 0 0 0 3px #F2B705,var(--nut-bevel)!important}
.board.flat .cell.hole{background:transparent!important;box-shadow:none!important}
.board.flat .cell.crate{border-radius:16%!important}
.word .slot.wpill,.words .word .slot.wpill,.slot.rev{color:var(--nut-ink)!important;text-shadow:none!important}
/* v73: giao diện tối — vát mép và bóng đổ của nút nhẹ hẳn đi (trên nền tối bóng đổ quá rõ làm lưới rối mắt);
   khay sáng hơn một chút để khe ở góc nút bớt tương phản */
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--tray:#4A4336;
  --nut-bevel:inset 0 1px 1px rgba(255,255,255,.45),inset 0 -1px 2px rgba(90,60,20,.10)}}
:root[data-theme="dark"]{--tray:#4A4336;--nut-bevel:inset 0 1px 1px rgba(255,255,255,.45),inset 0 -1px 2px rgba(90,60,20,.10)}
/* ===== v74: nút N6 (bảng thiết kế) — nút trắng thường, bo góc 8% (khe giữa 4 góc nhỏ hẳn), màu từ nhạt hơn để chữ đen nổi:
   --g1…--g6 = --w1…--w6 (bản sáng) pha 38% trắng; giữ nguyên ở giao diện tối (nút là vật thể, không đổi màu theo nền) */
:root{--g1:#7DB7A3;--g2:#D99688;--g3:#87A6CE;--g4:#C099C9;--g5:#DCB674;--g6:#87BAC2;--nut:#FFFFFF;
  --nut-bevel:inset 0 2px 2px rgba(255,255,255,.7),inset 0 -3px 3px rgba(70,60,40,.16),inset 2px 0 2px rgba(255,255,255,.3),inset -2px 0 2px rgba(70,60,40,.08),0 1px 2px rgba(40,30,10,.18)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--nut-bevel:inset 0 1px 1px rgba(255,255,255,.5),inset 0 -1px 2px rgba(60,50,30,.10)}}
:root[data-theme="dark"]{--nut-bevel:inset 0 1px 1px rgba(255,255,255,.5),inset 0 -1px 2px rgba(60,50,30,.10)}
.board.flat .cell,.board.flat .cell.crate{border-radius:8%!important}
.board-wrap.flat{border-radius:9px}
/* v75: ô gợi ý kiểu V1 (bảng thiết kế "Ô gợi ý · H1 + H2"): viền liền mảnh 1,5px sát mép + khung nét đứt lùi vào trong.
   Vàng trên nút trắng; vàng nâu trên ô đã tô màu (ô giao đã thuộc từ khác) để không chìm trên màu vàng đất. */
:root{--hint-c:#F2B705;--hint-c2:#A86E00}
.board.flat .cell.hint{box-shadow:inset 0 0 0 1.5px var(--hint-c),var(--nut-bevel)!important}
.board.flat .cell.hint::after{content:"";position:absolute;inset:7%;border-radius:5%;border:1.5px dashed var(--hint-c);pointer-events:none}
.board.flat .cell.found.hint{box-shadow:inset 0 0 0 1.5px var(--hint-c2),var(--nut-bevel)!important}
.board.flat .cell.found.hint::after{border-color:var(--hint-c2)}
.board.flat .cell.sel.hint::after{border-color:#A86E00}
/* v76: viền liền của ô gợi ý vẽ từng cạnh; cạnh chung với một ô gợi ý khác chỉ còn nửa nét (hai bên cộng lại = 1 nét) */
.board.flat .cell.hint{--ht:1.5px;--hb:1.5px;--hl:1.5px;--hr:1.5px;--hcol:var(--hint-c);
  box-shadow:inset var(--hl) 0 0 0 var(--hcol),inset calc(-1 * var(--hr)) 0 0 0 var(--hcol),inset 0 var(--ht) 0 0 var(--hcol),inset 0 calc(-1 * var(--hb)) 0 0 var(--hcol),var(--nut-bevel)!important}
.board.flat .cell.found.hint{--hcol:var(--hint-c2)}
.board.flat .cell.hint.hn-t{--ht:.75px}.board.flat .cell.hint.hn-b{--hb:.75px}
.board.flat .cell.hint.hn-l{--hl:.75px}.board.flat .cell.hint.hn-r{--hr:.75px}