:root{font-family:Segoe UI,Inter,sans-serif;line-height:1.3;color:#112218;background:radial-gradient(circle at top,#153f35,#0d261f 55%,#0b1714)}*{box-sizing:border-box}body{margin:0;min-height:100vh;overflow-x:hidden;overflow-y:auto}button,input{font:inherit}.app-root{min-height:100vh;width:100vw;color:#f1f5f1}.app-shell{min-height:100dvh;padding:clamp(.55rem,1.45vw,1.2rem)}.card-panel{background:linear-gradient(170deg,#0d2821f0,#0a1a16f0);border:1px solid rgba(196,161,95,.5);border-radius:18px;box-shadow:0 8px 24px #00000047}.muted{color:#97b4a7}.error-toast{position:fixed;left:50%;bottom:14px;transform:translate(-50%);background:#7a1a10f2;border:1px solid rgba(244,192,185,.4);color:#ffe8e3;padding:.6rem 1rem;border-radius:12px;max-width:min(90vw,620px);text-align:center}.admin-fab{position:fixed;right:14px;top:14px;z-index:110;border:1px solid rgba(225,188,121,.65);border-radius:999px;padding:.5rem .8rem;background:#0c1f18f2;color:#f7e2b8;cursor:pointer;font-weight:700;box-shadow:0 8px 18px #0000005c}.admin-fab.open{background:#d8b474eb;color:#23170d}.admin-overlay{position:fixed;inset:0;z-index:105;background:#060f0cad;display:grid;place-items:center;padding:.9rem}.admin-panel{width:min(96vw,840px);max-height:88vh;overflow:auto;padding:.9rem;display:grid;gap:.72rem}.admin-head{display:flex;justify-content:space-between;align-items:center;gap:.65rem}.admin-head h3{margin:0;color:#f3deb1}.admin-head button,.admin-actions button{border:1px solid rgba(220,186,129,.58);border-radius:10px;background:#d9b67633;color:#f7e0b3;padding:.42rem .64rem;cursor:pointer}.admin-head button:disabled,.admin-actions button:disabled{opacity:.45;cursor:not-allowed}.admin-state-row{display:flex;justify-content:space-between;align-items:center;gap:.6rem}.admin-state-pill{border-radius:999px;padding:.2rem .62rem;font-size:.76rem;font-weight:700;border:1px solid rgba(149,185,167,.52);color:#d8ece2;background:#7f9a8e2e}.admin-state-pill.running{border-color:#6bd7a09e;background:#51ac8240;color:#d2f8e6}.admin-state-pill.idle{border-color:#eac17f85;background:#b78c4533;color:#fae5bd}.admin-state-note{color:#a7c0b4;font-size:.82rem}.admin-metrics{display:grid;grid-template-columns:repeat(2,minmax(120px,1fr));gap:.45rem}.admin-metrics article{border:1px solid rgba(153,187,170,.3);border-radius:10px;padding:.4rem .5rem;display:grid;gap:.12rem}.admin-metrics span{color:#aac3b8;font-size:.75rem}.admin-metrics strong{color:#f5e2bb}.admin-controls{border:1px solid rgba(153,185,169,.3);border-radius:10px;padding:.5rem;display:grid;gap:.4rem}.admin-controls label{color:#f1d9aa;font-size:.82rem;font-weight:600}.admin-controls input{border-radius:8px;border:1px solid rgba(232,201,145,.45);padding:.44rem .58rem;background:#f8f6f1f5;color:#1a271f}.admin-controls input:disabled{opacity:.6}.admin-actions{display:flex;flex-wrap:wrap;gap:.45rem}.admin-level-grid{display:grid;grid-template-columns:repeat(2,minmax(180px,1fr));gap:.45rem}.admin-level-card{border:1px solid rgba(162,193,178,.31);border-radius:10px;padding:.48rem .54rem;background:#0a1b15bf}.admin-level-card h5{margin:0 0 .34rem;color:#f3ddaf}.admin-level-card p{margin:.1rem 0;color:#bfd6cb;font-size:.84rem}.popups-layer{position:fixed;inset:0;z-index:90;display:flex;align-items:center;justify-content:center;padding:.8rem;pointer-events:none}.event-popup{border:1px solid rgba(202,169,104,.55);border-radius:16px;padding:.78rem .92rem;background:#081a14f0;box-shadow:0 20px 44px #0000006b;width:min(90vw,430px);text-align:center;animation:popup-in .22s ease-out}.event-popup h5{margin:0;font-size:1.05rem;color:#f3deb0}.event-popup p{margin:.3rem 0 0;font-size:.95rem;color:#d4e5db}.event-popup-card{margin-top:.64rem;display:grid;place-items:center}.event-popup .playing-card{width:78px;height:110px}.event-popup.play{border-color:#69ce9e8c}.event-popup.bid{border-color:#e9c87d9e}.event-popup.trick{border-color:#80baee94}.event-popup.score{border-color:#f496819e}.lobby-layout{display:grid;grid-template-columns:minmax(310px,420px) 1fr;gap:1rem;min-height:calc(100dvh - 2.4rem)}.lobby-create,.lobby-list{padding:1rem 1.1rem}.brand-title{display:flex;align-items:center;gap:.55rem}.brand-icon{width:36px;height:36px;border-radius:10px;box-shadow:0 3px 10px #00000047}.lobby-create h1{margin:0 0 .35rem;color:#f3ddb3}.lobby-create p{margin-top:0;color:#c6d6cd}.lobby-create label{display:block;margin:.65rem 0 .35rem;color:#eed6a6;font-weight:600}.lobby-create input{width:100%;border-radius:10px;border:1px solid rgba(234,204,155,.5);padding:.55rem .75rem;background:#f8f6f1f2;color:#142019}.chip-row{display:flex;gap:.45rem}.chip-row.wrap{flex-wrap:wrap}.chip{border:1px solid rgba(220,185,125,.6);background:#eedab426;color:#f8e2b8;border-radius:999px;padding:.35rem .7rem;cursor:pointer}.chip.active{background:#d6b277;color:#251a0f;border-color:#d6b277}.cta{width:100%;margin-top:.9rem;border:0;border-radius:10px;padding:.65rem .8rem;background:linear-gradient(90deg,#d2b170,#f2dbac);color:#20150d;font-weight:700;cursor:pointer}.cta:disabled{opacity:.55;cursor:wait}.lobby-list h2{margin-top:0;color:#f0dbb0}.lobby-list ul{list-style:none;margin:0;padding:0;display:grid;gap:.65rem;overflow:auto;max-height:calc(100vh - 9.2rem)}.lobby-list li{background:#0b1e17cc;border:1px solid rgba(154,187,172,.26);border-radius:12px;padding:.55rem;display:flex;justify-content:space-between;align-items:center;gap:.7rem}.lobby-list li strong{display:block;color:#f8e2b5}.lobby-list li span{display:block;color:#afc6ba;font-size:.88rem}.lobby-list li button{border:0;border-radius:8px;padding:.42rem .65rem;background:#7cc79d;color:#113126;font-weight:700;cursor:pointer}.lobby-list li button:disabled{opacity:.4;cursor:not-allowed}.game-layout{display:grid;grid-template-columns:320px 1fr;gap:.95rem;min-height:calc(100dvh - 2.4rem)}.side-panel{padding:.8rem;display:grid;grid-template-rows:auto auto auto auto;gap:.55rem;min-height:0;align-content:start}.room-head{display:flex;justify-content:space-between;align-items:center;gap:.6rem}.room-head h2{margin:0;color:#f0d7a4}.room-head button,.action-box button{border:1px solid rgba(218,180,120,.6);border-radius:10px;background:#d7b2762e;color:#f6dfb2;padding:.45rem .65rem;cursor:pointer}.status-line{display:flex;justify-content:space-between;border:1px solid rgba(157,194,171,.3);border-radius:10px;padding:.4rem .55rem;color:#bdd4c7}.status-line strong{color:#f5e1b5}.trick-duration-control{border:1px solid rgba(160,194,176,.3);border-radius:10px;padding:.42rem .55rem;display:grid;gap:.28rem}.trick-duration-control label{color:#f3deb0;font-size:.82rem;font-weight:600}.trick-duration-control input[type=range]{width:100%;accent-color:#e2c185}.trick-duration-control input[type=range]:disabled{opacity:.55;cursor:not-allowed}.trick-duration-control small{color:#a9c0b4;font-size:.72rem}.highlight-control{border:1px solid rgba(160,194,176,.3);border-radius:10px;padding:.42rem .55rem;display:grid;gap:.24rem}.highlight-control-row{display:flex;justify-content:space-between;align-items:center;gap:.55rem;color:#f3deb0;font-size:.82rem;font-weight:600}.highlight-control small{color:#a9c0b4;font-size:.72rem}.toggle-switch{display:inline-flex;align-items:center;cursor:pointer}.toggle-switch input{position:absolute;width:1px;height:1px;margin:-1px;border:0;padding:0;clip:rect(0 0 0 0);overflow:hidden}.toggle-track{width:42px;height:22px;border-radius:999px;background:#95b9a861;border:1px solid rgba(173,206,190,.45);position:relative;transition:background .14s ease}.toggle-track i{position:absolute;left:2px;top:2px;width:16px;height:16px;border-radius:999px;background:#f6e0b4;transition:transform .14s ease}.toggle-switch input:checked+.toggle-track{background:#7dd1a58c}.toggle-switch input:checked+.toggle-track i{transform:translate(20px)}.score-grid{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}.score-grid article{border:1px solid rgba(154,185,168,.3);border-radius:10px;padding:.45rem}.score-grid h4{margin:0 0 .2rem;color:#f2ddad}.score-grid p{margin:0;color:#bdd2c7}.score-grid strong{color:#f6e2b8}.action-box{border:1px solid rgba(159,186,172,.3);border-radius:10px;padding:.5rem}.action-box h4{margin:0 0 .35rem;color:#f1daab}.bid-grid{display:flex;flex-wrap:wrap;gap:.45rem}.table-panel{min-height:0;padding:.6rem;display:grid;grid-template-rows:auto 1fr auto;gap:.6rem}.table-title-row{display:flex;justify-content:space-between;align-items:center;color:#f3dfb4}.table-title-row h3{margin:0}.table-surface{position:relative;border-radius:16px;border:2px solid rgba(207,173,108,.66);background:radial-gradient(circle at center,#1f6f55,#144838 70%,#113328);overflow:hidden;min-height:0}.seat-box{position:absolute;min-width:170px;max-width:260px;background:#081411d6;border:1px solid rgba(150,187,171,.38);border-radius:10px;padding:.35rem .5rem;display:grid;gap:.1rem}.seat-speech{position:absolute;left:50%;top:-34px;transform:translate(-50%);border:1px solid rgba(227,194,136,.72);border-radius:12px;padding:.18rem .46rem;background:#0d2119f2;color:#f6e2ba;font-size:.66rem;font-weight:700;white-space:nowrap;box-shadow:0 5px 10px #0000004d;z-index:4}.seat-speech:after{content:"";position:absolute;left:50%;bottom:-5px;width:8px;height:8px;transform:translate(-50%) rotate(45deg);background:#0d2119f2;border-right:1px solid rgba(227,194,136,.72);border-bottom:1px solid rgba(227,194,136,.72)}.seat-speech.below{top:calc(100% + 6px)}.seat-speech.below:after{top:-5px;bottom:auto;transform:translate(-50%) rotate(225deg)}.take-confirm-layer{position:fixed;inset:0;z-index:95;display:grid;place-items:center;padding:.9rem;background:#07100d75}.take-confirm-popup{width:min(94vw,460px);border:1px solid rgba(228,193,133,.72);border-radius:16px;padding:.82rem .9rem;background:#091c15f5;box-shadow:0 20px 44px #00000073;text-align:center;cursor:pointer}.take-confirm-popup h5{margin:0;color:#f3deb0;font-size:1.04rem}.take-confirm-popup p{margin:.36rem 0 0;color:#d5e6dc;font-size:.93rem}.take-confirm-card{margin-top:.62rem;display:grid;place-items:center}.take-confirm-button{margin-top:.68rem;border:0;border-radius:10px;padding:.5rem .8rem;background:linear-gradient(90deg,#d3b273,#f0dab0);color:#241a0f;font-weight:700;pointer-events:none}.seat-box strong{color:#ecf8e9;font-size:.94rem}.seat-box span{color:#bed6cb;font-size:.78rem}.bot-thinking{margin-top:.18rem;display:grid;gap:.15rem}.bot-thinking span{color:#f6e3bd;font-size:.66rem;letter-spacing:.03em}.bot-thinking-bar{height:4px;border-radius:999px;background:#f1d39a33;overflow:hidden}.bot-thinking-bar i{display:block;width:42%;height:100%;border-radius:inherit;background:linear-gradient(90deg,#f7d18333,#f7d183f2);animation:thinking-sweep .92s ease-in-out infinite}.seat-flags{display:flex;flex-wrap:wrap;gap:.24rem;margin-top:.16rem}.flag-chip{border:1px solid rgba(235,208,156,.54);border-radius:999px;padding:.08rem .38rem;color:#f6e7c8;font-size:.68rem;background:#68502b5c}.seat-box.active{border-color:#f0c770;box-shadow:0 0 0 1px #f0c77066;animation:seat-pulse .98s ease-out}.seat-box.top{top:8px;left:50%;transform:translate(-50%)}.seat-box.bottom{bottom:8px;left:50%;transform:translate(-50%)}.seat-box.left{top:50%;left:8px;transform:translateY(-50%)}.seat-box.right{top:50%;right:8px;transform:translateY(-50%)}.trick-area{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);border:1px solid rgba(182,212,198,.4);border-radius:14px;background:#081913bf;padding:.55rem;min-width:min(60vw,460px);text-align:center}.trick-area h4{margin:0;color:#ecdbb1}.trick-area.has-completed-trick{border-color:#dec58fb8}.trick-hint{margin:.22rem 0 0;color:#d3e3d8;font-size:.78rem}.trick-cards{margin-top:.42rem;width:min(70vw,320px);height:170px;margin-inline:auto;position:relative}.trick-card-wrap{position:absolute}.trick-card-shell{display:grid;justify-items:center;gap:.2rem;transform:translate(0) scale(1)}.trick-card-shell.collecting{animation:trick-collect .76s cubic-bezier(.24,.72,.28,1) forwards}.trick-card-wrap.completed .trick-card-shell{filter:drop-shadow(0 2px 6px rgba(0,0,0,.35))}.trick-card-wrap.top{top:0;left:50%;transform:translate(-50%)}.trick-card-wrap.bottom{bottom:0;left:50%;transform:translate(-50%)}.trick-card-wrap.left{top:50%;left:0;transform:translateY(-50%)}.trick-card-wrap.right{top:50%;right:0;transform:translateY(-50%)}.trick-card-wrap small{color:#bcd3c7;font-size:.74rem;max-width:82px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.trick-card-wrap.from-top{animation:play-from-top .26s ease-out}.trick-card-wrap.from-bottom{animation:play-from-bottom .26s ease-out}.trick-card-wrap.from-left{animation:play-from-left .26s ease-out}.trick-card-wrap.from-right{animation:play-from-right .26s ease-out}.hand-zone h4{margin:0 0 .4rem;color:#f2ddb1}.hand-row{display:flex;gap:.45rem;overflow-x:auto;padding-bottom:.2rem;scroll-snap-type:x proximity}.hand-row .playing-card{scroll-snap-align:start}.bid-offer-card{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);min-width:min(70vw,320px);border:1px solid rgba(232,205,144,.62);border-radius:14px;background:#0c1e16d1;padding:.7rem .8rem;text-align:center;animation:offer-pop .34s cubic-bezier(.2,.85,.25,1)}.bid-offer-card h4{margin:0 0 .42rem;color:#efdeb7}.bid-offer-card-wrap{display:grid;place-items:center}.playing-card{position:relative;width:82px;height:116px;border-radius:10px;border:1px solid #dccdb1;background:linear-gradient(180deg,#fffefe,#f2ede4);box-shadow:0 3px 8px #00000040;cursor:default;padding:0;overflow:hidden}.playing-card.tiny{width:56px;height:78px}.playing-card.clickable{cursor:pointer}.playing-card.selectable{cursor:pointer;border:2px solid #56b67e;transform:translateY(0);transition:transform .14s ease,box-shadow .14s ease}.playing-card.inert{cursor:default;pointer-events:none}.playing-card.selectable:hover{transform:translateY(-4px);box-shadow:0 7px 15px #00000059}.playing-card.selected{outline:2px solid #f5d089}.playing-card.red{color:#cf2f43}.playing-card.black{color:#161b22}.playing-card.dimmed{opacity:.56;filter:saturate(.88)}.corner{position:absolute;display:inline-grid;justify-items:center;line-height:1;font-weight:700;font-size:.9rem;min-width:18px}.playing-card.tiny .corner{font-size:.66rem;min-width:13px}.corner-rank{letter-spacing:-.02em}.corner-rank.rank-ten{font-size:.82em;letter-spacing:-.07em}.corner-suit{margin-top:.02rem}.corner.top-left{top:5px;left:5px}.corner.bottom-right{right:5px;bottom:5px;transform:rotate(180deg)}.face-rank{position:absolute;inset:0;display:grid;place-items:center;font-size:1.55rem;font-weight:700}.playing-card.tiny .face-rank{font-size:1.1rem}.pips-layer{position:absolute;inset:18px 10px 14px}.pip-symbol{position:absolute;inset:0;pointer-events:none}.pip-symbol span{position:absolute;transform:translate(-50%,-50%);line-height:1;font-size:1rem}.playing-card.tiny .pips-layer{inset:12px 7px 10px}.playing-card.tiny .pip-symbol span{font-size:.72rem}.deal-layer{position:absolute;inset:0;pointer-events:none}.deal-card{position:absolute;left:50%;top:50%;width:28px;height:40px;border-radius:4px;border:1px solid rgba(250,246,238,.7);background:linear-gradient(165deg,#faefe1,#d3b784);transform:translate(calc(-50% + var(--from-x)),calc(-50% + var(--from-y))) rotate(var(--tilt, 0deg));opacity:0;animation:deal-fly .76s cubic-bezier(.22,.74,.27,1) forwards}@keyframes deal-fly{0%{opacity:0;transform:translate(calc(-50% + var(--from-x)),calc(-50% + var(--from-y))) rotate(var(--tilt, 0deg)) scale(.5)}14%{opacity:1}84%{opacity:1}to{opacity:0;transform:translate(calc(-50% + var(--to-x)),calc(-50% + var(--to-y))) rotate(var(--tilt, 0deg)) scale(1)}}@keyframes offer-pop{0%{opacity:0;transform:translate(-50%,-44%) scale(.87)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}@keyframes trick-drop{0%{opacity:0;transform:translateY(-9px) scale(.94)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes trick-collect{0%{opacity:1;transform:translate(0) scale(1)}74%{opacity:.98;transform:translate(var(--collect-x, 0px),var(--collect-y, 0px)) scale(.82)}to{opacity:.18;transform:translate(var(--collect-x, 0px),var(--collect-y, 0px)) scale(.66)}}@keyframes play-from-top{0%{opacity:0;transform:translate(-50%,-44px) scale(.78)}to{opacity:1;transform:translate(-50%) scale(1)}}@keyframes play-from-bottom{0%{opacity:0;transform:translate(-50%,44px) scale(.78)}to{opacity:1;transform:translate(-50%) scale(1)}}@keyframes play-from-left{0%{opacity:0;transform:translate(-44px,-50%) scale(.78)}to{opacity:1;transform:translateY(-50%) scale(1)}}@keyframes play-from-right{0%{opacity:0;transform:translate(44px,-50%) scale(.78)}to{opacity:1;transform:translateY(-50%) scale(1)}}@keyframes seat-pulse{0%{box-shadow:0 0 #f0c77094}to{box-shadow:0 0 0 12px #f0c77000}}@keyframes popup-in{0%{opacity:0;transform:translateY(-8px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes thinking-sweep{0%{transform:translate(-110%)}to{transform:translate(260%)}}@media(max-width:1240px){.game-layout{grid-template-columns:290px 1fr}.seat-box{min-width:150px}.trick-area{min-width:min(66vw,430px)}}@media(max-width:1080px){.lobby-layout{grid-template-columns:1fr;min-height:auto}.lobby-list ul{max-height:none}.game-layout{grid-template-columns:1fr;min-height:auto;gap:.72rem}.table-panel{order:1}.side-panel{order:2;grid-template-rows:auto auto auto auto;overflow:visible}.table-surface{min-height:55vh}.trick-area{min-width:min(84vw,450px)}}@media(max-width:820px){.app-shell{padding:.6rem}.admin-fab{right:10px;top:10px;padding:.44rem .7rem;font-size:.86rem}.admin-panel{width:min(97vw,720px);max-height:90vh;padding:.72rem}.admin-metrics,.admin-level-grid{grid-template-columns:1fr}.lobby-layout{gap:.7rem}.lobby-create,.lobby-list{padding:.85rem .9rem}.table-title-row{flex-direction:column;align-items:flex-start;gap:.2rem}.table-panel{padding:.42rem}.table-surface{min-height:58vh}.seat-box{min-width:124px;max-width:165px;padding:.25rem .34rem}.seat-box strong{font-size:.82rem}.seat-box span{font-size:.68rem}.seat-box.top{top:5px}.seat-box.bottom{bottom:5px}.seat-box.left{left:5px}.seat-box.right{right:5px}.flag-chip{font-size:.62rem}.trick-area{min-width:min(92vw,420px);padding:.48rem}.trick-cards{width:min(92vw,285px);height:150px}.playing-card{width:70px;height:100px}.playing-card.tiny{width:48px;height:68px}.pip-symbol span{font-size:.86rem}.playing-card.tiny .pip-symbol span{font-size:.62rem}.seat-speech{top:-30px;font-size:.62rem;padding:.16rem .38rem}}@media(max-width:620px){.app-shell{padding:.45rem}.admin-fab{right:8px;top:8px;padding:.38rem .62rem;font-size:.8rem}.admin-panel{width:97vw;padding:.62rem;gap:.55rem}.admin-head{align-items:flex-start;flex-direction:column}.admin-state-row{flex-direction:column;align-items:flex-start}.admin-actions{display:grid;grid-template-columns:1fr 1fr}.game-layout{gap:.56rem}.side-panel{padding:.62rem;gap:.42rem}.room-head h2{font-size:1.08rem}.table-surface{min-height:61vh;border-radius:13px}.bid-offer-card{min-width:min(92vw,300px);padding:.55rem}.hand-row{gap:.35rem}.playing-card{width:64px;height:92px}.playing-card.tiny{width:44px;height:62px}.pip-symbol span{font-size:.76rem}.playing-card.tiny .pip-symbol span{font-size:.54rem}.take-confirm-popup{width:min(96vw,360px);padding:.62rem .68rem}.take-confirm-popup h5{font-size:.94rem}.take-confirm-popup p{font-size:.86rem}.brand-icon{width:30px;height:30px}.trick-cards{width:min(94vw,250px);height:136px}.trick-card-wrap small{font-size:.68rem;max-width:72px}.corner{font-size:.85rem}.face-rank{font-size:1.33rem}.event-popup{width:min(94vw,360px);padding:.64rem .72rem}.event-popup h5{font-size:.95rem}.event-popup p{font-size:.88rem}.event-popup .playing-card{width:66px;height:94px}}
