:root{--felt:#0f5132;--felt-dark:#0a3a24;--ink:#1d2320;--paper:#fbf7ee;--gold:#f2c14e;--red:#c0392b;--green:#1e8449;--muted:#7d8a84;--side:#10201b;--card-w:84px;color:var(--ink);background:var(--felt-dark);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--felt-dark)}button{font:inherit;background:var(--gold);color:#2a1f00;cursor:pointer;border:0;border-radius:8px;padding:.55rem 1rem;font-weight:600}button:hover:not(:disabled){filter:brightness(1.08)}button:disabled{opacity:.5;cursor:default}button.secondary{color:var(--ink);background:#e3ddd0}button.danger{background:var(--red);color:#fff}.leave-confirm{background:#0000004d;border-radius:10px;padding:.6rem .8rem;font-size:.9rem}.leave-confirm p{margin:0 0 .5rem}button.link{color:inherit;opacity:.75;background:0 0;padding:.3rem 0;text-decoration:underline}button.icon{color:inherit;opacity:.7;background:0 0;padding:0 .4rem;font-size:1.1rem}input{font:inherit;border:1px solid #c9c2b2;border-radius:8px;padding:.55rem .7rem}.muted{color:var(--muted)}.small{font-size:.8rem}.error{color:#ffb3a7}.notice{color:#5c4400;background:#fff3cd;border-radius:8px;padding:.6rem .8rem}.row{flex-wrap:wrap;justify-content:center;gap:.6rem;display:flex}.chip{background:#ffffff26;border-radius:999px;padding:.05rem .4rem;font-size:.7rem}.chip.warn{color:#fff;background:#b9770e}.entry,.lobby{min-height:100%;color:var(--paper);text-align:center;background:radial-gradient(ellipse at center, var(--felt) 0%, var(--felt-dark) 75%);flex-direction:column;justify-content:center;align-items:center;gap:1rem;padding:2rem 1rem;display:flex}.entry h1,.lobby h1{letter-spacing:.05em;margin:0;font-size:3rem}.tagline{opacity:.85;margin:0}.entry form{text-align:left;flex-direction:column;gap:.5rem;width:min(320px,100%);display:flex}.lobby section{width:min(640px,100%)}.lobby h2{opacity:.85;margin:0 0 .4rem;font-size:1rem}.invite{gap:.5rem;display:flex}.invite input{flex:1;min-width:0}.lobby-seats{grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:.7rem;display:grid}.lobby-seat{background:#00000040;border:2px dashed #fff3;border-radius:12px;flex-direction:column;align-items:center;gap:.35rem;padding:.9rem;display:flex}.lobby-seat.human,.lobby-seat.bot{border-style:solid;border-color:#f2c14e80}.seat-no{opacity:.6;font-size:.75rem}.entry .hint{color:#b8c9c0;margin:0}.solo{flex-direction:column;gap:.5rem;width:min(520px,100%);margin-top:.6rem;display:flex}.solo h2,.bot-level h2{opacity:.85;margin:0;font-size:1rem}.solo-levels{grid-template-columns:repeat(3,1fr);gap:.5rem;display:grid}.solo-level{color:var(--paper);background:#00000047;border:2px solid #f2c14e73;flex-direction:column;align-items:center;gap:.2rem;padding:.6rem .4rem;display:flex}.solo-level strong{color:var(--gold);font-size:1.05rem}.solo-level .small{opacity:.85;font-weight:400}.bot-level{flex-direction:column;align-items:center;gap:.4rem;display:flex}.levels{background:#00000040;border-radius:10px;gap:.3rem;padding:.25rem;display:inline-flex}.levels button{padding:.4rem .9rem}.levels button.secondary{color:var(--paper);background:0 0}.table-screen{grid-template-columns:1fr 300px;height:100vh;display:grid}.felt{color:var(--paper);background:radial-gradient(ellipse at 50% 45%, #177245 0%, var(--felt) 45%, var(--felt-dark) 100%);position:relative;overflow:hidden}.side{background:var(--side);color:#dfe7e2;flex-direction:column;gap:1rem;min-height:0;padding:1rem;display:flex}.side-toggle,.side-close,.note-inline{display:none}.side h3{text-transform:uppercase;letter-spacing:.08em;opacity:.7;margin:0 0 .5rem;font-size:.85rem}.card{width:var(--card-w);aspect-ratio:79/123;-webkit-user-select:none;user-select:none;border-radius:6px;height:auto;display:block;box-shadow:0 2px 6px #00000059}.contract-badge{z-index:5;background:#0000004d;border-radius:12px;align-items:center;gap:.6rem;max-width:330px;padding:.5rem .7rem;display:flex;position:absolute;top:12px;left:12px}.contract-badge .contract-icon{border-radius:6px;width:64px}.contract-badge .contract-no{background:var(--felt-dark);border-radius:6px;padding:0 .4rem;font-size:.7rem;position:absolute;top:-9px;left:10px}.contract-badge .muted{color:#b8c9c0}.declared{color:var(--gold);font-size:.85rem;font-weight:600}.contract-icon{display:block}.seat-tag{background:#0000004d;border:2px solid #0000;border-radius:12px;flex-direction:column;align-items:center;gap:.15rem;padding:.35rem .8rem;transition:border-color .2s,box-shadow .2s;display:inline-flex}.seat-tag.turn{border-color:var(--gold);box-shadow:0 0 18px #f2c14e8c}.seat-name{font-weight:700}.seat-meta{opacity:.9;flex-wrap:wrap;justify-content:center;gap:.45rem;font-size:.78rem;display:flex}.opponent{z-index:2;flex-direction:column;align-items:center;gap:.4rem;display:flex;position:absolute}.opponent.top{top:14px;left:50%;transform:translate(-50%)}.opponent.left{top:38%;left:14px;transform:translateY(-50%)}.opponent.right{top:38%;right:14px;transform:translateY(-50%)}.backs{display:flex}.backs .card{width:34px}.backs .card+.card{margin-left:-24px}.center{z-index:3;position:absolute;top:42%;left:50%;transform:translate(-50%,-50%)}.trick{width:300px;height:280px;position:relative}.trick-card{transition:transform .25s;position:absolute}.trick-card.bottom{bottom:0;left:50%;transform:translate(-50%)}.trick-card.top{top:0;left:50%;transform:translate(-50%)}.trick-card.left{top:50%;left:0;transform:translateY(-50%)}.trick-card.right{top:50%;right:0;transform:translateY(-50%)}.trick-card .card{width:88px}.trick.done .trick-card:not(.winner){opacity:.55}.trick-card.winner .card{box-shadow:0 0 0 3px var(--gold), 0 0 22px #f2c14ecc}.trick-label{white-space:nowrap;z-index:10;background:#000000a6;border-radius:999px;padding:.35rem .8rem;font-weight:700;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.choosing{background:#0000004d;border-radius:16px;flex-direction:column;align-items:center;gap:.6rem;padding:1.2rem 1.6rem;display:flex}.choosing p{margin:0;font-size:1.15rem}.spinner{border:4px solid #fff3;border-top-color:var(--gold);border-radius:50%;width:34px;height:34px;animation:.9s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.picker{background:var(--paper);color:var(--ink);border-radius:16px;width:min(640px,92vw);padding:1rem 1.2rem;box-shadow:0 10px 40px #00000080}.picker h2{margin:0}.picker p{margin:.2rem 0 .8rem}.picker-grid{grid-template-columns:repeat(auto-fill,minmax(135px,1fr));gap:.6rem;display:grid}.contract-tile{color:var(--ink);background:#fff;border:2px solid #e1d9c6;flex-direction:column;align-items:center;gap:.3rem;padding:.6rem .4rem;font-weight:400;display:flex}@media (hover:hover){.contract-tile:hover:not(:disabled){border-color:var(--gold);transform:translateY(-2px)}}.contract-tile .contract-icon{border-radius:6px;width:72px}.contract-tile.disabled{filter:grayscale();opacity:.45}.trix{align-items:center;gap:1rem;padding-bottom:1.6rem;display:flex;position:relative}.trix-column{flex-direction:column;align-items:center;min-width:76px;display:flex}.trix-column .card{width:72px}.trix-column .card+.card{margin-top:-86px}.trix-column .card.jack{box-shadow:0 0 0 2px var(--gold), 0 2px 6px #00000059}.trix-empty{aspect-ratio:79/123;opacity:.7;border:2px dashed #ffffff59;border-radius:6px;flex-direction:column;justify-content:center;align-items:center;width:72px;font-size:1.3rem;display:flex}.trix-empty .small{font-size:.65rem}.trix-finishers{justify-content:center;gap:.8rem;font-size:.85rem;font-weight:600;display:flex;position:absolute;bottom:0;left:0;right:0}.turn-hint{white-space:nowrap;background:#00000059;border-radius:999px;padding:.3rem .9rem;font-weight:600}.turn-hint.mine{background:var(--gold);color:#2a1f00;animation:1.6s ease-in-out infinite pulse}@keyframes pulse{50%{box-shadow:0 0 0 6px #f2c14e40}}.me{z-index:4;flex-direction:column;align-items:center;gap:.5rem;padding-bottom:12px;display:flex;position:absolute;bottom:0;left:0;right:0}.me-info{align-items:center;gap:.8rem;display:flex}.me-actions{gap:.5rem;display:flex}.declare{background:var(--red);color:#fff}.hand{padding-top:12px;display:flex}.hand .card{width:92px;transition:transform .12s,filter .12s}.hand .card+.card{margin-left:-36px}.hand .card.legal{cursor:pointer;transform:translateY(-10px)}@media (hover:hover){.hand .card.legal:hover{transform:translateY(-22px)}}.hand .card.illegal{filter:grayscale(.6)brightness(.55)}.toast{z-index:25;background:var(--paper);color:var(--ink);pointer-events:none;border-radius:14px;align-items:center;gap:.8rem;padding:.7rem 1.2rem;font-size:1.3rem;font-weight:700;animation:.25s ease-out pop;display:flex;position:absolute;top:18%;left:50%;transform:translate(-50%);box-shadow:0 10px 30px #00000073}.toast .contract-icon{border-radius:6px;width:54px}@keyframes pop{0%{opacity:0;transform:translate(-50%)scale(.85)}}.overlay{z-index:30;background:#0000008c;justify-content:center;align-items:center;padding:1rem;display:flex;position:absolute;inset:0}.overlay.light{background:#00000040}.panel{background:var(--paper);color:var(--ink);text-align:center;border-radius:16px;width:100%;max-width:560px;padding:1.2rem 1.4rem;box-shadow:0 16px 50px #00000080}.panel h2{margin:.2rem 0}.peek{width:auto}.peek-cards{justify-content:center;gap:.8rem;display:flex}.peek-cards figure{flex-direction:column;align-items:center;gap:.3rem;margin:0;display:flex}.peek-cards figure.winner .card{box-shadow:0 0 0 3px var(--gold)}.summary-head{justify-content:center;align-items:center;gap:.8rem;display:flex}.summary-head .contract-icon{border-radius:6px;width:60px}.summary table{border-collapse:collapse;width:100%;margin:.8rem 0}.summary th,.summary td{text-align:left;border-bottom:1px solid #e5dfd1;padding:.35rem .4rem}.summary tr.you td{font-weight:700}.bad{color:var(--red);font-weight:700}.good{color:var(--green);font-weight:700}.summary-foot{flex-wrap:wrap;justify-content:center;align-items:center;gap:1rem;display:flex}.gameover .loser{color:var(--red);margin:.2rem 0;font-size:2.2rem}.gameover .loser-score{margin:0 0 .6rem;font-size:1.3rem;font-weight:700}.gameover .winner{margin:0 0 .6rem}.standings{text-align:left;width:min(260px,100%);margin:0 auto 1rem}.standings li span{float:right;font-weight:700}.paused .row{margin-top:1rem}.paused .invite{margin-top:.5rem}.offline{background:var(--red);color:#fff;text-align:center;z-index:40;padding:.3rem;position:absolute;top:0;left:0;right:0}.lb{position:relative}.lb-row{background:#ffffff0a;border-radius:10px;align-items:center;gap:.6rem;padding:.3rem .5rem;transition:transform .7s cubic-bezier(.2,.8,.2,1),background .3s;display:flex;position:absolute;top:0;left:0;right:0}.lb-row.you{background:#f2c14e1a}.lb-rank{background:#ffffff1a;border-radius:50%;flex:none;justify-content:center;align-items:center;width:30px;height:30px;font-weight:800;display:flex;position:relative}.lb-row.leader .lb-rank{background:var(--gold);color:#2a1f00;box-shadow:0 0 12px #f2c14e99}.lb-row.last .lb-rank{background:var(--red);color:#fff}.lb-rank.tied{letter-spacing:-.02em;font-size:.78rem}.lb-main{flex-direction:column;flex:1;gap:3px;min-width:0;display:flex}.lb-top{align-items:baseline;gap:.4rem;display:flex}.lb-name{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;font-weight:600;overflow:hidden}.lb-row.you .lb-name{color:var(--gold)}.lb-total{font-variant-numeric:tabular-nums;font-size:1.15rem;font-weight:800}.lb-move{font-size:.72rem;font-weight:700;animation:.35s ease-out lbpop}.lb-move.up{color:#7bd88f}.lb-move.down{color:#ff8a7a}.lb-bottom{align-items:center;gap:.4rem;display:flex}.lb-bar{background:#ffffff1a;border-radius:3px;flex:1;height:5px;overflow:hidden}.lb-fill{border-radius:3px;height:100%;transition:width .8s ease-out,background .4s}.lb-fill.low{background:#5fbf7f}.lb-fill.mid{background:#e5a93b}.lb-fill.high{background:#e0533f}.lb-delta{font-size:.75rem;font-weight:800;animation:.35s ease-out lbpop}.lb-delta.bad{color:#ff8a7a}.lb-delta.good{color:#7bd88f}.lb-actions{flex-direction:column;flex:none;align-self:flex-start;display:flex}.lb-actions .icon{padding:0 .3rem;line-height:1.2}.owner-crown{color:var(--gold)}.lb .sb-contracts{flex-wrap:nowrap;gap:2px}.lb .sb-contracts span{padding:0 .15rem;font-size:.52rem;line-height:1.35}@keyframes lbpop{0%{opacity:0;transform:scale(.6)}}.scoreboard table{border-collapse:collapse;width:100%}.scoreboard td{vertical-align:middle;border-bottom:1px solid #ffffff14;padding:.35rem .2rem}.scoreboard tr.you .sb-name{color:var(--gold)}.sb-total{text-align:right;font-size:1.1rem;font-weight:800;padding-right:.5rem!important}.sb-contracts{flex-wrap:wrap;gap:3px;display:flex}.sb-contracts span{opacity:.8;border:1px solid #ffffff40;border-radius:4px;padding:.1rem .25rem;font-size:.62rem;font-weight:700}.sb-contracts span.used{background:var(--gold);color:#2a1f00;border-color:var(--gold);opacity:.45;text-decoration:line-through}.feed{flex-direction:column;flex:1;min-height:0;display:flex}.feed-list{flex:1;font-size:.88rem;line-height:1.35;overflow-y:auto}.feed-list p{margin:0 0 .35rem}@media (width<=900px){.table-screen{grid-template-columns:1fr;height:100dvh}.side{z-index:50;visibility:hidden;transition:transform .25s ease-out,visibility .25s;position:fixed;inset:0;overflow-y:auto;transform:translateY(100%)}.side.open{visibility:visible;transform:none}.side .feed{min-height:240px}.side-toggle{z-index:6;padding:.45rem .8rem;display:block;position:absolute;top:8px;right:8px}.side-close{align-self:flex-start;display:block}.contract-badge{max-width:none;padding:.35rem .5rem;font-size:.8rem;top:8px;left:8px;right:96px}.contract-badge .contract-icon{width:40px}.contract-badge .small{display:none}.contract-badge .contract-no{top:-7px}.backs{display:none}.opponent{gap:.2rem}.opponent.top{top:76px}.opponent.left{top:136px;left:6px;transform:none}.opponent.right{top:136px;right:6px;transform:none}.seat-tag{padding:.25rem .5rem;font-size:.85rem}.center{top:50%}.toast{max-width:90vw;padding:.5rem .8rem;font-size:1rem;top:36%}.toast .contract-icon{width:36px}.me-info{flex-wrap:wrap;justify-content:center;gap:.4rem}}@media (width<=900px) and (height<=820px){:root{--card-w:60px}.hand .card{width:62px}.hand .card+.card{margin-left:-30px}.trick{width:230px;height:230px}.trick-card .card{width:64px}.trix-column{min-width:54px}.trix-column .card{width:52px}.trix-column .card+.card{margin-top:-62px}}.rotate-notice{display:none}@media (orientation:landscape) and (height<=500px){.rotate-notice{z-index:60;background:var(--felt-dark);color:var(--paper);text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:.5rem;padding:1rem;display:flex;position:fixed;inset:0}.rotate-notice .big{font-size:3rem}}@media (width<=600px){.solo-levels{grid-template-columns:1fr}.solo-level{text-align:right;flex-direction:row;justify-content:space-between;padding:.55rem .8rem}.entry,.lobby{justify-content:flex-start;padding-top:2.5rem}.entry h1,.lobby h1{font-size:2.4rem}.hand{--hc:min(74px, calc((100vw - 16px) / 5.1));padding-top:8px}.hand .card{width:var(--hc)}.hand .card+.card{margin-left:calc(var(--hc) * -.42)}.hand .card.legal{transform:translateY(-8px)}.me{padding-bottom:max(8px, env(safe-area-inset-bottom));gap:.35rem}.me-actions button{padding:.4rem .7rem;font-size:.85rem}.turn-hint{padding:.25rem .7rem;font-size:.85rem}.contract-badge{gap:.4rem}.contract-badge .contract-icon{width:32px}.opponent.top{top:64px}.opponent.left,.opponent.right{top:118px}.seat-tag{max-width:46vw;padding:.2rem .45rem;font-size:.8rem}.seat-name{text-overflow:ellipsis;white-space:nowrap;max-width:100%;overflow:hidden}.seat-meta{gap:.3rem;font-size:.72rem}.center{top:47%}.trick{width:min(230px,62vw);height:200px}.trick-card .card{width:min(60px,16vw)}.center.center-picker{top:52px;bottom:calc(var(--hand-h,150px) + 44px);display:flex;left:8px;right:8px;transform:none}.center-picker .picker{width:100%;padding:.7rem .8rem;overflow-y:auto}.picker h2{font-size:1.1rem}.picker p{margin-bottom:.5rem;font-size:.85rem}.picker-grid{grid-template-columns:1fr;gap:.4rem}.contract-tile{text-align:left;flex-direction:row;gap:.6rem;padding:.35rem .6rem}.contract-tile .contract-icon{flex:none;width:38px}.contract-tile strong{min-width:5.3rem;font-size:.95rem}.contract-tile .small{font-size:.75rem}.trix{gap:.5rem}.trix-column{min-width:0}.trix-column .card,.trix-empty{width:min(52px,14vw)}.trix-column .card+.card{margin-top:calc(-1.19*min(52px,14vw))}.trix-empty .small{display:none}.trix-finishers{gap:.5rem;font-size:.75rem}.overlay{padding:.6rem}.panel{max-height:calc(100dvh - 1.2rem);padding:.9rem .8rem;overflow-y:auto}.peek-cards{gap:.4rem}.peek-cards .card{width:min(64px,19vw)}.peek-cards figcaption{font-size:.8rem}.summary-head .contract-icon{width:44px}.summary h2{font-size:1.2rem}.summary table{margin:.5rem 0;font-size:.9rem}.summary th,.summary td{padding:.3rem .25rem}.summary .note{display:none}.note-inline{font-weight:400;display:block}.gameover .loser{font-size:1.7rem}.paused .row button{flex:100%}.toast{font-size:.95rem;top:188px}.contract-badge .declared{background:var(--felt-dark);border-radius:6px;padding:0 .4rem;font-size:.7rem;position:absolute;top:-7px;right:8px}}