:root{--accent:#af9377;--soft:#e4e8d8}.brand-suits{font:400 24px var(--display);letter-spacing:-6px;padding-right:6px;color:#476559}.brand-suits i{color:#ba7d79}.table-shell{background:radial-gradient(ellipse at 50% 40%,#9ab39e,#7c9d87);border:8px solid #b9a387;border-radius:20px;box-shadow:inset 0 0 0 2px #e3cfac,inset 0 0 25px #1c423b33;padding:16px 20px 12px;margin:12px 20px}.table-label{display:flex;justify-content:space-between;gap:12px;color:#203c2d;font-size:10px;line-height:1.7;margin:0 0 12px}.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(44px,1fr));gap:4px;max-height:580px;max-height:min(580px,calc(100dvh - 170px));overflow-y:auto;padding:4px 3px 10px;overscroll-behavior:contain;scrollbar-color:#456751 #b3c7b2}.playing-card{position:relative;min-width:44px;aspect-ratio:.7;border:0;padding:0;border-radius:7px;background:#fffcf0;color:#3d514b;box-shadow:0 3px 0 #244a3b88;isolation:isolate;opacity:1!important;transition:transform .2s}.playing-card:disabled{cursor:default}.card-back{position:absolute;inset:0;border:2px solid #faf4df;border-radius:7px;background:repeating-linear-gradient(45deg,#8ca2b1 0 2px,#788d9d 2px 7px);display:grid;place-items:center;color:#fff8de;font:400 19px var(--display)}.card-back:before{content:'';position:absolute;inset:5px;border:1px solid #f0eddb88;border-radius:4px}.playing-card:not(:disabled):hover{transform:translateY(-3px)}.playing-card.is-picked{animation:card-turn 340ms ease-out}.playing-card.is-picked .card-face{opacity:1}.card-face{position:absolute;inset:0;overflow:hidden;border:1px solid #dfd8c4;border-radius:7px;background:linear-gradient(145deg,#fffef7,#f6efda);display:grid;place-items:center}.card-corner{position:absolute;left:4px;top:3px;display:grid;line-height:1;font:500 12.1px var(--display);text-align:center;gap:1px}.card-corner.bottom{left:auto;top:auto;right:4px;bottom:3px;transform:rotate(180deg)}.card-suit{font:400 22px/1 var(--display)}.red{color:#b97470}.owner-dot{position:absolute;right:-2px;top:-2px;min-width:13px;height:13px;display:grid;place-items:center;padding:0 3px;border:1px solid #fff1d1;border-radius:50%;background:#cba688;color:#fffdf2;font:500 10px var(--display);z-index:2}.table-seal{text-align:center;color:#355d45aa;font-size:14px;letter-spacing:6px;padding:10px 0 0}.select-row{display:grid;gap:8px;font-size:12px;margin:15px 0}.select-row select{min-height:46px;width:100%;padding:10px 12px;border:1px solid #cbd3bd;border-radius:11px;background:#fffdf5;color:var(--ink)}.hand-row{padding:12px 0;border-top:1px solid var(--line)}.hand-row>div:first-child{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:12px}.hand-row b{font-weight:500;overflow-wrap:anywhere}.hand-row small{font-size:12.1px;color:var(--muted);white-space:nowrap}.hand-chips{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px}.mini-card{min-width:30px;min-height:36px;padding:8px 5px;display:grid;place-items:center;background:#fffaf0;border:1px solid #e0d7c2;border-radius:6px;font:500 13px var(--display)}.hand-row.is-current{color:#8e7055}.rules-link{display:inline-flex;align-items:center;min-height:44px;font-size:12px;color:#687a59}.standing .hand-chips{margin-top:7px}.standing>span:first-child{align-self:flex-start;padding-top:3px}.standing .hand-name{font-size:12px;color:#7c8e63;font-weight:600}.table-scroll td{min-width:180px}@keyframes card-turn{0%{transform:rotateY(90deg) scale(.95)}100%{transform:rotateY(0) scale(1)}}

@media(max-width:700px){.table-shell{margin:9px;border-width:6px;padding:13px 9px 9px}.card-grid{gap:3px}.card-corner{font-size:12.1px;left:3px;top:3px}.card-corner.bottom{right:3px;bottom:3px}.card-suit{font-size:22px}.table-label{font-size:10px;gap:7px}.table-scroll td{min-width:170px}}

@media(max-width:700px){main#app{padding-left:8px;padding-right:8px}.table-shell{margin:4px 10px;border-width:3px;padding:8px 6px 6px}.card-grid{gap:3px;padding-left:2px;padding-right:2px}.table-label{padding:0 5px}}

.table-scroll-hint{font-size:10px;color:#203c2d;text-align:center;line-height:1.6;margin:7px 0 0}

.turn-banner{display:flex;align-items:center;gap:10px;min-height:44px;padding:7px 16px;background:#eaf0dc;border-bottom:1px solid var(--line)}.turn-banner>span:first-child{font-size:12.1px;white-space:nowrap;color:var(--muted)}.turn-banner>b{flex:1;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font:400 19px var(--display)}.turn-index{display:grid;place-items:center;min-width:23px;height:23px;border-radius:50%;background:#d6e1c2;font:500 12px var(--display);color:#667d55}

/* Strong ink on ivory, and a soft blue logo back. */
.playing-card{color:#192d36}.card-face{background:#fffef8;border-color:#858777}.red{color:#ad243d}.card-back{background:repeating-linear-gradient(45deg,#788fa7 0 2px,#647c96 2px 7px);border-color:#fff5d6}.card-back:before{border-color:#f9e9bbcc}.card-corner{font-weight:600}.owner-dot{background:#5b421f;color:#fff9e9;border-color:#fff8da}.mini-card{background:#fffef8;border-color:#8e917e}
.back-logo{display:block;width:67%;aspect-ratio:1;border-radius:22%;background:url('../grid-rush/assets/icons/icon-192.png') center/contain no-repeat;box-shadow:0 0 0 1px #ffffff88;z-index:1}

/* Stable colours link each revealed card to its player, with numeric badges as a second cue. */
.playing-card.is-picked .card-face{border:3px solid var(--player-color)}
.playing-card.is-picked .owner-dot{background:var(--player-color);color:#fff;border-color:#fffef8}
.hand-row b::before{content:'';display:inline-block;width:9px;height:9px;margin-right:7px;border-radius:50%;background:var(--player-color);vertical-align:1px}
.hand-row .mini-card,.standing .mini-card{border-color:var(--player-color)}
.turn-banner .turn-index{background:var(--player-color);color:#fff}
