.cb{--bg1:#4a2f14;--bg2:#140c04;--accent:#e8b04a;--accent-ink:#2a1a06;--card:rgba(255,236,200,.08);--card-br:rgba(232,176,74,.28)}
.cb-modes{display:flex;gap:8px;margin-bottom:6px}
.cb-disc-wrap{display:flex;justify-content:center;margin:2px 0 4px}
.cb-disc{width:120px;height:120px;filter:drop-shadow(0 6px 10px rgba(0,0,0,.5))}
.cb-disc .ring{transition:transform .6s cubic-bezier(.3,1.3,.5,1);transform-origin:0 0}
.cb-quote{display:flex;flex-wrap:wrap;gap:4px 14px;justify-content:center;padding:18px 12px;border-radius:18px;background:linear-gradient(160deg,#f3e3bf,#dcc592);box-shadow:inset 0 0 40px rgba(120,80,20,.4),0 10px 26px rgba(0,0,0,.5);border:2px solid #8a6424;color:#2a1a06;outline-offset:4px}
.cb-word{display:flex;gap:2px;white-space:nowrap}
.cb-cell{width:clamp(24px,7.2vw,34px);text-align:center;border:0;background:transparent;padding:0;font:inherit;color:inherit;cursor:pointer;border-radius:8px}
.cb-cell .g{display:block;height:clamp(32px,9vw,40px);line-height:clamp(32px,9vw,40px);font:800 clamp(20px,6vw,26px)/clamp(32px,9vw,40px) Georgia,serif;border-bottom:2.5px solid #5b3a12;color:#7a1f1f;transition:transform .15s}
.cb-cell .c{display:block;font:600 11px/14px ui-monospace,Menlo,monospace;color:#6b5328;margin-top:2px}
.cb-cell.same{background:rgba(232,176,74,.45)}
.cb-cell.sel{background:rgba(232,176,74,.9);box-shadow:0 0 0 2px #7a4a0a}
.cb-cell.bad .g{color:#c01818;text-decoration:line-through}
.cb-cell.lock .g{color:#14532d}
.cb-cell.pop .g{animation:cbpop .25s}
@keyframes cbpop{50%{transform:scale(1.35)}}
.cb-punct{font:800 clamp(20px,6vw,26px)/clamp(32px,9vw,40px) Georgia,serif;color:#2a1a06;padding:0 1px}
.cb-quote.won .cb-cell .g{color:#14532d;animation:cbwin .6s backwards}
@keyframes cbwin{from{transform:translateY(-10px) scale(1.4);color:#e8b04a}}
.cb-hint{text-align:center;color:var(--mute);margin:10px 0;min-height:22px}
.cb-freq{display:flex;gap:2px;align-items:flex-end;height:48px;justify-content:center;margin:6px 0 10px}
.cb-freq i{flex:1;max-width:18px;background:linear-gradient(#e8b04a,#a8742a);border-radius:3px 3px 0 0;position:relative;min-height:2px}
.cb-freq i b{position:absolute;bottom:-14px;left:0;right:0;text-align:center;font:600 9px ui-monospace,monospace;color:var(--mute)}
.cb-freq{padding-bottom:16px}
.cb-kb{display:grid;grid-template-columns:repeat(9,1fr);gap:5px;margin:8px 0 12px}
.cb-kb button{min-height:44px;border-radius:10px;border:1px solid var(--card-br);background:rgba(255,236,200,.12);color:#fff;font:800 17px system-ui;cursor:pointer}
.cb-kb button.used{opacity:.4}
.cb-kb button:active{transform:scale(.94)}
@media (min-width:520px){.cb-kb{grid-template-columns:repeat(13,1fr)}}
.cb-big{font-size:36px;font-weight:900;color:var(--accent);margin:4px 0}
.cb-stars{font-size:28px;letter-spacing:6px;color:var(--accent)}