:root{color-scheme:dark;--ink:#061516;--deep:#08282a;--felt:#0c4340;--cream:#fff1cf;--gold:#f4c85b;--cyan:#3bf4f0;--magenta:#ff4ca7;--red:#cf2449}*{box-sizing:border-box}html{background:var(--ink)}body{margin:0;min-width:320px;min-height:100svh;background:radial-gradient(circle at 50% 45%,#145e55 0,#082b2c 42%,#031012 100%);color:var(--cream);font-family:Arial,Helvetica,sans-serif}.game-shell{min-height:100svh;overflow:hidden;background-image:repeating-linear-gradient(112deg,transparent 0 31px,rgba(255,255,255,.018) 32px 33px)}button,a{font:inherit}.game-header{position:relative;z-index:8;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:13px clamp(14px,3vw,38px);border-bottom:1px solid rgba(255,241,207,.18);background:rgba(3,16,18,.86);backdrop-filter:blur(16px)}.brand{color:inherit;text-decoration:none;line-height:.86}.brand strong{display:block;font-size:18px;letter-spacing:-.04em}.brand small{display:block;margin-top:5px;color:var(--gold);font:800 7px/1 'Courier New',monospace;letter-spacing:.18em;text-transform:uppercase}.game-header>p{margin:0;color:rgba(255,241,207,.62);font:800 8px/1.4 'Courier New',monospace;text-transform:uppercase;letter-spacing:.08em}.game-header>div{display:flex;gap:6px}.game-header button,.summary-actions a{border:1px solid rgba(255,241,207,.24);background:transparent;color:rgba(255,241,207,.8);padding:8px 10px;cursor:pointer;font:800 8px/1 'Courier New',monospace;text-transform:uppercase}.game-header button:hover,.game-header button:focus-visible{border-color:var(--gold);color:var(--gold);outline:0}.scoreboard{position:relative;z-index:6;display:grid;grid-template-columns:1fr auto 1fr;gap:12px;align-items:stretch;padding:10px clamp(14px,3vw,38px);background:rgba(3,15,16,.64);border-bottom:1px solid rgba(255,241,207,.12)}.scoreboard article{display:grid;grid-template-columns:1fr auto;align-items:center;padding:7px 12px;border:1px solid rgba(255,241,207,.14);background:rgba(255,255,255,.035)}.scoreboard article>span{font:900 9px/1 'Courier New',monospace;text-transform:uppercase;color:var(--cyan)}.scoreboard article>strong{grid-row:1/3;grid-column:2;font-size:30px}.scoreboard article>small{font:7px/1.3 'Courier New',monospace;color:rgba(255,241,207,.48)}.scoreboard>div{display:grid;place-content:center;text-align:center;padding-inline:12px}.scoreboard>div span,.scoreboard>div small{font:700 6px/1.3 'Courier New',monospace;text-transform:uppercase;letter-spacing:.1em;color:rgba(255,241,207,.43)}.scoreboard>div b{font-size:21px;color:var(--gold)}.score-them{text-align:right}.score-them>span,.score-them>small{grid-column:2}.score-them>strong{grid-column:1!important}.table-wrap{position:relative;width:min(100%,1500px);min-height:760px;margin:0 auto;isolation:isolate;background:radial-gradient(ellipse at center,rgba(36,142,119,.35),transparent 49%),repeating-radial-gradient(ellipse at center,transparent 0 10px,rgba(255,255,255,.012) 11px 12px)}.table-wrap:before{content:'';position:absolute;inset:55px 9% 132px;border:1px solid rgba(244,200,91,.22);border-radius:44%;box-shadow:inset 0 0 110px rgba(0,0,0,.35),0 0 0 9px rgba(3,15,16,.2)}.ambient-feather{position:absolute;z-index:-1;width:190px;aspect-ratio:2/3;background:url('/media/peacock-feather-iridescent-v1.webp') center/contain no-repeat;opacity:.12;filter:saturate(1.8) hue-rotate(20deg);mix-blend-mode:screen;animation:feather 9s ease-in-out infinite alternate}.feather-a{left:-40px;top:160px;transform:rotate(-24deg)}.feather-b{right:-32px;top:260px;transform:rotate(28deg);animation-delay:-5s}@keyframes feather{to{margin-top:-24px;filter:saturate(3) hue-rotate(120deg) brightness(1.25);opacity:.23}}.seat{position:absolute;z-index:4;display:grid;grid-template-columns:auto 1fr auto;gap:8px 10px;align-items:center;width:210px;padding:9px 11px;border:1px solid rgba(255,241,207,.18);background:rgba(3,17,18,.82);box-shadow:0 14px 30px rgba(0,0,0,.24);transition:border-color .2s,box-shadow .2s,transform .2s}.seat.is-turn{border-color:var(--gold);box-shadow:0 0 30px rgba(244,200,91,.22);transform:scale(1.025)}.seat-north{left:50%;top:20px;transform:translateX(-50%)}.seat-north.is-turn{transform:translateX(-50%) scale(1.025)}.seat-south{left:50%;bottom:178px;transform:translateX(-50%)}.seat-south.is-turn{transform:translateX(-50%) scale(1.025)}.seat-west{left:3%;top:43%}.seat-east{right:3%;top:43%}.avatar{display:grid;grid-row:1/3;width:31px;aspect-ratio:1;place-items:center;border-radius:50%;border:1px solid var(--cyan);color:var(--cyan);font-weight:950}.seat b{font-size:12px}.seat small{display:block;color:rgba(255,241,207,.46);font:700 6px/1.2 'Courier New',monospace;letter-spacing:.08em}.seat dl{display:flex;gap:8px;margin:0}.seat dl div{display:grid;text-align:center}.seat dt,.seat em{font:700 6px/1 'Courier New',monospace;text-transform:uppercase;color:rgba(255,241,207,.42)}.seat dd{margin:2px 0 0;font-size:12px;font-weight:950}.seat>em{grid-column:2;font-style:normal}.seat>i{position:absolute;right:7px;top:-7px;padding:3px 5px;background:var(--gold);color:var(--ink);font:900 6px/1 'Courier New',monospace}.turn-status{position:absolute;z-index:5;left:50%;top:128px;transform:translateX(-50%);padding:6px 12px;border-radius:999px;background:rgba(3,15,16,.75);color:var(--gold);font:800 8px/1 'Courier New',monospace;text-transform:uppercase;letter-spacing:.08em}.trick{position:absolute;z-index:3;left:50%;top:50%;width:280px;height:220px;transform:translate(-50%,-52%)}.trick-empty{position:absolute;inset:0;display:grid;place-content:center;text-align:center;color:rgba(255,241,207,.34);font:700 8px/1.5 'Courier New',monospace;text-transform:uppercase}.trick-empty b{display:block;font-size:36px;color:rgba(244,200,91,.24)}.trick-card{position:absolute;width:78px;height:112px}.trick-card small{position:absolute;left:50%;bottom:-14px;transform:translateX(-50%);font:700 6px 'Courier New',monospace;color:rgba(255,241,207,.55);text-transform:uppercase}.trick-north{left:101px;top:0}.trick-south{left:101px;bottom:0}.trick-west{left:32px;top:54px;transform:rotate(-6deg)}.trick-east{right:32px;top:54px;transform:rotate(6deg)}.card-face,.hand-card{position:relative;display:block;width:100%;height:100%;border:1px solid rgba(0,0,0,.25);border-radius:8px;background:linear-gradient(145deg,#fffdf5,#ecdcb8);color:#111;box-shadow:0 7px 17px rgba(0,0,0,.32)}.is-red{color:#b51f3f}.card-corner{position:absolute;left:7px;top:6px;display:grid;text-align:center;font-style:normal;line-height:.85}.card-corner b{font-size:15px}.card-corner i{font-size:12px;font-style:normal}.card-corner-bottom{left:auto;right:7px;top:auto;bottom:6px;transform:rotate(180deg)}.card-suit{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:30px}.bidding{position:absolute;z-index:7;left:50%;top:51%;width:min(560px,80%);transform:translate(-50%,-50%);padding:22px;border:1px solid var(--gold);background:rgba(3,18,19,.96);box-shadow:0 25px 80px rgba(0,0,0,.65);text-align:center}.bidding>p{margin:0;color:var(--cyan);font:800 7px 'Courier New',monospace;text-transform:uppercase;letter-spacing:.16em}.bidding h1{margin:5px 0 7px;font-size:clamp(27px,5vw,45px);line-height:.88;text-transform:uppercase;letter-spacing:-.05em}.bidding>span{color:rgba(255,241,207,.56);font:8px/1.5 'Courier New',monospace}.bid-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:5px;margin-top:15px}.bid-grid button{min-height:38px;border:1px solid rgba(255,241,207,.22);background:rgba(255,255,255,.035);color:var(--cream);cursor:pointer;font-weight:950}.bid-grid button:first-child{grid-column:span 2;color:var(--cyan)}.bid-grid button:hover,.bid-grid button:focus-visible{border-color:var(--gold);background:var(--gold);color:var(--ink);outline:0}.hand-zone{position:absolute;z-index:6;left:2%;right:2%;bottom:8px;height:150px;padding:8px 12px;border-top:1px solid rgba(255,241,207,.14);background:linear-gradient(180deg,rgba(3,15,16,.2),rgba(3,15,16,.9))}.hand-zone>p{display:flex;justify-content:space-between;margin:0 0 7px;font:800 7px/1 'Courier New',monospace;text-transform:uppercase;color:var(--gold)}.hand-zone>p small{font:inherit;color:rgba(255,241,207,.42)}.hand{display:flex;justify-content:center;height:118px;padding-inline:24px}.hand-card{flex:0 1 78px;min-width:46px;margin-left:-11px;padding:0;transform:translateY(8px);filter:saturate(.62) brightness(.74);cursor:not-allowed;transition:transform .16s,filter .16s,box-shadow .16s;overflow:hidden}.hand-card:first-child{margin-left:0}.hand-card.is-legal{filter:none;cursor:pointer;box-shadow:0 0 0 1px var(--cyan),0 0 18px rgba(59,244,240,.28)}.hand-card.is-legal:hover,.hand-card.is-legal:focus-visible{z-index:5;transform:translateY(-9px) rotate(-1deg);outline:2px solid var(--gold);outline-offset:2px}.hand-card:disabled{opacity:.72}.summary{position:fixed;inset:0;z-index:30;display:grid;place-items:center;padding:20px;background:rgba(1,9,10,.76);backdrop-filter:blur(12px)}.summary[hidden]{display:none}.summary-card{width:min(620px,100%);padding:28px;border:1px solid var(--gold);background:#071d1f;box-shadow:0 30px 100px #000;text-align:center}.summary-mark{display:block;color:var(--gold);font-size:42px}.summary-card>p,.rules>p{margin:5px 0;color:var(--cyan);font:800 7px 'Courier New',monospace;text-transform:uppercase;letter-spacing:.15em}.summary-card h2,.rules h2{margin:8px 0 20px;font-size:clamp(31px,6vw,55px);line-height:.85;text-transform:uppercase;letter-spacing:-.06em}.summary-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.summary-grid>div{display:grid;padding:14px;border:1px solid rgba(255,241,207,.15);background:rgba(255,255,255,.03)}.summary-grid span{font:800 7px 'Courier New',monospace;text-transform:uppercase;color:rgba(255,241,207,.58)}.summary-grid strong{font-size:39px}.summary-grid small{font:7px 'Courier New',monospace;color:var(--gold)}.summary-actions{display:flex;justify-content:center;gap:8px;margin-top:20px}.summary-actions button,.summary-actions a{padding:12px 16px;text-decoration:none}.summary-actions button{border:0;background:var(--gold);color:var(--ink);font-weight:950;cursor:pointer}.rules{width:min(660px,calc(100% - 30px));border:1px solid var(--gold);background:#071d1f;color:var(--cream);padding:28px;box-shadow:0 30px 100px #000}.rules::backdrop{background:rgba(1,9,10,.78);backdrop-filter:blur(10px)}.rules-close{position:absolute;right:12px;top:9px;border:0;background:none;color:var(--cream);font-size:25px;cursor:pointer}.rules ul{padding-left:20px;color:rgba(255,241,207,.74);font:11px/1.6 'Courier New',monospace}.rules>small{display:block;padding-top:12px;border-top:1px solid rgba(255,241,207,.13);color:rgba(255,241,207,.45);font:8px/1.5 'Courier New',monospace}footer{display:flex;justify-content:space-between;gap:15px;padding:9px clamp(14px,3vw,38px);border-top:1px solid rgba(255,241,207,.11);color:rgba(255,241,207,.38);font:6px/1.3 'Courier New',monospace;text-transform:uppercase;letter-spacing:.08em}
@media(max-width:800px){.game-header>p{display:none}.scoreboard{grid-template-columns:1fr 1fr}.scoreboard>div{display:none}.table-wrap{min-height:700px}.table-wrap:before{inset:48px 2% 130px}.seat{width:170px;padding:7px}.seat-west{left:1%;top:38%}.seat-east{right:1%;top:38%}.seat dl{gap:4px}.trick{top:47%;transform:translate(-50%,-50%) scale(.82)}.hand-zone{left:0;right:0}.hand{padding-inline:0}.hand-card{min-width:39px;margin-left:-16px}.bidding{width:92%;top:48%}.ambient-feather{opacity:.08}.scoreboard article{grid-template-columns:1fr auto}.scoreboard article>strong{font-size:24px}}
@media(max-width:520px){.game-header{padding:10px}.brand strong{font-size:15px}.game-header button{padding:7px}.game-header button:last-child{display:none}.scoreboard{padding:7px}.scoreboard article{padding:6px}.scoreboard article>span{font-size:7px}.scoreboard article>small{font-size:5.5px}.table-wrap{min-height:650px}.seat{width:135px;grid-template-columns:auto 1fr;gap:5px;padding:6px}.avatar{width:25px}.seat dl{grid-column:1/3;justify-content:center}.seat>em{display:none}.seat-north{top:12px}.seat-south{bottom:157px}.seat-west,.seat-east{top:35%}.trick{top:46%;transform:translate(-50%,-50%) scale(.68)}.turn-status{top:105px;font-size:6px}.hand-zone{height:138px}.hand-zone>p small{display:none}.hand{height:108px}.hand-card{min-width:35px;margin-left:-20px;border-radius:5px}.hand-card .card-corner{left:4px;top:4px}.hand-card .card-corner b{font-size:11px}.hand-card .card-corner i{font-size:9px}.hand-card .card-corner-bottom{display:none}.hand-card .card-suit{font-size:22px}.bid-grid{grid-template-columns:repeat(5,1fr)}.bid-grid button:first-child{grid-column:span 1}.summary-grid{grid-template-columns:1fr}.summary-actions{flex-direction:column}footer{flex-direction:column;text-align:center}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.ambient-feather{opacity:.1}}


/* Kabob Spades trick-resolution presentation v2 - visual layer only; rules engine untouched. */
.seat.is-trick-winner{border-color:var(--cyan);box-shadow:0 0 0 1px rgba(59,244,240,.34),0 0 42px rgba(59,244,240,.34);animation:seatWinnerPulse 1.2s ease-in-out both}
@keyframes seatWinnerPulse{0%,100%{filter:none}45%{filter:brightness(1.32)}}
.trick-resolution{--collect-x:0px;--collect-y:0px;--stab-x:50%;--stab-y:50%;position:absolute;inset:0;transform-origin:center;animation:collectKabobTrick 1.85s cubic-bezier(.2,.75,.2,1) both;will-change:transform,opacity}
.trick-resolution.resolve-north{--collect-y:-178px;--stab-x:50%;--stab-y:26%}
.trick-resolution.resolve-south{--collect-y:168px;--stab-x:50%;--stab-y:74%}
.trick-resolution.resolve-west{--collect-x:-195px;--stab-x:25%;--stab-y:50%}
.trick-resolution.resolve-east{--collect-x:195px;--stab-x:75%;--stab-y:50%}
.trick-resolution .trick-card{animation:trickCardHold 1.85s ease both}
.trick-resolution .trick-card:not(.is-winning-card){filter:saturate(.86) brightness(.93)}
.trick-resolution .trick-card.is-winning-card{z-index:13;filter:none;animation:winnerCardPunch 1.85s ease both}
.trick-resolution .trick-card.is-winning-card .card-face{box-shadow:0 0 0 2px var(--gold),0 0 30px rgba(244,200,91,.72),0 14px 28px rgba(0,0,0,.42)}
@keyframes trickCardHold{0%,62%{opacity:1}82%{opacity:.94}100%{opacity:.24}}
@keyframes winnerCardPunch{0%,22%{transform:scale(1)}38%{transform:scale(1.12) rotate(-2deg)}55%,70%{transform:scale(1.07) rotate(1deg)}100%{transform:scale(.98);opacity:.55}}
@keyframes collectKabobTrick{0%,62%{transform:translate(0,0) scale(1);opacity:1}72%{transform:translate(0,0) scale(.96);opacity:1}100%{transform:translate(var(--collect-x),var(--collect-y)) scale(.52);opacity:.08}}
.kabob-skewer{position:absolute;z-index:18;left:var(--stab-x);top:var(--stab-y);width:205px;height:7px;border:1px solid rgba(76,40,15,.8);border-radius:999px;background:linear-gradient(180deg,#e9b86a 0,#a96e2c 45%,#704216 100%);box-shadow:0 2px 4px rgba(0,0,0,.55),0 0 16px rgba(244,200,91,.24);opacity:0;transform-origin:50% 50%;pointer-events:none}
.kabob-skewer:after{content:'';position:absolute;right:-15px;top:50%;width:0;height:0;border-top:6px solid transparent;border-bottom:6px solid transparent;border-left:17px solid #e1ad5b;transform:translateY(-50%);filter:drop-shadow(1px 1px 1px rgba(0,0,0,.4))}
.trick-winner-callout{position:absolute;z-index:20;left:50%;top:-52px;min-width:190px;transform:translateX(-50%);padding:7px 12px;border:1px solid rgba(244,200,91,.62);background:rgba(3,15,16,.92);box-shadow:0 10px 32px rgba(0,0,0,.44);text-align:center;opacity:0;animation:winnerCallout 1.85s ease both;pointer-events:none}
.trick-winner-callout b,.trick-winner-callout strong,.trick-winner-callout small{display:block}
.trick-winner-callout b{color:var(--cyan);font:900 9px/1 'Courier New',monospace;text-transform:uppercase;letter-spacing:.12em}
.trick-winner-callout strong{margin-top:3px;color:var(--gold);font:950 12px/1 'Courier New',monospace;text-transform:uppercase}
.trick-winner-callout small{margin-top:4px;color:rgba(255,241,207,.52);font:800 6px/1 'Courier New',monospace;text-transform:uppercase;letter-spacing:.1em}
@keyframes winnerCallout{0%,25%{opacity:0;transform:translate(-50%,8px) scale(.92)}34%,68%{opacity:1;transform:translate(-50%,0) scale(1)}100%{opacity:0;transform:translate(-50%,-8px) scale(.9)}}
.sizzle-particle{position:absolute;z-index:19;left:var(--stab-x);top:var(--stab-y);width:5px;height:5px;border-radius:50%;background:var(--gold);box-shadow:0 0 10px var(--gold);opacity:0;pointer-events:none}
.sizzle-1{--spark-x:28px;--spark-y:-32px;animation:sizzlePop 1.85s .72s ease-out both}
.sizzle-2{--spark-x:-34px;--spark-y:-19px;animation:sizzlePop 1.85s .78s ease-out both}
.sizzle-3{--spark-x:37px;--spark-y:22px;animation:sizzlePop 1.85s .82s ease-out both}
.sizzle-4{--spark-x:-29px;--spark-y:31px;animation:sizzlePop 1.85s .86s ease-out both}
@keyframes sizzlePop{0%{opacity:0;transform:translate(0,0) scale(.5)}8%{opacity:1}26%{opacity:0;transform:translate(var(--spark-x),var(--spark-y)) scale(1.25)}100%{opacity:0}}
@media(max-width:800px){.trick-resolution.resolve-north{--collect-y:-130px}.trick-resolution.resolve-south{--collect-y:132px}.trick-resolution.resolve-west{--collect-x:-135px}.trick-resolution.resolve-east{--collect-x:135px}.trick-winner-callout{top:-39px}.kabob-skewer{width:170px}}
@media(max-width:520px){.trick-winner-callout{top:-30px;min-width:170px}.kabob-skewer{width:145px}}
@media(prefers-reduced-motion:reduce){.trick-resolution,.trick-resolution .trick-card,.trick-resolution .trick-card.is-winning-card,.kabob-skewer,.trick-winner-callout,.sizzle-particle,.seat.is-trick-winner{animation:none!important}.trick-resolution{opacity:1;transform:none}.trick-resolution .trick-card.is-winning-card .card-face{box-shadow:0 0 0 2px var(--gold),0 0 22px rgba(244,200,91,.55)}.trick-winner-callout{opacity:1;transform:translateX(-50%)}}

/* A hand is presented before the authoritative bidding phase is allowed to advance. */
.deal-sequence{position:absolute;inset:0;z-index:8;overflow:hidden;pointer-events:none;background:radial-gradient(circle at center,rgba(4,28,29,.42),transparent 45%)}
.deal-sequence[hidden]{display:none}
.deal-label{position:absolute;z-index:140;left:50%;top:calc(50% + 64px);min-width:205px;transform:translateX(-50%);padding:9px 13px;border:1px solid rgba(244,200,91,.48);background:rgba(3,15,16,.92);box-shadow:0 12px 36px rgba(0,0,0,.46);text-align:center}
.deal-label b,.deal-label strong,.deal-label small{display:block}
.deal-label b{color:var(--cyan);font:900 7px/1 'Courier New',monospace;text-transform:uppercase}
.deal-label strong{margin-top:4px;color:var(--gold);font:950 11px/1 'Courier New',monospace;text-transform:uppercase}
.deal-label small{margin-top:5px;color:rgba(255,241,207,.58);font:700 7px/1 'Courier New',monospace;text-transform:uppercase}
.deal-deck,.deal-card{position:absolute;left:50%;top:50%;width:38px;height:54px;border:2px solid #fff3d1;border-radius:5px;background:linear-gradient(rgba(4,24,24,.08),rgba(4,24,24,.08)),url('/media/kabobs-card-back-v1.webp?v=1') center/cover no-repeat,#071d20;box-shadow:0 0 0 2px #183b38,0 5px 13px rgba(0,0,0,.48)}
.jackie-dealer{position:absolute;z-index:60;left:50%;top:50%;width:clamp(152px,21vw,242px);transform:translate(-16%,-40%);transform-origin:16% 40%;opacity:0;filter:drop-shadow(0 20px 22px rgba(0,0,0,.54));will-change:transform,opacity;animation:jackieDealerEntrance 2.46s cubic-bezier(.2,.72,.2,1) both}
.jackie-dealer img{display:block;width:100%;height:auto;transform-origin:16% 40%;animation:jackieDealerOffer .62s .18s ease-in-out 3 alternate}
@keyframes jackieDealerEntrance{0%{opacity:0;transform:translate(38%,-40%) rotate(2deg)}14%{opacity:.98;transform:translate(-13%,-40%) rotate(-.4deg)}78%{opacity:.98;transform:translate(-16%,-40%) rotate(0)}100%{opacity:0;transform:translate(-20%,-40%) rotate(-.6deg)}}
@keyframes jackieDealerOffer{from{transform:translateX(2px) rotate(.15deg)}to{transform:translateX(-3px) rotate(-.35deg)}}
.deal-deck{z-index:130;transform:translate(-50%,-50%) rotate(-3deg);box-shadow:3px -3px 0 #0b3031,6px -6px 0 #164747,0 9px 24px rgba(0,0,0,.58)}
.deal-card{z-index:calc(70 + var(--deal-layer));opacity:0;will-change:transform,opacity;animation:dealAroundTable .52s var(--deal-delay) cubic-bezier(.18,.72,.22,1) both}
.deal-to-north{--deal-x:0px;--deal-y:-190px;--deal-angle:3deg}
.deal-to-south{--deal-x:0px;--deal-y:190px;--deal-angle:-3deg}
.deal-to-west{--deal-x:calc(0px - min(34vw,390px));--deal-y:0px;--deal-angle:-10deg}
.deal-to-east{--deal-x:min(34vw,390px);--deal-y:0px;--deal-angle:10deg}
@keyframes dealAroundTable{0%{opacity:0;transform:translate(-50%,-50%) translate(0,0) rotate(0) scale(1.08)}12%{opacity:1}78%{opacity:1;transform:translate(-50%,-50%) translate(var(--deal-x),var(--deal-y)) rotate(var(--deal-angle)) scale(.82)}100%{opacity:0;transform:translate(-50%,-50%) translate(var(--deal-x),var(--deal-y)) rotate(var(--deal-angle)) scale(.7)}}
.hand-card.is-dealing{pointer-events:none;animation:dealIntoHand .58s var(--hand-deal-delay) cubic-bezier(.16,.78,.22,1) both;will-change:transform,opacity}
@keyframes dealIntoHand{0%{opacity:0;transform:translateY(-245px) rotate(-8deg) scale(.35)}60%{opacity:1;transform:translateY(15px) rotate(2deg) scale(1.03)}100%{opacity:.72;transform:translateY(8px) rotate(0) scale(1)}}

/* Each accepted play travels from its seat into the trick before it settles. */
.trick-card{--arrival-x:0px;--arrival-y:0px;--arrival-rotate:0deg;--rest-rotate:0deg;transform:rotate(var(--rest-rotate))}
.trick-north{--arrival-y:-205px;--arrival-rotate:4deg}
.trick-south{--arrival-y:205px;--arrival-rotate:-4deg}
.trick-west{--arrival-x:-310px;--arrival-rotate:-13deg;--rest-rotate:-6deg}
.trick-east{--arrival-x:310px;--arrival-rotate:13deg;--rest-rotate:6deg}
.trick-card.is-arriving{animation:cardToTrick .46s cubic-bezier(.17,.78,.2,1) both;will-change:transform,opacity}
@keyframes cardToTrick{0%{opacity:.2;transform:translate(var(--arrival-x),var(--arrival-y)) rotate(var(--arrival-rotate)) scale(.68)}72%{opacity:1;transform:translate(0,0) rotate(var(--rest-rotate)) scale(1.06)}100%{opacity:1;transform:translate(0,0) rotate(var(--rest-rotate)) scale(1)}}
.trick-resolution .trick-card.is-arriving:not(.is-winning-card){animation:finalCardToTrick 1.85s ease both}
.trick-resolution .trick-card.is-arriving.is-winning-card{animation:finalWinnerCardPunch 1.85s ease both}
@keyframes finalCardToTrick{0%{opacity:.2;transform:translate(var(--arrival-x),var(--arrival-y)) rotate(var(--arrival-rotate)) scale(.68)}20%,62%{opacity:1;transform:translate(0,0) rotate(var(--rest-rotate)) scale(1)}100%{opacity:.24;transform:translate(0,0) rotate(var(--rest-rotate)) scale(1)}}
@keyframes finalWinnerCardPunch{0%{opacity:.2;transform:translate(var(--arrival-x),var(--arrival-y)) rotate(var(--arrival-rotate)) scale(.68)}20%{opacity:1;transform:translate(0,0) rotate(var(--rest-rotate)) scale(1)}38%{transform:rotate(calc(var(--rest-rotate) - 2deg)) scale(1.12)}55%,70%{transform:rotate(calc(var(--rest-rotate) + 1deg)) scale(1.07)}100%{transform:rotate(var(--rest-rotate)) scale(.98);opacity:.55}}
@keyframes winnerCardPunch{0%,22%{transform:rotate(var(--rest-rotate)) scale(1)}38%{transform:rotate(calc(var(--rest-rotate) - 2deg)) scale(1.12)}55%,70%{transform:rotate(calc(var(--rest-rotate) + 1deg)) scale(1.07)}100%{transform:rotate(var(--rest-rotate)) scale(.98);opacity:.55}}

@media(max-width:800px){.deal-to-north{--deal-y:-145px}.deal-to-south{--deal-y:150px}.deal-to-west{--deal-x:-125px}.deal-to-east{--deal-x:125px}.trick-north{--arrival-y:-150px}.trick-south{--arrival-y:150px}.trick-west{--arrival-x:-160px}.trick-east{--arrival-x:160px}}
@media(max-width:520px){.deal-label{top:calc(50% + 55px);min-width:180px}.jackie-dealer{width:152px}.deal-deck,.deal-card{width:31px;height:44px}.deal-to-north{--deal-y:-120px}.deal-to-south{--deal-y:125px}.deal-to-west{--deal-x:-105px}.deal-to-east{--deal-x:105px}.trick-west{--arrival-x:-135px}.trick-east{--arrival-x:135px}}
@media(prefers-reduced-motion:reduce){.deal-sequence{background:transparent}.deal-sequence.is-reduced-motion .deal-card{display:none}.jackie-dealer,.jackie-dealer img{animation:none!important}.jackie-dealer{opacity:.9}.deal-label{top:calc(50% + 58px)}.hand-card.is-dealing{animation:none!important}.trick-card.is-arriving,.trick-resolution .trick-card.is-arriving{animation:none!important}}

/* Readability pass: retain the compact table while keeping interface copy legible. */
.brand small{font-size:9px}
.game-header>p,.game-header button{font-size:10px}
.scoreboard article>span{font-size:10px}
.scoreboard article>small{font-size:8px;line-height:1.4}
.scoreboard>div span,.scoreboard>div small{font-size:8px}
.seat b{font-size:14px}
.seat small,.seat dt,.seat em{font-size:8px;line-height:1.3}
.seat dd{font-size:14px}
.turn-status{font-size:10px}
.bidding>p{font-size:9px}
.bidding>span{font-size:10px}
.hand-zone>p{font-size:9px}
.summary-card>p,.rules>p{font-size:9px}
.rules ul{font-size:13px}
.rules>small{font-size:10px}
footer{font-size:8px}
.deal-label b,.deal-label small{font-size:8px}
.deal-label strong{font-size:13px}
.trick-winner-callout b{font-size:10px}
.trick-winner-callout strong{font-size:13px}
.trick-winner-callout small{font-size:8px}
@media(max-width:520px){.scoreboard article>span{font-size:8px}.scoreboard article>small{font-size:7px}.turn-status{font-size:8px}}

/* Readable, presentation-only suit layout. Bidding never dims or covers the hand. */
.hand-settings{width:min(1120px,calc(100% - 28px));margin:14px auto;border:1px solid #c9aa67;border-radius:12px;background:#072c2c;color:#fff1cf}
.hand-settings summary{min-height:48px;padding:15px 18px;cursor:pointer;font:700 15px/1.25 Arial,sans-serif;color:#f4d58b}
.hand-settings-content{padding:2px 18px 18px}.hand-settings label{display:block;margin-bottom:8px;font-size:16px;font-weight:700}
.hand-settings select{width:100%;max-width:700px;min-height:48px;padding:10px;font-size:16px;border:2px solid #d2b36f;border-radius:8px;background:#fff7e6;color:#133133}
.suit-order-preview{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}.suit-chip{background:#fff5dd;color:#162d2c;border-radius:7px;padding:9px 13px;font-size:16px;font-weight:700}.suit-chip.is-red{color:#a51e36}
.hand-settings button{min-height:48px;padding:10px 16px;border:1px solid #f4d58b;border-radius:8px;background:#ead08e;color:#142f2b;font-size:15px;font-weight:700;cursor:pointer}
.hand-settings p{margin:12px 0 0;font-size:14px;line-height:1.55;color:#dfe5d6}
.hand-settings :is(summary,select,button):focus-visible{outline:3px solid #fff2ab;outline-offset:4px}
.table-wrap{min-height:470px}.table-wrap:before{inset:55px 9% 48px}.seat-south{bottom:12px}.trick{top:56%}
.hand-zone{position:relative;inset:auto;width:min(1180px,calc(100% - 28px));height:auto;margin:10px auto 18px;padding:16px;border:1px solid #b8985b;border-radius:14px;background:#062c2c}
.hand-zone>p{flex-wrap:wrap;gap:8px;line-height:1.4;font:700 18px/1.35 Georgia,serif;margin:0 0 14px}.hand-zone>p small{display:block;font:14px/1.45 Arial,sans-serif;color:#e0e5db}
.hand{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;height:auto;padding:0}
.hand-suit-group{min-width:0;padding:12px 9px;border:1px solid #bfa46466;border-radius:10px;background:#fff5df0a}
.hand-suit-group h3{display:flex;align-items:center;gap:7px;background:#fff4d9;color:#162d2c;font:700 17px/1.3 Georgia,serif;padding:8px;margin:0 0 10px;border-radius:6px}.hand-suit-group h3.is-red{color:#a51e36}.hand-suit-group h3>span{font-size:23px}.hand-suit-group h3 small{margin-left:auto;font:14px Arial,sans-serif}
.suit-cards{display:flex;flex-wrap:wrap;align-items:flex-start;gap:7px}.empty-suit{padding:12px 2px;font-size:14px;color:#d9e1d6}
.hand-card{flex:0 0 54px;width:54px;min-width:54px;height:82px;margin:0;padding:0;transform:none;filter:none;opacity:1;border:2px solid #d4cbb7;border-radius:7px;color:#142827;box-shadow:0 3px 8px #0005;cursor:default}
.hand-card.is-red{color:#a51e36}.hand-card:disabled{opacity:1;filter:none;cursor:default}.hand-card .card-corner{left:5px;top:5px}.hand-card .card-corner b{font-size:20px}.hand-card .card-corner i{font-size:17px}.hand-card .card-corner-bottom{display:block;left:auto;right:5px;top:auto;bottom:5px}.hand-card .card-suit{font-size:30px}
.hand-card.is-legal{border-color:#39f6d2;box-shadow:0 0 0 1px #39f6d2,0 0 13px #39f6d24d;cursor:pointer}.hand-card.is-legal:hover,.hand-card.is-legal:focus-visible{transform:translateY(-5px);outline:3px solid #f4d58b;outline-offset:2px}
.bidding{position:relative;inset:auto;transform:none;width:min(860px,calc(100% - 28px));margin:0 auto 24px;padding:22px;border-radius:14px;box-shadow:0 8px 24px #0004}.bidding[hidden]{display:none}.bidding h1{font:700 clamp(25px,4vw,36px)/1.2 Georgia,serif;letter-spacing:0;text-transform:none}.bidding>p{font-size:12px}.bidding>span{font:15px/1.5 Arial,sans-serif;color:#e5e7dc}.bid-grid{gap:9px}.bid-grid button{min-width:44px;min-height:48px;font-size:20px;border-radius:7px;background:#fff1cf;color:#102d2b;border:2px solid #e6c779}.bid-grid button:first-child{color:#102d2b;background:#b7f3df}.bid-grid button:disabled{opacity:.6;cursor:default}
.is-bidding .table-wrap{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;min-height:0;padding:12px 24px 4px;background:none}.is-bidding .table-wrap:before,.is-bidding .trick,.is-bidding .ambient-feather{display:none}.is-bidding .seat{position:relative;inset:auto;transform:none;width:auto;min-width:0}.is-bidding .seat.is-turn{transform:none}.is-bidding .turn-status{position:relative;inset:auto;transform:none;grid-column:1/-1;text-align:center;font:700 15px/1.4 Arial,sans-serif;padding:12px}.is-bidding .seat-south{order:3}.is-bidding .seat-west{order:4}.is-bidding .turn-status{order:5}
@media(max-width:800px){.table-wrap{min-height:400px}.trick{top:54%}.hand{grid-template-columns:repeat(2,minmax(0,1fr))}.hand-suit-group{padding:10px 8px}.is-bidding .table-wrap{grid-template-columns:repeat(2,minmax(0,1fr));padding:10px 14px}.is-bidding .seat{width:auto;min-height:75px}.bid-grid{grid-template-columns:repeat(7,minmax(0,1fr))}}
@media(max-width:520px){.table-wrap{min-height:380px}.table-wrap:before{inset:45px 2% 45px}.seat-south{bottom:9px}.hand-zone{width:calc(100% - 16px);padding:11px}.hand{gap:8px}.hand-zone>p small{display:block}.hand-suit-group h3{font-size:15px;gap:5px;padding:7px 5px}.hand-suit-group h3>span{font-size:20px}.hand-card{flex-basis:44px;width:44px;min-width:44px;height:72px;margin:0;border-radius:6px}.hand-card .card-corner{left:4px;top:4px}.hand-card .card-corner b{font-size:18px}.hand-card .card-corner i{font-size:15px}.hand-card .card-corner-bottom{display:none}.hand-card .card-suit{font-size:26px;left:65%;top:62%}.suit-cards{gap:5px}.bidding{width:calc(100% - 16px);padding:16px}.bid-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:7px}.bid-grid button:first-child{grid-column:span 1}.is-bidding .seat dl{grid-column:1/3}.is-bidding .seat>em{display:none}.hand-settings{width:calc(100% - 16px)}.hand-settings-content{padding:2px 12px 16px}.suit-chip{padding:8px;font-size:14px}}
@media(prefers-reduced-motion:reduce){.hand-card.is-legal:hover,.hand-card.is-legal:focus-visible{transform:none}}
.hand-suit-group h3{flex-wrap:wrap}
.last-move{width:min(1180px,calc(100% - 28px));margin:14px auto;border:1px solid #bfa464;border-radius:12px;padding:14px 16px;background:#082d2d}.last-move[hidden],.last-move-detail[hidden]{display:none}.last-move-heading{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px}.last-move-heading p{flex:1 1 240px;margin:0;font:700 16px/1.5 Georgia,serif;color:#fff3d8}.last-move-heading button{min-height:48px;padding:11px 18px;border:1px solid #edcf8b;border-radius:8px;background:linear-gradient(135deg,#fff0bd,#d4af62);color:#16312c;font-size:16px;font-weight:700;cursor:pointer}.last-move-heading button:focus-visible{outline:3px solid #fff2ab;outline-offset:4px}.last-move-detail{display:flex;flex-wrap:wrap;align-items:flex-start;gap:18px;border-top:1px solid #bca16b80;margin-top:14px;padding-top:16px}.last-move-card{flex:0 0 78px;width:78px;height:112px}.last-move-card .card-corner b{font-size:24px}.last-move-card .card-corner i{font-size:21px}.last-move-card .card-suit{font-size:40px}.last-move-copy{flex:1 1 220px;min-width:0}.last-move-copy h3{font:700 19px/1.35 Georgia,serif;margin:0 0 8px}.last-move-copy p,.last-move-copy ol{font:15px/1.6 Arial,sans-serif;margin:8px 0}.last-move-copy ol{padding-left:23px}.last-move-copy li{overflow-wrap:anywhere}
.ambient-feather,.table-wrap:before{pointer-events:none}
@media(max-width:520px){.last-move{width:calc(100% - 16px);padding:12px}.last-move-heading p{font-size:15px}.last-move-heading button{width:100%}.last-move-detail{gap:14px}.last-move-copy{flex-basis:150px}.last-move-copy h3{font-size:17px}}

/* One physical skewer. Its aligned rear shaft is behind the gathered cards;
   only its emerging front and point are above them, making the penetration visible. */
.trick-resolution{--pile-x:140px;--pile-y:56px;--skewer-length:205px}
.trick-resolution.resolve-south{--pile-x:140px;--pile-y:164px}.trick-resolution.resolve-west{--pile-x:71px;--pile-y:110px}.trick-resolution.resolve-east{--pile-x:209px;--pile-y:110px}
.trick-north{--card-x:140px;--card-y:56px}.trick-south{--card-x:140px;--card-y:164px}.trick-west{--card-x:71px;--card-y:110px}.trick-east{--card-x:209px;--card-y:110px}
.trick-resolution .trick-card{--gather-x:calc(var(--pile-x) - var(--card-x) + (var(--play-order) - 1.5)*3px);--gather-y:calc(var(--pile-y) - var(--card-y) + (var(--play-order) - 1.5)*2px);z-index:3}
.trick-resolution .trick-card,.trick-resolution .trick-card.is-winning-card,.trick-resolution .trick-card.is-arriving:not(.is-winning-card),.trick-resolution .trick-card.is-arriving.is-winning-card{animation:trickCardPierceGather 1.85s ease both}
.trick-resolution .trick-card.is-arriving:not(.is-winning-card),.trick-resolution .trick-card.is-arriving.is-winning-card{animation-name:trickCardPierceArrival}
.trick-resolution .trick-card.is-winning-card{z-index:13;--gather-x:0px;--gather-y:0px}
@keyframes trickCardPierceGather{0%,16%{transform:translate(0,0) rotate(var(--rest-rotate));opacity:1}32%,72%{transform:translate(var(--gather-x),var(--gather-y)) rotate(var(--rest-rotate));opacity:1}100%{transform:translate(var(--gather-x),var(--gather-y)) rotate(var(--rest-rotate)) scale(.98);opacity:.4}}
@keyframes trickCardPierceArrival{0%{transform:translate(var(--arrival-x),var(--arrival-y)) rotate(var(--arrival-rotate)) scale(.68);opacity:.2}16%{transform:translate(0,0) rotate(var(--rest-rotate));opacity:1}32%,72%{transform:translate(var(--gather-x),var(--gather-y)) rotate(var(--rest-rotate));opacity:1}100%{transform:translate(var(--gather-x),var(--gather-y)) rotate(var(--rest-rotate)) scale(.98);opacity:.4}}
.kabob-skewer{position:absolute;inset:0;z-index:auto;width:100%;height:100%;margin:0;border:0;border-radius:0;background:none;box-shadow:none;opacity:1;transform:none;animation:none;pointer-events:none}
.kabob-skewer:before,.kabob-skewer:after{content:'';position:absolute;left:var(--pile-x);top:var(--pile-y);right:auto;bottom:auto;width:var(--skewer-length);transform-origin:50% 50%;background:linear-gradient(180deg,#edc383,#af793b 45%,#71491e);animation:skewerPierce 1.85s cubic-bezier(.18,.8,.25,1) both;filter:drop-shadow(0 2px 2px #0007)}
.kabob-skewer:before{z-index:2;height:7px;border:1px solid #714b2b;border-radius:999px;box-sizing:border-box}
.kabob-skewer:after{z-index:18;height:12px;border:0;border-radius:0;clip-path:polygon(72% 21%,92% 21%,92% 0,100% 50%,92% 100%,92% 79%,72% 79%)}
@keyframes skewerPierce{0%,30%{opacity:0;transform:translate(calc(-50% - 140px),-50%) rotate(31deg)}43%,100%{opacity:1;transform:translate(-50%,-50%) rotate(31deg)}}
.trick-resolution .is-winning-card .card-face:after{content:'';position:absolute;right:0;top:68%;width:10px;height:4px;border-radius:50%;background:#4e341555;box-shadow:inset 1px 1px 2px #392310aa;transform:rotate(31deg);pointer-events:none}
@media(max-width:800px){.trick-resolution{--skewer-length:170px}}
@media(max-width:520px){.trick-resolution{--skewer-length:145px}}
@media(prefers-reduced-motion:reduce){.trick-resolution .trick-card,.trick-resolution .trick-card.is-winning-card,.trick-resolution .trick-card.is-arriving:not(.is-winning-card),.trick-resolution .trick-card.is-arriving.is-winning-card{animation:none!important;transform:translate(var(--gather-x),var(--gather-y)) rotate(var(--rest-rotate));opacity:1}.kabob-skewer:before,.kabob-skewer:after{animation:none!important;opacity:1;transform:translate(-50%,-50%) rotate(31deg)}}