:root{--felt: #123524;--felt-deep: #0d2619;--felt-edge: #2f5e45;--brass: #e8c88a;--brass-dim: #b9975b;--parchment: #f2e8d5;--parchment-dim: #b9ae98;--parchment-faint: #8d8575;--danger: #c2564b;--ok: #5a9c6b;--card-width: clamp(40px, min(9.8vw, 9.5vh), 76px);--surface: #0f2b1c;--surface-raised: #143826;--hairline: rgb(232 200 138 / 14%);--seat-card-width: calc(var(--card-width) * .596);--radius: 8px;--shadow: 0 6px 18px rgb(0 0 0 / 45%);color-scheme:dark}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}html{background-color:#0c2318}body:before{content:"";position:fixed;inset:0;z-index:-1;background:radial-gradient(ellipse at 50% 38%,#1a4a32 0%,var(--felt) 58%,#0c2318 100%);pointer-events:none}body{color:var(--parchment);font:16px/1.5 system-ui,-apple-system,Segoe UI,Roboto,Noto Naskh Arabic,sans-serif;overscroll-behavior:none;-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer;border:0;background:none}:where(button,a,input,select,textarea,[tabindex]):focus-visible{outline:2px solid var(--brass);outline-offset:2px;border-radius:4px}input{font:inherit}.screen{min-height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;padding:28px 20px 48px;max-width:34rem;margin-inline:auto;text-align:center}.wordmark{font-weight:800;letter-spacing:.22em;color:var(--brass);line-height:1}.wordmark .top{font-size:clamp(2.4rem,11vw,3.6rem);display:block}.wordmark .bottom{font-size:clamp(.9rem,3.6vw,1.2rem);display:block;margin-top:6px}.wordmark .suits{color:var(--brass-dim);letter-spacing:.4em;font-size:.95rem;margin-top:10px;display:block}.btn{display:block;width:100%;max-width:22rem;padding:13px 18px;border-radius:var(--radius);background:linear-gradient(180deg,var(--surface-raised),var(--surface));border:1px solid var(--felt-edge);color:var(--parchment);font-weight:600;letter-spacing:.01em;box-shadow:inset 0 1px #ffffff0a;transition:background .12s ease,border-color .12s ease,transform 80ms ease}.btn:hover:not(:disabled){border-color:var(--brass-dim);filter:brightness(1.12)}.btn:active:not(:disabled){transform:translateY(1px);filter:brightness(.96)}.btn:disabled{opacity:.5;cursor:default}.btn.primary{background:linear-gradient(180deg,#f2d9a6,var(--brass));color:#20180a;border-color:var(--brass)}.btn.primary:hover:not(:disabled){filter:brightness(1.05)}.btn.danger{border-color:var(--danger);color:#f0b3ad}.btn.small{width:auto;padding:8px 14px;font-size:.9rem}.field{width:100%;max-width:22rem;text-align:start}.field label{display:block;font-size:.82rem;color:var(--parchment-dim);margin-bottom:5px}.field input{width:100%;padding:11px 13px;border-radius:var(--radius);background:var(--felt-deep);border:1px solid var(--felt-edge);color:var(--parchment)}.field input:focus{outline:2px solid var(--brass-dim);outline-offset:1px}.muted{color:var(--parchment-dim);font-size:.9rem}.faint{color:var(--parchment-faint);font-size:.82rem}.error{color:#f0b3ad;font-size:.9rem}.link{color:var(--brass);text-decoration:underline;background:none}.panel{background:var(--surface);border:1px solid var(--felt-edge);border-radius:var(--radius);padding:14px 16px}h2{letter-spacing:.02em}.room-list{width:100%;max-width:30rem;display:flex;flex-direction:column;gap:10px}.room-row{display:flex;align-items:center;gap:12px;text-align:start;padding:12px 14px;border-radius:var(--radius);background:var(--felt-deep);border:1px solid var(--felt-edge);width:100%}.room-row:hover{border-color:var(--brass-dim)}.room-row .name{font-weight:600;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.badge{font-size:.66rem;letter-spacing:.08em;padding:2px 6px;border-radius:4px;border:1px solid var(--brass-dim);color:var(--brass);white-space:nowrap}.table{position:relative;height:100dvh;display:grid;grid-template-rows:auto auto 1fr auto auto;gap:4px;padding:calc(8px + env(safe-area-inset-top)) calc(8px + env(safe-area-inset-right)) calc(8px + env(safe-area-inset-bottom)) calc(8px + env(safe-area-inset-left));max-width:1100px;margin-inline:auto}.table>.table-top{grid-row:1}.table>.turn-bar{grid-row:2}.table>.felt{grid-row:3;grid-column:1}.table>.overlay.in-table{grid-row:3;grid-column:1}.table>.hand{grid-row:4}.table>.my-plate{grid-row:5}.table-top{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:6px 8px;border-radius:10px;background:#00000038;border:1px solid var(--hairline)}.turn-bar{display:flex;align-items:center;justify-content:center;gap:10px;min-height:1.6rem;padding:2px 8px;font-size:.86rem;color:var(--parchment-dim)}.turn-bar .whose{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.turn-bar .deadline{padding:1px 9px;border-radius:999px;border:1px solid var(--brass-dim);background:#00000047}.turn-bar .deadline.urgent{border-color:var(--danger)}.felt{position:relative;border-radius:50%/30%;background:radial-gradient(ellipse at 50% 38%,#1f5a3b,#164329 58%,#0f2e1e);box-shadow:inset 0 0 90px #00000061;display:grid;place-items:center;min-height:0}.seat{position:absolute;display:flex;flex-direction:column;align-items:center;gap:4px}.seat.top{top:8px;inset-inline-start:50%;transform:translate(-50%)}.seat.right{inset-inline-end:10px;top:50%;transform:translateY(-50%)}.seat.left{inset-inline-start:10px;top:50%;transform:translateY(-50%)}.plate{display:flex;align-items:center;gap:5px;padding:3px 9px;border-radius:999px;background:#040806a6;border:1px solid #ffffff17;font-size:.78rem;white-space:nowrap;max-width:min(16rem,44vw)}.plate.turn{border-color:#e8c15acc}.plate.turn .name{color:#f7dc90}.badge-btn{display:flex;align-items:center;gap:5px;padding:0;min-width:0}button.badge-btn{cursor:pointer}button.badge-btn:hover .name{color:var(--brass)}.plate .face{flex:0 0 auto;display:grid;place-items:center;width:1.45em;height:1.45em;border-radius:50%;background:#ffffff17;border:1px solid rgb(198 160 74 / 60%);font-size:.82em;object-fit:cover;overflow:hidden}.plate .crown{color:var(--brass);font-size:.82em}.plate .name{overflow:hidden;text-overflow:ellipsis}.plate .tag{color:var(--parchment-faint);font-size:.72em}.score-chip{flex:0 0 auto;padding:0 6px;border-radius:999px;font-variant-numeric:tabular-nums;font-size:.92em;background:#6816169e;border:1px solid #ce565659;color:#efb9b9}.score-chip.gain{background:#10502a9e;border-color:#5abe7859;color:#b4e6c2}.plate-action{flex:0 0 auto;padding:1px 7px;border-radius:999px;font-size:.72em;letter-spacing:.04em;text-transform:uppercase;color:#f7dc90;background:#f7dc9024;border:1px solid rgb(247 220 144 / 55%)}.my-plate{display:flex;justify-content:center;padding-bottom:6px}.seat-meta{font-size:.72rem;color:var(--parchment-dim)}.seat-hand{position:relative;flex:0 0 auto;display:grid;place-items:center}.seat-hand.top{width:calc(var(--card-width) * 3);height:calc(var(--seat-card-width) / .688)}.seat-hand.left,.seat-hand.right{width:calc(var(--seat-card-width) / .688);height:calc(var(--card-width) * 3)}.seat-hand img{position:absolute;width:var(--seat-card-width);border-radius:2px;border:.5px solid rgb(0 0 0 / 30%);transition:none}.felt-centre{display:grid;gap:10px;justify-items:center;padding:0 18px}.trick{position:relative;display:grid;place-items:center;width:calc(var(--card-width) * 4.04);height:calc(var(--card-width) * 2.92)}.trick .played{position:absolute;line-height:0}.trick .played img{width:calc(var(--card-width) * .962);border-radius:3px;border:.5px solid rgb(0 0 0 / 30%);box-shadow:var(--shadow);display:block}.trick .played.winner img{outline:2px solid var(--brass);outline-offset:2px}.overlay.in-table{position:relative;inset:auto;z-index:10;background:#0000006b;-webkit-backdrop-filter:none;backdrop-filter:none;border-radius:50%/30%;padding:12px;min-height:0;max-height:100%;overflow-y:auto}.double-picks{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin:14px 0}.double-pick{display:flex;flex-direction:column;align-items:center;gap:5px;padding:0}.pick-card{position:relative;display:block;line-height:0}.pick-card img{width:calc(var(--card-width) * .73);border-radius:3px;display:block;opacity:.62;transition:opacity .12s ease,transform .12s ease}.double-pick.on .pick-card img{opacity:1;transform:translateY(-3px);outline:2px solid var(--brass);outline-offset:2px}.x2{position:absolute;top:-6px;inset-inline-end:-8px;padding:1px 5px;border-radius:999px;background:var(--brass);color:#20180a;font-size:.68rem;font-weight:800}.pick-label{font-size:.72rem;color:var(--parchment-faint)}.double-pick.on .pick-label{color:var(--brass)}.hand{display:flex;justify-content:center;align-items:flex-end;min-height:calc(var(--card-width) * 1.5);padding-bottom:4px}.hand .card{position:relative;flex:0 0 auto;border:0;padding:0;transition:transform .12s ease,filter .12s ease;transform-origin:bottom center}.hand .card:not(:first-child){margin-inline-start:calc(var(--card-width) * -.42)}.hand .card img{width:var(--card-width);border-radius:5px;display:block;box-shadow:var(--shadow)}.hand .card{cursor:default}.hand .card.playable{cursor:pointer}.hand .card.playable:hover,.hand .card.playable:focus-visible{transform:translateY(-14px)}.hand .card.playable img{outline:2px solid var(--brass);outline-offset:1px}.hand .card.dimmed img{filter:brightness(.55) saturate(.6)}.hand .card.selected{transform:translateY(-18px)}.overlay{position:fixed;inset:0;background:#00000094;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);display:grid;place-items:center;padding:20px;z-index:20}.sheet{background:linear-gradient(180deg,var(--surface-raised),var(--felt-deep));border:1px solid var(--felt-edge);border-radius:14px;padding:18px 20px;width:min(30rem,100%);max-height:86dvh;overflow:auto;box-shadow:var(--shadow)}.sheet h2{margin:0 0 4px;font-size:1.05rem;color:var(--brass)}.sheet .row{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}.contract-grid{display:grid;gap:8px;margin-top:12px}.contract-grid{grid-template-columns:repeat(auto-fit,minmax(8.5rem,1fr))}.contract-btn{text-align:center;padding:13px 12px;border-radius:var(--radius);border:1px solid var(--felt-edge);background:linear-gradient(180deg,var(--surface-raised),var(--surface));font-weight:600;transition:border-color .12s ease,filter .12s ease}.contract-btn:hover:not(:disabled){border-color:var(--brass);filter:brightness(1.12)}.contract-btn:disabled{opacity:.34;cursor:default}.scores{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;font-size:.82rem}.scores .entry{display:flex;gap:7px;align-items:baseline;padding:3px 10px;border-radius:999px;background:#0000004d;border:1px solid transparent}.scores .entry.turn{border-color:var(--brass)}.scores .entry.me{background:#e8c88a1f}.scores .entry .who{max-width:7rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.scores .entry .value{color:var(--brass);font-variant-numeric:tabular-nums;font-weight:600}.chat{display:flex;flex-direction:column;gap:8px;height:min(60dvh,28rem)}.chat .log{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:8px;padding-inline-end:4px}.chat .message{text-align:start}.chat .message .who{font-size:.74rem;color:var(--brass-dim)}.chat .message .body{background:#0f2b1c;border-radius:8px;padding:7px 10px;display:inline-block;max-width:100%;overflow-wrap:anywhere}.chat .message.mine .body{background:#1d4733}.chat .composer{display:flex;gap:8px}.chat .composer input{flex:1 1 auto;min-width:0;padding:10px 12px;border-radius:var(--radius);background:var(--felt-deep);border:1px solid var(--felt-edge);color:var(--parchment)}.chat .composer .btn{flex:0 0 auto}.deadline{font-variant-numeric:tabular-nums;color:var(--brass);font-size:.82rem}.deadline.urgent{color:#f0b3ad}.trix-board{display:grid;grid-template-columns:repeat(2,auto);gap:8px 14px;justify-content:center}.trix-slot{display:flex;align-items:center;gap:6px;width:calc(var(--card-width) * 3.31);height:calc(var(--card-width) * 1.04);padding-inline:7px;border-radius:var(--radius);background:#0003;border:1px solid var(--hairline)}.trix-slot .suit{flex:0 0 auto;font-size:1.05rem;color:var(--parchment-dim)}.trix-slot .suit.red{color:#e07a6e}.trix-slot .run{position:relative;flex:1;height:100%}.trix-slot .run img{position:absolute;top:50%;inset-inline-start:0;translate:0 -50%;width:calc(var(--card-width) * .635);border-radius:2px;border:.5px solid rgb(0 0 0 / 30%)}.trix-slot .run img.waiting{opacity:.2}.banner{padding:9px 14px;border-radius:var(--radius);background:#3a2320;border:1px solid var(--danger);font-size:.88rem}.spinner{width:26px;height:26px;border:2px solid var(--felt-edge);border-top-color:var(--brass);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}}.avatar{display:inline-grid;place-items:center;flex:0 0 auto;border-radius:50%;object-fit:cover;background:#0f2b1c;border:1px solid var(--felt-edge);color:var(--brass);font-weight:700}.friend-row,.leader-row{display:flex;align-items:center;gap:10px;width:100%;padding:10px 12px;border-radius:var(--radius);background:var(--felt-deep);border:1px solid var(--felt-edge);text-align:start}.leader-row:hover,.friend-row:hover{border-color:var(--brass-dim)}.leader-row.me{border-color:var(--brass)}.friend-identity{display:flex;align-items:center;gap:10px;flex:1;min-width:0;text-align:start;padding:0}.who{display:flex;flex-direction:column;min-width:0}.who .name{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.presence{font-size:.76rem;color:var(--parchment-faint)}.presence.online{color:var(--ok)}.friend-actions{display:flex;gap:6px;flex:0 0 auto}.count{display:inline-block;margin-inline-start:6px;min-width:1.15rem;padding:0 5px;border-radius:999px;background:var(--brass);color:#1b2b1f;font-size:.72rem;font-weight:700;text-align:center}.leader-row .rank{width:1.6rem;text-align:center;color:var(--brass-dim);font-variant-numeric:tabular-nums}.leader-row .points{margin-inline-start:auto;color:var(--brass);font-weight:700;font-variant-numeric:tabular-nums}.tabs{display:flex;gap:6px;flex-wrap:wrap;justify-content:center}.tab{padding:7px 13px;border-radius:999px;border:1px solid var(--felt-edge);background:var(--felt-deep);font-size:.86rem}.tab.active{border-color:var(--brass);color:var(--brass)}.profile-head{display:flex;align-items:center;gap:12px}.profile-head h2{margin:0}.stat-row{display:flex;gap:10px;margin-top:12px}.stat{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;padding:9px 6px;border-radius:var(--radius);background:#0f2b1c;border:1px solid var(--felt-edge)}.stat .value{color:var(--brass);font-weight:700;font-variant-numeric:tabular-nums}.toasts{position:fixed;top:10px;inset-inline:0;display:flex;flex-direction:column;align-items:center;gap:6px;z-index:30;pointer-events:none}.toast{pointer-events:auto;max-width:min(28rem,calc(100% - 32px));padding:9px 14px;border-radius:999px;background:#0f2b1cf2;border:1px solid var(--brass-dim);box-shadow:var(--shadow);font-size:.88rem}.toast .row{display:flex;gap:8px;margin-top:8px;justify-content:center}.toast.invite{border-radius:var(--radius)}.seat-name.tappable{cursor:pointer}.seat-name.tappable:hover,.seat-name.tappable:focus-visible{border-color:var(--brass-dim);outline:none}.settings-group{width:100%;max-width:22rem;display:flex;flex-direction:column;gap:8px;padding:12px 14px;border-radius:var(--radius);background:var(--felt-deep);border:1px solid var(--felt-edge);text-align:start}.switch-row{display:flex;align-items:center;gap:10px;padding:6px 0;cursor:pointer}.switch-row input{accent-color:var(--brass);width:18px;height:18px}.slider{width:100%;accent-color:var(--brass)}.slider:disabled{opacity:.4}a.btn{text-decoration:none;text-align:center}.sheet-actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px;padding-top:12px;border-top:1px solid var(--felt-edge)}.contract-btn.chosen{border-color:var(--brass);color:var(--brass)}.quoted{margin:8px 0 0;padding:8px 10px;border-inline-start:2px solid var(--brass-dim);background:#0f2b1c;border-radius:0 var(--radius) var(--radius) 0;font-size:.88rem;color:var(--parchment-dim);overflow-wrap:anywhere}.player-row,.report-row{display:flex;flex-direction:column;gap:6px;width:100%;padding:12px 14px;border-radius:var(--radius);background:var(--felt-deep);border:1px solid var(--felt-edge);text-align:start}.report-row p{margin:0;overflow-wrap:anywhere}.report-row.resolved{opacity:.55}.tags{display:flex;gap:6px;flex-wrap:wrap}.badge.danger{border-color:var(--danger);color:#f0b3ad}.screenshot{max-width:100%;border-radius:var(--radius);border:1px solid var(--felt-edge)}.field textarea{width:100%;padding:11px 13px;border-radius:var(--radius);background:var(--felt-deep);border:1px solid var(--felt-edge);color:var(--parchment);resize:vertical}.field textarea:focus{outline:2px solid var(--brass-dim);outline-offset:1px}.chat .message .link{display:block;margin-top:2px;font-size:.72rem}.chat .message .body{text-align:start;cursor:pointer}.chat .message .body:hover{filter:brightness(1.15)}.chat .message .quote{font-size:.74rem;color:var(--parchment-faint);padding-inline-start:7px;border-inline-start:2px solid var(--brass-dim);margin-bottom:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}.chat .reactions{display:flex;gap:4px;flex-wrap:wrap;margin-top:3px}.chat .reactions .chip{padding:0 6px;border-radius:999px;background:#0000004d;border:1px solid transparent;font-size:.78rem}.chat .reactions .chip.mine{border-color:var(--brass-dim)}.chat .message-actions{display:flex;gap:6px;align-items:center;margin-top:4px;flex-wrap:wrap}.chat .message-actions .react{font-size:1rem;line-height:1;padding:2px;border-radius:6px}.chat .message-actions .react:hover{background:#ffffff1a}.chat .replying{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:.78rem;color:var(--parchment-dim);padding:4px 8px;border-radius:var(--radius);background:#00000040}.deltas{display:grid;gap:6px;margin-top:10px;min-width:14rem}.delta-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.delta-row .who{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.delta-row .score-chip{background:#0000004d;border-color:var(--hairline);color:var(--parchment-dim)}@media(pointer:coarse){.btn.small{padding:11px 16px;min-height:44px}.link{display:inline-block;padding:11px 6px}.switch-row{min-height:44px}.switch-row input{width:22px;height:22px}.slider{height:32px}.chat .message .body{padding:10px 12px}.chat .reactions .chip{padding:5px 9px}.chat .message-actions .react{padding:8px;font-size:1.15rem}.tab{padding:11px 15px}.plate-action{padding:7px 11px}.double-pick{padding:8px 6px;min-height:44px}.pick-card img{width:calc(var(--card-width) * 1.1)}.double-picks{gap:14px 10px}}@media(hover:none){.hand .card.playable:hover{transform:none}.btn:hover:not(:disabled){border-color:var(--felt-edge);filter:none}.btn.primary:hover:not(:disabled){border-color:var(--brass)}.contract-btn:hover:not(:disabled){border-color:var(--felt-edge);filter:none}.room-row:hover,.leader-row:hover,.friend-row:hover{border-color:var(--felt-edge)}.chat .message .body:hover{filter:none}button.badge-btn:hover .name{color:inherit}.btn:active:not(:disabled),.contract-btn:active:not(:disabled),.tab:active,.room-row:active,.friend-row:active,.leader-row:active{filter:brightness(1.25)}}@media(orientation:portrait)and (max-width:620px){.seat.left,.seat.right{top:auto;bottom:14px;transform:none}.plate{max-width:42vw}:root{--card-width: clamp(40px, calc((100vw - 16px) / 7.96), 76px)}}@media(max-height:520px){.table-top{padding:0 4px}.table-top .btn.small{padding:9px 12px;min-height:40px;font-size:.84rem}.turn-bar{min-height:0;padding:0 8px;font-size:.8rem}.felt{align-items:end}.seat.top{top:2px}.felt-centre{gap:0}.contract-line{position:absolute;top:6px;inset-inline-start:16px;font-size:.78rem}}@media(max-width:620px){.screen{justify-content:flex-start;justify-content:safe center;padding:calc(20px + env(safe-area-inset-top)) calc(16px + env(safe-area-inset-right)) calc(32px + env(safe-area-inset-bottom)) calc(16px + env(safe-area-inset-left));gap:14px}.overlay{padding:12px}.sheet{width:100%;max-height:calc(100dvh - 24px - env(safe-area-inset-bottom))}.chat{height:min(70dvh,32rem)}}.toasts{top:calc(10px + env(safe-area-inset-top))}@media(orientation:portrait)and (max-height:700px){.seat.left .seat-hand,.seat.right .seat-hand{display:none}.seat.left,.seat.right{bottom:8px}}.toast.warning{border-color:var(--danger);background:#3a2320f2;color:#f0b3ad}.turn-bar .reconnecting{color:var(--brass-dim)}.fab-back{position:fixed;top:calc(12px + env(safe-area-inset-top));inset-inline-start:calc(12px + env(safe-area-inset-left));z-index:15;display:grid;place-items:center;width:44px;height:44px;padding:0;border-radius:50%;background:linear-gradient(180deg,var(--surface-raised),var(--surface));border:1px solid var(--felt-edge);color:var(--brass);box-shadow:var(--shadow);transition:border-color .12s ease,filter .12s ease}[dir=rtl] .fab-back svg{transform:scaleX(-1)}.screen:has(>.fab-back){padding-block-start:calc(68px + env(safe-area-inset-top))}@media(hover:hover){.fab-back:hover{border-color:var(--brass-dim);filter:brightness(1.15)}}@media(hover:none){.fab-back:active{filter:brightness(1.25)}}