*{box-sizing:border-box}body{margin:0;background:#0c1714;color:#eeeade;font-family:system-ui,sans-serif}button,input,select{font:inherit}button{cursor:pointer}button:disabled{cursor:default;opacity:.45}button:focus-visible,a:focus-visible{outline:2px solid #efcc7c;outline-offset:4px}header{min-height:77px;padding:14px 30px;border-bottom:1px solid #ffffff12;display:flex;align-items:center;justify-content:space-between;background:#101e19;gap:15px}.brand{font-family:Georgia,serif;font-size:31px;letter-spacing:4px;text-decoration:none;color:#eeeade}.brand small{font-family:system-ui,sans-serif;font-size:9px;letter-spacing:2.5px;display:block;color:#b8a476;margin-top:3px}.topmeta{display:flex;gap:17px;align-items:center;font-size:12px;color:#b3c0b5}.connection{font-size:11px;color:#d6b173}.connection:before{content:"";display:inline-block;width:6px;height:6px;background:#d6b173;border-radius:50%;margin-right:6px}.connection.online{color:#99caa7}.connection.online:before{background:#8cc397}.btn{border:1px solid #82917b55;border-radius:7px;background:#273c2e;color:#e8e5d6;padding:12px 17px;font-size:12px;white-space:nowrap;min-height:42px}.btn.gold{background:#ceb273;color:#1d271d;border-color:#e9d5a0;font-weight:700}.btn.small{padding:7px 12px;min-height:32px;font-size:11px}.btn.red,.red{color:#f09885}.btn:hover:not(:disabled){filter:brightness(1.14)}.text-button{border:0;background:none;color:#bea77b;font-size:12px;padding:7px;text-decoration:underline;text-underline-offset:4px}.muted{font-size:12px;color:#9cb19f;line-height:1.6}.eyebrow{text-transform:uppercase;font-size:10px;letter-spacing:2px;color:#bdac7e;font-weight:600}h1{font-family:Georgia,serif;font-weight:400;font-size:clamp(42px,5vw,74px);line-height:1.06;margin:23px 0;letter-spacing:-2px}h1 em{font-style:normal;color:#c6b078}h2{font-family:Georgia,serif;font-size:26px;font-weight:400;margin:8px 0 18px}h3{font-size:14px;color:#d5c394;margin:22px 0 9px}p{color:#a9bcac;line-height:1.75;font-size:13px}.panel{background:#14251c;border:1px solid #ffffff13;border-radius:15px;padding:30px}.panel label{display:block;font-size:12px;color:#b6c6b7;margin:18px 0 10px}.panel input,.panel select{width:100%;margin-top:9px;border:1px solid #62736088;border-radius:7px;background:#0e1d15;color:#eeeade;padding:13px 14px;min-height:46px;outline-color:#ccb879}.panel .btn{margin-top:12px}.welcome{max-width:1050px;margin:65px auto;padding:0 30px;display:grid;grid-template-columns:1fr 380px;gap:70px;align-items:center}.welcome-text p{max-width:400px;font-size:16px}.welcome-cards{display:flex;justify-content:center;max-width:330px;margin-top:40px;height:200px}.welcome-cards img{width:108px;height:154px;margin-left:-20px;filter:drop-shadow(0 8px 10px #0008)}.welcome-cards img:first-child{margin-left:0}.login p{font-size:13px}.login .btn{width:100%;margin-top:20px}.login small{font-size:11px;color:#7e9885;display:block;margin-top:20px}.lobby-home{max-width:1110px;padding:42px 30px;margin:auto}.home-heading{max-width:700px}.home-heading h1{font-size:55px;margin:18px 0}.home-heading p{font-size:15px}.home-panels{display:grid;grid-template-columns:1fr 1fr;gap:23px;margin:30px 0}.home-panels .panel{padding:28px}.home-panels .btn{width:100%}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:20px}.join-panel p{max-width:320px}.join-panel input{letter-spacing:5px;font-size:21px}.join-panel .muted{margin-top:25px}.layout{display:grid;grid-template-columns:minmax(0,1fr) 265px;min-height:calc(100vh - 77px)}.game-main{min-width:0;padding:16px 24px}.toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:9px;font-size:11px;color:#95a995}.room-code strong{font-size:16px;letter-spacing:2px;color:#d7c99c;margin-left:6px}.round{color:#94a592}.board{height:500px;position:relative}.felt{position:absolute;inset:83px 14px 109px;border-radius:46%/50%;border:12px solid #443c2b;outline:2px solid #65563b;box-shadow:0 12px 45px #0009,inset 0 0 0 3px #ad95623d,inset 0 0 70px #00170b;background-color:#145b3d;background-image:repeating-linear-gradient(18deg,#ffffff04 0px,#ffffff04 1px,transparent 1px,transparent 3px),repeating-linear-gradient(110deg,#0000000b 0px,#0000000b 1px,transparent 1px,transparent 4px),radial-gradient(ellipse at center,#27744d66,transparent 75%);transition:background-color .4s}.felt.blue{background-color:#164d6a}.tableprint{position:absolute;top:180px;width:100%;text-align:center;font-family:Georgia,serif;font-size:36px;letter-spacing:8px;color:#d0d7bf12;pointer-events:none}.opponent{position:absolute;text-align:center}.opponent.north{top:0;left:50%;transform:translate(-50%)}.seat{display:flex;align-items:center;justify-content:center;gap:9px;font-size:12px}.avatar{display:grid;place-items:center;flex-shrink:0;width:38px;height:38px;border-radius:50%;background:#36483e;border:2px solid #8c9e8877;color:#e4d8aa;font-family:Georgia,serif;font-size:18px}.seat .text{text-align:left}.seat strong{font-size:12px;display:block}.seat small{color:#8ba392;font-size:10px;display:block;margin-top:4px}.active-seat .avatar{border-color:#ddc67d;box-shadow:0 0 0 3px #d1b36020}.opphand{display:flex;justify-content:center;margin-top:10px;height:73px}.opphand img{width:48px;height:69px;object-fit:fill;border-radius:4px;box-shadow:1px 2px 5px #0009;margin-left:-25px;transform:rotate(var(--r));transform-origin:center 110%}.opphand img:first-child{margin-left:0}.tricks-count{font-size:9px;color:#91ac92;position:relative;top:3px}.opponent.west{left:0;top:183px}.opponent.east{right:0;top:183px}.opponent.west .seat,.opponent.east .seat{flex-direction:column;gap:3px}.opponent.west .text,.opponent.east .text{text-align:center}.opponent.west .opphand,.opponent.east .opphand{height:59px}.opponent.west .opphand img,.opponent.east .opphand img{width:34px;height:48px;margin-left:-25px}.opponent.west .opphand img:first-child,.opponent.east .opphand img:first-child{margin-left:0}.centerinfo{position:absolute;top:127px;width:100%;text-align:center;font-size:9px;letter-spacing:1.5px;color:#d7e4cc80}.deck{position:absolute;left:11%;top:207px;height:95px;width:100px}.teams .deck{left:22%;top:228px;scale:.8}.deck img{position:absolute;width:62px;height:88px;border-radius:5px;filter:drop-shadow(2px 3px 3px #0006)}.deck .up{transform:rotate(90deg);left:24px;top:4px}.deck .back{left:0;box-shadow:2px 2px #d3c9ae,4px 4px #163e2c}.deck small{position:absolute;bottom:-17px;left:0;font-size:9px;color:#c7d3bc;white-space:nowrap}.centerzone{position:absolute;top:182px;left:50%;transform:translate(-50%);width:220px;height:140px}.centerhint{position:absolute;inset:0;display:grid;place-items:center;text-align:center;color:#b8cdb9b0;font-size:12px;line-height:1.6}.trick-card{position:absolute;width:69px;height:98px;filter:drop-shadow(0 5px 4px #0007);border-radius:5px;animation:play-in .25s ease-out}.trick-card.north{left:74px;top:0;rotate:4deg}.trick-card.south{left:92px;top:41px;rotate:-5deg}.trick-card.west{left:20px;top:22px;rotate:-13deg}.trick-card.east{right:5px;top:25px;rotate:12deg}.resolving{animation:glow 1.4s ease-out}.turntag{position:absolute;top:337px;left:50%;transform:translate(-50%);border-radius:20px;border:1px solid #829c7950;background:#102d22;padding:7px 12px;white-space:nowrap;color:#bdcbb8;font-size:10px;display:flex;gap:11px;align-items:center;z-index:2}.turntag.your-turn{border-color:#d8bd7660;color:#e3cb93}.timer{font-variant-numeric:tabular-nums;font-weight:700;min-width:26px}.timer.urgent{color:#ff9a80}.hand{position:absolute;bottom:31px;left:50%;transform:translate(-50%);display:flex;justify-content:center;align-items:flex-end;height:148px;max-width:95%;padding:0 10px}.card{width:82px;flex:0 0 82px;padding:0;border:0;background:none;border-radius:6px;transform:translateY(var(--y)) rotate(var(--r));transform-origin:50% 125%;margin-left:-34px;position:relative;transition:transform .2s,filter .2s;filter:drop-shadow(0 4px 4px #0009);animation:deal .35s ease-out both;animation-delay:var(--delay)}.card:disabled{opacity:1}.card:first-child{margin-left:0}.card img{display:block;width:100%;border-radius:6px}.card.legal{filter:drop-shadow(0 0 4px #e5c879) drop-shadow(0 4px 5px #0008)}.card.illegal{filter:brightness(.58) drop-shadow(0 4px 4px #0008)}.card:hover:not(:disabled),.card:focus-visible:not(:disabled){transform:translateY(calc(var(--y) - 24px)) rotate(0);z-index:20;outline:2px solid #ead393}.you{position:absolute;bottom:-8px;left:50%;transform:translate(-50%)}.controls{background:#14251c;border:1px solid #ffffff12;border-radius:12px;padding:17px 20px;min-height:102px;display:flex;align-items:center;justify-content:space-between;gap:17px;margin-top:20px}.controls h2{font-family:system-ui,sans-serif;font-size:14px;font-weight:600;margin:0 0 6px}.controls p{font-size:11px;color:#a1b5a3;line-height:1.6;margin:0;max-width:400px}.control-text{flex:1}.buttons{display:flex;gap:9px;flex-wrap:wrap;align-items:center}.controls .buttons{justify-content:flex-end}.suit{font-size:21px;padding:8px 12px}.suit span{font-size:10px;vertical-align:middle}.notice{font-size:9px;color:#778e7e;text-align:center;margin:15px 0 3px}.sidebar{background:#111f18;border-left:1px solid #ffffff10;padding:23px 20px}.sidehead{font-size:9px;letter-spacing:1.5px;color:#a1b19e;text-transform:uppercase;margin-bottom:16px}.sidehead>span{float:right}.scoreboard{display:grid;grid-template-columns:1fr 1fr;gap:10px}.scorebox{border:1px solid #ffffff12;background:#172b20;border-radius:8px;padding:13px}.scorebox small{font-size:10px;color:#acbeab}.scorebox strong{display:block;font-family:Georgia,serif;font-size:33px;margin-top:5px;font-weight:400}.scorebox.mine{border-color:#c4a66a66}.progress{height:3px;background:#304c38;margin-top:11px}.progress i{display:block;height:100%;background:#cdb272}.details{display:grid;grid-template-columns:1fr auto;gap:15px;font-size:11px;margin:25px 0}.details dt{color:#8fa993}.details dd{margin:0;color:#e4e6d8;max-width:110px;overflow-wrap:anywhere;text-align:right}.divider{height:1px;background:#ffffff10;margin:23px 0}.history{font-size:10px;line-height:1.6;color:#a1b9a5;max-height:225px;overflow:auto}.history>div{margin-bottom:12px;display:flex;gap:9px}.history .dot{width:4px;height:4px;background:#ad965f;border-radius:50%;margin-top:6px;flex-shrink:0}.side-buttons{display:flex;gap:8px;align-items:center;margin-top:20px;flex-wrap:wrap}.theme{width:24px;height:24px;border:2px solid #77836b;border-radius:50%;background:#205f42}.theme.blue{background:#205c79}.local-note{font-size:10px;color:#839e89;line-height:1.8;margin-top:22px}.waiting-table{max-width:650px;margin:30px auto}.waiting-table h2{font-size:32px}.seat-list{display:grid;gap:12px;margin:25px 0}.lobby-seat{display:flex;align-items:center;gap:12px;padding:15px;border:1px solid #ffffff16;border-radius:10px;background:#102118}.lobby-seat.mine{border-color:#bca66966}.lobby-seat strong{font-size:13px}.lobby-seat small{display:block;font-size:10px;color:#8da993;margin-top:6px}.lobby-seat .text-button{margin-left:auto}.waiting-table>.buttons{margin-bottom:10px}.meld-controls{display:flex;flex-direction:column;gap:9px}.meld-option,.bella-toggle{font-size:11px;color:#ddc991;display:flex;align-items:center;gap:6px;line-height:1.5}.meld-option input,.bella-toggle input{accent-color:#cfb578;width:17px;height:17px}.announcements{display:flex;gap:10px;flex-wrap:wrap;font-size:10px;color:#bcae7b;margin:12px 8px}.toast{position:fixed;bottom:22px;left:50%;transform:translate(-50%);background:#324431;border:1px solid #c1aa72;color:#fff0c5;border-radius:9px;box-shadow:0 8px 30px #0009;padding:13px 16px;max-width:min(90%,650px);font-size:12px;z-index:200;display:flex;align-items:center;gap:15px}.toast button{border:0;background:none;color:#e2d3a5;font-size:23px}.offline-banner{position:fixed;top:0;left:0;right:0;text-align:center;background:#9f5836;color:#fff0d2;padding:9px;font-size:11px;z-index:150}.modal-backdrop{position:fixed;inset:0;background:#000a;backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;padding:22px;z-index:100}.modal{width:560px;max-width:100%;max-height:90vh;overflow:auto;border:1px solid #a18c5a;border-radius:15px;background:#172b20;padding:27px;box-shadow:0 18px 80px #0009}.modal-heading{display:flex;align-items:center;justify-content:space-between;gap:15px}.modal h2{font-size:29px;color:#e4ce96}.close{border:0;background:none;color:#bfb895;font-size:30px}.score-table{width:100%;border-collapse:collapse;font-size:12px;margin:20px 0 25px}.score-table th{font-size:10px;color:#a1b298;font-weight:500;text-align:right;padding:9px 4px;border-bottom:1px solid #ffffff18}.score-table th:first-child,.score-table td:first-child{text-align:left}.score-table td{padding:9px 4px;text-align:right;color:#e7e8d9;border-bottom:1px solid #ffffff0b}.score-table tr:nth-last-child(3){color:#ebc778;font-weight:700}.rules-content p{font-size:12px}.trick-history{border-bottom:1px solid #ffffff10;padding:14px 0}.trick-history strong{font-size:12px;color:#cbbc8e}.trick-history>div{display:flex;gap:15px;margin-top:12px}.trick-history span{display:flex;flex-direction:column;align-items:center;gap:6px}.trick-history img{width:50px}.trick-history small{font-size:10px;color:#a7b5a1}details{margin:12px 0;font-size:12px;color:#c3b486}summary{cursor:pointer;padding:8px 0}@keyframes deal{0%{opacity:0;translate:0 -16px}to{opacity:1;translate:0 0}}@keyframes play-in{0%{opacity:0;scale:.8}to{opacity:1;scale:1}}@keyframes glow{50%{filter:drop-shadow(0 0 6px #dabd7d)}}@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}@media (max-width:1100px){.layout{grid-template-columns:minmax(0,1fr) 235px}.game-main{padding:14px 17px}.sidebar{padding:22px 15px}.controls{flex-direction:column;align-items:stretch}.controls .buttons{justify-content:flex-start}.card{width:75px;flex-basis:75px;margin-left:-34px}.opponent.west{left:-7px}.opponent.east{right:-7px}.opponent.west .text strong,.opponent.east .text strong{font-size:10px}.opponent.west .text small,.opponent.east .text small{font-size:8px}.welcome{gap:35px}.history{max-height:180px}}@media (max-width:760px){header{min-height:66px;padding:12px 16px}.brand{font-size:25px;letter-spacing:3px}.brand small{font-size:7px;letter-spacing:1.5px}.topmeta{gap:10px;font-size:10px}.connection{font-size:9px}.topmeta>span:nth-child(2){display:none}.welcome{grid-template-columns:1fr;gap:12px;padding:20px;margin:25px auto}.welcome h1{font-size:46px}.welcome-text p{font-size:14px}.welcome-cards{display:none}.login{max-width:450px}.lobby-home{padding:28px 20px}.home-heading h1{font-size:42px}.home-panels{grid-template-columns:1fr}.layout{display:block}.game-main{padding:10px}.toolbar{gap:4px;flex-wrap:wrap;margin-bottom:14px}.room-code strong{font-size:14px}.round{font-size:9px}.board{height:460px}.felt{inset:80px 2px 103px;border-width:8px;border-radius:35%/46%}.tableprint{font-size:25px;top:185px}.centerinfo{top:123px;font-size:8px;letter-spacing:1px}.deck{left:9%;top:199px;scale:.7;transform-origin:left center}.teams .deck{left:19%;top:195px;scale:.6}.centerzone{top:165px;width:165px;height:136px;left:53%}.trick-card{width:57px;height:81px}.trick-card.north{left:52px}.trick-card.south{left:64px;top:38px}.trick-card.west{left:7px}.trick-card.east{right:0}.turntag{top:301px;font-size:9px;max-width:90%;white-space:normal;text-align:center}.card{width:65px;flex-basis:65px;margin-left:-34px}.hand{bottom:28px;height:132px;padding:0}.opphand img{width:40px;height:58px;margin-left:-23px}.opphand{height:62px}.opponent.west{left:0;top:190px;max-width:72px}.opponent.east{right:0;top:190px;max-width:72px}.opponent.west .avatar,.opponent.east .avatar{width:27px;height:27px;font-size:13px}.opponent.west .opphand,.opponent.east .opphand{display:none}.opponent.west strong,.opponent.east strong{max-width:65px;overflow-wrap:anywhere}.opponent.west .tricks-count,.opponent.east .tricks-count{font-size:8px}.seat .avatar{width:33px;height:33px}.seat strong{font-size:11px}.seat small{font-size:9px}.you{bottom:-5px}.controls{margin-top:15px;padding:15px;min-height:90px}.controls p{font-size:10px}.controls .btn{min-height:40px;padding:10px 13px}.sidebar{border:0;border-top:1px solid #ffffff12;padding:20px;display:grid;grid-template-columns:1fr 1fr;gap:15px}.sidebar>.sidehead{grid-column:1/-1;margin:0}.scoreboard{align-self:start}.details{margin:0;font-size:10px;gap:11px}.sidebar .divider,.sidebar>.history,.sidebar>.local-note,.sidebar>.sidehead:not(:first-child){display:none}.side-buttons{margin:0;grid-column:1/-1}.notice{font-size:8px}.waiting-table{margin:15px auto;padding:22px}.modal-backdrop{padding:12px}.modal{padding:22px;max-height:94vh}.modal h2{font-size:25px}.score-table{font-size:11px}.btn.suit span{display:none}.meld-option,.bella-toggle{font-size:10px}.form-row{gap:12px}}
