.cols { --cw:clamp(38px, 11.4vw, 82px); display:grid; grid-template-columns:repeat(7, 1fr); gap:6px; justify-items:center; align-items:start; min-height:calc(var(--cw) * 4.4); }
.col { display:flex; flex-direction:column; align-items:center; width:100%; min-height:calc(var(--cw) * 1.4); border-radius:8px; }
.col.empty { border:2px dashed rgba(255,255,255,.28); }
.col .pcard { --cw:inherit; }
.col .pcard + .pcard { margin-top:calc(var(--cw) * -1.06); }
.col .pcard.up + .pcard { margin-top:calc(var(--cw) * -1.02); }
.col .pcard.down + .pcard { margin-top:calc(var(--cw) * -1.2); }
.col .pcard.sel { transform:translateY(-4px); outline:3px solid #fbbf24; }
.col .pcard.hint { box-shadow:0 0 0 3px #4ade80, 0 3px 8px rgba(0,0,0,.4); }
.felt { width:min(760px,100%); }
.bar button { min-height:44px; }
#suits button.on { background:var(--accent); color:var(--accent-ink,#06202e); }