:root{font-family:Segoe UI,Arial,sans-serif;color:#f4f3e8;background:#0d241e;font-synthesis:none;--gold:#eac989;--muted:#a4b8ab;--line:#ffffff1a;--green:#173e32}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(ellipse at 50% 35%,#214c3c 0,#102d24 55%,#0b211b 100%)}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:default;opacity:.38}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid var(--gold);outline-offset:4px}header{height:100px;max-width:1440px;margin:auto;padding:0 5%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:13px;color:inherit;text-decoration:none;font-size:18px;font-weight:700;letter-spacing:3px}.brand-icon{display:grid;place-items:center;width:43px;height:51px;border:1px solid var(--gold);border-radius:9px;color:var(--gold);font-family:Georgia;font-size:27px;letter-spacing:-3px;transform:rotate(-8deg)}.brand small{font-size:10px;letter-spacing:2px;color:var(--muted);display:block;margin-top:5px}.header-right{display:flex;align-items:center;gap:22px}.local-badge{font-size:13px;color:var(--muted)}.icon-button{background:transparent;color:#e6eddf;border:1px solid #ffffff30;border-radius:8px;padding:9px 15px;font-size:14px}.welcome{position:relative;max-width:1050px;margin:55px auto;padding:35px 60px;min-height:650px}.eyebrow{color:var(--gold);font-size:12px;font-weight:600;letter-spacing:3px}h1{font-family:Georgia,serif;font-size:64px;font-weight:400;line-height:1.08;letter-spacing:-2px;margin:22px 0}h1 em{font-weight:400;color:var(--gold)}.welcome p{color:var(--muted);line-height:1.7;font-size:17px}.welcome-cards{position:absolute;right:45px;top:115px;width:350px;height:300px;display:flex;align-items:center;justify-content:center}.card{position:relative;width:82px;height:118px;flex-shrink:0;border:1px solid #e7e1d2;border-radius:10px;background:#fffaf0;color:#202b28;box-shadow:0 5px 10px #0002;display:flex;flex-direction:column;align-items:flex-start;padding:8px 10px;font-family:Georgia,serif;user-select:none}.card b{font-size:22px;line-height:1}.card>span{font-size:43px;align-self:center;line-height:1.35}.card small{font-family:Segoe UI,sans-serif;font-size:9px;letter-spacing:1px;align-self:center}.card.red{color:#b24440}.card.joker{background:#f5e4b9;border-color:#cba859}.welcome-cards .card{position:absolute;width:140px;height:204px;border-radius:13px;padding:14px}.welcome-cards .card b{font-size:34px}.welcome-cards .card>span{font-size:77px}.welcome-cards .card small{font-size:13px}.welcome-cards .card:first-child{transform:translateX(-95px) rotate(-19deg)}.welcome-cards .card:last-child{transform:translateX(95px) rotate(19deg)}.welcome-cards .joker{z-index:2;transform:translateY(-28px) rotate(-3deg);box-shadow:0 20px 50px #0006}.start-controls{display:grid;gap:12px;width:340px;margin-top:27px}.start-controls label{font-size:14px;color:#c2cfc5}input{border:1px solid #ffffff35;background:#09251e;color:#fff;border-radius:9px;padding:13px 15px;min-width:0}.primary,.secondary{border-radius:9px;padding:15px 21px;border:1px solid transparent;font-size:16px;font-weight:600}.primary{background:var(--gold);color:#203128}.primary span{float:right}.secondary{background:#ffffff08;border-color:#ffffff30;color:#e4eadd}.welcome-foot{margin-top:40px;font-size:13px;letter-spacing:3px;color:var(--muted)}.welcome-foot span{color:var(--gold);letter-spacing:1px}.game-layout{max-width:1430px;margin:0 auto;padding:25px 4%;display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:28px}.game-top{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:15px}.round-title{font-size:22px;font-family:Georgia,serif}.round-title small{font-family:Segoe UI,sans-serif;font-size:13px;color:var(--muted);display:block;margin-top:6px}.round-track{display:flex;gap:6px}.round-track span{width:24px;height:26px;display:grid;place-items:center;font-size:12px;color:#8caa98;border-bottom:2px solid #ffffff15}.round-track .current{color:var(--gold);border-color:var(--gold)}.table{position:relative;height:450px;border:1px solid #b5caa325;border-radius:45%;background:radial-gradient(ellipse,#285641 0%,#1a4434 64%,#173d30 100%);box-shadow:inset 0 0 0 9px #102f2555,inset 0 0 0 11px #adc69a0a,0 22px 70px #0002;margin:0 15px}.table:before{content:'';position:absolute;inset:23px;border:1px solid #cee2b512;border-radius:45%;pointer-events:none}.table-mark{position:absolute;inset:44% 0 auto;text-align:center;font:italic 27px Georgia;color:#e3d5a71b;letter-spacing:4px}.seat{position:absolute;display:flex;align-items:center;gap:10px;background:#102e25;border:1px solid #ffffff1a;padding:10px 14px;border-radius:12px;z-index:2;min-width:145px}.seat.active{border-color:var(--gold);box-shadow:0 0 0 3px #eac98910}.seat.s0{bottom:-12px;left:50%;transform:translateX(-50%)}.seat.s1{left:-22px;top:43%}.seat.s2{top:-7px;left:50%;transform:translateX(-50%)}.seat.s3{right:-22px;top:43%}.avatar{width:33px;height:33px;display:grid;place-items:center;border-radius:50%;color:var(--gold);background:#ffffff0a;font:19px Georgia}.seat-name{font-size:14px;max-width:115px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.seat-info{font-size:12px;color:var(--muted);margin-top:4px}.seat-info strong{color:#eee6ca;font-weight:500}.dealer{font-size:10px;background:var(--gold);color:#1c3428;padding:1px 4px;border-radius:50%;margin-left:5px}.trump{position:absolute;left:32px;top:35px;font-size:12px;color:var(--muted);display:flex;align-items:center;gap:10px}.trump strong{font-family:Georgia;font-size:28px;color:var(--gold)}.trick{position:absolute;inset:0;pointer-events:none}.played{position:absolute}.played.p0{bottom:65px;left:calc(50% - 41px);transform:rotate(4deg)}.played.p1{left:calc(50% - 140px);top:155px;transform:rotate(-12deg)}.played.p2{left:calc(50% - 41px);top:70px;transform:rotate(-4deg)}.played.p3{right:calc(50% - 140px);top:155px;transform:rotate(12deg)}.played .mode-tag{position:absolute;bottom:-22px;left:0;right:0;text-align:center;font:12px Segoe UI;color:var(--gold);white-space:nowrap}.table-message{position:absolute;top:42%;left:21%;right:21%;text-align:center;font-family:Georgia;font-size:23px;line-height:1.4;color:#e7e7d8}.hand-section{padding-top:29px}.action-panel{min-height:79px;text-align:center}.action-title{font-size:16px;margin:0 0 10px}.action-title small{font-size:13px;color:var(--muted);display:block;margin-top:6px}.bid-list{display:flex;gap:7px;justify-content:center;flex-wrap:wrap}.bid-button{background:#ffffff09;border:1px solid #ffffff30;color:#e8efdf;border-radius:8px;min-width:40px;height:38px}.bid-button:hover:not(:disabled){background:var(--gold);color:#17382b}.hand{display:flex;justify-content:center;padding:15px 5px 4px;min-height:140px}.hand .card{cursor:pointer;transition:transform .15s,opacity .15s;margin-left:-10px}.hand .card:first-child{margin-left:0}.hand .card:hover:not(:disabled){transform:translateY(-13px)}.hand .card:disabled{opacity:.5;cursor:default}.hand .card.legal{box-shadow:0 -3px 0 var(--gold),0 5px 10px #0002}.card.back{background:repeating-linear-gradient(45deg,#224b3a,#224b3a 5px,#2a5742 5px,#2a5742 7px);border:4px solid #d5cfb1;color:#e3d4aa;display:grid;place-items:center;font-size:29px}.hand-caption{text-align:center;color:var(--muted);font-size:12px;margin-top:8px}.sidebar{border-left:1px solid var(--line);padding-left:25px}.sidebar h2{font:24px Georgia;margin:0 0 5px}.sidebar-sub{font-size:13px;color:var(--muted);margin:0 0 22px}.score-row{display:flex;align-items:center;justify-content:space-between;padding:13px 0;border-bottom:1px solid var(--line);gap:10px}.score-row .score-name{font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.score-row .score-value{font:25px Georgia;color:var(--gold)}.score-row.me .score-name{color:var(--gold)}.score-table{width:100%;border-collapse:collapse;font-size:12px;margin-top:20px;text-align:center}.score-table th{color:var(--muted);font-weight:400}.score-table td,.score-table th{padding:9px 3px;border-bottom:1px solid #ffffff0c}.score-table .negative{color:#e39f91}.score-table .positive{color:#c9dcc2}.log-title{font-size:12px;letter-spacing:2px;color:var(--muted);margin-top:30px}.log{font-size:13px;line-height:1.6;color:#afc3b5;max-height:200px;overflow:auto}.log p{margin:8px 0}.room-code{margin-top:22px;display:flex;align-items:center;justify-content:space-between;gap:7px}.room-code span{font-size:12px;color:var(--muted)}.room-code button{font-size:12px}.bottom-tools{display:flex;gap:10px;margin-top:18px}.bottom-tools button{font-size:12px;padding:8px 12px}.status-line{font-size:12px;color:var(--muted);margin-top:15px}.result{background:#16382e;border:1px solid #eac98960;border-radius:16px;text-align:center;padding:24px;margin:15px 0}.result h2{font:30px Georgia;margin:0 0 10px;color:var(--gold)}.result p{color:#d5dfd0;line-height:1.6}.result .primary{margin-top:10px}.lobby{max-width:660px;margin:60px auto;padding:25px}.lobby h1{font-size:45px}.lobby-players{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:25px 0}.lobby-player{padding:22px;background:#ffffff07;border:1px solid var(--line);border-radius:10px}.lobby-player small{display:block;color:var(--muted);margin-top:8px}.invite{display:flex;gap:10px}.invite input{flex:1;font-size:14px}dialog{background:#15392d;color:#f0f0df;border:1px solid #d8c69850;border-radius:16px;max-width:650px;width:calc(100% - 30px);padding:28px;max-height:85vh}dialog::backdrop{background:#03140dda;backdrop-filter:blur(5px)}.dialog-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.dialog-head h2{font:28px Georgia;margin:0}dialog p,dialog li{font-size:15px;line-height:1.7;color:#cfddcd}dialog h3{color:var(--gold);margin-top:25px;font-size:17px}#toast{position:fixed;left:50%;bottom:25px;transform:translateX(-50%);z-index:10;background:#f0dcaa;color:#183329;border-radius:10px;padding:13px 20px;box-shadow:0 8px 30px #0005;max-width:90vw;display:none}.mode-options{display:flex;justify-content:center;gap:10px;margin:22px 0}.mode-options button{min-width:140px}.muted{color:var(--muted)}
@media(min-width:1500px){.welcome{margin-top:95px}.table{height:490px}}
@media(max-width:1050px){.game-layout{grid-template-columns:minmax(0,1fr) 230px;gap:20px}.sidebar{padding-left:18px}.seat{min-width:115px;padding:9px}.seat.s1{left:-15px}.seat.s3{right:-15px}.avatar{display:none}.table{height:420px;margin:0 10px}.welcome{padding:25px 40px}.welcome-cards{right:20px;width:310px}}
@media(max-width:760px){header{height:76px;padding:0 20px}.brand{font-size:15px;letter-spacing:2px}.brand small{font-size:9px}.brand-icon{width:33px;height:42px;font-size:24px}.local-badge{display:none}.welcome{margin:28px auto;padding:15px 25px;min-height:0;max-width:450px}.eyebrow{font-size:11px}h1{font-size:46px;line-height:1.1}.welcome p{font-size:16px}.welcome-cards{position:relative;right:auto;top:auto;width:100%;height:210px;margin-top:20px}.welcome-cards .card{width:105px;height:152px;padding:10px}.welcome-cards .card b{font-size:26px}.welcome-cards .card>span{font-size:54px}.welcome-cards .card small{font-size:10px}.welcome-cards .card:first-child{transform:translateX(-75px) rotate(-19deg)}.welcome-cards .card:last-child{transform:translateX(75px) rotate(19deg)}.start-controls{width:100%;margin-top:0}.welcome-foot{font-size:11px;letter-spacing:1px;text-align:center;margin-bottom:30px}.game-layout{display:flex;flex-direction:column;padding:18px 12px;gap:30px}.game-top{padding:0 5px}.round-title{font-size:19px}.round-title small{font-size:12px}.round-track{gap:2px}.round-track span{width:19px;font-size:11px}.table{height:360px;border-radius:37%;margin:15px 8px 0}.table:before{border-radius:37%}.seat{min-width:96px;max-width:135px;padding:7px 9px;gap:5px}.seat-name{font-size:12px;max-width:90px}.seat-info{font-size:11px}.seat.s1{left:-12px;top:44%}.seat.s3{right:-12px;top:44%}.seat.s2{top:-12px}.trump{left:20px;top:43px;display:block;font-size:11px}.trump strong{display:block;font-size:24px}.card{width:65px;height:94px;padding:7px;border-radius:7px}.card b{font-size:18px}.card>span{font-size:32px}.card small{font-size:7px}.played.p0{left:calc(50% - 32px);bottom:47px}.played.p2{left:calc(50% - 32px);top:46px}.played.p1{left:calc(50% - 78px);top:126px}.played.p3{right:calc(50% - 78px);top:126px}.table-message{font-size:19px;left:25%;right:25%;top:40%}.hand{min-height:111px;padding-left:0;padding-right:0}.hand .card{margin-left:-27px}.hand-section{padding-top:26px}.action-panel{min-height:76px}.action-title{font-size:14px}.bid-button{min-width:31px;height:35px;padding:0 8px}.bid-list{gap:5px}.sidebar{border-left:0;border-top:1px solid var(--line);padding:23px 8px 0}.score-rows{display:grid;grid-template-columns:1fr 1fr;column-gap:22px}.score-table{font-size:14px}.log{max-height:140px}.lobby{margin:25px auto;padding:22px}.lobby h1{font-size:35px}.invite{flex-wrap:wrap}.invite input{width:100%;flex-basis:100%}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* Compact table controls and clearer trump. */
.brand{letter-spacing:.3px;gap:12px}.brand-name{font-size:20px;line-height:1.12;font-weight:600}.brand-icon{flex-shrink:0}
.mic-toggle{width:44px;height:44px;flex-shrink:0;display:grid;place-items:center;border-radius:50%;border:1px solid #ee8e8a80;background:#552c2c;color:#ffaca6;padding:0;transition:background .15s,color .15s}
.mic-toggle[hidden]{display:none}.mic-toggle.is-on{background:#205a3d;border-color:#7de6a180;color:#98f4b6}.mic-toggle:hover:not(:disabled){filter:brightness(1.2)}.mic-toggle.is-pending{opacity:.65}
.mic-glyph{position:relative;display:block;width:24px;height:26px}.mic-glyph:before{content:'';position:absolute;left:8px;top:1px;width:8px;height:15px;border:2px solid currentColor;border-radius:6px}.mic-glyph:after{content:'';position:absolute;left:4px;top:10px;width:16px;height:11px;border:2px solid currentColor;border-top:0;border-radius:0 0 10px 10px}.mic-glyph i{position:absolute;left:11px;top:20px;height:5px;border-left:2px solid currentColor}.mic-glyph i:before{content:'';position:absolute;left:-6px;top:4px;width:10px;border-top:2px solid currentColor}.mic-toggle:not(.is-on) .mic-glyph i:after{content:'';position:absolute;left:-11px;top:-10px;width:28px;border-top:2px solid currentColor;transform:rotate(-45deg);box-shadow:0 -2px 0 #552c2c}
.seat.speaking{border-color:#89d49b;box-shadow:0 0 0 2px #89d49b25}
.trump{left:38px;top:36px;display:flex;flex-direction:column;gap:0;align-items:center;font-size:16px;font-weight:600;color:#eee5ce;line-height:1.3;pointer-events:none}.trump strong{font-size:50px;line-height:1.1;color:#f3d799}.trump.red-suit strong{color:#ffada3}
.table-mark{inset:50% auto auto 50%;transform:translate(-50%,-50%);font:112px/1 Georgia,serif;letter-spacing:0;color:#eddbad;opacity:.13;pointer-events:none}.table-mark.red-suit{color:#ffa99d}
@media(max-width:760px){header{padding:0 16px}.brand{gap:9px}.brand-name{font-size:17px}.header-right{gap:10px}.header-right .icon-button{padding:9px 11px}.trump{left:20px;top:39px;font-size:14px;gap:0}.trump strong{font-size:42px}.table-mark{font-size:94px}}
@media(max-width:360px){header{padding:0 10px}.brand-name{font-size:15px}.header-right{gap:7px}.mic-toggle{width:42px;height:42px}.trump{left:14px;font-size:13px}}