/* A compact card table inspired by the game's illustrated cover. */
.cols { --cw:clamp(40px, 11.5vw, 82px); display:grid; grid-template-columns:repeat(7, 1fr); gap:6px; justify-items:center; align-items:start; min-height:calc(var(--cw) * 2.6); }
.col { display:flex; flex-direction:column; align-items:center; }
.tray { --cw:clamp(44px, 12vw, 84px); display:flex; gap:28px; justify-content:center; align-items:end; margin-top:12px; }
.pile { display:flex; flex-direction:column; align-items:center; gap:7px; min-width:var(--cw); }
.pile-label { color:#f8e8b9; font-size:.69rem; font-weight:800; letter-spacing:.09em; text-transform:uppercase; text-align:center; text-shadow:0 1px 2px #173b2e; }
.waste { min-height:calc(var(--cw) * 1.4); }
#stockCard { cursor:pointer; outline-offset:4px; }
#stockCard::after { content:'♠'; position:absolute; inset:14%; display:grid; place-items:center; border:1px solid rgba(255,255,255,.64); border-radius:5px; color:#f5eacb; font:700 calc(var(--cw) * .38)/1 Georgia,serif; text-shadow:0 2px 3px #0b3157; }
#stockCard:hover { transform:translateY(-3px); box-shadow:0 5px 0 #183d4e,0 9px 18px rgba(0,0,0,.35); }
.felt { width:min(720px,100%); padding:15px 13px 18px; border-color:#70462a; background:radial-gradient(ellipse at 50% 8%,#208260 0%,#0f6449 54%,#0a4738 100%); box-shadow:inset 0 0 0 2px rgba(243,210,144,.34),inset 0 0 35px rgba(2,31,22,.4),0 18px 32px rgba(36,39,26,.2); }
.felt .pcard.ok { box-shadow:0 0 0 3px #e9c971,0 4px 11px rgba(5,25,19,.46); }
.felt .pcard.ok:hover { transform:translateY(-6px); }
.hud { width:100%; gap:7px; }
.hud span { display:inline-flex; align-items:baseline; gap:5px; padding:5px 10px; border:1px solid #3d6558; border-radius:8px; background:#213c36; color:#d0e4d6; font-size:.82rem; font-weight:650; }
.hud b { color:#f4e2ad; font-size:1.03rem; font-variant-numeric:tabular-nums; }
.golf-actions { width:min(100%,440px); display:grid; grid-template-columns:1.25fr 1fr; gap:8px; padding:8px; border:2px solid #9a6940; border-radius:14px; background:linear-gradient(135deg,#704328,#4c2c1e); box-shadow:inset 0 1px 0 #c38b52,0 7px 15px rgba(59,38,24,.18); }
body.game-themeable > main .golf-actions button { min-height:45px; padding:7px 10px; border-radius:9px; font-size:.89rem; font-weight:800; line-height:1.15; }
body.game-themeable > main .golf-actions button::before { display:inline-block; margin-right:7px; font-size:1.14rem; line-height:.7; vertical-align:-1px; }
body.game-themeable > main #drawBtn { border:1px solid #e7bd63; background:linear-gradient(#ffe6a1,#e5b75c); color:#332413; box-shadow:inset 0 1px 0 #fff5cf,0 3px 0 #9d6c30; }
body.game-themeable > main #drawBtn::before { content:'♠'; }
body.game-themeable > main #new { border:1px solid #e5d7b8; background:linear-gradient(#fffdf4,#e9dfc8); color:#463522; box-shadow:inset 0 1px 0 #fff,0 3px 0 #aa9777; }
body.game-themeable > main #new::before { content:'↻'; }
body.game-themeable > main .golf-actions button:hover:not(:disabled) { filter:brightness(1.06); transform:translateY(-1px); }
body.game-themeable > main .golf-actions button:active:not(:disabled) { transform:translateY(2px); box-shadow:inset 0 2px 3px rgba(55,35,14,.22); }
body.game-themeable > main .golf-actions button:disabled { opacity:.58; }
@media (max-width:640px) {
  .felt { padding:9px 7px 12px; }
  .tray { gap:20px; margin-top:9px; }
  .pile-label { font-size:.58rem; }
  .hud span { font-size:.72rem; padding:4px 7px; }
  .hud b { font-size:.9rem; }
  .golf-actions { width:min(100%,390px); }
  body.game-themeable > main .golf-actions button { min-height:44px; font-size:.8rem; }
  body.game-themeable > main .golf-actions button::before { margin-right:4px; }
}