/* Thirteen collectible cards around a black lacquer table; the owner's
   signature is the only expressive flourish. Shared suit background stays intact. */
body.theater :is(.table-page,.winners-page) { --signature:'Allura','Segoe Script','Brush Script MT',cursive; }
body.theater .spades-heading { padding:61px 0 25px; text-align:center; }
body.theater .spades-heading h1 { font:400 clamp(45px,6.2vw,76px)/1.15 var(--display); letter-spacing:-.05em; }
body.theater .spades-heading>p { margin-top:24px; color:#b5b5b5; font-size:16px; line-height:1.8; }
body.theater .spades-experience { padding:10px 0 48px; }
body.theater .spades-surface { width:min(790px,100%); aspect-ratio:1; position:relative; margin:auto; isolation:isolate; container-type:inline-size; }
body.theater .spades-rim { position:absolute; inset:2%; border-radius:50%; border:1px solid #363636; background:radial-gradient(ellipse at 50% 15%,#ffffff08,transparent 50%),radial-gradient(circle,#000 55%,#080808 70%,#000 74%); box-shadow:inset 0 2px 1px #ffffff25,inset 0 -8px 15px #000,0 24px 45px #000; z-index:-1; }
body.theater .spades-rim::before,body.theater .spades-rim::after { content:''; position:absolute; border:1px solid #ffffff12; border-radius:50%; inset:3%; }
body.theater .spades-rim::after { inset:21.5%; border-color:#ffffff0d; }
body.theater .spades-orbit { position:absolute; inset:0; }
body.theater .table-page .spades-position-0 { --card-x:50.0000%; --card-y:9.9000%; --card-angle:0.0000deg; --deal-order:0; --deal-x:0.0000cqw; --deal-y:40.1000cqw; }
body.theater .table-page .spades-position-1 { --card-x:68.6354%; --card-y:14.4932%; --card-angle:27.6923deg; --deal-order:1; --deal-x:-18.6354cqw; --deal-y:35.5068cqw; }
body.theater .table-page .spades-position-2 { --card-x:83.0017%; --card-y:27.2206%; --card-angle:55.3846deg; --deal-order:2; --deal-x:-33.0017cqw; --deal-y:22.7794cqw; }
body.theater .table-page .spades-position-3 { --card-x:89.8076%; --card-y:45.1665%; --card-angle:83.0769deg; --deal-order:3; --deal-x:-39.8076cqw; --deal-y:4.8335cqw; }
body.theater .table-page .spades-position-4 { --card-x:87.4942%; --card-y:64.2197%; --card-angle:110.7692deg; --deal-order:4; --deal-x:-37.4942cqw; --deal-y:-14.2197cqw; }
body.theater .table-page .spades-position-5 { --card-x:76.5912%; --card-y:80.0153%; --card-angle:138.4615deg; --deal-order:5; --deal-x:-26.5912cqw; --deal-y:-30.0153cqw; }
body.theater .table-page .spades-position-6 { --card-x:59.5966%; --card-y:88.9348%; --card-angle:166.1538deg; --deal-order:6; --deal-x:-9.5966cqw; --deal-y:-38.9348cqw; }
body.theater .table-page .spades-position-7 { --card-x:40.4034%; --card-y:88.9348%; --card-angle:193.8462deg; --deal-order:7; --deal-x:9.5966cqw; --deal-y:-38.9348cqw; }
body.theater .table-page .spades-position-8 { --card-x:23.4088%; --card-y:80.0153%; --card-angle:221.5385deg; --deal-order:8; --deal-x:26.5912cqw; --deal-y:-30.0153cqw; }
body.theater .table-page .spades-position-9 { --card-x:12.5058%; --card-y:64.2197%; --card-angle:249.2308deg; --deal-order:9; --deal-x:37.4942cqw; --deal-y:-14.2197cqw; }
body.theater .table-page .spades-position-10 { --card-x:10.1924%; --card-y:45.1665%; --card-angle:276.9231deg; --deal-order:10; --deal-x:39.8076cqw; --deal-y:4.8335cqw; }
body.theater .table-page .spades-position-11 { --card-x:16.9983%; --card-y:27.2206%; --card-angle:304.6154deg; --deal-order:11; --deal-x:33.0017cqw; --deal-y:22.7794cqw; }
body.theater .table-page .spades-position-12 { --card-x:31.3646%; --card-y:14.4932%; --card-angle:332.3077deg; --deal-order:12; --deal-x:18.6354cqw; --deal-y:35.5068cqw; }
body.theater .table-page .spades-orbit-card { position:absolute; left:var(--card-x); top:var(--card-y); width:9.25%; min-width:32px; max-width:74px; aspect-ratio:5/7; padding:0; border:0; margin:0; border-radius:5px; background:transparent; color:#000; transform:translate(-50%,-50%) rotate(var(--card-angle)); perspective:750px; z-index:2; cursor:pointer; touch-action:pan-y; }
body.theater .table-page .spades-orbit-card:focus-visible { outline:2px solid #fff; outline-offset:6px; }
body.theater .table-page .spades-orbit-card[id] { scroll-margin-top:130px; }
body.theater .table-page .spades-orbit-card::after { content:''; position:absolute; inset:-6px; border-radius:8px; }
/* The outer card travels from a shared stack. Its inner layer remains free
   to turn over immediately when someone chooses an earned seat. */
@supports (width:1cqw) {
  body.theater .table-page .is-dealing .spades-orbit-card { animation:spades-deal 720ms cubic-bezier(.19,.75,.24,1) calc(var(--deal-order)*85ms) both; will-change:transform; }
}
body.theater .spades-card-inner { position:absolute; inset:0; display:block; transform-style:preserve-3d; transition:transform .65s cubic-bezier(.2,.7,.15,1); }
body.theater .is-signed .spades-card-inner { transform:rotateY(180deg); }
body.theater .spades-card-front,body.theater .spades-card-reverse { position:absolute; inset:0; display:block; backface-visibility:hidden; -webkit-backface-visibility:hidden; border-radius:5px; overflow:hidden; }
body.theater .spades-card-front { background:#f7f7f7; border:1px solid #e4e4e4; color:#000; box-shadow:0 2px 3px #0009; }
body.theater .spades-card-front::after { content:''; position:absolute; inset:5px; border:1px solid #00000014; border-radius:2px; pointer-events:none; }
body.theater .spades-corner { display:flex; position:absolute; align-items:center; flex-direction:column; gap:1px; font:400 clamp(8px,1.15vw,13px)/1 var(--display); }
body.theater .spades-corner-top { top:6%; left:10%; }
body.theater .spades-corner-bottom { bottom:6%; right:10%; transform:rotate(180deg); }
body.theater .spades-symbol { display:block; width:100%; height:auto; }
body.theater .spades-corner .spades-symbol { width:.58em; }
body.theater .spades-face-mark { display:grid; position:absolute; inset:29% 29%; place-items:center; }
body.theater .spades-court { position:absolute; inset:23% 22%; display:grid; place-items:center; }
body.theater .spades-court>span { font:400 clamp(18px,3vw,37px)/1 var(--display); position:relative; z-index:1; }
body.theater .spades-court>.spades-symbol { position:absolute; inset:auto; width:105%; opacity:.09; }
body.theater .is-claimed:hover .spades-card-front { background:#fff; box-shadow:0 0 0 2px #fff,0 10px 15px #0009; }
body.theater .is-claimed.is-signed { z-index:3; }
body.theater .spades-card-reverse { transform:rotateY(180deg); background:#050505; border:1px solid #efefef; color:#fff; text-align:center; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:18% 8%; }
body.theater .spades-card-reverse::before { content:''; position:absolute; inset:5px; border:1px solid #ffffff30; border-radius:2px; pointer-events:none; }
body.theater .is-claimed .spades-card-front::before,
body.theater .is-claimed .spades-card-reverse::after,
body.theater .spades-feature-card .spades-card-reverse::after { content:''; position:absolute; inset:-30%; z-index:2; pointer-events:none; background:linear-gradient(110deg,transparent 25%,#94949415 41%,#ffffffb8 49%,#96969614 57%,transparent 72%); transform:translateX(-135%); opacity:0; }
body.theater .is-polishing .is-claimed .spades-card-front::before { animation:spades-polish 720ms ease calc(650ms + var(--deal-order)*85ms) both; }
body.theater .is-claimed:is(:hover,:focus-visible) .spades-card-front::before,
body.theater .is-claimed.is-signed .spades-card-reverse::after { animation:spades-polish-interactive 850ms ease 150ms both; }
body.theater .spades-feature-card .spades-card-reverse::after { animation:spades-polish-interactive 950ms ease 350ms both; }
body.theater .spades-winner-label { font-size:5px; color:#a8a8a8; margin-bottom:5px; }
body.theater .spades-owner-name { font-size:clamp(5px,.65vw,8px); line-height:1.4; overflow-wrap:anywhere; }
body.theater .spades-owner-signature { font:400 clamp(7px,1.15vw,14px)/1.15 var(--signature); margin-top:3px; overflow-wrap:anywhere; transform:rotate(-6deg); }
body.theater .spades-owner-foot { position:absolute; left:8px; right:8px; bottom:10%; color:#a8a8a8; font-size:4px; }
body.theater .table-page .spades-orbit-card.is-unclaimed { cursor:default; }
body.theater .is-unclaimed .spades-card-front { background:#070707; color:#777; border-color:#4a4a4a; }
body.theater .is-unclaimed .spades-card-front::after { border-color:#ffffff0c; }
body.theater .spades-signature-stage { position:absolute; inset:28%; display:grid; place-items:center; perspective:900px; pointer-events:none; }
body.theater .spades-stage-rest { display:flex; flex-direction:column; align-items:center; text-align:center; transition:opacity .25s ease; }
body.theater .spades-stage-rest>img { width:43px; height:auto; margin-bottom:18px; opacity:.9; }
body.theater .spades-stage-rest p { font:400 34px/1.1 var(--display); }
body.theater .spades-stage-rest p>strong { font-weight:400; }
body.theater .spades-stage-rest p>span { color:#858585; font-size:20px; padding-left:9px; }
body.theater .spades-stage-rest>span { color:#999; font-size:12px; margin-top:12px; }
body.theater .spades-stage-cards { position:absolute; inset:0; display:grid; place-items:center; }
body.theater .spades-feature-card { position:absolute; width:60%; min-width:116px; max-width:190px; aspect-ratio:5/7; transform:rotate(-5deg); animation:spades-present .55s cubic-bezier(.2,.7,.15,1) both; }
body.theater .spades-feature-card .spades-card-reverse { transform:none; border-radius:8px; box-shadow:0 15px 24px #000; padding:23% 13%; }
body.theater .spades-feature-card .spades-card-reverse::before { inset:8px; border-radius:4px; }
body.theater .spades-feature-card .spades-winner-label { font-size:10px; margin-bottom:14px; }
body.theater .spades-feature-card .spades-owner-name { max-width:100%; font:400 clamp(15px,2vw,23px)/1.35 var(--display); }
/* Long names step down so they stay on one line instead of breaking mid-word. */
body.theater .spades-feature-card .spades-owner-name.owner-name-long { font-size:clamp(12px,1.3vw,16px); overflow-wrap:normal; white-space:nowrap; }
body.theater .spades-feature-card .spades-owner-name.owner-name-extended { font-size:clamp(10px,1.05vw,13px); overflow-wrap:normal; white-space:nowrap; }
body.theater .spades-feature-card .spades-owner-signature { flex:none; max-width:94%; font-size:clamp(20px,3vw,32px); margin-top:12px; white-space:nowrap; overflow-wrap:normal; }
body.theater .spades-feature-card .spades-owner-signature.signature-long { font-size:clamp(18px,2.4vw,26px); }
body.theater .spades-feature-card .spades-owner-signature.signature-extended { font-size:clamp(14px,1.8vw,20px); }
body.theater .spades-feature-card .spades-owner-foot { font-size:8px; bottom:10%; }
body.theater .spades-feature-card .spades-corner { font-size:14px; }
body.theater .has-selection .spades-stage-rest { opacity:0; }
body.theater .spades-table-note { display:flex; align-items:center; justify-content:space-between; gap:16px; max-width:650px; margin:14px auto 0; font-size:13px; color:#a8a8a8; }
body.theater .spades-table-note a { padding:10px 0; color:#ddd; }
body.theater .spades-ledger { padding:100px 0 65px; }
body.theater .spades-ledger-intro { display:grid; grid-template-columns:1fr 1fr; align-items:end; gap:36px; margin-bottom:40px; }
body.theater .spades-ledger-intro h2 { font:400 clamp(30px,3.5vw,43px)/1.3 var(--display); letter-spacing:-.035em; }
body.theater .spades-ledger-intro>p { color:#b5b5b5; font-size:15px; }
body.theater .spades-winner-list { border-top:1px solid #333; }
body.theater .spades-winner-row { display:grid; grid-template-columns:62px 1.05fr 1.15fr auto; align-items:center; gap:26px; padding:30px 0; border-bottom:1px solid #303030; scroll-margin-top:35px; }
body.theater .spades-ledger-card { width:41px; height:57px; border:1px solid #e9e9e9; background:#f5f5f5; border-radius:3px; color:#000; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; }
body.theater .spades-ledger-card>span { font:400 18px/1 var(--display); }
body.theater .spades-ledger-card .spades-symbol { width:13px; }
body.theater .spades-ledger-person h3 { font:400 19px/1.4 var(--display); overflow-wrap:anywhere; }
body.theater .spades-ledger-handle { color:#b5b5b5; font-size:12px; overflow-wrap:anywhere; margin-top:4px; }
body.theater .spades-ledger-seat { color:#888; font-size:11px; margin-top:7px; }
body.theater .spades-ledger-puzzle>p { color:#aaa; font-size:11px; }
body.theater .spades-ledger-puzzle h4 { font-size:14px; font-weight:400; line-height:1.4; margin:5px 0 0; }
body.theater .spades-ledger-puzzle time { display:block; color:#888; font-size:11px; margin-top:7px; }
body.theater .spades-ledger-prize { margin-top:18px; max-width:32ch; }
body.theater .spades-prize-label { color:#999; font-size:10px; margin-bottom:5px; }
body.theater .spades-prize-main { color:#ddd; font-size:12px; line-height:1.65; }
body.theater .spades-prize-main strong { color:#fff; font-weight:600; }
body.theater .spades-prize-detail { color:#aaa; font-size:11px; line-height:1.7; margin-top:6px; }
body.theater .spades-replay-link { display:flex; align-items:center; justify-content:space-between; gap:14px; min-height:46px; padding:10px 15px; border:1px solid #595959; text-decoration:none; font-size:12px; white-space:nowrap; }
body.theater .spades-replay-link:hover { border-color:#eee; background:#fff; color:#000; }
body.theater .spades-replay-link>span { font-size:17px; }
body.theater .spades-replay-unavailable { display:block; color:#888; font-size:11px; max-width:120px; }
body.theater .spades-winners-heading { text-align:left; padding-bottom:8px; }
body.theater .spades-view-table { display:inline-flex; align-items:center; gap:10px; margin-top:26px; padding:10px 0; font-size:13px; }
body.theater .spades-view-table .spades-symbol { width:12px; }
body.theater .winners-page .spades-ledger { padding-top:40px; }
body.theater .spades-visually-hidden { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }
@keyframes spades-present { from { opacity:0; transform:rotateY(-75deg) rotate(-5deg) scale(.91); } to { opacity:1; transform:rotateY(0) rotate(-5deg) scale(1); } }
@keyframes spades-deal {
  from { transform:translate(calc(-50% + var(--deal-x)),calc(-50% + var(--deal-y))) rotate(-14deg) scale(.84); }
  78% { transform:translate(-50%,-50%) rotate(calc(var(--card-angle) + 3deg)) scale(1.02); }
  to { transform:translate(-50%,-50%) rotate(var(--card-angle)) scale(1); }
}
@keyframes spades-polish { 0% { opacity:0; transform:translateX(-135%); } 18% { opacity:.7; } 80% { opacity:.7; } 100% { opacity:0; transform:translateX(135%); } }
@keyframes spades-polish-interactive { 0% { opacity:0; transform:translateX(-135%); } 18% { opacity:.65; } 80% { opacity:.65; } 100% { opacity:0; transform:translateX(135%); } }
@media(max-width:800px) { body.theater .spades-winner-row { grid-template-columns:46px 1fr 1fr; gap:20px; } body.theater .spades-ledger-action { grid-column:3; margin-top:-8px; } body.theater .spades-ledger-card { grid-row:span 2; } body.theater .spades-ledger-person { grid-row:span 2; } body.theater .spades-ledger-puzzle { align-self:end; } body.theater .spades-replay-link { justify-content:center; max-width:185px; } }
@media(max-width:600px) {
  body.theater .spades-heading { padding:31px 0 20px; }
  body.theater .spades-heading h1 { font-size:46px; }
  body.theater .spades-heading>p { font-size:14px; margin-top:20px; }
  body.theater .spades-experience { padding-top:14px; }
  body.theater .table-page .spades-orbit-card { border-radius:3px; }
  body.theater .spades-card-front,body.theater .spades-card-reverse { border-radius:3px; }
  body.theater .spades-card-front::after { inset:3px; }
  body.theater .spades-corner { font-size:7px; }
  body.theater .spades-court>span { font-size:18px; }
  body.theater .spades-orbit-card .spades-owner-name { font-size:4px; }
  body.theater .spades-orbit-card .spades-owner-signature { font-size:6px; }
  body.theater .spades-orbit-card .spades-winner-label,body.theater .spades-orbit-card .spades-owner-foot { display:none; }
  body.theater .spades-stage-rest>img { width:26px; margin-bottom:12px; }
  body.theater .spades-stage-rest p { font-size:27px; }
  body.theater .spades-stage-rest p>span { font-size:16px; padding-left:5px; }
  body.theater .spades-stage-rest>span { font-size:9px; margin-top:8px; }
  body.theater .spades-feature-card { min-width:109px; width:72%; }
  body.theater .spades-feature-card .spades-owner-name { font-size:13px; }
  body.theater .spades-feature-card .spades-owner-name.owner-name-long { font-size:11px; }
  body.theater .spades-feature-card .spades-owner-name.owner-name-extended { font-size:9px; }
  body.theater .spades-feature-card .spades-owner-signature { font-size:19px; margin-top:7px; }
  body.theater .spades-feature-card .spades-owner-signature.signature-long { font-size:16px; }
  body.theater .spades-feature-card .spades-owner-signature.signature-extended { font-size:13px; }
  body.theater .spades-feature-card .spades-winner-label { font-size:8px; margin-bottom:9px; }
  body.theater .spades-feature-card .spades-owner-foot { font-size:6px; }
  body.theater .spades-feature-card .spades-corner { font-size:10px; }
  body.theater .spades-table-note { font-size:10px; gap:10px; margin-top:17px; }
  body.theater .spades-ledger { padding:64px 0 35px; }
  body.theater .spades-ledger-intro { grid-template-columns:1fr; gap:20px; margin-bottom:30px; }
  body.theater .spades-ledger-intro h2 { font-size:31px; }
  body.theater .spades-ledger-intro>p { font-size:13px; }
  body.theater .spades-winner-row { grid-template-columns:36px 1fr; gap:16px; padding:25px 0; }
  body.theater .spades-ledger-card { width:32px; height:45px; grid-row:1; align-self:start; }
  body.theater .spades-ledger-card>span { font-size:15px; }
  body.theater .spades-ledger-card .spades-symbol { width:10px; }
  body.theater .spades-ledger-person { grid-row:1; }
  body.theater .spades-ledger-person h3 { font-size:19px; }
  body.theater .spades-ledger-handle { font-size:12px; }
  body.theater .spades-ledger-seat { font-size:10px; }
  body.theater .spades-ledger-puzzle { grid-column:2; margin-top:2px; }
  body.theater .spades-ledger-puzzle h4 { font-size:13px; }
  body.theater .spades-ledger-puzzle time { font-size:10px; }
  body.theater .spades-ledger-prize { margin-top:14px; }
  body.theater .spades-ledger-action { grid-column:2; margin-top:0; }
  body.theater .spades-replay-link { justify-content:space-between; min-height:44px; max-width:none; width:100%; font-size:12px; }
  body.theater .spades-replay-unavailable { max-width:none; font-size:11px; }
  body.theater .winners-page .spades-ledger { padding-top:25px; }
}
@media(max-width:360px) { body.theater .spades-feature-card { min-width:97px; } body.theater .spades-feature-card .spades-owner-name { font-size:12px; } body.theater .spades-feature-card .spades-owner-name.owner-name-long { font-size:10px; } body.theater .spades-feature-card .spades-owner-signature { font-size:17px; } body.theater .spades-feature-card .spades-owner-signature.signature-long { font-size:14px; } body.theater .spades-feature-card .spades-owner-signature.signature-extended { font-size:12px; } body.theater .spades-heading h1 { font-size:41px; } }
@media(prefers-reduced-motion:reduce) { body.theater .spades-card-inner,body.theater .spades-stage-rest { transition:none; } body.theater .spades-feature-card,body.theater .table-page .is-dealing .spades-orbit-card,body.theater .is-claimed .spades-card-front::before,body.theater .is-claimed .spades-card-reverse::after,body.theater .spades-feature-card .spades-card-reverse::after { animation:none!important; } }