/* Crazy Eights: current-suit badge, stock and discard pile, inline suit picker, power-card line. Existing tokens only. */
.ce-table{display:flex;flex-direction:column;align-items:center;gap:var(--space-2);width:100%}
.ce-badge{margin:0;padding:2px var(--space-3);border:1px solid var(--line-strong);border-radius:999px;background:var(--felt-deep);color:var(--paper);font-family:var(--display);font-weight:800;font-size:14px;min-height:28px}
.ce-badge.called{border-color:var(--lime);color:var(--lime)}
.ce-table .piles{margin-top:0}
.ce-discard{min-width:64px;min-height:92px}
.ce-discard .card{width:64px;height:92px;box-shadow:none}
#stock.playable{outline:3px solid var(--lime);outline-offset:3px}
#stock[aria-disabled="true"]{cursor:default}
.hand .card.playable{translate:0 -6px}
.hand .card.playable.selected{translate:0 -12px}
.ce-flow{margin:0;color:var(--muted);font-size:12px}
.ce-flow.ce-owed{color:var(--lime);font-weight:700}
.ce-picker{width:min(420px,100%);padding:var(--space-4);border:1px solid var(--lime);border-radius:var(--radius);background:var(--ink-soft);text-align:center}
.ce-picker-title{margin:0;font-family:var(--display);font-size:18px;font-weight:800;color:var(--paper)}
.table-center .ce-picker-detail{margin:var(--space-1) 0 var(--space-3);font-size:13px}
.ce-suits{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-2)}
.ce-suit-button{display:flex;flex-direction:column;align-items:center;gap:2px;min-height:72px;padding:var(--space-2) var(--space-1);border-radius:12px;font-size:13px}
.ce-suit-button small{font-size:11px;font-weight:400;color:inherit;opacity:.8}
.ce-suit-symbol{font-size:26px;line-height:1}
.ce-picker #ce-picker-cancel{margin-top:var(--space-3);background:none}
@media(max-width:767px){.ce-suits{grid-template-columns:repeat(2,minmax(0,1fr))}.ce-picker{padding:var(--space-3)}.ce-badge{font-size:13px}}
/* Five seats on tablet widths: the shell's one-row seat grid leaves the name ~40 px; stack the score under the status instead (plan §9). */
@media(min-width:768px) and (max-width:1100px){#players.seat-ring[data-count="5"] .ring-seat{grid-template-columns:40px minmax(0,1fr);grid-template-areas:"avatar name" "avatar detail" "avatar score";row-gap:2px}#players.seat-ring[data-count="5"] .player small{white-space:normal}#players.seat-ring[data-count="5"] .player-score{font-size:16px;justify-self:start}#players.seat-ring[data-count="5"] .player-score small{display:inline;margin-left:4px}}
.game .table-top{gap:var(--space-2)}#round-label{white-space:nowrap}#target-label{text-align:right}