/* Table composition: centered hands, right seats, left discards. */
#app{max-width:none;width:100%;padding:0 28px;min-height:100dvh;display:flex;flex-direction:column}
.topbar{height:72px;flex-shrink:0}.brand small{font-size:7px}.brand b{font-size:16px}.brand{font-size:12px}.brand-mark{font-size:32px}
.table{flex:none;min-height:430px;height:calc(100dvh - 320px);max-height:850px;padding:26px 34px;border-radius:28px;background:radial-gradient(ellipse at center,#344333 0,#243627 50%,#18281f 100%)}
.table-border{border-radius:20px;inset:8px}
.seat{position:absolute;left:26%;right:26%;display:flex;flex-direction:column;gap:10px;min-height:0}
.seat.opponent{top:26px}.seat.player{bottom:25px}
.hand{order:2;width:100%;height:112px;min-height:112px;gap:8px;padding:0}
.number-card{width:73px;height:112px;flex:0 0 73px;max-width:73px;min-width:73px;animation:none}
.number-card+.number-card{margin-left:0}
.number-card img{width:73px;height:112px;max-height:none;object-fit:fill;border-radius:4px}
.hand:has(.number-card:nth-child(6)){gap:0}.hand:has(.number-card:nth-child(6)) .number-card+.number-card{margin-left:-18px}
.scorebox{order:1;text-align:center;display:flex;align-items:center;justify-content:center;gap:8px;background:#111c14b3;border:1px solid #a696514d;border-radius:5px;padding:7px 15px;min-height:34px;min-width:108px}
.scorebox strong{font:18px Georgia;margin:0}.scorebox>span{display:none}.scorebox small{font-size:8px}.scorebox #opponent-trumps{display:none}
.identity{position:absolute;right:calc(-54.166% + 36px);width:170px;text-align:right;top:0;display:flex;flex-direction:column;align-items:flex-end;gap:0}
.player .identity{top:auto;bottom:0}.identity h1,.identity h2{font-size:24px;margin:4px 0 10px}.identity .eyebrow{font-size:8px;letter-spacing:2px}.hearts{justify-content:flex-end;font-size:21px;gap:5px}.stake{font-size:12px;margin-top:10px;color:var(--gold)}
.center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);height:118px;gap:82px;justify-content:center}
.center:before,.center:after{display:none}.deck,.trump-deck{width:65px;height:99px;flex:none;transform:rotate(4deg)}.trump-deck{transform:rotate(-4deg)}.deck img{width:65px;height:99px;max-height:none;object-fit:fill;border-radius:4px}.deck span{width:29px;height:29px;line-height:27px;right:-11px;bottom:-4px;font-size:12px;transform:none}.deck>small{position:absolute;top:115px;left:50%;transform:translateX(-50%);font:8px Arial;text-transform:uppercase;letter-spacing:2px;color:#bdc4aa;white-space:nowrap}
.target{position:absolute;left:30px;top:50%;transform:translateY(-50%);min-width:0;width:160px;text-align:left;display:flex;align-items:baseline;flex-wrap:wrap;gap:7px;color:var(--muted)}.target>span{font-size:8px;letter-spacing:2px}.target strong{font:28px Georgia;line-height:1;color:var(--gold)}.target small{display:none}.target:has(small:not(:empty)){border:0}
.pool-wrap{position:absolute;right:30px;top:50%;transform:translateY(-50%);width:154px;margin:0}.pool{display:flex;flex-wrap:wrap;gap:5px}.pool span{width:29px;height:34px;line-height:32px;font-size:13px}.pool-wrap small{display:block;font-size:7px;line-height:1.5;letter-spacing:.7px;margin-top:9px}
.played-zone{position:absolute;left:30px;width:210px}.opponent-played{top:28px}.player-played{bottom:28px}.played-label{display:block;font:8px Arial;text-transform:uppercase;letter-spacing:1.5px;margin-bottom:12px;color:#adb698}.played-list{display:flex;align-items:center}.played-placeholder{height:103px;width:67px;border:1px solid #ad9a584d;border-radius:6px;display:grid;place-items:center;color:#82906c55;font-size:25px}.played-card{position:relative;width:67px;height:103px;flex:0 0 67px;filter:drop-shadow(2px 3px 3px #0007);transition:transform 0.12s}.played-card+.played-card{margin-left:-22px}.played-card img{width:67px;height:103px;object-fit:fill;border-radius:4px;filter:saturate(.65) brightness(.85)}.played-card:hover,.played-card:focus-visible{transform:translateY(-6px);z-index:12}.played-tip{display:none;position:absolute;bottom:115px;left:0;width:210px;padding:13px;background:#152017;border:1px solid #ad9a58;box-shadow:0 5px 20px #0008;white-space:normal}.played-tip b{display:block;font:16px Georgia;color:var(--gold);margin-bottom:6px}.played-tip small{font:11px/1.5 Arial}.played-card:hover .played-tip,.played-card:focus-visible .played-tip{display:block}.opponent-played .played-tip{top:113px;bottom:auto}
.actionbar{padding:12px 8px;min-height:68px;border-bottom:0;flex-shrink:0}.actions button{min-width:136px;padding:11px 18px;min-height:43px}.status p{font-size:10px}.status strong{font-size:12px}
.sleeve{position:relative;padding:0 0 4px;min-height:160px;flex:1;display:flex;flex-direction:column;justify-content:flex-end}.sleeve-heading{position:absolute;top:1px;left:8px;right:8px;pointer-events:none}.sleeve-heading h2{font-size:8px}.sleeve-heading small{display:none}.sleeve-heading button{pointer-events:auto}
.trumps{display:flex;align-items:flex-end;justify-content:center;gap:0;overflow:visible;min-height:151px;padding:0 30px 8px;isolation:isolate}
.trumps>.trump{position:relative;display:block;width:91px;height:140px;flex:0 0 91px;padding:0;border:0;background:none;border-radius:6px;transform-origin:50% 140%;transform:translateY(var(--fan-drop,0px)) rotate(var(--fan-angle,0deg));transition:transform 0.1467s ease,filter 0.1467s ease;filter:drop-shadow(2px 5px 4px #0009);overflow:visible}
.trumps>.trump+.trump{margin-left:-15px}.trumps>.trump>img{display:block;width:91px;height:140px;object-fit:fill;filter:none;border-radius:6px}
.trumps>.trump>.copy{position:absolute;left:50%;bottom:calc(100% + 15px);transform:translateX(-50%);width:220px;padding:15px;text-align:center;background:#172219f5;border:1px solid #b5a16b;box-shadow:0 8px 30px #000b;border-radius:6px;opacity:0;visibility:hidden;pointer-events:none;transition:opacity 0.12s}.trumps>.trump>.copy b{font-size:18px}.trumps>.trump>.copy small{font-size:11px;line-height:1.5}.trumps>.trump>.copy .cost{margin-top:3px;font-size:8px}
.trumps>.trump:hover:enabled,.trumps>.trump:focus-visible{transform:translateY(-24px) rotate(0deg) scale(1.13);z-index:30;background:none;filter:drop-shadow(0 12px 12px #0009)}.trumps>.trump:hover:enabled>.copy,.trumps>.trump:focus-visible>.copy{opacity:1;visibility:visible}.trumps>.trump:disabled{opacity:.6}.trumps.many>.trump+.trump{margin-left:-49px}
.trumps>.empty{min-height:96px;max-width:350px;border:0;background:none;opacity:.65;font-size:11px}.empty span{font-size:28px}footer{padding:8px 8px 12px;position:relative;z-index:0;min-height:30px;font-size:8px}
@media(min-width:1600px){.table{height:calc(100dvh - 325px)}.trumps>.trump,.trumps>.trump>img{width:98px;height:151px}.trumps>.trump{flex-basis:98px}.trumps{min-height:163px}.sleeve{min-height:175px}}
@media(max-height:750px) and (min-width:801px){.topbar{height:58px}.table{height:calc(100dvh - 262px);min-height:345px}.seat.opponent{top:17px}.seat.player{bottom:17px}.hand{height:91px;min-height:91px}.number-card,.number-card img{width:59px;height:91px;min-width:59px;max-width:59px;flex-basis:59px}.seat{gap:6px}.scorebox{padding:5px 10px;min-height:29px}.scorebox strong{font-size:15px}.deck,.deck img{width:53px;height:81px}.deck>small{top:94px}.center{height:87px}.played-placeholder,.played-card,.played-card img{height:85px;width:55px}.played-card{flex-basis:55px}.actionbar{min-height:58px;padding:7px}.trumps>.trump,.trumps>.trump>img{width:77px;height:119px}.trumps>.trump{flex-basis:77px}.trumps{min-height:123px}.sleeve{min-height:135px}.played-label{margin-bottom:8px}}
@media(max-width:1000px){#app{padding:0 15px}.seat{left:23%;right:23%}.identity{right:calc(-42.59% + 22px);width:130px}.identity h1,.identity h2{font-size:20px}.hearts{font-size:17px;gap:3px}.identity .eyebrow{display:none}.played-zone{left:22px;width:140px}.played-card+.played-card{margin-left:-30px}.pool-wrap{right:22px;width:115px}.pool span{width:23px;height:28px;line-height:26px}.target{left:22px;width:130px}.target>span{font-size:7px;letter-spacing:1px}.hand{gap:5px}.number-card,.number-card img{width:65px;height:100px;min-width:65px;max-width:65px;flex-basis:65px}.hand{height:100px;min-height:100px}}
@media(max-width:800px){#app{padding:0 10px}.topbar{height:64px}.table{height:530px;min-height:530px;border-radius:22px;padding:0}.table-border{border-radius:15px}.seat{left:22%;right:22%;gap:8px}.seat.opponent{top:22px}.seat.player{bottom:23px}.identity{right:calc(-39.285% + 17px);width:100px}.identity h1,.identity h2{font-size:17px;flex:auto}.hearts{font-size:14px;gap:2px}.stake{font-size:10px;margin-top:7px}.scorebox{padding:6px 10px;min-width:90px;min-height:29px}.scorebox strong{font-size:16px}.scorebox small{display:none}.hand{height:98px;min-height:98px}.number-card,.number-card img{width:64px;height:98px;min-width:64px;max-width:64px;flex-basis:64px}.center{gap:60px;top:50%;height:95px}.deck,.deck img{width:59px;height:91px}.deck>small{top:103px;font-size:7px}.played-zone{left:17px;width:90px}.opponent-played{top:24px}.player-played{bottom:25px}.played-label{font-size:7px;line-height:1.5;letter-spacing:.5px;max-width:85px}.played-placeholder,.played-card,.played-card img{width:47px;height:73px}.played-card{flex-basis:47px}.played-list{flex-wrap:wrap;gap:4px}.played-card+.played-card{margin-left:-30px}.played-tip{width:165px}.target{left:17px;width:85px;gap:4px}.target strong{font-size:23px}.pool-wrap{right:17px;width:83px}.pool{gap:3px}.pool span{width:24px;height:27px;line-height:25px;font-size:11px}.pool-wrap small{font-size:6px;letter-spacing:0}.actionbar{flex-direction:row;align-items:center;min-height:70px;padding:12px 3px;gap:10px}.status p{max-width:240px;font-size:9px}.actions{display:flex;gap:6px}.actions button{min-width:90px;padding:10px;font-size:10px}.trumps{min-height:151px}.sleeve{min-height:165px}.sleeve-heading{left:3px;right:3px}.sleeve-heading h2{letter-spacing:1px}.trumps>.trump+.trump{margin-left:-28px}footer{font-size:7px}}
@media(max-width:580px){.table{height:480px;min-height:480px}.seat{left:22%;right:22%}.seat.opponent{top:54px}.seat.player{bottom:52px}.identity{right:calc(-39.285% + 12px);top:-42px;width:110px;gap:0}.player .identity{bottom:-41px;top:auto}.identity h1,.identity h2{font-size:14px;margin:0 0 3px}.hearts{font-size:12px}.stake{font-size:9px;margin-top:3px}.hand{gap:4px;height:82px;min-height:82px}.number-card,.number-card img{width:53px;height:82px;min-width:53px;max-width:53px;flex-basis:53px}.number-card+.number-card{margin-left:0}.hand:has(.number-card:nth-child(4)){gap:0}.hand:has(.number-card:nth-child(4)) .number-card+.number-card{margin-left:-18px}.hand:has(.number-card:nth-child(7)) .number-card+.number-card{margin-left:-30px}.scorebox{padding:4px 9px;min-height:25px}.scorebox strong{font-size:14px}.center{gap:38px;height:78px;top:50%}.deck,.deck img{width:49px;height:76px}.deck>small{top:87px;letter-spacing:1px}.deck span{width:23px;height:23px;line-height:21px;font-size:10px;right:-7px;bottom:-4px}.played-zone{left:12px;width:64px}.opponent-played{top:22px}.player-played{bottom:22px}.played-label{font-size:6px;letter-spacing:0;margin-bottom:8px}.played-placeholder,.played-card,.played-card img{width:39px;height:60px}.played-card{flex-basis:39px}.played-list{gap:0}.played-card+.played-card{margin-left:-25px}.target{left:12px;top:50%;width:58px;display:block}.target>span{font-size:6px;letter-spacing:.3px;display:block;margin-bottom:6px}.target strong{font-size:21px}.pool-wrap{right:12px;width:53px}.pool{gap:3px}.pool span{width:15px;height:20px;line-height:18px;font-size:9px}.pool-wrap small{display:none}.actionbar{flex-direction:column;align-items:stretch;gap:10px;min-height:100px;padding:12px 2px}.status p{max-width:none}.status strong{font-size:11px}.actions{display:grid;grid-template-columns:1fr 1fr}.actions button{min-height:42px;padding:8px}.sleeve{min-height:153px}.trumps{min-height:143px;padding:8px 7px}.trumps>.trump,.trumps>.trump>img{width:78px;height:120px}.trumps>.trump{flex-basis:78px}.trumps>.trump+.trump{margin-left:-37px}.trumps>.trump>.copy{width:160px;padding:10px}.trumps>.trump>.copy b{font-size:15px}.trumps>.trump>.copy small{font-size:10px}.trumps.many{flex-wrap:wrap;row-gap:20px;padding-top:30px}.trumps.many>.trump{transform:none}.trumps.many>.trump+.trump{margin-left:-39px}.trumps>.empty{font-size:10px;min-height:96px}.sleeve-heading{top:2px}.sleeve-heading h2{font-size:7px}.text-button{font-size:8px}footer{padding:12px 2px 8px;min-height:32px}}
@media(max-width:359px){.topbar{height:85px}.table{height:465px;min-height:465px}.center{gap:24px}.deck,.deck img{width:43px;height:66px}.deck>small{top:78px}.pool-wrap{right:10px}.identity{right:calc(-39.285% + 10px)}.trumps>.trump+.trump{margin-left:-43px}}
@media(prefers-reduced-motion:reduce){.trumps>.trump,.played-card{transition:none}}

/* Verdant Court — gothic-minimal visual pass. */
:root{
  --void:#040a07;
  --deep:#07140f;
  --forest:#0d241a;
  --felt:#153326;
  --jade:#8dd7ad;
  --jade-bright:#c2f0d0;
  --gold:#d9bc78;
  --gold-bright:#f1d99b;
  --ink:#f2eddf;
  --muted:#9eb1a4;
  --line:#d8bf7b2e;
  --red:#e06e67;
  --green:#8dd7ad;
}

html{background:var(--void)}
body{
  position:relative;
  overflow-x:hidden;
  background:
    linear-gradient(180deg,#03100ba8 0%,#06110ac4 52%,#030805f4 100%),
    url('assets/ui/gothic-forest-table.webp') center top/cover fixed no-repeat,
    var(--void);
  color:var(--ink);
}
body::before{
  content:'';position:fixed;inset:0;pointer-events:none;z-index:0;
  background:
    radial-gradient(ellipse at 50% 4%,#c9efd81a 0,transparent 31%),
    linear-gradient(112deg,transparent 32%,#b7ebcf0b 45%,transparent 56%),
    radial-gradient(ellipse at center,transparent 35%,#010403b8 100%);
  mix-blend-mode:screen;
}
#app{position:relative;z-index:1;max-width:1680px;padding:0 clamp(16px,2.3vw,40px)}

.topbar{height:78px;padding:0 8px;border-bottom:1px solid #d9c17b1a;background:linear-gradient(90deg,transparent,#0a1710a8 28%,#0a1710a8 72%,transparent)}
.brand{gap:14px;color:#e8deca;line-height:1}.brand-mark{display:grid;place-items:center;width:42px;height:42px;font-size:22px;color:var(--gold-bright);border:1px solid #d9bc7866;transform:rotate(45deg);background:linear-gradient(145deg,#1d3828,#08120d);box-shadow:0 0 25px #94d6ae13,inset 0 0 14px #d9bc780c}.brand-mark::first-line{transform:rotate(-45deg)}
.brand-mark{font-family:Georgia,serif;text-shadow:0 0 12px #f0d99b66}.brand>div>div{line-height:1}.brand-kicker{display:block;font:600 8px/1 Arial,sans-serif;letter-spacing:5px;color:var(--gold);margin:0 0 5px 2px}.brand b{font-weight:400;font-size:17px;letter-spacing:3px}.brand small{margin-top:7px;color:#91ad9b;letter-spacing:2px}
.run{gap:10px;padding:7px 16px;border:1px solid #d8bf7b20;border-radius:999px;background:#07110cb8;box-shadow:inset 0 0 18px #8fd0a80a}.run strong{color:var(--gold-bright);font-size:19px}.divider{border-color:#d8bf7b33}
nav{gap:8px}.icon{width:38px;height:38px;min-height:38px;border-radius:50%;border-color:#d8bf7b2e;background:#08130ecc;color:#b9cabe;box-shadow:inset 0 0 14px #90d0aa0a}.icon:hover:enabled{color:var(--gold-bright);background:#173425;border-color:#d9bc7877;box-shadow:0 0 18px #8cd6ad20}

.table{
  min-height:420px;
  height:calc(100dvh - 322px);
  border:1px solid #d8bd7561;
  border-radius:38px;
  background:
    radial-gradient(ellipse at 50% 48%,#2d654949 0,#163b2c59 32%,#07170fd9 78%),
    linear-gradient(135deg,#193d2c99,#07140ee0);
  box-shadow:0 28px 80px #000b,0 0 55px #77c5970e,inset 0 0 110px #010603c9,inset 0 1px #f1d99b22;
  backdrop-filter:blur(2px) saturate(.85);
}
.table::before{display:none}
.table::after{content:'';position:absolute;inset:13px;z-index:-1;pointer-events:none;border-radius:29px;background:radial-gradient(ellipse at 50% 50%,#9ee0b80e,transparent 58%);border:1px solid #d8bf7b18;box-shadow:inset 0 0 35px #87ca9f0a}
.table-border{inset:7px;border-color:#f1d99b22;border-radius:31px;box-shadow:0 0 0 1px #08110d,inset 0 0 0 1px #8dd7ad0b}

.identity h1,.identity h2{color:#f1eadb;text-shadow:0 2px 18px #000;font-weight:400}.identity .eyebrow{color:var(--gold);letter-spacing:3px}.stake{color:#a9c0b0}.hearts{color:#e2786f;filter:drop-shadow(0 0 6px #e06e6733)}.hearts .lost{color:#34483d}
.scorebox{background:linear-gradient(180deg,#10271cdb,#07130de8);border-color:#d9bc7842;border-radius:999px;box-shadow:0 10px 25px #0006,inset 0 1px #c4e9d115}.scorebox strong{color:var(--gold-bright);text-shadow:0 0 16px #e5c77c28}.scorebox small{color:#a7b8ad;letter-spacing:.4px}

.number-card{filter:drop-shadow(0 10px 10px #000a);transition:transform 0.1333s ease,filter 0.1333s ease}.number-card img{border-radius:7px;outline:1px solid #ead4943d;outline-offset:-1px}.number-card:hover{transform:translateY(-8px) scale(1.035);filter:drop-shadow(0 13px 13px #000b) drop-shadow(0 0 9px #9cdfb948)}
.center{gap:94px}.deck,.trump-deck{filter:drop-shadow(0 11px 9px #000b)}.deck::before{inset:3px -5px -5px 5px;border-color:#d9bc7866;background:#0a1811;border-radius:7px;box-shadow:inset 0 0 16px #8bd2a31a}.deck img{border-radius:7px;outline:1px solid #ead49480;outline-offset:2px}.deck span{border-color:#d9bc7880;background:#09150fee;color:var(--gold-bright);box-shadow:0 0 16px #8fd2aa24}.deck>small{color:#adc1b3}
.target{padding:12px 14px;border-left:1px solid #d9bc7855!important;background:linear-gradient(90deg,#07130d99,transparent)}.target>span{color:#9bb5a4}.target strong{font-size:34px;color:var(--gold-bright);text-shadow:0 0 25px #e8cb8040}
.target-feedback{position:absolute;left:100%;top:50%;width:max-content;pointer-events:none;transform:translateY(-50%);z-index:20}.target-change-notice{display:block;color:var(--gold-bright);font:700 30px/1.2 Arial,sans-serif;white-space:nowrap;text-shadow:0 2px 8px #000,0 0 18px #e8cb8066;animation:seat-feedback-fade 1.9s ease-out both}
.pool span{border-color:#8bc5a83b;background:#09170fa8;color:#c3decc;border-radius:5px;box-shadow:inset 0 0 10px #9bdcb812}.pool span.known{color:#66827466;border-color:#8bc5a81c}.pool-wrap small{color:#879b8e}
.played-label{color:#b6c9bc}.played-placeholder{border-color:#d9bc7842;background:#06120c52;color:#d9bc784f}.played-card img{border-radius:6px;outline:1px solid #d9bc783d}.played-card:hover{filter:drop-shadow(0 10px 12px #000c) drop-shadow(0 0 8px #8dd7ad33)}.played-tip{background:#08150ff5;border-color:#d9bc786e;border-radius:8px;box-shadow:0 16px 35px #000c,0 0 24px #8dd7ad13}

.actionbar{margin:0 10px;padding:11px 8px}.status>span{width:8px;height:8px;background:var(--jade);box-shadow:0 0 7px var(--jade),0 0 20px #8dd7ad88}.status strong{color:#dfe9e2;letter-spacing:.4px}.status p{color:#8fa397}.actions button{border-radius:7px;text-transform:uppercase;letter-spacing:2px;font:700 9px/1 Arial,sans-serif;box-shadow:0 9px 22px #0005}.primary{background:linear-gradient(180deg,#ead18f,#b9944f);color:#122018;border-color:#f2dda5;box-shadow:0 8px 28px #e4bd6225,inset 0 1px #fff6d3}.primary:hover:enabled{background:linear-gradient(180deg,#f7e4ae,#d2ad63);box-shadow:0 8px 32px #e4bd6240}.secondary{background:#0a1811b5;border-color:#8cc7a263;color:#bfd3c5}.secondary:hover:enabled{background:#153526;color:#e6f2e9;border-color:#9cdbb6}

.sleeve{border-top:1px solid #d9bc7817;background:radial-gradient(ellipse at 50% 100%,#163a2a4d,transparent 64%)}.sleeve-heading h2{color:var(--gold);letter-spacing:3px}.text-button{color:#92a99a}.text-button:hover:enabled{color:var(--gold-bright);background:none;border-color:transparent}
.trumps>.trump{filter:drop-shadow(0 9px 9px #000c)}.trumps>.trump>img{border-radius:8px;outline:1px solid #d9bc784f;outline-offset:-1px}.trumps>.trump:hover:enabled,.trumps>.trump:focus-visible{filter:drop-shadow(0 17px 15px #000c) drop-shadow(0 0 13px #9be1b45c)}.trumps>.trump>.copy{background:linear-gradient(180deg,#10291ded,#07130df7);border-color:#dabf7891;border-radius:10px;box-shadow:0 16px 45px #000e,0 0 30px #8dd7ad16}.trumps>.trump>.copy::after{content:'';position:absolute;left:50%;top:100%;border:7px solid transparent;border-top-color:#d9bc786e;transform:translateX(-50%)}
footer{color:#71897b}

dialog{border:1px solid #d9bc787d;border-radius:14px;background:linear-gradient(145deg,#183727f2,#07130dfb 70%);box-shadow:0 35px 120px #000f,0 0 60px #8dd7ad18,inset 0 1px #d9e9df18;overflow:hidden}
dialog::before{content:'♠';position:absolute;right:28px;top:20px;color:#d9bc7824;font-size:85px;transform:rotate(12deg)}
dialog::backdrop{background:#010604dc;backdrop-filter:blur(10px) saturate(.7)}
#modal-content{position:relative;padding:40px 42px}dialog .eyebrow{color:var(--gold);letter-spacing:4px}dialog h2{max-width:490px;color:#f4ead4;font-size:38px;line-height:1.05;text-shadow:0 3px 22px #000}dialog p{max-width:500px;color:#aec0b4}dialog button{border-radius:6px;text-transform:uppercase;letter-spacing:1.5px;font:700 9px Arial,sans-serif}
#loading{background:radial-gradient(ellipse at center,#173426,#040a07 67%);font:500 15px Arial,sans-serif;letter-spacing:7px;text-shadow:0 0 20px #d9bc7866}#loading span{color:var(--jade);filter:drop-shadow(0 0 8px #8dd7ad)}

@media(max-width:800px){.table{border-radius:26px}.table::after,.table-border{border-radius:20px}.brand-mark{width:35px;height:35px}.run{padding:5px 10px}.target{padding-left:8px}.center{gap:62px}}
@media(max-width:580px){body{background-position:center top}.topbar{height:78px;display:grid;grid-template-columns:1fr auto;grid-template-rows:48px 24px;gap:0;background:#06100bb8}.brand{grid-column:1;grid-row:1}.brand-mark{width:31px;height:31px;font-size:17px}.brand-kicker{letter-spacing:3px}.brand b{font-size:12px}nav{grid-column:2;grid-row:1}.run{grid-column:1/-1;grid-row:2;position:static;transform:none;width:auto;justify-self:center;flex-wrap:nowrap;background:transparent;border:0;padding:0}.run strong{font-size:14px}.run .divider{display:block;height:13px}.table{border-radius:20px}.table::after,.table-border{border-radius:14px}.target{background:none;padding:0;border-left:0!important}.actionbar{margin:0}.actions button{letter-spacing:1px}}
@media(max-width:800px){.target-change-notice{font-size:23px}}
@media(max-width:580px){.target-change-notice{font-size:16px}}
@media(min-width:801px) and (min-height:751px) and (max-height:900px){.table{height:calc(100dvh - 338px)}}
@media(prefers-reduced-motion:reduce){body{background-attachment:scroll}}

/* Card scale, movement, drag-and-drop, and in-table showdown. */
.hand{height:123px;min-height:123px}
.number-card,.number-card img{width:80px;height:123px;min-width:80px;max-width:80px;flex-basis:80px}
.center{height:130px}
.deck,.trump-deck,.deck img{width:72px;height:109px}
.deck>small{top:126px}
.played-placeholder,.played-card,.played-card img{width:74px;height:113px}
.played-card{flex-basis:74px}.played-tip{bottom:125px}.opponent-played .played-tip{top:123px}
.pool span{width:32px;height:37px;line-height:35px}
.trumps>.trump,.trumps>.trump>img{width:100px;height:154px}.trumps>.trump{flex-basis:100px;transform-origin:50% 154px}.trumps{min-height:167px}.sleeve{min-height:180px}

.revealed-card{transform-style:preserve-3d;animation:card-reveal 0.52s cubic-bezier(.2,.72,.2,1) both}
.played-flight{animation:trump-flight 0.4133s cubic-bezier(.18,.8,.16,1) both;z-index:35}
@keyframes card-reveal{0%{transform:perspective(700px) rotateY(90deg) scale(.92);filter:brightness(.45)}55%{transform:perspective(700px) rotateY(-7deg) scale(1.07);filter:brightness(1.3) drop-shadow(0 0 18px #e5ca7f66)}100%{transform:none;filter:drop-shadow(0 10px 10px #000a)}}
@keyframes trump-flight{0%{opacity:.35;transform:translate(var(--play-x),var(--play-y)) scale(1.28) rotate(-7deg);filter:drop-shadow(0 16px 18px #000d) drop-shadow(0 0 15px #9be1b488)}75%{opacity:1;transform:translate(0,0) scale(1.05) rotate(1deg)}100%{transform:none}}

.trumps>.trump[draggable=true]{cursor:grab}.trumps>.trump[draggable=true]:active{cursor:grabbing}
body.dragging-trump .trumps>.trump{transition:opacity 0.12s,filter 0.12s;opacity:.58}
body.dragging-trump .player-played{z-index:45}
body.dragging-trump .player-played .played-list{position:relative;min-height:125px;min-width:96px;border:1px dashed #9fe2b58c;border-radius:10px;background:#102d206e;box-shadow:0 0 24px #8dd7ad1c,inset 0 0 18px #8dd7ad12}
body.dragging-trump .player-played .played-list::after{content:'PLAY';position:absolute;inset:0;display:grid;place-items:center;color:#c9ead6;font:700 8px Arial,sans-serif;letter-spacing:2px;text-shadow:0 1px 8px #000}
.player-played.drag-over .played-list{border-color:var(--gold-bright)!important;background:#25462f99!important;box-shadow:0 0 34px #d9bc7840,inset 0 0 24px #8dd7ad28!important;transform:scale(1.04)}

.round-reveal{display:none;position:absolute;left:50%;top:50%;z-index:50;width:min(360px,42vw);padding:20px 24px;transform:translate(-50%,-50%);text-align:center;border:1px solid #d9bc7894;border-radius:12px;background:linear-gradient(145deg,#153827f5,#07140ff5);box-shadow:0 24px 65px #000d,0 0 38px #91dbad25,inset 0 1px #e8d9ad20;backdrop-filter:blur(9px)}
.round-reveal.is-visible{display:grid;grid-template-columns:1fr auto;gap:6px 18px;align-items:center;animation:reveal-plaque 0.3667s 0.4133s cubic-bezier(.2,.75,.15,1) both}
.round-reveal .eyebrow{grid-column:1/-1;font-size:8px;letter-spacing:4px}.round-reveal h2{grid-column:1/-1;font-size:25px;font-weight:400;margin:2px 0 8px;color:#f1eadb}.reveal-score{grid-column:1;font:34px Georgia,serif;color:var(--gold-bright);text-shadow:0 0 20px #e1c47733}.reveal-detail{grid-column:1;font-size:9px}.reveal-next{grid-column:2;grid-row:3/5;min-width:112px;padding:12px 14px}
@keyframes reveal-plaque{from{opacity:0;transform:translate(-50%,-44%) scale(.94);filter:blur(5px)}to{opacity:1;transform:translate(-50%,-50%);filter:none}}
.round-ended .actionbar .status{opacity:.45}.round-ended .actions{opacity:.55}

@media(min-width:801px) and (min-height:751px) and (max-height:900px){.table{height:calc(100dvh - 358px)}}
@media(max-height:750px) and (min-width:801px){.table{height:calc(100dvh - 300px)}.hand{height:100px;min-height:100px}.number-card,.number-card img{width:65px;height:100px;min-width:65px;max-width:65px;flex-basis:65px}.center{height:96px}.deck,.trump-deck,.deck img{width:58px;height:89px}.deck>small{top:102px}.played-placeholder,.played-card,.played-card img{width:61px;height:94px}.played-card{flex-basis:61px}.trumps>.trump,.trumps>.trump>img{width:85px;height:131px}.trumps>.trump{flex-basis:85px;transform-origin:50% 131px}.trumps{min-height:136px}.sleeve{min-height:148px}}
@media(max-width:800px){.hand{height:108px;min-height:108px}.number-card,.number-card img{width:70px;height:108px;min-width:70px;max-width:70px;flex-basis:70px}.deck,.trump-deck,.deck img{width:65px;height:100px}.deck>small{top:113px}.played-placeholder,.played-card,.played-card img{width:52px;height:80px}.played-card{flex-basis:52px}.pool span{width:26px;height:30px;line-height:28px}.round-reveal{width:min(330px,58vw)}}
@media(max-width:580px){.hand{height:90px;min-height:90px}.number-card,.number-card img{width:58px;height:90px;min-width:58px;max-width:58px;flex-basis:58px}.deck,.trump-deck,.deck img{width:54px;height:84px}.deck>small{top:95px}.played-placeholder,.played-card,.played-card img{width:43px;height:66px}.played-card{flex-basis:43px}.pool span{width:17px;height:22px;line-height:20px}.trumps>.trump,.trumps>.trump>img{width:86px;height:132px}.trumps>.trump{flex-basis:86px;transform-origin:50% 132px}.trumps{min-height:151px}.sleeve{min-height:162px}.round-reveal{width:238px;padding:15px 16px;gap:5px 9px}.round-reveal h2{font-size:19px}.reveal-score{font-size:25px}.reveal-next{min-width:84px;padding:10px 8px;font-size:8px}}
@media(prefers-reduced-motion:reduce){.revealed-card,.played-flight,.round-reveal.is-visible{animation:none}}

@media(min-width:801px){.trumps.many{flex-wrap:wrap;row-gap:32px;padding-top:25px}.trumps.many>.trump{transform:rotate(var(--fan-angle,0deg))}.sleeve:has(.many){padding-top:15px}}

/* Tactile drag pass and diegetic action feeds. */
.deck,.trump-deck,.deck img{width:80px;height:123px}.deck>small{top:140px}
.trumps{transform:translateY(-20px);margin-bottom:-20px;touch-action:none}
.trumps>.trump>img{object-fit:contain;image-rendering:-webkit-optimize-contrast;filter:contrast(1.07) saturate(1.025);backface-visibility:hidden}
.trumps>.trump>.copy{will-change:opacity}.dragging-trump .trumps>.trump>.copy{display:none!important}
.trumps>.trump.drag-source{opacity:.16!important;filter:none!important}
.drag-card-ghost{position:fixed;left:0;top:0;z-index:1000;pointer-events:none;padding:0;border:0;border-radius:8px;background:none;object-fit:contain;transform-origin:50% 72%;filter:drop-shadow(0 10px 10px #0009);will-change:transform}
.drag-card-ghost img{display:block;width:100%;height:100%;object-fit:contain;border-radius:8px;image-rendering:-webkit-optimize-contrast;filter:contrast(1.08) saturate(1.03)}
.drag-card-ghost.returning{transition:transform 0.1333s cubic-bezier(.2,.75,.2,1),opacity 0.1111s;opacity:.45}
.playfield{isolation:isolate}
.playfield.player-drop-active::after{content:'';position:absolute;inset:50% 0 0;z-index:-1;pointer-events:none;border-radius:0 0 18px 18px;background:linear-gradient(180deg,#71c99803,#71c99824);box-shadow:inset 0 -55px 80px #69c08d14}
.playfield.player-drop-active.drag-valid::after{background:linear-gradient(180deg,#b9edce08,#8dd7ad35);box-shadow:inset 0 -70px 100px #8dd7ad25}
body.dragging-trump .player-played .played-list{min-height:113px;min-width:74px;border-color:#8dd7ad42;background:#102d2038;box-shadow:inset 0 0 18px #8dd7ad0b}
body.dragging-trump .player-played .played-list::after{content:''}

.actionbar{justify-content:flex-end}.actionbar .status{display:none}
.table-feed{position:absolute;z-index:12;display:flex;align-items:center;justify-content:center;gap:10px;width:280px;color:#a8bbae;pointer-events:none;opacity:0;visibility:hidden;transform:translate(-50%,-50%) translateY(5px);transition:opacity 0.1333s ease,transform 0.1667s cubic-bezier(.2,.8,.2,1),visibility 0.1333s}
.table-feed.is-visible{opacity:.92;visibility:visible;transform:translate(-50%,-50%) translateY(0)}
.table-feed .feed-mark{display:grid;place-items:center;flex:0 0 28px;width:28px;height:28px;border:1px solid #d9bc7847;border-radius:50%;background:#08160fbb;color:var(--gold);font:16px Georgia,serif;box-shadow:0 0 18px #0007}
.table-feed strong{display:block;color:#e8eee9;font:600 9px Arial,sans-serif;letter-spacing:1.5px;text-transform:uppercase}.table-feed p{margin-top:5px;color:#8fa397;font:9px/1.35 Arial,sans-serif}
.opponent-feed{left:50%;top:36%;width:auto;min-width:180px;text-align:center}
.opponent-feed .thinking-pulse{width:7px;height:7px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 0 #d8bc7866;animation:thinking-pulse 0.8s ease-out infinite}
.player-feed{left:50%;top:68%;bottom:auto;text-align:left}.player-feed .feed-mark{color:var(--jade);border-color:#8dd7ad55;box-shadow:0 0 18px #8dd7ad18}
@keyframes thinking-pulse{0%{box-shadow:0 0 0 0 #d8bc7866}70%,100%{box-shadow:0 0 0 9px #d8bc7800}}
.scorebox small:empty{display:none}

@media(max-height:750px) and (min-width:801px){.deck,.trump-deck,.deck img{width:65px;height:100px}.deck>small{top:113px}.trumps{transform:translateY(-12px);margin-bottom:-12px}}
@media(max-width:800px){.deck,.trump-deck,.deck img{width:70px;height:108px}.deck>small{top:121px}.table-feed{width:210px}.opponent-feed{width:auto}.table-feed p{font-size:8px}}
@media(max-width:580px){.deck,.trump-deck,.deck img{width:58px;height:90px}.deck>small{top:101px}.trumps{transform:translateY(-10px);margin-bottom:-10px}.table-feed{width:170px;gap:6px}.opponent-feed{width:auto;min-width:145px}.table-feed .feed-mark{width:22px;height:22px;flex-basis:22px;font-size:12px}.table-feed strong{font-size:7px;letter-spacing:.7px}.table-feed p{display:none}}
@media(prefers-reduced-motion:reduce){.drag-card-ghost,.table-feed{transition:none}.thinking-pulse{animation:none!important}.trumps{transform:none;margin-bottom:0}}

/* Larger card pass and edge-aware trump treatment. */
.hand{height:129px;min-height:129px}
.number-card,.number-card img{width:84px;height:129px;min-width:84px;max-width:84px;flex-basis:84px}
.center{height:136px}
.deck,.trump-deck,.deck img{width:84px;height:129px}.deck>small{top:147px}
.played-placeholder,.played-card,.played-card img{width:78px;height:119px}.played-card{flex-basis:78px}.played-tip{bottom:132px}.opponent-played .played-tip{top:129px}
.trumps>.trump,.trumps>.trump>img{width:105px;height:162px}.trumps>.trump{flex-basis:105px;transform-origin:50% 162px}.trumps{min-height:175px}.sleeve{min-height:189px}
.trumps>.trump>img,.drag-card-ghost img{outline:none;filter:drop-shadow(-1px 0 0 #e2c878b8) drop-shadow(1px 0 0 #e2c878b8) drop-shadow(0 -1px 0 #e2c878b8) drop-shadow(0 1px 0 #e2c878b8) contrast(1.07) saturate(1.025)}
.played-card img{outline:none;filter:drop-shadow(-1px 0 0 #d9bc7894) drop-shadow(1px 0 0 #d9bc7894) drop-shadow(0 -1px 0 #d9bc7894) drop-shadow(0 1px 0 #d9bc7894) saturate(.72) brightness(.9)}
.trump-deck img{outline:none;filter:drop-shadow(-1px 0 0 #d9bc7894) drop-shadow(1px 0 0 #d9bc7894) drop-shadow(0 -1px 0 #d9bc7894) drop-shadow(0 1px 0 #d9bc7894)}
.table-feed.result-feed{opacity:1;min-width:260px}

/* The Scarlet Salon takes over solo tables 3–4. Keep text and card values clear. */
body[data-table-theme="scarlet"]{
  --void:#16080c;--deep:#240c12;--forest:#310e18;--felt:#4a1720;
  --jade:#d9897b;--jade-bright:#ffbaa4;--gold:#d6a06f;
  --gold-bright:#f2cf9c;--muted:#c1a49e;--line:#d6a06f38;
  --green:#d9897b;
  background:
    linear-gradient(180deg,#1c090f9c 0%,#210a10b8 52%,#100508ed 100%),
    url('assets/scarlet/salon-background.webp') center top/cover fixed no-repeat,
    #16080c;
}
body[data-table-theme="scarlet"]::before{
  background:radial-gradient(ellipse at 50% 3%,#ffb0801a,transparent 34%),radial-gradient(ellipse at center,transparent 34%,#100307ac 100%);
  mix-blend-mode:screen;
}
body[data-table-theme="scarlet"] .topbar{background:linear-gradient(90deg,transparent,#210b12df 28%,#210b12df 72%,transparent);border-bottom-color:#d6a06f3d}
body[data-table-theme="scarlet"] .brand-mark{background:linear-gradient(145deg,#55202a,#200a11);border-color:#d6a06f88;box-shadow:0 0 22px #b6494922,inset 0 0 14px #d6a06f12}
body[data-table-theme="scarlet"] .brand small{color:#cbaaa3}
body[data-table-theme="scarlet"] .run{background:#230b13d9;border-color:#d6a06f47}
body[data-table-theme="scarlet"] .icon{background:#230b13db;border-color:#d6a06f55;color:#e7cab7}
body[data-table-theme="scarlet"] .icon:hover:enabled{background:#51212a;color:#fff0d7;border-color:#efc491}
body[data-table-theme="scarlet"] .table{
  border-color:#d6a06f8c;
  background:radial-gradient(ellipse at 50% 44%,#72303a91 0,#4d1823d4 42%,#21080fef 92%),linear-gradient(135deg,#52202aee,#210811f2);
  box-shadow:0 28px 80px #000c,0 0 60px #b44b5024,inset 0 0 115px #120306e3,inset 0 1px #f3c69e32;
}
body[data-table-theme="scarlet"] .table::after{border-color:#d6a06f39;background:radial-gradient(ellipse at center,#e5a27a0b,transparent 63%);box-shadow:inset 0 0 35px #c75c5a17}
body[data-table-theme="scarlet"] .table-border{border-color:#efc49176;box-shadow:0 0 0 1px #200a10,inset 0 0 0 1px #f1b69023}
body[data-table-theme="scarlet"] .scorebox{background:linear-gradient(180deg,#4d1c29df,#230a13ef);border-color:#e4b0798a;box-shadow:0 10px 25px #0007,inset 0 1px #f8c5a830}
body[data-table-theme="scarlet"] .target{background:linear-gradient(90deg,#2b0c16d4,transparent);border-left-color:#e3b07885!important}
body[data-table-theme="scarlet"] .target>span,body[data-table-theme="scarlet"] .pool-wrap small,body[data-table-theme="scarlet"] .deck>small{color:#d0aea4}
body[data-table-theme="scarlet"] .deck::before{background:#3c121c;border-color:#d6a06f8c}
body[data-table-theme="scarlet"] .deck img{outline-color:#efc4919c}
body[data-table-theme="scarlet"] .deck span{background:#32111adf;border-color:#e4b0798c}
body[data-table-theme="scarlet"] .pool span{background:#32111acc;border-color:#efbc8b5c;color:#ffe3c7;box-shadow:inset 0 0 10px #e5a27a19}
body[data-table-theme="scarlet"] .pool span.known{background:#220d13a0;border-color:#efbc8b24;color:#b8787b84;box-shadow:none;text-decoration:line-through;text-decoration-color:#d49c8999}
body[data-table-theme="scarlet"] .played-placeholder{background:#2c1018a8;border-color:#e4b07980;color:#dfb08891}
body[data-table-theme="scarlet"] .played-label{color:#efcbbb}
body[data-table-theme="scarlet"] .played-tip,body[data-table-theme="scarlet"] .trumps>.trump>.copy{background:linear-gradient(180deg,#501c29f5,#210a11fa);border-color:#e3b078a8}
body[data-table-theme="scarlet"] .sleeve{background:radial-gradient(ellipse at 50% 100%,#792e384a,transparent 67%);border-top-color:#e3b07836}
body[data-table-theme="scarlet"] .status p{color:#c8a9a4}
body[data-table-theme="scarlet"] .secondary{background:#37111bce;border-color:#d6a06f7c;color:#f4d9c3}
body[data-table-theme="scarlet"] .secondary:hover:enabled{background:#60232d;color:#fff0df}
body[data-table-theme="scarlet"] .primary{background:linear-gradient(180deg,#f1cea0,#bd765c);border-color:#f8d9af;color:#261018}
body[data-table-theme="scarlet"] .primary:hover:enabled{background:linear-gradient(180deg,#ffdfb9,#d78a6c)}
body[data-table-theme="scarlet"] dialog:not(.main-menu):not(.menu-flow){background:linear-gradient(145deg,#59212bf2,#210a11fb 75%);border-color:#e3b0788c}
@media(max-width:580px){body[data-table-theme="scarlet"] .topbar{background:#210b12e8}}
@media(prefers-reduced-motion:reduce){body[data-table-theme="scarlet"]{background-attachment:scroll}}

/* The Sapphire Observatory takes over solo tables 5–6. */
body[data-table-theme="sapphire"]{
  --void:#050b17;--deep:#081328;--forest:#0b1d3b;--felt:#102b52;
  --jade:#88b8d4;--jade-bright:#c5e7f4;--gold:#9fb8ca;
  --gold-bright:#d9e9f1;--muted:#9bafc1;--line:#adc6d638;
  --green:#7fb3d2;
  background:
    linear-gradient(180deg,#050b17a1 0%,#071226b8 53%,#020610ed 100%),
    url('assets/sapphire/observatory-background.webp') center top/cover fixed no-repeat,
    #050b17;
}
body[data-table-theme="sapphire"]::before{background:radial-gradient(ellipse at 50% 2%,#8ac9ff1a,transparent 36%),radial-gradient(ellipse at center,transparent 30%,#01040cb5 100%);mix-blend-mode:screen}
body[data-table-theme="sapphire"] .topbar{background:linear-gradient(90deg,transparent,#07142ce5 28%,#07142ce5 72%,transparent);border-bottom-color:#b6cfdf3d}
body[data-table-theme="sapphire"] .brand-mark{background:linear-gradient(145deg,#173e69,#050d20);border-color:#b9cfdd88;box-shadow:0 0 24px #4d9dcc29,inset 0 0 14px #d9effb14}
body[data-table-theme="sapphire"] .brand small{color:#9fb7ca}
body[data-table-theme="sapphire"] .run{background:#071329df;border-color:#aec8d947}
body[data-table-theme="sapphire"] .icon{background:#071329df;border-color:#adc7d855;color:#d5e4ec}
body[data-table-theme="sapphire"] .icon:hover:enabled{background:#163c68;color:#f3fbff;border-color:#d5ebf7}
body[data-table-theme="sapphire"] .table{border-color:#b8cfdd8c;background:radial-gradient(ellipse at 50% 44%,#1b4b7c91 0,#0c294fd9 43%,#040b1bef 92%),linear-gradient(135deg,#143c69ee,#040b1cf3);box-shadow:0 28px 80px #000d,0 0 65px #4c99c82b,inset 0 0 120px #01040de8,inset 0 1px #d9effb34}
body[data-table-theme="sapphire"] .table::after{border-color:#b7d0df3d;background:radial-gradient(ellipse at center,#8fc8e30b,transparent 63%);box-shadow:inset 0 0 38px #5eaad11a}
body[data-table-theme="sapphire"] .table-border{border-color:#c6dbe77c;box-shadow:0 0 0 1px #030a19,inset 0 0 0 1px #e6f5fd26}
body[data-table-theme="sapphire"] .scorebox{background:linear-gradient(180deg,#12335cdf,#050e22f2);border-color:#b7d0df8c;box-shadow:0 10px 25px #0008,inset 0 1px #e4f4fd32}
body[data-table-theme="sapphire"] .target{background:linear-gradient(90deg,#071630d8,transparent);border-left-color:#b6cfdf8c!important}
body[data-table-theme="sapphire"] .target>span,body[data-table-theme="sapphire"] .pool-wrap small,body[data-table-theme="sapphire"] .deck>small{color:#a6bccb}
body[data-table-theme="sapphire"] .deck::before{background-color:#0b2343;border-color:#b6cfdf8c}
body[data-table-theme="sapphire"] .deck img{outline-color:#c8deea9f}
body[data-table-theme="sapphire"] .deck span{background:#071a35e8;border-color:#bdd4e28f}
body[data-table-theme="sapphire"] .pool span{background:#0a2142d1;border-color:#b9d5e45c;color:#e4f3fb;box-shadow:inset 0 0 10px #8bcbe71a}
body[data-table-theme="sapphire"] .pool span.known{background:#06152ba6;border-color:#bad5e324;color:#7191aa82;box-shadow:none;text-decoration:line-through;text-decoration-color:#9cb8ca99}
body[data-table-theme="sapphire"] .played-placeholder{background:#071a35b0;border-color:#b8d0df80;color:#a9c8da91}
body[data-table-theme="sapphire"] .played-label{color:#d4e6f0}
body[data-table-theme="sapphire"] .played-tip,body[data-table-theme="sapphire"] .trumps>.trump>.copy{background:linear-gradient(180deg,#123961f5,#040d20fa);border-color:#b9d1dfa8}
body[data-table-theme="sapphire"] .sleeve{background:radial-gradient(ellipse at 50% 100%,#174c7d4b,transparent 67%);border-top-color:#b7d0df38}
body[data-table-theme="sapphire"] .status p{color:#a6bac9}
body[data-table-theme="sapphire"] .secondary{background:#09213fce;border-color:#acc7d77c;color:#d9e9f2}
body[data-table-theme="sapphire"] .secondary:hover:enabled{background:#174a76;color:#f2fbff}
body[data-table-theme="sapphire"] .primary{background:linear-gradient(180deg,#e2edf3,#8ba9ba);border-color:#eff8fc;color:#071326}
body[data-table-theme="sapphire"] .primary:hover:enabled{background:linear-gradient(180deg,#f5fbfe,#a9c5d4)}
body[data-table-theme="sapphire"] dialog:not(.main-menu):not(.menu-flow){background:linear-gradient(145deg,#12385ff2,#040c1efb 75%);border-color:#bad1df91}
@media(max-width:580px){body[data-table-theme="sapphire"] .topbar{background:#07142cec}}
@media(prefers-reduced-motion:reduce){body[data-table-theme="sapphire"]{background-attachment:scroll}}

/* The Gilded Vault takes over solo tables 7–8. */
body[data-table-theme="gilded"]{
  --void:#080705;--deep:#120e09;--forest:#21170d;--felt:#302110;
  --jade:#d4a64f;--jade-bright:#f5cf7a;--gold:#c99a45;
  --gold-bright:#f2d38b;--muted:#b7a686;--line:#d2a34a3b;
  --green:#d0a14c;
  background:
    linear-gradient(180deg,#0907049c 0%,#100c07ba 54%,#050402ed 100%),
    url('assets/gilded/vault-background.webp') center top/cover fixed no-repeat,
    #080705;
}
body[data-table-theme="gilded"]::before{background:radial-gradient(ellipse at 50% 2%,#ffbd4d18,transparent 35%),radial-gradient(ellipse at center,transparent 31%,#030201b8 100%);mix-blend-mode:screen}
body[data-table-theme="gilded"] .topbar{background:linear-gradient(90deg,transparent,#100c07e7 28%,#100c07e7 72%,transparent);border-bottom-color:#d1a34b40}
body[data-table-theme="gilded"] .brand-mark{background:linear-gradient(145deg,#463117,#0d0905);border-color:#d8aa538f;box-shadow:0 0 24px #d68f2526,inset 0 0 14px #f3d28b14}
body[data-table-theme="gilded"] .brand small{color:#bca985}
body[data-table-theme="gilded"] .run{background:#110d08e3;border-color:#d2a64f4d}
body[data-table-theme="gilded"] .icon{background:#110d08e3;border-color:#d2a64f59;color:#e4cc9b}
body[data-table-theme="gilded"] .icon:hover:enabled{background:#4a3217;color:#fff1c9;border-color:#e9c272}
body[data-table-theme="gilded"] .table{border-color:#d2a34b91;background:radial-gradient(ellipse at 50% 44%,#5a3d188c 0,#2b1d0edb 43%,#0d0905f2 92%),linear-gradient(135deg,#3d2a14ee,#0c0805f4);box-shadow:0 28px 80px #000e,0 0 65px #b9791e28,inset 0 0 120px #030201e8,inset 0 1px #f2d28b34}
body[data-table-theme="gilded"] .table::after{border-color:#d6aa533d;background:radial-gradient(ellipse at center,#e4aa3f0b,transparent 63%);box-shadow:inset 0 0 38px #bd79201b}
body[data-table-theme="gilded"] .table-border{border-color:#dbb45f80;box-shadow:0 0 0 1px #090603,inset 0 0 0 1px #f6da9928}
body[data-table-theme="gilded"] .scorebox{background:linear-gradient(180deg,#382713df,#100b06f3);border-color:#d2a34b91;box-shadow:0 10px 25px #0009,inset 0 1px #f1d18b34}
body[data-table-theme="gilded"] .target{background:linear-gradient(90deg,#1a1108dc,transparent);border-left-color:#d0a04a91!important}
body[data-table-theme="gilded"] .target>span,body[data-table-theme="gilded"] .pool-wrap small,body[data-table-theme="gilded"] .deck>small{color:#bca989}
body[data-table-theme="gilded"] .deck::before{background-color:#21160c;border-color:#d1a24b91}
body[data-table-theme="gilded"] .deck img{outline-color:#ddb35f9f}
body[data-table-theme="gilded"] .deck span{background:#1a1109e8;border-color:#d6aa548f}
body[data-table-theme="gilded"] .pool span{background:#21160cd4;border-color:#d9ad575c;color:#f2dfb7;box-shadow:inset 0 0 10px #e0a43d1a}
body[data-table-theme="gilded"] .pool span.known{background:#120d08a8;border-color:#d6aa5426;color:#8b765485;box-shadow:none;text-decoration:line-through;text-decoration-color:#b89a6699}
body[data-table-theme="gilded"] .played-placeholder{background:#1b1209b3;border-color:#d1a24b85;color:#c49a5291}
body[data-table-theme="gilded"] .played-label{color:#e6cc9a}
body[data-table-theme="gilded"] .played-tip,body[data-table-theme="gilded"] .trumps>.trump>.copy{background:linear-gradient(180deg,#3b2915f7,#0e0905fb);border-color:#d4a650ac}
body[data-table-theme="gilded"] .sleeve{background:radial-gradient(ellipse at 50% 100%,#5e3f174c,transparent 67%);border-top-color:#d1a24b3b}
body[data-table-theme="gilded"] .status p{color:#b6a586}
body[data-table-theme="gilded"] .secondary{background:#24180dce;border-color:#c99b487f;color:#ead5ac}
body[data-table-theme="gilded"] .secondary:hover:enabled{background:#513719;color:#fff0c9}
body[data-table-theme="gilded"] .primary{background:linear-gradient(180deg,#f4d997,#b27b32);border-color:#fae5ad;color:#1b1208}
body[data-table-theme="gilded"] .primary:hover:enabled{background:linear-gradient(180deg,#ffedbb,#cb9141)}
body[data-table-theme="gilded"] dialog:not(.main-menu):not(.menu-flow){background:linear-gradient(145deg,#382612f3,#0d0905fc 75%);border-color:#d5aa5596}
@media(max-width:580px){body[data-table-theme="gilded"] .topbar{background:#100c07ee}}
@media(prefers-reduced-motion:reduce){body[data-table-theme="gilded"]{background-attachment:scroll}}
.table-feed.result-feed strong{font:400 30px/1 Georgia,serif;letter-spacing:.3px;text-transform:none;color:var(--gold-bright);text-shadow:0 0 24px #e4c77955,0 3px 18px #000}

@media(max-height:750px) and (min-width:801px){.hand{height:105px;min-height:105px}.number-card,.number-card img{width:68px;height:105px;min-width:68px;max-width:68px;flex-basis:68px}.center{height:101px}.deck,.trump-deck,.deck img{width:68px;height:105px}.deck>small{top:119px}.played-placeholder,.played-card,.played-card img{width:64px;height:99px}.played-card{flex-basis:64px}.trumps>.trump,.trumps>.trump>img{width:89px;height:138px}.trumps>.trump{flex-basis:89px;transform-origin:50% 138px}.trumps{min-height:143px}.sleeve{min-height:155px}}
@media(max-width:800px){.hand{height:113px;min-height:113px}.number-card,.number-card img{width:74px;height:113px;min-width:74px;max-width:74px;flex-basis:74px}.deck,.trump-deck,.deck img{width:74px;height:113px}.deck>small{top:127px}.played-placeholder,.played-card,.played-card img{width:55px;height:84px}.played-card{flex-basis:55px}}
@media(max-width:580px){.hand{height:95px;min-height:95px}.number-card,.number-card img{width:61px;height:95px;min-width:61px;max-width:61px;flex-basis:61px}.deck,.trump-deck,.deck img{width:61px;height:95px}.deck>small{top:106px}.played-placeholder,.played-card,.played-card img{width:45px;height:69px}.played-card{flex-basis:45px}.trumps>.trump,.trumps>.trump>img{width:90px;height:139px}.trumps>.trump{flex-basis:90px;transform-origin:50% 139px}.trumps{min-height:159px}.sleeve{min-height:170px}.table-feed.result-feed strong{font-size:24px}}
/* Casual duel menus keep the existing card-table visual language. */
.room-input{display:block;width:100%;box-sizing:border-box;margin:18px 0 8px;padding:14px 16px;border:1px solid #b59b5c66;border-radius:8px;background:#07110d;color:#f1ead7;font:600 20px/1.3 Arial,sans-serif;text-transform:uppercase;letter-spacing:.2em;}
.room-input:focus{outline:2px solid var(--gold);outline-offset:3px;}
.room-code{display:block;text-align:center;font-size:clamp(30px,8vw,48px);letter-spacing:.2em;color:var(--gold);padding:20px 0;user-select:text;}
.network-error{color:#eaa795!important;}
.match-clock{display:inline-flex;align-items:center;justify-content:center;align-self:center;min-height:30px;padding:3px 10px;border:1px solid #b5a16b55;border-radius:20px;background:#07110de0;font-size:10px;color:var(--gold);font-variant-numeric:tabular-nums;white-space:nowrap;}
.match-clock[hidden]{display:none}
.match-clock.urgent{color:#efa58b;}
footer{flex-wrap:wrap;gap:8px;}
footer #modes{font-size:11px;min-height:32px;}
#modal button[hidden]{display:none!important;}
@media(max-width:600px){.actions .match-clock{grid-column:1/-1;justify-self:center;min-height:24px;font-size:9px;padding:2px 7px}}
/* Aligned edges make both piles read as tidy stacks of card stock. */
.center .deck{isolation:isolate}
.center .deck::before,.center .deck::after{
  content:'';position:absolute;inset:0;display:block;
  background:#10241a var(--deck-back) center/100% 100% no-repeat;
  border:1px solid #d7c49d;border-radius:7px;
  box-shadow:0 2px 0 #f0e0bb,0 5px 7px #0008;
  pointer-events:none;
}
.center .deck::before{z-index:-1;transform:translate(-2px,4px)}
.center .deck::after{z-index:-2;transform:translate(-4px,8px)}
.center .deck>img{position:relative;z-index:1}
.center .deck>span,.center .deck>small{z-index:2}
.center .deck[data-stack="short"]::after,.center .deck[data-stack="single"]::before,.center .deck[data-stack="single"]::after{display:none}
body[data-table-theme="scarlet"] .center .deck::before,body[data-table-theme="scarlet"] .center .deck::after{background-color:#32111a;border-color:#e2b28b;box-shadow:0 2px 0 #f1d5b5,0 5px 7px #0008}
body[data-table-theme="sapphire"] .center .deck::before,body[data-table-theme="sapphire"] .center .deck::after{background-color:#0a2344;border-color:#bdd4e2;box-shadow:0 2px 0 #e2edf3,0 5px 7px #0009}
body[data-table-theme="gilded"] .center .deck::before,body[data-table-theme="gilded"] .center .deck::after{background-color:#21160c;border-color:#d8ab54;box-shadow:0 2px 0 #f0d28e,0 5px 7px #000a}

/* One continuous table contains the hands, actions and trump sleeve. */
.table{height:auto;min-height:0;max-height:none;padding:0;display:flex;flex-direction:column}
.playfield{position:relative;flex:none;height:clamp(430px,calc(100dvh - 330px),850px)}
.table .actionbar{justify-content:center;margin:0 26px;padding:12px 8px;min-height:64px}
.table .actions{justify-content:center}
.table .sleeve{flex:none;min-height:205px;margin:0 26px;padding:0 0 18px;background:none}
.table .trumps{transform:none;margin-bottom:0;padding-top:28px;padding-bottom:12px}
.table .sleeve-heading{left:8px;right:8px;top:8px}
@media(max-height:750px) and (min-width:801px){.playfield{height:max(365px,calc(100dvh - 300px))}.table .sleeve{min-height:178px}.table .actionbar{min-height:58px}}
@media(max-width:800px){.playfield{height:530px}.table .sleeve{margin:0 14px;min-height:190px}.table .actionbar{margin:0 14px}}
@media(max-width:580px){.playfield{height:520px}.table .sleeve{margin:0 10px;min-height:195px}.table .actionbar{margin:0 10px}.table .actions button{min-width:125px;min-height:44px}.table .sleeve-heading{left:4px;right:4px}}
@media(max-width:359px){.playfield{height:465px}}

/* Clearer existing hints and a spoken opponent pass. */
.player-feed{width:340px}
.player-feed strong{font-size:14px;line-height:1.3;letter-spacing:1px}
.player-feed p{font-size:12px;line-height:1.4}
.opponent-feed.pass-bubble{top:32%;min-height:52px;display:flex;align-items:center;justify-content:center;padding:12px 22px;min-width:0;width:max-content;max-width:80%;border:1px solid #d9bc7880;border-radius:16px;background:#18392bed;color:#f0dfb3;box-shadow:0 7px 22px #0004;opacity:1}
.opponent-feed.pass-bubble strong{max-width:300px;font:italic 16px/1.25 Georgia,serif;letter-spacing:.15px;text-transform:none;color:#f0dfb3}
.opponent-feed.pass-bubble::after{content:"";position:absolute;left:50%;bottom:100%;width:12px;height:12px;background:#18392b;border-top:1px solid #d9bc7880;border-left:1px solid #d9bc7880;transform:translate(-50%,6px) rotate(45deg)}
@media(max-width:800px){.player-feed{width:280px}.player-feed strong{font-size:13px}.player-feed p{font-size:11px}}
@media(max-width:580px){.player-feed{width:calc(100% - 100px);top:65%}.player-feed strong{font-size:12px;letter-spacing:.5px}.player-feed p{display:block;font-size:10px;line-height:1.3}.opponent-feed.pass-bubble{top:32%;min-height:46px;padding:10px 16px}.opponent-feed.pass-bubble strong{max-width:220px;font-size:14px}}


@media(max-width:580px){.playfield{height:620px}.player-feed{top:66%}}

.sequence-card{position:fixed;z-index:900;pointer-events:none;object-fit:fill;border-radius:6px;transform-origin:center;filter:drop-shadow(0 9px 9px #0008);backface-visibility:visible}
.cards-in-motion #hit,.cards-in-motion #pass,.cards-in-motion #trumps button{pointer-events:none}


/* Brief feedback anchored beside each seat, outside the card play area. */
.identity .stake{font-size:15px;line-height:1.3}
.seat-feedback{position:absolute;right:calc(100% + 12px);white-space:nowrap;pointer-events:none;font:700 20px/1.2 Arial,sans-serif;z-index:20;text-shadow:0 2px 8px #000;animation:seat-feedback-fade 2s ease-out both}
.seat-feedback.damage{top:34px;color:#f3e8d0}.damage-heart{color:#ef756c}
.seat-feedback.raise{top:64px;font-size:17px;color:#edcf79}
@keyframes seat-feedback-fade{0%{opacity:0;transform:translateY(7px) scale(.9)}12%,65%{opacity:1;transform:translateY(0) scale(1)}100%{opacity:0;transform:translateY(-18px)}}
@media(max-width:800px){.identity .stake{font-size:13px}.seat-feedback{font-size:17px;right:calc(100% + 7px)}.seat-feedback.damage{top:24px}.seat-feedback.raise{top:46px;font-size:14px}}
@media(max-width:580px){.identity .stake{font-size:12px}.seat-feedback.damage{top:17px}.seat-feedback.raise{top:35px;font-size:13px}}
@media(prefers-reduced-motion:reduce){.seat-feedback{animation:none!important}}

.revolver-station{position:absolute;left:50%;top:35%;transform:translate(-50%,-50%);width:145px;text-align:center;pointer-events:none;z-index:9}
#revolver{width:145px;overflow:visible;transform-origin:50% 50%;transition:transform .38s ease;filter:drop-shadow(0 5px 5px #000a)}
#revolver-message{font:11px/1.3 Arial;color:var(--gold);min-height:16px;margin:7px -35px 0;text-shadow:0 2px 5px #000}
.muzzle-flash{opacity:0}#revolver.firing .muzzle-flash{opacity:1}#revolver.firing{filter:drop-shadow(0 0 12px #ffcf75);translate:3px 0}
@media(max-width:800px){.revolver-station{width:110px;top:37%}#revolver{width:110px}#revolver-message{font-size:10px}}
@media(max-width:580px){.revolver-station{width:85px;top:36%}#revolver{width:85px}#revolver-message{font-size:9px}}

/* Keep opponent speech above the shared weapon. */
.opponent-feed.pass-bubble{top:30%}


/* Decks retain their original centered footprint; the weapon does not affect it. */
.center{gap:94px;align-items:center}
.center .trump-deck{margin-right:0}
.center .revolver-station{position:absolute;left:calc(100% + 56px);top:50%;transform:translateY(-50%);width:290px}
.center #revolver{width:290px;display:block}
.center #revolver-message{margin:7px 0 0}
@media(max-width:800px){.center{gap:62px}.center .revolver-station{left:calc(100% + 24px);width:220px}.center #revolver{width:220px}}
@media(max-width:580px){.center .revolver-station{left:calc(100% + 16px);width:170px}.center #revolver{width:170px}}

@media(min-width:581px) and (max-width:1100px){.pool-wrap{top:72%}}
@media(max-width:580px){.center .revolver-station{left:calc(100% - 94px);top:-40px}.opponent-feed.pass-bubble{top:26%}}

/* Stakes are represented by the shared revolver load. */
.identity .stake{display:none}
.seat-feedback.damage{font-size:40px}
.revealed-card{animation-duration:.3467s}.played-flight{animation-duration:.2756s}
.drag-card-ghost.returning{transition-duration:.1067s,.1067s,.1067s,.0889s}
@media(max-width:800px){.seat-feedback.damage{font-size:34px}}

/* Card travel is 1.25 times longer than the previous setting. */
.revealed-card{animation-duration:.4334s}.played-flight{animation-duration:.3445s}
.drag-card-ghost.returning{transition-duration:.1334s,.1334s,.1334s,.1111s}

/* Painted emerald-and-brass revolver; flash rotates with the weapon. */
#revolver{position:relative;aspect-ratio:1619/971}
.revolver-art{display:block;width:100%;height:auto;pointer-events:none;user-select:none}
.revolver-flash{position:absolute;left:-5%;top:19%;width:12%;height:20%;opacity:0;overflow:visible;filter:drop-shadow(0 0 8px #ffbf5d)}
#revolver.firing .revolver-flash{opacity:1}

#revolver-message.ammo-row{display:flex;justify-content:center;align-items:center;gap:7px;min-height:30px;margin-top:7px}
.ammo-bullet{width:15px;height:30px;object-fit:contain;transition:filter .18s,opacity .18s}
.ammo-bullet.loaded{filter:brightness(1.25) drop-shadow(0 0 3px #e6ba5c88);opacity:1}
.ammo-bullet.unloaded{filter:grayscale(1) brightness(.65);opacity:.5}
@media(max-width:580px){.ammo-bullet{width:12px;height:24px}#revolver-message.ammo-row{gap:5px;min-height:24px}}

#revolver-message.ammo-row{gap:3px;min-height:22px}
#revolver-message .ammo-bullet{width:12px;height:22px;min-height:0;border:0;outline:0;background:none;flex:0 0 12px}
@media(max-width:580px){#revolver-message.ammo-row{gap:2px;min-height:18px}#revolver-message .ammo-bullet{width:10px;height:18px;flex-basis:10px}}

#revolver-message.ammo-row{gap:1.5px}
#revolver-message .ammo-bullet{width:16px;flex-basis:16px;object-fit:fill}
@media(max-width:580px){#revolver-message.ammo-row{gap:1px}#revolver-message .ammo-bullet{width:13px;flex-basis:13px}}

#revolver-message.ammo-row{width:max-content;margin:7px auto 0;padding:7px 10px;border:1px solid #ad915b80;border-radius:8px;background:linear-gradient(180deg,#10231df2,#07120ff5);box-shadow:inset 0 1px 0 #e6ca7c12,0 3px 9px #0005}
@media(max-width:580px){#revolver-message.ammo-row{padding:5px 8px;border-radius:6px}}

/* Small rightward adjustment for the weapon and its attached cartridge frame. */
.center .revolver-station{margin-left:16px}
@media(max-width:580px){.center .revolver-station{margin-left:8px}}

/* Table-colored opponent speech and shared-cylinder cartridge frames. */
body[data-table-theme="scarlet"] .opponent-feed.pass-bubble{background:#3c121cf2;border-color:#e2a67499;color:#f4d9c3;box-shadow:0 7px 22px #10030888,inset 0 1px #f3c69e18}
body[data-table-theme="scarlet"] .opponent-feed.pass-bubble strong{color:#f4d9c3}
body[data-table-theme="scarlet"] .opponent-feed.pass-bubble::after{background:#3c121c;border-color:#e2a67499}
body[data-table-theme="scarlet"] #revolver-message.ammo-row{background:linear-gradient(180deg,#3c121cf5,#20090ff8);border-color:#e2a67491;box-shadow:inset 0 1px #f3c69e20,0 3px 9px #0007}
body[data-table-theme="sapphire"] .opponent-feed.pass-bubble{background:#0a2344f2;border-color:#bdd4e299;color:#e1eef5;box-shadow:0 7px 22px #01040c99,inset 0 1px #e4f4fd1a}
body[data-table-theme="sapphire"] .opponent-feed.pass-bubble strong{color:#e1eef5}
body[data-table-theme="sapphire"] .opponent-feed.pass-bubble::after{background:#0a2344;border-color:#bdd4e299}
body[data-table-theme="sapphire"] #revolver-message.ammo-row{background:linear-gradient(180deg,#0a2344f5,#040d20fa);border-color:#bdd4e294;box-shadow:inset 0 1px #e4f4fd22,0 3px 9px #0008}
body[data-table-theme="gilded"] .opponent-feed.pass-bubble{background:#21160cf2;border-color:#d8ab549e;color:#f0ddb7;box-shadow:0 7px 22px #030201aa,inset 0 1px #f0d28e1d}
body[data-table-theme="gilded"] .opponent-feed.pass-bubble strong{color:#f0ddb7}
body[data-table-theme="gilded"] .opponent-feed.pass-bubble::after{background:#21160c;border-color:#d8ab549e}
body[data-table-theme="gilded"] #revolver-message.ammo-row{background:linear-gradient(180deg,#21160cf5,#0d0905fa);border-color:#d8ab5498;box-shadow:inset 0 1px #f0d28e24,0 3px 9px #0009}

/* Seat vitals share one slot grid so shield and heart spacing stays aligned. */
.identity{--vital-size:23.1px;--vital-gap:2px}
.hearts,.shields{display:flex;justify-content:flex-end;align-items:center;gap:var(--vital-gap)}
.hearts{font-size:var(--vital-size)}
.hearts span{display:grid;place-items:center;flex:0 0 var(--vital-size);width:var(--vital-size);height:var(--vital-size);line-height:1}
.shields{min-height:var(--vital-size);margin:0}
.shields:empty{visibility:hidden}
.shield-icon{display:block;width:var(--vital-size);height:var(--vital-size);object-fit:contain;filter:drop-shadow(0 1px 2px #000b) drop-shadow(0 0 4px #8fc5e255)}
.opponent .identity h1{margin:4px 0 8px}
.opponent .hearts,.player .shields{margin-bottom:4px}
.player .identity{transform:translateY(67px)}
.player .identity h2{margin:8px 0 0}
.shield-icon.breaking{animation:shield-hit .18s cubic-bezier(.18,.76,.32,1) both}
.shield-icon.breaking.vanishing{animation:shield-vanish .18s ease-in forwards}
.seat-feedback.shield-block{top:28px;color:#f0d58b;font-size:18px}
@keyframes shield-hit{0%{transform:scale(1)}45%{transform:scale(1.2) rotate(-6deg);filter:drop-shadow(0 0 8px #a8dcf0aa)}100%{transform:scale(1) rotate(0)}}
@keyframes shield-vanish{from{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.62) translateY(3px)}}
@media(max-width:1000px){.identity{--vital-size:18.7px}}
@media(max-width:800px){.identity{--vital-size:15.4px}.seat-feedback.shield-block{top:18px;font-size:15px}}
@media(max-width:580px){.identity{--vital-size:13.2px;--vital-gap:1px}.opponent .identity h1{margin:0 0 4px}.opponent .hearts,.player .shields{margin-bottom:2px}.player .identity{transform:translateY(68px)}.player .identity h2{margin:4px 0 0}.seat-feedback.shield-block{top:10px;font-size:13px}}

/* Keep every primary control inside a phone portrait viewport. */
@media(max-width:580px){
  .topbar{height:70px}
  .playfield{height:clamp(390px,calc(100dvh - 369px),475px)}
  .table .actionbar{min-height:90px;padding:8px 2px;gap:6px}
  .table .sleeve{min-height:145px;padding-bottom:8px}
  .table .trumps{min-height:120px;padding-top:24px;padding-bottom:4px}
}

/* A short landscape screen uses the same complete table at a reduced scale. */
@media(orientation:landscape) and (max-height:580px){
  html,body{width:100%;height:100%;overflow:hidden}
  #app{width:166.667%;max-width:none;transform:scale(.6);transform-origin:top left;padding:0 24px}
  .topbar{height:54px}
  .playfield{height:340px}
  .table .actionbar{min-height:78px}
  .table .actions button{min-height:74px}
  .table .sleeve{min-height:150px}
  .table .trumps{min-height:123px}
  .player-feed{display:none}
}
@media(orientation:landscape) and (max-height:350px){
  #app{width:200%;transform:scale(.5)}
  .table .actions button{min-height:88px}
}
@media(prefers-reduced-motion:reduce){.shield-icon.breaking{animation:none}.shield-icon.breaking.vanishing{opacity:0}}

/* Keep the table surface focused on play; secondary labels remain available to the code for accessibility and menus. */
.brand-kicker,#pool-label,#history,#footer-note,#modes,#best,body>#app>footer{display:none!important}

/* The sound control always uses one note glyph; mute state is shown by a centered slash. */
#sound{position:relative;font-size:0;line-height:1}
#sound::before{content:'♪';display:block;font:18px/1 Georgia,serif}
#sound[aria-pressed="false"]::after{content:'';position:absolute;left:50%;top:50%;width:22px;height:1.5px;border-radius:2px;background:currentColor;transform:translate(-50%,-50%) rotate(-45deg);transform-origin:center;pointer-events:none}

/* Phone app shell: the table, actions and trump dock always fit one viewport. */
@media(max-width:760px) and (orientation:portrait){
  html,body{width:100%;height:100%;overflow:hidden;overscroll-behavior:none}
  body{padding:0 env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);background-attachment:scroll}
  #app{box-sizing:border-box;width:100%;height:100dvh;min-height:0;padding:0 6px;overflow:hidden}
  .topbar{height:52px;min-height:52px;padding-top:env(safe-area-inset-top);display:flex;flex-wrap:nowrap;align-items:center;gap:6px;background:#06100bd9}
  .brand{flex:0 0 30px;gap:0}.brand b,.brand small{display:none}.brand-mark{width:28px;height:28px;font-size:16px}
  .run{position:static;transform:none;width:auto;flex:1;justify-content:center;flex-wrap:nowrap;padding:0;border:0;background:transparent;font-size:7px;letter-spacing:.6px}.run strong{font-size:13px}.run .divider{display:block;height:12px;margin:0 2px}
  nav{flex:0 0 auto;gap:0}.icon{width:31px;min-height:38px;font-size:15px}#language{font-size:9px}
  .table{box-sizing:border-box;height:calc(100dvh - 52px - env(safe-area-inset-top) - env(safe-area-inset-bottom));min-height:0;display:grid;grid-template-rows:minmax(0,1fr) 56px 116px;overflow:hidden;border-radius:18px}
  .table-border{inset:5px;border-radius:13px}
  .playfield{height:auto!important;min-height:0;overflow:hidden}
  .seat{left:52px;right:74px;gap:4px}.seat.opponent{top:14px}.seat.player{bottom:13px}
  .hand{height:74px;min-height:74px;gap:3px}.number-card,.number-card img{width:48px;height:74px;min-width:48px;max-width:48px;flex-basis:48px}.number-card+.number-card{margin-left:0}.hand:has(.number-card:nth-child(4)) .number-card+.number-card{margin-left:-13px}.hand:has(.number-card:nth-child(7)) .number-card+.number-card{margin-left:-24px}
  .scorebox{min-width:76px;min-height:22px;padding:3px 7px}.scorebox strong{font-size:13px}
  .identity{right:-66px;top:0;width:64px}.player .identity{top:auto;bottom:0;transform:none}.identity h1,.identity h2{max-width:64px;margin:2px 0;font-size:11px;line-height:1.05;overflow-wrap:anywhere}.identity .stake{font-size:8px;margin-top:2px}.identity{--vital-size:10px;--vital-gap:0}.opponent .hearts,.player .shields{margin-bottom:1px}
  .center{top:50%;height:70px;gap:35px}.deck,.trump-deck,.deck img{width:45px;height:69px}.deck>small{top:77px;font-size:6px;letter-spacing:.7px}.deck span{width:21px;height:21px;line-height:19px;font-size:9px;right:-6px}
  .center .revolver-station{left:calc(100% + 7px);width:104px;margin-left:0}.center #revolver{width:104px}.center #revolver-message{margin-top:3px;padding:3px 5px;font-size:7px}.center #revolver-message .ammo-bullet{width:9px;height:16px;flex-basis:9px}
  .target{left:9px;width:40px;gap:2px}.target>span{font-size:5px;letter-spacing:.2px}.target strong{font-size:20px}
  .pool-wrap{display:none}
  .played-zone{left:9px;width:37px}.opponent-played{top:12px}.player-played{bottom:12px}.played-label{display:none}.played-placeholder,.played-card,.played-card img{width:34px;height:52px}.played-card{flex-basis:34px}.played-card+.played-card{margin-left:-26px}
  .table-feed{max-width:190px}.opponent-feed{top:31%}.opponent-feed.pass-bubble{top:30%;min-height:34px;padding:6px 10px}.opponent-feed.pass-bubble strong{max-width:170px;font-size:11px}.player-feed{top:69%;width:190px}.player-feed p{display:none}.player-feed strong{font-size:10px}
  .table .actionbar{box-sizing:border-box;min-height:56px;height:56px;margin:0 7px;padding:5px 0}
  .table .actions{width:100%;display:grid;grid-template-columns:auto minmax(0,1fr) minmax(0,1fr);gap:6px;align-items:center}.actions .match-clock{grid-column:auto;min-height:23px;padding:2px 6px;font-size:8px}.table .actions button{min-width:0;min-height:42px;padding:7px 5px;font-size:9px}
  .table .sleeve{box-sizing:border-box;height:116px;min-height:116px;margin:0 7px;padding:0 0 4px;overflow:visible}.table .sleeve-heading{top:2px}.table .trumps{height:112px;min-height:112px;padding:11px 4px 2px;overflow:visible;align-items:flex-end}
  .trumps>.trump,.trumps>.trump>img{width:65px;height:100px}.trumps>.trump{flex-basis:65px;transform-origin:50% 100px}.trumps>.trump+.trump{margin-left:-20px}.trumps>.trump>.copy{bottom:calc(100% + 8px);width:min(190px,70vw);padding:9px}.trumps>.trump>.copy b{font-size:14px}.trumps>.trump>.copy small{font-size:9px}.trumps>.empty{min-height:80px}
  .round-reveal{width:min(250px,78vw)}
}

/* The phone layout grows with CSS viewport width, so 720px device previews
   keep the same proportions as a 390px handset instead of stretching empty felt. */
@media(max-width:760px) and (orientation:portrait){
  #app{--phone-top:clamp(52px,12vw,86px);--phone-actions:clamp(56px,13vw,94px);--phone-sleeve:clamp(116px,25vw,190px)}
  .topbar{height:var(--phone-top);min-height:var(--phone-top);gap:clamp(6px,1.4vw,10px)}
  .brand{flex-basis:clamp(30px,7vw,50px)}.brand-mark{width:clamp(28px,6.5vw,47px);height:clamp(28px,6.5vw,47px);font-size:clamp(16px,3.8vw,27px)}
  .run{font-size:clamp(7px,1.6vw,12px);letter-spacing:clamp(.6px,.14vw,1px)}.run strong{font-size:clamp(13px,3vw,22px)}.run .divider{height:clamp(12px,2.8vw,20px)}
  .icon{width:clamp(31px,7vw,50px);height:clamp(38px,8vw,58px);font-size:clamp(15px,3.4vw,24px)}#language{font-size:clamp(9px,2vw,14px)}
  .table{height:calc(100dvh - var(--phone-top) - env(safe-area-inset-top) - env(safe-area-inset-bottom));grid-template-rows:minmax(0,1fr) var(--phone-actions) var(--phone-sleeve)}
  .seat{left:clamp(52px,13.3vw,96px);right:clamp(74px,19vw,137px);gap:clamp(4px,1vw,7px)}.seat.opponent{top:clamp(14px,3.3vw,24px)}.seat.player{bottom:clamp(13px,3vw,22px)}
  .hand{height:clamp(74px,19vw,136px);min-height:clamp(74px,19vw,136px);gap:clamp(3px,.8vw,6px)}.number-card,.number-card img{width:clamp(48px,12.3vw,88px);height:clamp(74px,19vw,136px);min-width:clamp(48px,12.3vw,88px);max-width:clamp(48px,12.3vw,88px);flex-basis:clamp(48px,12.3vw,88px)}
  .hand:has(.number-card:nth-child(4)) .number-card+.number-card{margin-left:clamp(-24px,-3.3vw,-13px)}.hand:has(.number-card:nth-child(7)) .number-card+.number-card{margin-left:clamp(-42px,-6.2vw,-24px)}
  .scorebox{min-width:clamp(76px,19vw,137px);min-height:clamp(22px,5.5vw,40px);padding:clamp(3px,.8vw,6px) clamp(7px,1.8vw,13px)}.scorebox strong{font-size:clamp(13px,3.3vw,24px)}
  .identity{right:clamp(-118px,-16.9vw,-66px);width:clamp(64px,16.4vw,118px)}.identity h1,.identity h2{max-width:100%;font-size:clamp(11px,2.8vw,20px)}.identity .stake{font-size:clamp(8px,2vw,14px)}.identity{--vital-size:clamp(10px,2.55vw,18px)}
  .center{height:clamp(70px,17.5vw,126px);gap:clamp(35px,9vw,65px)}.deck,.trump-deck,.deck img{width:clamp(45px,11.5vw,83px);height:clamp(69px,17.7vw,127px)}.deck>small{top:clamp(77px,19.7vw,142px);font-size:clamp(6px,1.5vw,11px)}.deck span{width:clamp(21px,5.4vw,39px);height:clamp(21px,5.4vw,39px);line-height:clamp(19px,4.9vw,35px);font-size:clamp(9px,2.3vw,17px)}
  .center .revolver-station{left:calc(100% + clamp(7px,1.8vw,13px));width:clamp(104px,26.7vw,192px)}.center #revolver{width:clamp(104px,26.7vw,192px)}.center #revolver-message{font-size:clamp(7px,1.75vw,13px)}
  .target{left:clamp(9px,2.3vw,17px);width:clamp(40px,10.3vw,74px)}.target>span{font-size:clamp(5px,1.25vw,9px)}.target strong{font-size:clamp(20px,5.1vw,37px)}
  .played-zone{left:clamp(9px,2.3vw,17px);width:clamp(37px,9.5vw,68px)}.played-placeholder,.played-card,.played-card img{width:clamp(34px,8.7vw,63px);height:clamp(52px,13.3vw,96px)}.played-card{flex-basis:clamp(34px,8.7vw,63px)}
  .table .actionbar{height:var(--phone-actions);min-height:var(--phone-actions);margin:0 clamp(7px,1.8vw,13px);padding:clamp(5px,1.25vw,9px) 0}.table .actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(6px,1.5vw,11px)}.table .actions:has(.match-clock:not([hidden])){grid-template-columns:auto repeat(2,minmax(0,1fr))}.actions .match-clock{min-height:clamp(23px,5.8vw,42px);font-size:clamp(8px,2vw,14px)}.table .actions button{min-height:clamp(42px,10.7vw,77px);font-size:clamp(9px,2.3vw,16px)}
  .table .sleeve{height:var(--phone-sleeve);min-height:var(--phone-sleeve);margin:0 clamp(7px,1.8vw,13px)}.table .trumps{height:calc(var(--phone-sleeve) - 4px);min-height:calc(var(--phone-sleeve) - 4px);padding-top:clamp(11px,2.8vw,20px)}
  .trumps>.trump,.trumps>.trump>img{width:clamp(65px,16.7vw,120px);height:clamp(100px,25.6vw,184px)}.trumps>.trump{flex-basis:clamp(65px,16.7vw,120px);transform-origin:50% 100%}.trumps>.trump+.trump{margin-left:clamp(-37px,-5.1vw,-20px)}
}

/* Landscape phones use a right-hand trump rail instead of scaling the whole app. */
@media(orientation:landscape) and (max-height:580px){
  html,body{width:100%;height:100%;overflow:hidden;overscroll-behavior:none}
  body{padding:0 env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}
  #app{box-sizing:border-box;width:100%;height:100dvh;min-height:0;max-width:none;padding:0 8px;transform:none;overflow:hidden}
  .topbar{height:44px;min-height:44px}.brand small,.tagline{display:none}.brand-mark{font-size:22px}.brand b{font-size:12px}.run strong{font-size:13px}.icon{width:32px;min-height:36px}
  .table{height:calc(100dvh - 44px);min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 142px;grid-template-rows:minmax(0,1fr) 50px;overflow:hidden;border-radius:17px}
  .playfield{grid-column:1;grid-row:1;height:auto!important;min-height:0;overflow:hidden}.table .actionbar{grid-column:1;grid-row:2;height:50px;min-height:50px;margin:0 8px;padding:3px}.table .sleeve{grid-column:2;grid-row:1/3;height:auto;min-height:0;margin:6px 5px;padding:18px 0 4px;border-left:1px solid var(--line);overflow:hidden}
  .table .sleeve-heading{top:5px;left:8px}.table .trumps{height:100%;min-height:0;padding:2px 0;transform:none;display:flex;flex-direction:column;justify-content:center;align-items:center;overflow:visible}
  .trumps>.trump,.trumps>.trump>img{width:58px;height:89px}.trumps>.trump{flex:0 0 89px;transform:none}.trumps>.trump+.trump{margin-left:0;margin-top:-52px}
  .seat{left:18%;right:21%;gap:2px}.seat.opponent{top:8px}.seat.player{bottom:7px}.hand{height:65px;min-height:65px}.number-card,.number-card img{width:42px;height:65px;min-width:42px;max-width:42px;flex-basis:42px}.scorebox{min-height:20px;padding:2px 6px}.scorebox strong{font-size:12px}
  .identity{right:calc(-35% + 5px);width:95px}.identity h1,.identity h2{font-size:12px}.identity{--vital-size:10px}.player .identity{transform:none}
  .center{height:65px;gap:37px}.deck,.trump-deck,.deck img{width:42px;height:65px}.deck>small{top:72px;font-size:5px}.center .revolver-station{left:calc(100% + 8px);width:118px}.center #revolver{width:118px}.center #revolver-message{padding:3px 5px;margin-top:2px}.target{left:8px;width:70px}.target strong{font-size:18px}.pool-wrap{display:none}
  .played-zone{left:8px;width:42px}.played-label{display:none}.played-placeholder,.played-card,.played-card img{width:34px;height:52px}.played-card{flex-basis:34px}.opponent-played{top:8px}.player-played{bottom:7px}
  .table-feed{display:none}.table-feed p{display:none}.table-feed strong{font-size:9px}
  .table .actions{display:grid;grid-template-columns:auto 1fr 1fr;gap:5px;width:min(430px,100%)}.actions .match-clock{grid-column:auto;min-height:22px;font-size:8px}.table .actions button{min-width:0;min-height:39px;padding:5px}
}

/* Mobile GPUs get the same visual hierarchy with cheaper raster work. */
@media(max-width:760px),(max-height:580px),(pointer:coarse){
  body{background-image:linear-gradient(180deg,#03100ba8 0%,#06110ac4 52%,#030805f4 100%),url('assets/mobile/ui/gothic-forest-table.webp');background-attachment:scroll;background-size:auto,cover;background-position:center,center top}
  body[data-table-theme="scarlet"]{background-image:linear-gradient(180deg,#1c090f9c 0%,#210a10b8 52%,#100508ed 100%),url('assets/mobile/scarlet/salon-background.webp')}
  body[data-table-theme="sapphire"]{background-image:linear-gradient(180deg,#050b17a1 0%,#071226b8 53%,#020610ed 100%),url('assets/mobile/sapphire/observatory-background.webp')}
  body[data-table-theme="gilded"]{background-image:linear-gradient(180deg,#0907049c 0%,#100c07ba 54%,#050402ed 100%),url('assets/mobile/gilded/vault-background.webp')}
  body::before{display:none}
  .table,.round-reveal{backdrop-filter:none}
  .table::before{display:none}
  body[data-table-theme] .table{box-shadow:0 8px 20px #0008}
  .number-card,.deck,.trumps>.trump>img,.played-card img,.trump-deck img,#revolver,.shield-icon,.sequence-card,.drag-card-ghost{filter:none}
  /* Action animations are shared with desktop; reduced-motion rules above still apply. */
  .thinking-pulse{animation:none!important;box-shadow:none!important}
  dialog::backdrop{backdrop-filter:none}
}

/* Freeze table effects during platform, focus, and menu pauses. */
.game-paused #app *, .game-paused #app *::before, .game-paused #app *::after { animation-play-state:paused!important }

/* Keep the desktop table, controls and sleeve inside the game viewport. */
#app{-webkit-user-select:none;user-select:none}
@media(min-width:801px) and (min-height:581px){
  #app{height:100dvh;min-height:0}
  .table{flex:1;min-height:0}
  .playfield{flex:1;min-height:0;height:auto}
  .seat.opponent{top:10px}
  .seat.player{bottom:10px}
  .player-feed:not(.result-feed){display:none}
  .actionbar .status{display:flex}
  .table .actionbar{position:relative;justify-content:flex-start}
  .table .actions{position:absolute;left:50%;transform:translateX(-50%)}
}

/* The source art has English titles baked in; cover only that title band in Russian. */
.card-art{position:relative;display:block;flex:none;width:53px;height:85px}
.card-art.drag-card-ghost{position:fixed}
.card-art>img{display:block;width:100%;height:100%;object-fit:fill;border-radius:inherit}
.trumps>.trump>.card-art,.played-card>.card-art{width:100%;height:100%;border-radius:6px}
.stack-card>.card-art{width:65px;height:100px;border-radius:5px}
.localized-card-title{position:absolute;z-index:1;left:9%;right:9%;top:78%;height:13%;display:flex;align-items:center;justify-content:center;padding:0 1px;overflow:hidden;background:#08251b;color:#f2d887;text-align:center;text-transform:uppercase;font:700 clamp(5px,.65vw,10px)/1 Georgia,serif;letter-spacing:0;pointer-events:none}
body[data-table-theme="scarlet"] .card-art:not(.boss-art) .localized-card-title{background:#35131b;color:#f2d5ad}
body[data-table-theme="sapphire"] .card-art:not(.boss-art) .localized-card-title{background:#0d2549;color:#e2e9d9}
body[data-table-theme="gilded"] .card-art:not(.boss-art) .localized-card-title{background:#2b1b0b;color:#f6d889}
.trumps .localized-card-title{font-size:clamp(6px,.8vw,11px)}
.trumps .long-title .localized-card-title{font-size:clamp(5px,.55vw,8px)}
.stack-card .localized-card-title{font-size:6px}
.stack-card .long-title .localized-card-title{font-size:5px}
@media(max-width:760px){.trumps .localized-card-title{font-size:clamp(5px,1.3vw,9px)}}
