.room{--card-w: max(56px, min(clamp(62px, 8.4vw, 134px), calc((100svh - 300px) / 3.6)));--hand-w: max(72px, min(clamp(84px, 10.6vw, 158px), calc((100svh - 300px)/4) ));--opp-w: clamp(40px, 4.2vw, 66px);--sx: 6px;--sy: 10px;position:relative;min-height:calc(100svh - var(--bar-h, 66px));overflow:hidden;isolation:isolate;background:var(--walnut) url(/img/walnut.webp) center / cover no-repeat;color:#fff}.room:after{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(120% 90% at 12% 0%,rgba(255,236,196,.3),transparent 55%),radial-gradient(90% 70% at 100% 100%,rgba(20,10,4,.35),transparent 60%);transition:opacity 1.2s var(--ease-out)}.room[data-3d="1"]:after{opacity:0}.kitchen3d{position:absolute;inset:0;z-index:0;width:100%;height:100%;opacity:0;transition:opacity 1.4s var(--ease-out)}.room[data-3d="1"] .kitchen3d{opacity:1}.table{position:relative;z-index:2;display:grid;min-height:inherit;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto minmax(0,1fr) auto;grid-template-areas:"top notepad" "felt felt" "bottom bottom";padding:clamp(10px,1.6vw,22px) clamp(12px,2.5vw,36px) clamp(14px,2vw,28px);gap:clamp(8px,1.4vw,18px)}.table[data-players="4"]{grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"left top notepad" "left felt right" "bottom bottom bottom"}.card{position:relative;width:var(--w, var(--card-w));aspect-ratio:300 / 484;border-radius:7%/4.4%;flex:none;background:var(--card-cream) center / cover no-repeat;border:0;padding:0;cursor:default;box-shadow:calc(var(--sx) * .15) calc(var(--sy) * .15) 1px #1e100847,var(--sx) var(--sy) 16px -4px #1e100873;transition:transform var(--t-std) var(--ease-out),box-shadow var(--t-std) var(--ease-out),filter var(--t-std);-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}.card img{width:100%;height:100%;border-radius:inherit;pointer-events:none}.card--back{background-image:url(/cards/back.webp)}button.card{cursor:pointer}.card[data-state=playable]:hover,.card[data-state=selected]{transform:translateY(-14%) rotate(var(--r, 0deg));box-shadow:calc(var(--sx) * .3) calc(var(--sy) * .5) 2px #1e100840,calc(var(--sx) * 2) calc(var(--sy) * 2.2) 28px -6px #1e10088c}.card[data-state=selected]:after{content:"";position:absolute;inset:-4px;border-radius:inherit;box-shadow:0 0 0 4px var(--lemon),0 0 22px 4px #f3d54e8c;pointer-events:none}.card[data-state=muted]{filter:saturate(.55) brightness(.8)}.card[data-take="1"]{transform:translateY(-6px)}.card[data-take="1"]:after{content:"";position:absolute;inset:-4px;border-radius:inherit;box-shadow:0 0 0 4px var(--lemon),0 0 26px 6px #f3d54e99;pointer-events:none;animation:breathe 1.4s var(--ease-in-out) infinite}@keyframes breathe{50%{box-shadow:0 0 0 4px var(--lemon),0 0 12px 2px #f3d54e59}}.card.flying{position:fixed;z-index:60;margin:0;pointer-events:none}.seat{display:flex;align-items:center;gap:clamp(8px,1.4vw,18px);min-width:0}.seat--top{grid-area:top}.seat--left{grid-area:left;flex-direction:column;justify-content:center}.seat--right{grid-area:right;flex-direction:column;justify-content:center}.seat--bottom{grid-area:bottom;flex-direction:column;justify-content:flex-end;align-items:center;gap:8px;position:relative}.chair{display:flex;align-items:center;gap:10px;padding:6px 14px 6px 6px;border-radius:999px;flex:none;background:#fffdf6f0;color:var(--espresso);box-shadow:var(--shadow-card);transition:box-shadow var(--t-std) var(--ease-out),transform var(--t-std) var(--ease-out)}.chair img{width:52px;height:52px;border-radius:50%;object-fit:cover;border:2px solid #fff;box-shadow:0 1px 3px #00000040}.chair__name{font-weight:700;font-size:1.02rem;line-height:1.15}.chair__level{font-size:.88rem;color:var(--espresso-soft)}.chair[data-turn="1"]{box-shadow:0 0 0 3px var(--lemon),0 0 24px 4px #f3d54e8c,var(--shadow-card);transform:translateY(-1px)}.chair__think{display:none;gap:4px;margin-left:4px}.chair[data-thinking="1"] .chair__think{display:inline-flex}.chair__think i{width:6px;height:6px;border-radius:50%;background:var(--cobalt);animation:dot 1s var(--ease-in-out) infinite}.chair__think i:nth-child(2){animation-delay:.15s}.chair__think i:nth-child(3){animation-delay:.3s}@keyframes dot{50%{transform:translateY(-4px);opacity:.5}}.chair--you{display:none}.bubble{position:absolute;z-index:30;background:var(--paper);color:var(--espresso);border-radius:14px;padding:8px 14px;font-weight:700;box-shadow:var(--shadow-card);white-space:nowrap;animation:rise var(--t-std) var(--ease-out)}.bubble:after{content:"";position:absolute;left:22px;top:-7px;border:8px solid transparent;border-bottom-color:var(--paper);border-top:0}.opp-hand{display:flex}.opp-hand .card{--w: var(--opp-w);margin-left:calc(var(--opp-w) * -.52)}.opp-hand .card:first-child{margin-left:0}.seat--left .opp-hand,.seat--right .opp-hand{flex-direction:column}.seat--left .opp-hand .card,.seat--right .opp-hand .card{margin-left:0;margin-top:calc(var(--opp-w) * -1.25);transform:rotate(90deg)}.seat--left .opp-hand .card:first-child,.seat--right .opp-hand .card:first-child{margin-top:0}.pile{position:relative;width:calc(var(--card-w) * .8);aspect-ratio:300 / 484;flex:none}.pile .card{--w: 100%;position:absolute;inset:0}.pile .card:nth-child(2){transform:rotate(3deg) translate(2px,-2px)}.pile .card:nth-child(3){transform:rotate(-2deg) translate(-2px,-3px)}.pile .scopa-mark{--w: 100%;position:absolute;inset:0;transform:rotate(90deg) translateY(8%)}.pile__count{position:absolute;left:50%;bottom:-26px;transform:translate(-50%);font:700 .95rem var(--font-body);color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.6);white-space:nowrap}.pile[data-empty="1"]{visibility:hidden}.seat--top .pile{width:calc(var(--card-w) * .62)}.seat--top .pile__count{left:calc(100% + 8px);bottom:4px;transform:none}.felt{grid-area:felt;position:relative;display:grid;place-items:center;min-height:0}.table-cards{display:flex;flex-wrap:wrap;justify-content:center;align-content:center;gap:clamp(8px,1.2vw,16px);max-width:min(92%,880px);min-height:calc(var(--card-w) * 1.62)}.table-cards .card:nth-child(odd){--r: -1.4deg;transform:rotate(-1.4deg)}.table-cards .card:nth-child(3n){--r: 1.8deg;transform:rotate(1.8deg)}.table-cards .card[data-take="1"]{transform:translateY(-6px) rotate(var(--r, 0deg))}.table[data-kind=trick] .felt{container-type:size}.trick{--cw: min(var(--card-w), calc(100cqh / 2.95));position:relative;width:calc(var(--cw) * 3.4);height:calc(var(--cw) * 2.9)}.trick .card{--w: var(--cw);position:absolute;left:50%;top:50%}.trick [data-seat="0"]{transform:translate(-50%,-18%) rotate(-3deg)}.trick [data-seat="1"]{transform:translate(8%,-58%) rotate(84deg)}.trick [data-seat="2"]{transform:translate(-50%,-96%) rotate(4deg)}.trick [data-seat="3"]{transform:translate(-108%,-58%) rotate(-86deg)}.table[data-players="2"] .trick [data-seat="1"]{transform:translate(-40%,-92%) rotate(5deg)}.table[data-players="2"] .trick [data-seat="0"]{transform:translate(-60%,-14%) rotate(-4deg)}.deck{position:absolute;right:clamp(0px,2vw,30px);top:50%;transform:translateY(-50%);display:grid;justify-items:center;gap:8px}.deck__stack{position:relative;width:calc(var(--card-w) * .86);aspect-ratio:300 / 484}.deck__stack .card{--w: 100%;position:absolute;inset:0}.deck__stack .card:nth-child(2){transform:translate(-2px,-2px)}.deck__stack .card:nth-child(3){transform:translate(-4px,-4px)}.deck__stack .deck__briscola{position:absolute;--w: 100%;inset:16% auto auto -62%;transform:rotate(90deg);z-index:-1}.deck__band{position:absolute;left:-6%;right:-6%;top:40%;height:20%;background:linear-gradient(180deg,#fff7d0,var(--lemon));border-top:1px solid rgba(0,0,0,.15);border-bottom:1px solid rgba(0,0,0,.15);display:grid;place-items:center;color:var(--espresso);font:700 clamp(.62rem,.7vw,.82rem)/1 var(--font-body);letter-spacing:.02em;box-shadow:0 2px 6px #00000040;z-index:5;transform:translate(-4px,-4px)}.deck__count{font:700 .95rem var(--font-body);text-shadow:0 1px 3px rgba(0,0,0,.6)}.deck[data-empty="1"] .deck__stack,.deck[data-empty="1"] .deck__count{display:none}.deck[data-empty="1"]{top:auto;bottom:8px;transform:none}@media(max-width:720px){.deck[data-empty="1"] .deck__seal{display:inline-block}}.deck__seal{border:0;background:#fffdf6eb;color:var(--espresso);border-radius:999px;padding:4px 10px;font:700 .85rem var(--font-body);cursor:pointer;box-shadow:var(--shadow-card)}.deck[data-cut=ready] .deck__stack{cursor:pointer;animation:nudge 1.6s var(--ease-in-out) infinite}@keyframes nudge{50%{transform:translateY(-4px)}}@media(min-width:721px)and (max-height:820px){.deck{top:0;transform:none}.deck[data-empty="1"]{top:auto}}@media(min-width:721px)and (max-height:940px){.notepad__title{display:none}.notepad{padding-top:12px}}.hand{display:flex;justify-content:center;align-items:flex-end;gap:clamp(8px,1.2vw,16px);padding-top:10px;min-height:calc(var(--hand-w) * 1.68)}.hand .card{--w: var(--hand-w)}.hand{--avail: min(100vw - 40px, 1040px)}.hand--many .card{margin-left:clamp(calc(var(--hand-w) * -.66),calc((var(--avail) - var(--n, 10) * var(--hand-w)) / (var(--n, 10) - 1)),10px)}.hand--many{gap:0}.hand--many .card:first-child{margin-left:0}.table[data-players="4"]{--hand-w: max(64px, min(clamp(74px, 7.6vw, 120px), calc((100svh - 300px) / 4.4)));--card-w: max(50px, min(clamp(54px, 6.6vw, 108px), calc((100svh - 300px) / 4.4)));--opp-w: clamp(38px, 3.6vw, 56px)}.table[data-players="4"] .seat--left .opp-hand .card:not(:first-child),.table[data-players="4"] .seat--right .opp-hand .card:not(:first-child){margin-top:calc(var(--opp-w) * -1.36)}@media(min-width:721px){.table[data-players="4"]{--opp-w: min(clamp(38px, 3.6vw, 56px), calc((100svh - 300px) / 9))}.table[data-players="4"] .seat--left,.table[data-players="4"] .seat--right{display:grid;grid-template-columns:auto auto;align-content:center;justify-content:center;align-items:end;gap:14px}.table[data-players="4"] .seat--left .chair,.table[data-players="4"] .seat--right .chair{grid-column:1 / -1;justify-self:center}.table[data-players="4"] .seat--left .opp-hand,.table[data-players="4"] .seat--right .opp-hand{padding:calc(var(--opp-w) * .3) calc(var(--opp-w) * .32) 0}.table[data-players="4"] .seat--left .opp-hand .card:not(:first-child),.table[data-players="4"] .seat--right .opp-hand .card:not(:first-child){margin-top:calc(var(--opp-w) * -1.45)}.table[data-players="4"] .seat--right .pile{width:calc(var(--card-w) * .62);margin-bottom:26px}}.seat--left,.seat--right{gap:14px}.seat--left .opp-hand,.seat--right .opp-hand{padding-top:calc(var(--opp-w) * .3)}.seat--bottom .pile{position:absolute;left:0;bottom:30px}.seat--bottom .chair{position:absolute;right:0;bottom:8px}.prompt{background:#fffdf6f2;color:var(--espresso);border-radius:999px;padding:6px 16px;font-weight:700;box-shadow:var(--shadow-card);white-space:nowrap;min-height:36px;max-width:100%}.prompt:empty{visibility:hidden}.notepad{grid-area:notepad;align-self:start;justify-self:end;position:relative;z-index:3;width:clamp(180px,16vw,250px);padding:18px 16px 14px 36px;color:var(--graphite);background:var(--paper) linear-gradient(transparent 27px,var(--paper-line) 28px) 0 12px / 100% 28px;border-radius:4px 4px 10px 10px;box-shadow:var(--shadow-card);transform:rotate(1.6deg);font-family:var(--font-hand)}.notepad:before{content:"";position:absolute;left:24px;top:0;bottom:0;width:2px;background:#c4342a73}.notepad:after{content:"";position:absolute;top:-10px;left:50%;width:70px;height:20px;transform:translate(-50%) rotate(-3deg);background:#f3d54eb3;box-shadow:0 1px 2px #00000026}.notepad__title{font-size:1.15rem;line-height:28px;color:var(--espresso-soft)}.notepad__rows{display:grid;grid-template-columns:1fr auto;column-gap:12px}.notepad__name{font-size:1.3rem;line-height:28px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.notepad__score{font-size:2.2rem;line-height:28px;text-align:right;font-variant-numeric:tabular-nums;color:var(--espresso)}.notepad__target{font-size:1.1rem;line-height:28px;color:var(--espresso-soft);grid-column:1 / -1}.notepad button{position:absolute;inset:0;background:none;border:0;cursor:pointer;border-radius:inherit}@media(max-width:720px){.room{--card-w: clamp(56px, 19.5vw, 86px);--hand-w: clamp(80px, 25vw, 108px);--opp-w: 34px;min-height:calc(100svh - var(--bar-h, 60px))}.table{grid-template-columns:minmax(0,1fr) auto;padding:10px 10px 12px}.table[data-players="4"]{grid-template-columns:58px minmax(0,1fr) 58px;grid-template-areas:"top top notepad" "left felt right" "bottom bottom bottom"}.chair{padding:4px 10px 4px 4px;gap:8px}.chair img{width:40px;height:40px}.chair__name{font-size:.95rem}.chair__level{font-size:.8rem}.seat--left .chair,.seat--right .chair{flex-direction:column;padding:4px;border-radius:16px}.seat--left .chair__text,.seat--right .chair__text{display:none}.notepad{width:128px;padding:10px 8px 6px 22px;background-size:100% 24px;background-position:0 8px}.notepad:before{left:14px}.notepad__title{display:none}.notepad__name{font-size:1.05rem;line-height:24px}.notepad__score{font-size:1.6rem;line-height:24px}.notepad__target{font-size:.95rem;line-height:24px}.felt{--strip: calc(var(--card-w) * .66 * 1.613 + 30px);padding-bottom:var(--strip)}.deck{right:0;top:auto;bottom:0;transform:none;gap:4px}.deck__stack{width:calc(var(--card-w) * .66)}.deck__band{font-size:.58rem;letter-spacing:0}.deck__count{font-size:.85rem}.deck__seal{display:none}.seat--bottom .pile{bottom:calc(100% + 30px);left:4px;width:calc(var(--card-w) * .66)}.seat--bottom .pile__count{bottom:-24px;font-size:.85rem}.table-cards{max-width:100%}.table-cards:has(>.card:nth-child(5)){--card-w: clamp(50px, 16vw, 70px)}.prompt{white-space:normal;text-align:center;line-height:1.25}.seat--top .chair{flex-direction:column;gap:2px;padding:4px 8px 6px;border-radius:16px;position:relative}.seat--top .chair__level{display:none}.seat--top .chair__name{font-size:.84rem;text-align:center}.seat--top .chair__think{position:absolute;top:6px;right:6px;margin:0;flex-direction:column}.seat--top .pile{width:calc(var(--card-w) * .56)}.seat--top .pile__count{font-size:.85rem;bottom:-22px;left:50%;transform:translate(-50%)}.seat--bottom .chair{display:none}.hand{min-height:calc(var(--hand-w) * 1.66)}.hand{--avail: calc(100vw - 20px) }.table[data-players="4"]{--hand-w: clamp(62px, 17vw, 80px)}.trick{width:calc(var(--card-w) * 3.3);height:calc(var(--card-w) * 3)}}@media(max-width:380px){.room{--hand-w: 76px}}