*{box-sizing:border-box}:root{color:#eff7f1;font-synthesis:none;background:#0e2621;font-family:system-ui,sans-serif}body{margin:0}main{max-width:680px;margin:auto;padding:24px}header{justify-content:space-between;align-items:center;gap:16px;display:flex}.brand{font-size:22px;font-weight:700}.online{color:#b9db9f}.offline{color:#edc986}section{margin-top:32px}h1{font-size:28px}h2{margin-top:28px;font-size:19px}.panel{background:#18352e;border:1px solid #476054;border-radius:8px;padding:24px}label{margin-bottom:8px;display:block}input,button{width:100%;font:inherit;border-radius:6px;padding:12px}input{color:#fff;background:#102a23;border:1px solid #5a7366;margin-bottom:16px}button{color:#172f23;cursor:pointer;background:#d5e8b2;border:1px solid #0000;font-weight:600}button.secondary{color:#dfedca;background:0 0;border-color:#93b381}button:disabled{opacity:.45;cursor:default}:focus-visible{outline-offset:3px;outline:3px solid #f4d38b}.code-label{margin-top:0}.game-code{letter-spacing:2px;overflow-wrap:anywhere;font-family:monospace;font-size:clamp(20px,5vw,30px);display:block}ul{padding-left:22px}li{padding:6px 0}.note{color:#b3c5ba;margin:0 0 20px;font-size:14px;line-height:1.5}.game-code+.note{margin-top:12px}.error{color:#ffd0bc}.rules{margin:24px 0}.rules dl{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px 16px;display:grid}.rules dt{color:#b3c5ba}.rules dd{overflow-wrap:anywhere;margin:0}main{max-width:1050px}.game-table section{margin-top:24px}.seats{flex-wrap:wrap;gap:12px;padding-left:24px;display:flex}.seats li{border:1px solid #476054;min-width:140px;padding:8px 12px}.seats span{margin-top:4px;font-size:14px;display:block}.cards,.table-pairs{flex-wrap:wrap;gap:10px;margin:12px 0;display:flex}.card{color:#172f23;background:#eff7f1;border:2px solid #93b381;border-radius:6px;justify-content:center;align-items:center;width:auto;min-width:90px;min-height:64px;padding:12px;font-size:15px;display:inline-flex}.card:disabled{opacity:1}.card.selected{border-color:#e2a827;outline:2px solid #e2a827}.card[draggable=true]{cursor:grab}.zone{border:1px solid #5a7366;padding:16px}.zone h2{margin-top:0}.private-zone{border-style:dashed}.table-pair{flex-direction:column;gap:8px;min-width:110px;display:flex}.defense-slot{color:#eff7f1;background:#23483c;border:1px dashed #93b381;min-height:64px}.rules-details{margin:24px 0}.rules-details summary{cursor:pointer}.visibility-choice{border:1px solid #476054;border-radius:6px;margin:0 0 12px;padding:12px}.visibility-choice label{align-items:center;gap:8px;margin:4px 24px 4px 0;display:inline-flex}.visibility-choice input{width:auto;margin:0}.public-games{padding:0;list-style:none}.public-games li{border-bottom:1px solid #476054;justify-content:space-between;align-items:center;gap:16px;padding:16px 0;display:flex}.public-games p{margin:6px 0 0}.public-games button{flex-shrink:0;width:auto}.pagination{justify-content:space-between;align-items:center;gap:12px;margin-top:20px;display:flex}.pagination button{width:auto}.pagination span{text-align:center}@media (width<=480px){.public-games li{flex-direction:column;align-items:stretch}.pagination{flex-wrap:wrap}.pagination span{flex-basis:100%;order:-1}}.round-controls{border:1px solid #93b381;padding:16px}.round-controls h2{margin-top:0}.round-buttons{flex-wrap:wrap;gap:12px;margin:16px 0;display:flex}.round-buttons button{width:auto}main.playing{width:100%;max-width:none}.transfer-zone{border:1px dashed #777;max-width:440px;margin:16px 0;padding:12px}.card[data-suit=hearts],.card[data-suit=diamonds]{color:#b42332}.profile-panel{margin-bottom:20px}.profile-panel h2{margin-top:0}.profile-fields,.profile-summary{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.profile-fields input{flex:180px;width:auto;margin:0}.profile-fields button,.profile-summary button{width:auto}.profile-summary{justify-content:space-between}.profile-panel .note{margin:12px 0 0}.settings-menu{z-index:30;font-size:14px;position:fixed;top:12px;right:18px}.settings-menu summary{cursor:pointer;background:#19382e;border:1px solid #8b9f83;border-radius:7px;padding:8px 12px}.settings-content{background:#112c26;border:1px solid #8b9f83;border-radius:10px;width:min(320px,100vw - 36px);padding:18px;position:absolute;top:44px;right:0;box-shadow:0 8px 30px #0008}.settings-content label{align-items:center;gap:10px;display:flex}.settings-content input{width:auto;margin:0}.settings-content p{color:#bdcebf;margin-bottom:0;font-size:13px}main>header{padding-right:150px}.result-screen{text-align:center;background:#17392e;border:1px solid #bea56f;border-radius:20px;min-height:360px;padding:70px 24px}.result-screen h2{font-size:clamp(26px,5vw,42px)}.result-screen button{width:auto;margin-top:20px}.playing>section{margin-top:12px}.playing>section>h1{display:none}.panel.playing-room{background:0 0;border:0;padding:0}.playing-room .room-info{color:#b3c5ba;align-items:baseline;gap:12px;display:flex}.playing-room .room-info .note{display:none}.playing-room .room-info h2,.playing-room .room-info p{margin:0;font-size:13px}.playing-room .room-info .game-code{letter-spacing:1px;font-size:16px}.playing-room>.secondary{width:auto}.table-status{flex-wrap:wrap;justify-content:center;gap:18px;padding:20px 0 12px;font-size:14px;display:flex}.table-status span{color:#b3c5ba}.table-surface{isolation:isolate;min-height:410px;margin:32px 36px 20px;padding:115px 170px 85px;position:relative}.table-surface:before{content:"";z-index:-1;background:radial-gradient(#286c53,#174b3b 75%);border:12px solid #43382d;border-radius:46%;position:absolute;inset:20px 0;box-shadow:0 0 0 3px #76634b,inset 0 0 0 2px #75917c,inset 0 0 45px #092c26,0 16px 32px #06191488}.table-seats{margin:0;padding:0;list-style:none}.table-seat{left:var(--seat-x);top:var(--seat-y);text-align:center;z-index:2;width:146px;padding:0;position:absolute;transform:translate(-50%,-50%)}.seat-label{background:#112c26;border:1px solid #63796c;border-radius:12px;padding:9px 12px;box-shadow:0 4px 12px #001a1866}.seat-label strong{overflow-wrap:anywhere;font-size:15px;display:block}.seat-role{color:#cad7cc;margin:4px 0;font-size:12px;display:block}.seat-label small{color:#b3c5ba;font-size:11px;display:block}.seat-label .seat-losses{margin-top:3px}.table-seat[data-role=attacker] .seat-label{border-color:#e8c77a}.table-seat[data-role=defender] .seat-label{border-color:#9dc5f0;box-shadow:0 0 0 2px #9dc5f022}.table-seat[data-role=finished]{opacity:.65}.hidden-hand{justify-content:center;height:46px;margin-top:7px;padding-right:19px;display:flex}.card-back{background:repeating-linear-gradient(45deg,#365b82 0 3px,#294766 3px 6px);border:2px solid #e0e5d8;border-radius:5px;flex:0 0 34px;width:34px;height:46px;display:block;box-shadow:0 2px 4px #001a1866}.hidden-hand .card-back{transform:rotate(var(--card-angle));transform-origin:bottom;margin-right:-19px}.table-center{justify-content:center;align-items:center;gap:28px;min-height:190px;display:flex}.game-table .table-center section{margin:0}.table-center .deck{text-align:center;flex:0 0 130px}.table-center h2{color:#c3d5c7;margin:0 0 10px;font-size:13px;font-weight:500}.table-center p{color:#c3d5c7;font-size:12px}.stock-cards{justify-content:center;align-items:center;padding:8px 0;display:flex}.stock-back{z-index:1;flex-basis:60px;width:60px;height:86px;box-shadow:-3px 3px #9aab9e,-6px 6px #163b30}.game-table .card{border:1px solid #ccd4c7;border-radius:7px;min-width:64px;min-height:90px;padding:8px;font-size:16px;box-shadow:0 3px 6px #001a1833}.table-center .zone{text-align:center;border:0;flex:1;min-width:0;max-width:640px;padding:0}.table-pairs{justify-content:center;gap:16px}.table-pair{gap:0;width:78px;min-width:72px;padding-bottom:20px}.table-pair>.card+.card,.table-pair>.defense-slot{margin-top:-36px;transform:translate(8px,20px)rotate(7deg)}.table-pair>.defense-slot{min-height:90px;padding:8px;font-size:12px}.defense-slot:disabled{visibility:hidden}.player-controls{flex-direction:column;align-items:stretch;max-width:920px;margin:0 auto;display:flex}.game-table .player-controls section{margin:12px 0 0}.player-controls .own-hand{text-align:center;order:-1}.own-hand h2{margin:8px 0;font-size:14px}.own-hand p,.private-zone p,.transfer-zone p{color:#b3c5ba;margin:8px 0;font-size:13px}.own-hand .cards{justify-content:center;gap:6px;padding-top:8px}.own-hand .card{min-width:76px;min-height:106px;transition:transform .12s}.own-hand .card:not(:disabled):hover,.own-hand .card.selected{transform:translateY(-8px)}.player-controls .private-zone{text-align:center;background:#17372e;border-radius:12px;padding:12px 16px}.private-zone h2,.transfer-zone h2,.round-controls h2{font-size:15px}.private-zone .cards{justify-content:center}.player-controls button:not(.card){width:auto}.player-controls .round-controls{border-radius:12px;padding:12px 16px}.round-controls ul{flex-wrap:wrap;gap:24px;display:flex}.opening-note{text-align:center;color:#b3c5ba;margin:20px 0;font-size:12px}@media (width<=850px){main.playing{padding:12px}.table-surface{margin:35px 0;padding:125px 95px 110px}.table-seat{width:105px}.seat-label{padding:7px}.seat-label strong{font-size:13px}.seat-label .seat-losses{display:none}.table-center{flex-direction:column;gap:18px}.table-center .deck{flex-basis:auto}.table-center .deck h2,.table-center .deck>p{margin:4px}.table-surface:before{border-width:7px}}@media (width<=480px){.table-surface{padding:140px 62px 105px}.table-seat{width:86px}.seat-role{font-size:11px}.hidden-hand{transform:scale(.8)}.table-pair{width:62px;min-width:62px}.table-pairs{gap:10px}.game-table .card{min-width:56px;font-size:13px}.own-hand .card{min-width:61px;min-height:90px}.table-status{text-align:center;gap:6px}}@media (prefers-reduced-motion:reduce){.own-hand .card{transition:none}}.table-center .zone>h2{clip-path:inset(50%);width:1px;height:1px;position:absolute;overflow:hidden}.table-surface{min-height:420px;margin:24px 18px 8px;padding:115px 150px 100px}.table-surface:before{border-width:9px;border-radius:38px;inset:16px 0}.table-center{gap:24px;min-height:210px}.table-center .deck{flex:0 0 125px}.deck small{color:#b3c5ba;font-size:11px}.table-battle{text-align:center;flex:1;min-width:0}.table-center .defense-zone{max-width:none}.table-pairs{gap:18px;margin:0}.table-pair{width:88px;min-width:88px;min-height:150px;padding:0 8px 30px 0;position:relative}.table-pair>.card+.card{margin:0;position:absolute;top:32px;left:14px;transform:rotate(8deg)}.table-pair>.defense-slot{color:#0000;z-index:1;background:0 0;border:2px dashed #a2cba3;border-radius:8px;min-height:116px;margin:0;position:absolute;inset:0;transform:none}.table-pair>.defense-slot:hover,.table-pair>.defense-slot:focus-visible{background:#c4e7bf33}.table-battle .table-draft{border:1px dashed #aac5a766;border-radius:10px;min-height:76px;margin:8px 0 0;padding:8px}.table-draft .cards{justify-content:center;margin:4px 0 10px}.table-draft button:not(.card){width:auto;padding:9px 16px;font-size:13px}.table-draft small{color:#c1d3c4;margin-top:6px;font-size:11px;display:block}.table-draft:empty{display:none}.table-center p.drop-hint{color:#d1e0cf;margin:18px 0;font-size:14px}.table-transfer{flex-direction:column;gap:4px;margin:14px 0 0;display:inline-flex}.transfer-target{color:#f4dea5;background:#182e27aa;border:1px dashed #e1c781;width:auto;padding:10px 25px}.table-transfer small{color:#c1d3c4;font-size:11px}.round-transition{z-index:5;pointer-events:none;place-items:center;display:grid;position:absolute;inset:0}.round-transition>div{text-align:center;background:#102922f5;border:1px solid #d2b97c;border-radius:14px;max-width:85%;padding:22px 32px;animation:1.9s both round-arrival;box-shadow:0 8px 40px #0008}.round-transition small{color:#d2b97c;margin-bottom:8px;display:block}.round-transition strong{overflow-wrap:anywhere;font-size:clamp(18px,2vw,27px);display:block}@keyframes round-arrival{0%{opacity:0;transform:translateY(8px)}12%,80%{opacity:1;transform:none}to{opacity:0}}.game-table .player-controls section{margin-top:6px}.player-controls .own-hand{order:0}.own-hand .cards{gap:3px;margin:6px 0}.player-controls .round-controls{width:min(100%,680px);margin:8px auto}.round-controls .note{display:none}.round-controls ul{margin:6px 0;font-size:12px}.round-controls h2{margin:0}.round-controls p{margin:6px 0}.round-buttons{justify-content:center;margin:4px}@media (width<=850px){.table-surface{margin:22px 0 8px;padding:145px 85px 110px}.table-center{flex-direction:column;gap:12px}.table-center .deck{flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;display:flex}.deck>h2,.deck>small{display:none}.table-battle{width:100%}}@media (width<=480px){.table-surface{padding:140px 52px 110px}.table-seat{width:80px}.seat-label strong{font-size:11px}.seat-label{padding:6px 3px}.table-pair{width:70px;min-width:70px;min-height:124px}.table-pairs{gap:14px}.table-draft{font-size:12px}.stock-back{flex-basis:60px;width:60px;height:90px}.own-hand .cards{gap:2px}}@media (prefers-reduced-motion:reduce){.round-transition>div{animation:none}}.table-surface{margin-top:48px;margin-bottom:32px}.seat-label .seat-losses{display:none}.seat-label{padding:7px 10px}.table-transfer small{display:none}@media (width<=850px){.table-surface{margin-top:48px;margin-bottom:32px}}.table-pair>.defense-slot{width:80px;height:116px;inset:0 auto auto 0}@media (width<=600px){.table-pair>.defense-slot{width:66px;height:98px;min-height:98px}}.table-battle .round-controls{background:#102b24ed;border-radius:10px;max-width:480px;margin:10px auto 0;padding:10px 14px}.table-battle .round-controls h2{color:#f1dfb7;font-size:14px}.table-battle .round-controls ul{justify-content:center;gap:4px 18px;padding:0;list-style:none}.table-battle .round-controls li{padding:0}.table-battle .round-controls button{width:auto;padding:8px 20px}.table-battle .round-buttons{margin-top:10px}.trump-symbol{color:#eff0dd;text-shadow:0 3px 6px #0006;font-size:74px;line-height:1}.trump-symbol[data-suit=hearts],.trump-symbol[data-suit=diamonds]{color:#ff9298}.game-table .card[data-hint=true]{border:2px solid #72bd9b;box-shadow:0 0 0 2px #72bd9b55}.card-help{z-index:2;color:#fff;background:#205e43;border-radius:50%;width:19px;height:19px;font:700 13px/19px system-ui;position:absolute;top:3px;right:3px}.game-table .card{color:#152a32;background:#fff9e9;border:1px solid #d0b985;flex:none;width:80px;min-width:80px;height:116px;min-height:116px;padding:0;font-family:Georgia,Times New Roman,serif;position:relative;overflow:hidden;box-shadow:0 3px 7px #00191477}.game-table .card[data-suit=hearts],.game-table .card[data-suit=diamonds]{color:#b22635}.card-face{pointer-events:none;position:absolute;inset:0}.card-index{z-index:1;flex-direction:column;align-items:center;font-size:17px;line-height:.95;display:flex;position:absolute;top:4px;left:5px}.card-index b{font-weight:700}.card-index>span{font-size:17px}.bottom-index{inset:auto 5px 4px auto;transform:rotate(180deg)}.card-pips{position:absolute;inset:19px 13px}.card-pips>span{transform:translate(-50%, -50%) rotate(var(--pip-turn));font-size:20px;line-height:1;position:absolute}.ace-pips>span{text-shadow:0 2px #c8ad7666;font-size:46px}.court-art{background-image:url(/cards/courts.png);background-repeat:no-repeat;background-size:300% 100%;border:1px solid #bb9b57;position:absolute;inset:17px 15px}.own-hand .card{width:90px;height:132px}.own-hand .card-index{font-size:19px}.own-hand .card-pips{inset:22px 16px}.own-hand .card-pips>span{font-size:23px}.own-hand .ace-pips>span{font-size:48px}.stock-cards .card{margin-left:-24px;transform:rotate(90deg)}.stock-back{flex-basis:74px;width:74px;height:110px}@media (width<=600px){.game-table .card{width:66px;min-width:66px;height:98px;min-height:98px}.card-index,.card-index>span,.own-hand .card-index{font-size:15px}.card-pips,.own-hand .card-pips{inset:19px 11px}.card-pips>span,.own-hand .card-pips>span{font-size:18px}.ace-pips>span,.own-hand .ace-pips>span{font-size:38px}.court-art{inset:17px 12px}}.card[data-movable=true]{touch-action:none;cursor:grab;-webkit-user-select:none;user-select:none}.card.drag-ghost{z-index:100;pointer-events:none;color:#152a32;background:#fff9e9;border:1px solid #d0b985;border-radius:7px;width:80px;min-width:80px;height:116px;min-height:116px;padding:0;font-family:Georgia,serif;position:fixed;overflow:hidden;transform:translate(-50%,-65%)rotate(-5deg);box-shadow:0 12px 25px #0007}.card.drag-ghost[data-suit=hearts],.card.drag-ghost[data-suit=diamonds]{color:#b22635}
