:root{--ink:#f6edd8;--muted:#bcae96;--gold:#dbb979;--card:#fff8e9;--green:#143f35;font-family:Arial,Helvetica,sans-serif;color:var(--ink);background:#16120f;font-synthesis:none;color-scheme:dark}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at top,#403020,#17130f 65%)}[hidden]{display:none!important}button,a,select{-webkit-tap-highlight-color:transparent}button,select{font:inherit}button{cursor:pointer;transition:background .18s,transform .18s,box-shadow .18s}button:disabled{cursor:default;opacity:.4}button:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid #f0c778;outline-offset:4px}a{color:inherit;text-decoration:none}.header{height:76px;padding:0 30px;display:flex;align-items:center;justify-content:space-between;gap:20px;background:linear-gradient(#211a14,#17130ff2);border-bottom:1px solid #b89b5d40;box-shadow:0 2px 15px #0007;position:relative;z-index:5}.brand{display:flex;align-items:center;gap:11px;font:28px Georgia,serif;white-space:nowrap}.brand-mark{display:grid;place-items:center;border:1px solid #cba767;border-radius:16px 16px 5px 5px;width:38px;height:44px;color:#e6c98f;font:35px Georgia,serif;box-shadow:inset 0 0 12px #c2963e16}.brand small{display:block;font:7px Arial;letter-spacing:2.7px;color:#b6a181;margin-top:5px}.room-heading{font:italic 15px Georgia,serif;color:#c3ac86;letter-spacing:.4px}.room-spark{font-style:normal;font-size:10px;padding:0 14px;color:#a47d42}.header-right{display:flex;align-items:center;gap:17px}.practice-badge{display:flex;gap:7px;align-items:center;text-transform:uppercase;font-size:9px;letter-spacing:1.4px;color:#bfb49d}.practice-badge i{width:5px;height:5px;border-radius:50%;background:#8dbf9e;box-shadow:0 0 8px #7bc59b77}.text-button{border:0;background:none;color:#d4c3a6;padding:9px 0;font-size:11px}.text-button:hover{color:#fff2d5}.quiet-button{background:linear-gradient(#3e342ad9,#251f19ee);border:1px solid #bfa46f66;border-radius:7px;padding:11px 15px;color:#f1e4ca;font-size:11px;box-shadow:inset 0 1px #ffffff0c,0 3px 7px #0003}.quiet-button:hover:not(:disabled){background:#58452d;border-color:#e6c789}.header .quiet-button{padding:9px 13px}.header #pause{min-width:65px}main{max-width:1920px;margin:auto}.game-layout{display:block}.play-area{position:relative}.scoreboard{position:absolute;z-index:4;left:24px;right:24px;top:15px;height:59px;display:flex;align-items:center;justify-content:space-between;gap:20px;pointer-events:none}.team-score{display:flex;align-items:center;gap:11px;border:1px solid #d2b77b42;border-radius:9px;padding:10px 15px;background:linear-gradient(135deg,#211a16ed,#251e17bd);backdrop-filter:blur(12px);box-shadow:0 8px 20px #0003;min-width:235px}.team-score strong{font-size:12px;font-weight:500}.team-score small{display:block;font-size:8px;color:#c1b296;margin-top:5px}.team-score b{font:29px Georgia,serif;color:#f4e4bf;margin-left:8px}.team-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}.jade{background:#9dc9b5;box-shadow:0 0 8px #a3e1b850}.ochre{background:#dfb56c}.rival{text-align:right;justify-content:flex-end}.score-dots{display:flex;gap:4px}.score-dots i{width:4px;height:4px;border-radius:50%;background:#cdb88633}.score-dots .filled{background:#95cab0}.rival .filled{background:#dbb979}.round-meta{text-align:center;background:#171812c9;border:1px solid #d5ba7f40;padding:11px 22px;border-radius:9px;backdrop-filter:blur(12px);box-shadow:0 4px 16px #0003}.round-meta span{display:block;font-size:8px;letter-spacing:2px;color:#cfb98d;margin-bottom:7px}.round-meta strong{font-size:12px;font-weight:500;color:#fff0d2}.felt{position:relative;isolation:isolate;overflow:hidden;min-height:570px;background:#17392e url('assets/empty-room.jpg') center top / 100% 570px no-repeat;color:#fff1d5}.felt:before{content:'';position:absolute;z-index:-1;inset:0;pointer-events:none;background:linear-gradient(#100d0c30,transparent 24%,transparent 54%,#0b201619 71%,#102d22 99%)}.felt:after{content:'';position:absolute;inset:0;pointer-events:none;z-index:-1;box-shadow:inset 0 -8px 18px #0005,inset 0 0 80px #0003}.table-outline{position:absolute;left:5%;right:5%;top:365px;bottom:23px;border:1px solid #bd99563b;border-radius:50%;pointer-events:none}.table-watermark{position:absolute;left:50%;top:425px;transform:translate(-50%,-50%);font:78px Georgia,serif;color:#dbc2840a;pointer-events:none}.seat{position:absolute;z-index:3;top:112px;display:flex;align-items:center;gap:8px;transform:translateX(-50%);background:linear-gradient(135deg,#221b17ed,#1c1916b8);border:1px solid #d5b87855;border-radius:8px;padding:8px 11px;min-width:110px;backdrop-filter:blur(8px);box-shadow:0 5px 15px #0005;transition:border-color .25s,box-shadow .25s}.seat-1{left:9%}.seat-2{left:23%}.seat-3{left:37%}.seat-4{left:50%}.seat-5{left:64%}.seat-6{left:78%}.seat-7{left:92%}.seat-0{top:auto;bottom:12px;left:8%;min-width:98px}.avatar{width:29px;height:29px;flex-shrink:0;display:grid;place-items:center;border-radius:50%;font:14px Georgia,serif;background:radial-gradient(circle at 35% 25%,#61846a,#223e30);border:1px solid #a9c59e99;color:#e8edd7;box-shadow:inset 0 0 10px #0004}.theirs .avatar{background:radial-gradient(circle at 35% 25%,#a17745,#493420);border-color:#c4a66d}.seat-name{display:block;font-size:11px;font-weight:600;margin-bottom:4px}.seat-meta{display:flex;align-items:center;gap:5px;font-size:9px;color:#cfc2a9;white-space:nowrap}.seat-back{display:inline-block;width:7px;height:10px;border:1px solid #d9bb8c;border-radius:1px;background:#723c30;box-shadow:2px 0 #281914,3px 0 #aa8f67}.seat.active{border-color:#f0ce81;box-shadow:0 0 0 2px #e7bf632e,0 0 24px #e8b44c40;background:linear-gradient(135deg,#66502dec,#242019ed)}.seat.active:after{content:'';position:absolute;bottom:-7px;left:calc(50% - 5px);border-left:5px solid transparent;border-right:5px solid transparent;border-top:6px solid #efd18b}.table-center{position:relative;z-index:2;width:70%;margin:350px auto 50px;text-align:center}.turn-label{display:inline-block;font-size:9px;letter-spacing:2.5px;font-weight:600;color:#ffdf9c;background:#17251dd9;border:1px solid #c2a16455;border-radius:30px;padding:8px 17px;margin:0 0 9px;box-shadow:0 3px 10px #0003}.live-move{font-size:12px;line-height:1.6;text-shadow:0 2px 5px #000;margin:0 auto 10px;max-width:620px;color:#ffedcb;min-height:19px}.pile-key{font-size:8px;letter-spacing:1.6px;color:#bcae82;margin:0 0 10px}.pile-key span{letter-spacing:.3px;color:#dfc899}.highest{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px;min-height:105px;perspective:900px}.table-play{display:flex;gap:6px;padding:5px;border:1px solid transparent;border-radius:9px;max-width:100%;transform:rotateX(12deg);transform-origin:center;min-width:0}.table-play.latest-play{border-color:#f0cc7b;background:#e9c7770a;box-shadow:0 0 18px #f0ce6d1c,inset 0 0 12px #e3c3720e}.card{position:relative;width:93px;height:136px;flex-shrink:0;border:1px solid #dac6a0;border-radius:7px;padding:7px;color:#232322;font-family:Georgia,serif;background:linear-gradient(115deg,#fffdf2,#f4e8cd);box-shadow:0 1px 0 #b3a082,0 2px 0 #d6c7a5,1px 6px 8px #0005,inset 0 0 16px #e5cf9e2b;user-select:none}.card.red{color:#b82828}.card.gray{color:#787b79}.card-corner{position:absolute;left:6px;top:6px;display:flex;flex-direction:column;align-items:center;font-size:23px;line-height:22px;width:20px}.card-corner small{font-size:16px;line-height:17px}.card-bottom{left:auto;top:auto;bottom:6px;right:6px;transform:rotate(180deg)}.card-center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:41px}.card.joker .card-corner{font:8px Arial;letter-spacing:1px;writing-mode:vertical-rl;height:40px;width:10px}.joker-label{position:absolute;bottom:24px;left:0;width:100%;font:7px Arial;letter-spacing:2px;text-transform:uppercase}.pips{position:absolute;inset:28px 22px;display:grid;grid-template-columns:1fr 1fr;grid-auto-rows:1fr;align-items:center;justify-items:center;gap:0 3px}.pips i{font-style:normal;font-size:18px;line-height:1}.pips-3,.pips-2{grid-template-columns:1fr}.pips-3 i,.pips-2 i{font-size:24px}.pips-7 i:last-child,.pips-9 i:last-child{position:absolute;top:40%;left:calc(50% - 7px)}.face-emblem{position:absolute;inset:29px 23px;display:grid;place-items:center;font-size:47px;border:1px solid #a17b3e55;background:repeating-linear-gradient(45deg,#c09c5411 0px,#c09c5411 2px,transparent 2px,transparent 7px);color:#8d652f}.face-suit{position:absolute;font-size:14px;left:calc(50% - 6px);bottom:29px}.highest .card{width:63px;height:90px;flex-shrink:1;min-width:0;padding:4px;box-shadow:1px 2px 0 #b7a987,2px 7px 9px #0006}.highest .card-corner{font-size:15px;line-height:14px;width:14px;left:4px;top:4px}.highest .card-corner small{font-size:10px;line-height:11px}.highest .card-bottom{left:auto;top:auto;right:4px;bottom:4px}.highest .card-center{font-size:28px}.highest .pips{inset:20px 16px;gap:0}.highest .pips i{font-size:12px}.highest .face-emblem{inset:20px 17px;font-size:30px}.highest .face-suit{font-size:11px;bottom:17px}.highest .card.joker .card-corner{font-size:6px;height:28px;width:8px}.highest .joker-label{font-size:5px;bottom:13px}.empty-table{font:italic 21px Georgia,serif;color:#ded1af88}.table-stats{display:flex;align-items:center;justify-content:center;gap:23px;margin-top:15px;font-size:10px;color:#ded1ad}.table-stats>span{display:flex;align-items:center;gap:7px}.table-stats b{font-size:12px;color:#f9e6b9;font-weight:500;margin-left:4px}.table-stats button{border:0;background:none;color:inherit;font-size:10px;padding:5px}.tiny-deck{width:19px;height:26px;border:2px solid #ead5ae;border-radius:2px;background:repeating-linear-gradient(45deg,#813e33 0px,#813e33 2px,#aa6250 2px,#aa6250 3px);box-shadow:1px 1px #b9a17e,2px 2px #e8d1aa,3px 3px #9e896a;transform:rotate(-9deg)}.button{display:inline-flex;justify-content:center;align-items:center;gap:18px;border:1px solid #e2c182;border-radius:7px;padding:13px 23px;min-height:44px;background:linear-gradient(#f2d495,#cfa35c);color:#382b1b;font-size:12px;font-weight:600;box-shadow:0 3px 0 #8c6a37,0 7px 18px #0004,inset 0 1px #fff2cf}.button:hover:not(:disabled){background:linear-gradient(#ffe7b3,#e1b56b);transform:translateY(-2px);box-shadow:0 4px 0 #8c6a37,0 10px 20px #0004}.button:active:not(:disabled){transform:translateY(1px);box-shadow:0 1px 0 #8c6a37}.welcome{position:absolute;z-index:4;left:50%;top:315px;transform:translateX(-50%);width:min(440px,90%);padding:24px 25px 27px;border:1px solid #c7a76a77;border-radius:13px;background:linear-gradient(145deg,#182d24f0,#14251ef5);box-shadow:0 15px 60px #0007,inset 0 1px #ffffff0a;backdrop-filter:blur(12px);text-align:center}.welcome-suits{color:#d8b46f;font-size:21px;margin:0 0 12px}.eyebrow{font-size:8px;letter-spacing:2px;font-weight:600;color:#c5ad7b}.welcome h2{font:38px/1.08 Georgia,serif;margin:13px 0 14px;color:#fbefd1;letter-spacing:-.6px}.welcome p{font-size:11px;line-height:1.8;color:#c1c2ad;margin:0 0 19px}.welcome small{display:block;font-size:9px;color:#9da68e;margin-top:17px}.felt:has(.welcome:not([hidden])){min-height:690px}.felt:has(.welcome:not([hidden])) .table-center{visibility:hidden}.felt:has(.welcome:not([hidden])) .seat-0{display:none}.hand-zone{position:relative;z-index:3;background:linear-gradient(#32251bea,#221b16f8),repeating-linear-gradient(1deg,#422b1b 0px,#422b1b 2px,#392719 3px,#392719 7px);border-top:2px solid #8f663d;box-shadow:0 -5px 14px #0006,inset 0 1px #e0b67a22;padding:15px 28px 17px}.hand-top{display:flex;justify-content:space-between;align-items:center;position:relative;z-index:1}.hand-top .eyebrow{margin-right:12px;color:#e8d7b2}.hand-top #hand-count{font-size:10px;color:#bca98b}.hand-top .text-button{font-size:10px}.hand{min-height:171px;display:flex;align-items:center;justify-content:safe center;overflow-x:auto;overflow-y:hidden;padding:22px 20px 16px;scrollbar-width:thin;scrollbar-color:#907342 transparent;perspective:900px}.hand .card{margin:0 -6px;transform:translateY(var(--lift,0px)) rotate(var(--fan,0deg));transform-origin:50% 110%;transition:transform .18s,box-shadow .18s;cursor:pointer;z-index:1}.hand .card:hover:not(:disabled){transform:translateY(-13px) rotate(0deg);z-index:4;box-shadow:0 8px 20px #0008}.hand .card.selected{transform:translateY(-18px) rotate(0deg);border:2px solid #e1b65c;box-shadow:0 0 0 2px #e9c980,0 9px 22px #0008;z-index:3}.hand .card.selected:after{content:'✓';position:absolute;right:-5px;top:-7px;width:19px;height:19px;border-radius:50%;background:#e4bd73;color:#322819;font:bold 11px Arial;display:grid;place-items:center;border:1px solid #ffe3a4}.hand .card:disabled{opacity:1;cursor:default}.hand.wide-hand .card{margin:0 3px}.placeholder-card{background:repeating-linear-gradient(45deg,#6d3025 0,#6d3025 2px,#8c4935 2px,#8c4935 4px);border:4px double #dac29b;box-shadow:0 5px 8px #0005!important}.placeholder-card:after{content:'✦';position:absolute;inset:9px;display:grid;place-items:center;border:1px solid #d9b98788;color:#e7c38b;font-size:28px}.action-row{display:flex;align-items:center;justify-content:space-between;gap:20px;border-top:1px solid #be9b5a26;padding-top:13px}.action-row p{font-size:11px;line-height:1.6;color:#cdbb9c;margin:0;max-width:480px}.play-buttons{display:flex;gap:9px;flex-shrink:0}.play-buttons .quiet-button{min-height:44px;padding:11px 19px}.play-buttons .button{min-width:155px}.table-message{position:absolute;z-index:5;left:50%;bottom:7px;transform:translateX(-50%);font-size:10px;color:#e5d6b7;background:#192c23ed;border:1px solid #d5b97c55;border-radius:6px;padding:7px 14px;white-space:nowrap}.discussion{max-width:390px;margin:0 auto;padding:19px 24px 21px;background:#14261eed;border:1px solid #bb9b6055;border-radius:10px;box-shadow:0 10px 30px #0004;backdrop-filter:blur(8px)}.discussion h2{font:28px Georgia,serif;margin:0 0 10px}.discussion p{font-size:11px;line-height:1.7;color:#c9cbb4;margin:0 0 15px}.discussion label{display:block;text-align:left;font-size:10px;color:#d6c49c;margin-bottom:8px}.discussion .button{width:100%;margin-top:12px;font-size:11px;gap:8px}.discussion small{display:block;font-size:9px;line-height:1.6;color:#a5b39b;margin-top:15px}.table-center:has(.discussion:not([hidden])) .highest{display:none}.table-center:has(.discussion:not([hidden])){margin-top:335px;margin-bottom:48px}select{width:100%;border:1px solid #9c855e;padding:12px;border-radius:6px;background:#252f23;color:#f7ead0;font-size:12px}.table-center:has(.discussion:not([hidden])) .table-stats{margin-top:12px}footer{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:17px 28px;font-size:9px;color:#9e8f77;border-top:1px solid #b59c6720;background:#18140f}footer .text-button{font-size:9px;color:#aa9a80}.footer-suits{display:none}.footer-note{color:#8f947e}dialog{color:#efe1c3;background:linear-gradient(135deg,#28271e,#191f18);border:1px solid #bca16d77;border-radius:14px;width:min(680px,92vw);max-height:88vh;padding:30px;box-shadow:0 25px 100px #000a}dialog::backdrop{background:#0e100cc7;backdrop-filter:blur(7px)}dialog h2{font:34px Georgia,serif;margin:10px 0 17px;color:#f3e1b9}.dialog-top{display:flex;align-items:center;justify-content:space-between}.dialog-top .eyebrow{margin:0}.close-button{width:32px;height:32px;font-size:25px;border:0;background:none;color:#d2bd96}.dialog-intro{font-size:13px;line-height:1.7;color:#c1b496;margin:0 0 24px}.rules-grid{display:grid;grid-template-columns:1fr 1fr;gap:17px 26px;margin:15px 0 24px}dialog h3{font:19px Georgia,serif;margin:0 0 10px;color:#e2ca9d}dialog p,dialog li{font-size:12px;line-height:1.7;color:#c3b79c}.rank-strip{padding:10px;background:#ffffff08;border-radius:5px;word-spacing:5px;font:17px Georgia,serif;color:#ead0a0}.rank-strip em{font-style:normal;color:#dfab75}#round-dialog{width:min(430px,92vw);text-align:center;padding:34px}#round-dialog .eyebrow{margin:auto}.result-icon{font-size:50px;color:#e0b774;margin:20px}#round-dialog .button{width:100%}.dialog-actions{display:flex;gap:10px;justify-content:flex-end}#new-dialog{width:min(430px,92vw)}#resources-dialog{width:min(550px,92vw)}.pile-cards{display:flex;flex-wrap:wrap;gap:9px;padding:12px 0}#toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%,20px);background:#2a3427;color:#f6e5bd;border:1px solid #bfa367;border-radius:8px;padding:13px 22px;font-size:12px;z-index:10;opacity:0;pointer-events:none;transition:.2s;max-width:90vw;text-align:center;box-shadow:0 10px 30px #0008}#toast.show{opacity:1;transform:translate(-50%,0)}
@media(min-width:1600px){.felt{background-size:100% 680px;min-height:680px}.seat{top:140px}.seat-0{top:auto}.table-center{margin-top:420px}.table-center:has(.discussion:not([hidden])){margin-top:410px}.table-outline{top:435px}.welcome{top:400px}.felt:has(.welcome:not([hidden])){min-height:780px}}
@media(max-width:1100px){.header{padding:0 20px;gap:12px}.room-heading{display:none}.header-right{gap:13px}.seat{min-width:85px;padding:7px;gap:6px}.avatar{width:24px;height:24px;font-size:12px}.seat-name{font-size:10px}.seat-meta{font-size:8px}.team-score{min-width:200px}.team-score small{font-size:7px}.score-dots{display:none}.felt{background-size:1100px 570px}.seat-1{left:6%}.seat-2{left:20%}.seat-3{left:35%}.seat-5{left:65%}.seat-6{left:80%}.seat-7{left:94%}.seat-0{left:8%}.table-center{width:80%}.hand-zone{padding:15px 23px 17px}}
@media(max-width:700px){.header{height:66px;padding:0 14px;gap:10px}.brand{font-size:23px;gap:8px}.brand-mark{width:31px;height:37px;font-size:28px}.brand small{font-size:5px;letter-spacing:1.7px}.header-right{gap:9px}.practice-badge{display:none}.header .text-button{font-size:10px}.header .quiet-button{padding:8px 10px;font-size:10px}.header #new-match{font-size:18px;padding:5px 10px}.header #new-match span{display:none}.header #pause{min-width:55px}.scoreboard{left:12px;right:12px;top:12px;height:51px;gap:8px}.team-score{min-width:0;padding:10px;gap:7px;border-radius:6px}.team-score small{display:none}.team-score strong{font-size:10px}.team-score b{font-size:22px;margin:0}.team-dot{width:5px;height:5px}.round-meta{padding:9px 12px;border-radius:6px}.round-meta span{font-size:7px;letter-spacing:1px;margin-bottom:5px}.round-meta strong{font-size:10px}.felt{min-height:575px;background-size:auto 460px;background-position:center 0;background-color:#153c2c}.felt:before{background:linear-gradient(#0c100c30,transparent 20%,#0b1f1b55 45%,#14392a 78%)}.seat{top:83px;min-width:0;gap:5px;padding:6px 8px;transform:translateX(-50%);background:#211e17e8}.seat-1{left:14%}.seat-2{left:38%}.seat-3{left:62%}.seat-4{left:86%}.seat-5{left:23%;top:141px}.seat-6{left:50%;top:141px}.seat-7{left:77%;top:141px}.seat-0{top:auto;left:50%;bottom:10px;padding:5px 12px}.seat-0 .avatar{display:none}.seat-0>div:last-child{display:flex;align-items:center;gap:8px}.seat-0 .seat-name{margin:0}.seat .avatar{width:24px;height:24px}.seat-name{font-size:10px}.seat-meta{font-size:8px}.table-center{width:94%;margin:250px auto 67px}.table-center:has(.discussion:not([hidden])){margin-top:225px;margin-bottom:60px;width:90%}.table-outline{top:284px;left:3%;right:3%;bottom:45px;border-radius:45%}.table-watermark{top:350px}.turn-label{font-size:8px;letter-spacing:1.6px}.live-move{font-size:11px;max-width:90%;margin-bottom:12px}.pile-key{font-size:7px;letter-spacing:1px}.highest{gap:7px;min-height:95px}.highest .card{width:49px;height:74px}.highest .card-corner{font-size:13px;line-height:12px;left:3px;top:3px}.highest .card-corner small{font-size:9px;line-height:10px}.highest .card-bottom{left:auto;top:auto;right:3px;bottom:3px}.highest .card-center{font-size:23px}.highest .pips{inset:18px 14px}.highest .pips i{font-size:10px}.highest .face-emblem{inset:17px 14px;font-size:26px}.highest .face-suit{bottom:14px;font-size:10px}.table-play{padding:4px;gap:4px}.table-stats{margin-top:13px;font-size:9px}.table-stats button{font-size:9px}.welcome{top:245px;padding:22px 24px}.welcome h2{font-size:34px}.welcome p{font-size:11px}.felt:has(.welcome:not([hidden])){min-height:585px}.hand-zone{padding:13px 14px 16px}.hand-top .eyebrow{font-size:8px;letter-spacing:1.5px}.hand{min-height:154px;padding:20px 14px 14px}.hand .card{width:68px;height:105px;margin:0 -5px}.hand .card-corner{font-size:19px;line-height:18px;left:5px;top:5px;width:15px}.hand .card-corner small{font-size:13px;line-height:14px}.hand .card-bottom{left:auto;top:auto;bottom:5px;right:5px}.hand .pips{inset:23px 18px;gap:0}.hand .pips i{font-size:14px}.hand .face-emblem{inset:23px 17px;font-size:37px}.hand .face-suit{bottom:22px}.hand .card-center{font-size:32px}.action-row{flex-direction:column;align-items:stretch;gap:11px;padding-top:11px}.action-row p{font-size:11px;text-align:center;max-width:none;min-height:18px}.play-buttons{gap:7px}.play-buttons .quiet-button{flex:1;padding:10px 12px;font-size:11px}.play-buttons .button{flex:1.5;min-width:0;padding:11px 15px;font-size:11px;gap:8px}footer{padding:14px;font-size:8px;gap:10px}.footer-note{display:none}footer .text-button{font-size:8px}.discussion{padding:17px 20px}.discussion h2{font-size:25px}.discussion p{font-size:11px}.table-message{bottom:42px;font-size:9px;max-width:90%}.rules-grid{grid-template-columns:1fr}dialog{padding:23px}dialog h2{font-size:28px}.dialog-intro{font-size:12px}}
@media(max-width:380px){.header-right{gap:6px}.brand small{display:none}.brand{font-size:21px}.header .text-button{font-size:9px}.seat{padding:5px;gap:4px}.seat .avatar{width:20px;height:20px}.seat-name{font-size:9px}.seat-meta{font-size:7px}.round-meta{padding:9px}.team-score{padding:9px 7px;gap:5px}.hand .card{width:63px;height:100px;margin:0 -5px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
/* Preserve the room artwork's proportions while the table grows with the pile. */
@media(min-width:701px){.felt{background-size:100% auto;background-position:center -7vw;min-height:620px}.table-center{margin-top:390px}.table-center:has(.discussion:not([hidden])){margin-top:375px}.welcome{top:365px}.felt:has(.welcome:not([hidden])){min-height:740px}}
@media(min-width:1600px){.table-center{margin-top:460px}.table-center:has(.discussion:not([hidden])){margin-top:445px}.welcome{top:430px}.felt:has(.welcome:not([hidden])){min-height:805px}}
@media(min-width:701px) and (max-width:1100px){.felt{background-size:1100px auto;background-position:center -77px}.table-center{margin-top:330px}.table-center:has(.discussion:not([hidden])){margin-top:310px}.welcome{top:315px}}
.latest-play{animation:deal-in .35s ease-out}@keyframes deal-in{from{opacity:.2;translate:0 -18px}to{opacity:1;translate:0 0}}
@media(prefers-reduced-motion:reduce){.latest-play{animation:none}}
@media(min-width:701px) and (max-width:1599px){.seat:not(.seat-0){top:82px}}
@media(max-width:700px){.felt{min-height:490px}.table-center{margin-top:230px}.highest{gap:5px}.table-play{padding:3px;gap:4px}.highest .card{width:47px}.hand{min-height:150px}.action-row{position:relative}}
/* Leave room for the lower corners of a larger fanned hand. */
.hand{padding-bottom:38px}
@media(max-width:700px){.hand{padding-bottom:34px}}
/* Independent environment, articulated characters and live, anonymous card fans. */
.felt{background-image:url('assets/empty-room.jpg')}
.character-room{position:absolute;inset:135px 0 auto;height:240px;z-index:1;pointer-events:none}
.character-room canvas{display:block;width:100%;height:100%}
.seats{position:absolute;inset:0;z-index:3;pointer-events:none}
.seat{pointer-events:none}
.player-status{position:absolute;top:calc(100% + 5px);left:0;width:100%;font-size:8px;letter-spacing:.7px;text-align:center;color:#dfcda8;text-shadow:0 2px 3px #000}
.seat.active .player-status{color:#ffe0a0}
.seat.celebrating{border-color:#b1dbb6;box-shadow:0 0 22px #b8e39766}
.opponent-hand{position:absolute;left:50%;top:154px;width:150px;height:82px;transform:translateX(-50%);perspective:500px}
.hand-back{position:absolute;bottom:0;left:calc(50% - 19px);width:38px;height:58px;border:2px solid #eddcba;border-radius:4px;background:repeating-linear-gradient(45deg,#5f2826 0px,#5f2826 2px,#8b4234 2px,#8b4234 4px);box-shadow:0 2px 1px #94734b,1px 4px 6px #0007;transform:translateX(var(--back-x)) rotate(var(--back-angle));transform-origin:50% 110%;backface-visibility:hidden}
.hand-back:after{content:'✦';position:absolute;inset:3px;border:1px solid #dcb77788;display:grid;place-items:center;font-size:18px;color:#dfbc86}
.seat.active .opponent-hand{filter:drop-shadow(0 0 5px #e3c17355)}
.seat-0 .player-status{display:none}
.character-room:not(.ready)~.seats .seat:not(.seat-0):before{content:'';position:absolute;left:50%;top:70px;transform:translateX(-50%);width:90px;height:150px;border-radius:45% 45% 20% 20%;background:radial-gradient(ellipse at 50% 28%,#c99b72 0 24%,transparent 25%),radial-gradient(ellipse at 50% 95%,#456451 0 58%,transparent 59%);filter:drop-shadow(0 5px 6px #0005)}
.latest-play{animation:none}
#card-motion{position:fixed;inset:0;z-index:80;pointer-events:none;overflow:hidden;perspective:900px}
.flying-card{position:absolute;left:0;top:0;transform-origin:0 0;will-change:transform;pointer-events:none}
.flying-turn{width:100%;height:100%;position:relative;transform-style:preserve-3d}
.flying-card .flight-front,.flight-back{position:absolute;inset:0;width:100%;height:100%;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:5px}
.flight-back{transform:rotateY(180deg);border:2px solid #f0d8ae;background:repeating-linear-gradient(45deg,#713328 0,#713328 2px,#9c513c 2px,#9c513c 4px);box-shadow:0 4px 10px #0006}
.flight-back:after{content:'✦';position:absolute;inset:4px;border:1px solid #e7c282aa;display:grid;place-items:center;color:#ebc78c;font-size:22px}
#felt[aria-busy=true] .turn-label{color:#f8dca5;border-color:#e0bc72}
@media(min-width:1600px){.character-room{top:160px;height:250px}.seat:not(.seat-0){top:95px}.opponent-hand{top:170px}}
@media(min-width:701px) and (max-width:1100px){.character-room{top:145px;height:220px}.opponent-hand{top:163px;height:70px}.hand-back{width:32px;height:49px;left:calc(50% - 16px)}.table-center{margin-top:385px}.table-center:has(.discussion:not([hidden])){margin-top:380px}}
@media(max-width:700px){.character-room{top:140px;height:365px}.felt{background-size:auto 620px;min-height:700px}.seat-5,.seat-6,.seat-7{top:268px}.seat-1,.seat-2,.seat-3,.seat-4{top:83px}.player-status{font-size:7px;top:calc(100% + 4px)}.opponent-hand{top:104px;height:75px;width:110px;transform:translateX(-50%) scale(.72);transform-origin:50% 100%}.seat-0{bottom:10px}.table-center{margin-top:490px}.table-center:has(.discussion:not([hidden])){margin-top:490px}.table-outline{top:510px}.table-watermark{top:580px}.welcome{top:490px}.felt:has(.welcome:not([hidden])){min-height:825px}.character-room:not(.ready)~.seats .seat:not(.seat-0):before{top:65px;width:65px;height:120px}}
@media(prefers-reduced-motion:reduce){.flying-card{display:none}}
@media(min-width:701px){.felt{background-size:100% 650px;background-position:center top;min-height:690px}.character-room{top:200px;height:240px}.seat:not(.seat-0){top:135px}.opponent-hand{top:154px;height:82px}.table-center{margin-top:450px}.table-center:has(.discussion:not([hidden])){margin-top:450px}.table-outline{top:455px}.welcome{top:450px}.felt:has(.welcome:not([hidden])){min-height:815px}}
@media(min-width:701px) and (max-width:1100px){.character-room{top:205px;height:220px}.opponent-hand{top:170px;height:70px}}
.anonymous-flight{border:2px solid #f0d8ae;background:repeating-linear-gradient(45deg,#713328 0,#713328 2px,#9c513c 2px,#9c513c 4px)}
@media(max-width:700px){.opponent-hand{transform:translateX(-50%) scale(var(--hand-scale,.72))}}
/* Photographic actors sit at different depths around the curved table. */
.character-room{inset:0 0 auto;height:580px;z-index:1}
.character-room canvas{visibility:hidden}
.character-room.ready canvas{visibility:visible}
.character-fallback{position:absolute;inset:0}
.character-fallback img{position:absolute;object-fit:contain;mask-image:linear-gradient(#000 88%,transparent 99%)}
.character-room.ready .character-fallback{visibility:hidden}
.character-room:not(.ready)~.seats .seat:not(.seat-0):before{display:none}
.table-surface{position:absolute;z-index:0;top:370px;left:-5%;width:110%;height:1000px;border-radius:50% 50% 0 0;border:13px solid #4b2d1d;background:radial-gradient(ellipse at 48% 10%,#43634d22,transparent 60%),repeating-linear-gradient(83deg,#ffffff02 0 1px,#00000002 1px 3px),linear-gradient(165deg,#274b3a,#12372d 60%);box-shadow:0 -2px 0 #b0874b,0 -8px 0 #35241c,0 -10px 0 #997547,inset 0 0 0 2px #b3945c66,inset 0 15px 30px #051d16aa,0 -10px 25px #0007;pointer-events:none}
.table-surface:after{content:'';position:absolute;inset:20px;border:1px solid #b19c6055;border-radius:50% 50% 0 0}
.felt{background-size:100% 680px;background-position:center top;min-height:720px}
.seat:not(.seat-0){padding:6px 10px;min-width:94px;border-radius:6px;background:linear-gradient(135deg,#211c17e8,#1e1a16cc);backdrop-filter:blur(6px)}
.seat:not(.seat-0) .avatar{display:none}
.seat:not(.seat-0)>div:not(.opponent-hand):not(.avatar){display:flex;align-items:center;gap:10px}
.seat:not(.seat-0) .seat-name{margin:0;font-size:11px}
.seat:not(.seat-0) .seat-meta{font-size:9px}
.player-status{font-size:7px;top:calc(100% + 3px);text-shadow:0 1px 4px #000}
.opponent-hand{width:150px;height:82px;transform-origin:50% 100%}
.hand-back{width:38px;height:58px;left:calc(50% - 19px);border-width:1px;border-radius:3px;box-shadow:1px 1px #92734e,1px 3px 4px #0007}
.table-center{z-index:2;margin-top:470px;width:65%}
.table-center:has(.discussion:not([hidden])){margin-top:450px}
.welcome{top:460px}
.felt:has(.welcome:not([hidden])){min-height:815px}
.table-outline{z-index:1;top:445px;left:16%;right:16%;opacity:.4}
.table-watermark{z-index:1;top:530px}
@media(min-width:1600px){.character-room{height:680px}.felt{min-height:800px;background-size:100% 800px}.table-surface{top:430px}.table-center,.table-center:has(.discussion:not([hidden])){margin-top:550px}.welcome{top:550px}.felt:has(.welcome:not([hidden])){min-height:900px}}
@media(min-width:701px) and (max-width:1100px){.table-surface{top:300px}.felt{min-height:620px;background-size:1100px 650px}.table-center,.table-center:has(.discussion:not([hidden])){margin-top:380px}.welcome{top:380px}.felt:has(.welcome:not([hidden])){min-height:750px}.seat:not(.seat-0){min-width:80px;padding:5px 7px}.seat:not(.seat-0)>div:not(.opponent-hand):not(.avatar){gap:5px}.seat:not(.seat-0) .seat-name{font-size:10px}}
@media(max-width:700px){.character-room{height:720px}.felt{min-height:760px;background-size:auto 620px}.table-surface{top:300px;left:-24%;width:148%;height:1100px;border-width:9px}.table-center,.table-center:has(.discussion:not([hidden])){margin-top:540px;width:94%}.welcome{top:540px}.felt:has(.welcome:not([hidden])){min-height:870px}.seat:not(.seat-0){padding:4px 5px;min-width:62px}.seat:not(.seat-0)>div:not(.opponent-hand):not(.avatar){gap:5px}.seat:not(.seat-0) .seat-name{font-size:9px}.seat:not(.seat-0) .seat-meta{font-size:8px}.seat-back{display:none}.player-status{font-size:6px;letter-spacing:.2px}.table-outline{top:520px;left:4%;right:4%}.table-watermark{top:585px}.hand-back{width:38px;height:58px;left:calc(50% - 19px)}}
@media(min-width:480px) and (max-width:700px){.table-center,.table-center:has(.discussion:not([hidden])){margin-top:710px}.welcome{top:710px}.felt{min-height:920px}.felt:has(.welcome:not([hidden])){min-height:1040px}.table-surface{top:400px}}

@media(min-width:480px) and (max-width:700px){.character-room{height:820px}}

/* ---- Online table: lobby, roster states, timers, voice ---- */
.welcome.lobby{position:relative;top:auto!important;left:auto;transform:none;margin:290px auto 40px;width:min(520px,92%);text-align:left}
.welcome.lobby h2{font-size:30px;text-align:center}.welcome.lobby .welcome-suits,.welcome.lobby>div>.eyebrow{display:block;text-align:center}
.lobby-label{display:block;font-size:9px;letter-spacing:1.6px;text-transform:uppercase;color:#c5ad7b;margin:14px 0 7px}
.lobby-input{width:100%;border:1px solid #9c855e;border-radius:6px;padding:12px 13px;background:#1b2a22;color:#f7ead0;font-size:14px}
.lobby-input.code{text-transform:uppercase;letter-spacing:4px;font-family:Georgia,serif;font-size:18px}
.lobby-row,.share-row{display:flex;gap:8px;align-items:stretch}.lobby-row .quiet-button,.share-row .quiet-button{flex-shrink:0;min-width:84px}
.lobby-actions{display:flex;gap:10px;justify-content:center;margin-top:18px;flex-wrap:wrap}.lobby-actions .button{flex:1 1 220px}
.lobby-join{margin-top:6px}.lobby-error{display:block;min-height:16px;margin-top:12px;color:#f0a98c;font-size:11px;text-align:center}
#lobby-room .eyebrow b{color:#f6e5bd;letter-spacing:3px;font:14px Georgia,serif;margin-left:6px}
.share-row{margin:0 0 14px}.share-row .lobby-input{font-size:11px;color:#cdbb9c}
.seat-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:6px}
.seat-row{display:flex;align-items:center;gap:9px;padding:9px 11px;border:1px solid #c7a76a44;border-radius:8px;background:#ffffff08;font-size:12px;min-height:44px}
.seat-row.theirs{border-color:#dfb56c44}.seat-row.ours{border-color:#9dc9b544}
.seat-row.clickable{cursor:pointer}.seat-row.clickable:hover{background:#ffffff14;border-color:#e6c789}
.seat-row.me{background:#285f4e33;border-color:#85bda3}
.seat-no{width:20px;height:20px;border-radius:50%;display:grid;place-items:center;font-size:10px;flex-shrink:0;background:#9dc9b5;color:#12241c}.theirs .seat-no{background:#dfb56c;color:#2b2013}
.seat-who{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#f1e4ca}.seat-row.empty .seat-who,.seat-row.bot .seat-who{color:#a8a08a;font-style:italic}
.seat-tags{font-size:8px;letter-spacing:1px;text-transform:uppercase;color:#bfb49d;white-space:nowrap}.seat-tags .online{color:#95cab0}.seat-tags .offline{color:#e3a07a}
.seat-row .text-button{padding:4px 2px;font-size:10px;white-space:nowrap}
#lobby-status{display:block;text-align:center;margin-top:12px;font-size:10px;color:#b9d5c4}#lobby-leave{display:block;margin:10px auto 0}
.room-badge{display:flex;align-items:center;gap:8px;font-size:10px;letter-spacing:1.4px;text-transform:uppercase;color:#bfb49d}.room-badge b{font:15px Georgia,serif;letter-spacing:3px;color:#f6e5bd}.room-badge .text-button{font-size:9px;padding:6px 0}
.conn-status{font-size:9px;letter-spacing:1.2px;text-transform:uppercase;color:#f0a98c;animation:pulse 1.2s infinite}@keyframes pulse{50%{opacity:.4}}
.voice-button{min-width:112px}.voice-button.live{border-color:#85bda3;background:#285f4e;color:#f5f0e1}.voice-button.muted{border-color:#e3a07a}.voice-button.blocked{border-color:#e38a6a;background:#5a2d22}.voice-button.connecting,.voice-button.error{opacity:.75}
.audio-banner{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;margin:6px 0 12px;padding:9px 14px;border:1px solid #e4bf7366;border-radius:14px;background:#2a2118;color:#f3e1b9;font-size:13px}.audio-banner[hidden]{display:none}.voice-dock{display:flex;align-items:center;padding-right:9px;margin-right:2px;border-right:1px solid #be9b5a33}.voice-dock:empty,.voice-dock:has(> [hidden]){display:none}@media(max-width:700px){.voice-dock{padding-right:7px;margin-right:0}.play-buttons .voice-button{flex:0 0 auto;min-width:0;padding:10px 12px;font-size:15px;line-height:1}.voice-button .label{display:none}}
.seat-mic{display:inline-block;margin-left:5px;font-size:11px;opacity:.75;vertical-align:1px}.seat-mic.live{opacity:1;filter:drop-shadow(0 0 4px #95cab0)}
.turn-timer{display:inline-block;margin:0 0 9px 8px;font-size:11px;letter-spacing:1px;color:#ffe7b3;background:#17251dd9;border:1px solid #c2a16455;border-radius:30px;padding:7px 13px;vertical-align:top;min-width:64px;font-variant-numeric:tabular-nums}
.turn-timer.urgent{color:#ffd0b0;border-color:#e3a07a;animation:pulse .8s infinite}
.seat.offline{opacity:.72}.seat.offline .player-status{color:#e3a07a}.seat.bot .seat-name:after{content:' ⚙';font-size:9px;color:#bfb49d}
.seat.speaking{border-color:#95cab0;box-shadow:0 0 0 2px #85bda355,0 0 22px #95cab066}.seat.speaking .avatar{box-shadow:0 0 0 3px #95cab0}
.seat-row.speaking{box-shadow:inset 0 0 0 1px #95cab0}
.review-note{font-size:11px;color:#b9d5c4;margin:-8px 0 16px;min-height:17px;font-variant-numeric:tabular-nums}
.waiting-copy{font-size:12px;color:#c9cbb4;margin:0}
.team-score small{max-width:170px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media(max-width:700px){.seat-list{grid-template-columns:1fr}.welcome.lobby{margin-top:250px}.room-badge .text-button{display:none}.team-score small{max-width:110px}}


/* Private declarations are separate from the public move caption. */