:root{--ink:#1d2b4f;--ink2:#4a5574;--bg:#f6f7fb;--card:#fff;--line:#dde2ec;--acc:#ffb23f;--good:#2e8a63;--bad:#c2453d;--u:#2e8a63;--o:#d9861a;--l:#3a5ec9;color-scheme:light}
@media (prefers-color-scheme:dark){:root{--ink:#eef1f8;--ink2:#aeb7cc;--bg:#11182b;--card:#19223a;--line:#2c3753;--acc:#f5b04a;--good:#5cc596;--bad:#ef7d74;color-scheme:dark}}
*{box-sizing:border-box}
body{margin:0;font:17px/1.5 system-ui,-apple-system,"Segoe UI",sans-serif;background:var(--bg);color:var(--ink);min-height:100vh;display:flex;flex-direction:column}
.banner{margin:0;background:var(--ink);color:var(--bg);font-size:.75rem;text-align:center;padding:6px 12px}
.top{display:flex;align-items:center;gap:12px;max-width:640px;width:100%;margin:0 auto;padding:14px 16px}
.logo{font-weight:800;font-size:1.3rem;text-decoration:none;color:var(--ink);margin-left:auto}
.logo b{background:var(--ink);color:var(--acc);border-radius:6px;padding:0 5px}
.logo span{font-weight:500;color:var(--ink2);font-size:.9rem}
.back{font:inherit;font-weight:700;border:0;background:none;color:var(--ink);cursor:pointer;padding:6px 0}
main{flex:1;max-width:640px;width:100%;margin:0 auto;padding:8px 16px 32px;display:flex;flex-direction:column;gap:14px}
h1{font-size:1.8rem;line-height:1.15;margin:8px 0 0}
h2{font-size:1.3rem;margin:0}
p{margin:0}
.muted{color:var(--ink2)}
.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:18px;display:flex;flex-direction:column;gap:10px}
.pick{text-align:left;font:inherit;color:inherit;cursor:pointer;border-left:6px solid var(--c)}
.pick .verb{color:var(--c);font-weight:800;font-size:1.4rem}
.u{--c:var(--u)}.o{--c:var(--o)}.l{--c:var(--l)}
.btn{font:inherit;font-weight:700;border:2px solid var(--ink);background:var(--card);color:var(--ink);border-radius:999px;padding:10px 18px;cursor:pointer}
.btn.primary{background:var(--ink);color:var(--bg)}
.btn:disabled{opacity:.45;cursor:default}
.row{display:flex;gap:8px;flex-wrap:wrap}
.chat{display:flex;flex-direction:column;gap:8px;max-height:46vh;overflow-y:auto}
.bub{max-width:85%;padding:9px 13px;border-radius:14px}
.bub.me{align-self:flex-end;background:var(--ink);color:var(--bg)}
.bub.ai{align-self:flex-start;background:var(--bg);border:1px solid var(--line)}
.bub.win{outline:2px solid var(--acc)}
.trick{text-align:left;font:inherit;color:inherit;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:10px 12px;cursor:pointer}
.trick small{display:block;color:var(--ink2)}
.trick.used{opacity:.55}
.card.ok{border-color:var(--good)}.card.no{border-color:var(--bad)}
.tag{font-weight:800}.tag.ok{color:var(--good)}.tag.no{color:var(--bad)}
.msg{background:var(--acc);color:#1d2b4f;border-radius:14px;padding:14px 16px}
.foot{text-align:center;font-size:.85rem;color:var(--ink2);padding:16px}
.foot a{color:inherit}
:focus-visible{outline:3px solid var(--acc);outline-offset:2px}
