:root{--bg: #10161d;--panel: rgba(20, 28, 38, .92);--panel-solid: #182432;--accent: #4da3ff;--teamA: #4da3ff;--teamB: #ff8a5c;--good: #7bd88f;--text: #e8eef5;--muted: #9fb0c3;--felt: #123a2c;--felt-light: #1b5540;--felt-dark: #0a2016;color-scheme:dark}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;overflow:hidden;-webkit-user-select:none;user-select:none}input,textarea{-webkit-user-select:text;user-select:text}button{font:inherit;padding:8px 14px;border-radius:8px;border:1px solid #34506e;background:#21344a;color:var(--text);cursor:pointer;transition:filter .12s,transform .05s}button:hover:not(:disabled){filter:brightness(1.18)}button:active:not(:disabled){transform:translateY(1px)}button:disabled{opacity:.4;cursor:not-allowed}button.primary{background:linear-gradient(180deg,#5cadff,#3d8ce6);border-color:#3d8ce6;color:#06121f;font-weight:700;box-shadow:0 6px 18px #4da3ff52}button.ghost{background:transparent;border-color:#34506e}button:focus-visible{outline:none;box-shadow:0 0 0 3px #4da3ff59}input{font:inherit;padding:10px 12px;border-radius:8px;border:1px solid #34506e;background:#0e1620;color:var(--text);width:100%;margin-top:6px;transition:border-color .15s,box-shadow .15s}input::placeholder{color:#5b6f85}input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px #4da3ff2e}.home{height:100%;display:grid;place-items:center;position:relative;overflow:hidden;background:radial-gradient(1100px 800px at 50% 34%,var(--felt-light) 0%,var(--felt) 46%,var(--felt-dark) 100%)}.home-inner{display:flex;flex-direction:column;align-items:center}.card-fan{display:flex;justify-content:center;margin-bottom:18px}.mini-card{width:56px;height:80px;margin:0 -15px;border-radius:9px;background:linear-gradient(158deg,#fff,#e6edf6);color:#1b2836;display:grid;place-items:center;font-size:28px;font-weight:700;border:1px solid rgba(0,0,0,.14);box-shadow:0 14px 30px #0000008c}.mini-card.red{color:#d6455f}.mini-card:nth-child(1){transform:rotate(-15deg) translateY(12px)}.mini-card:nth-child(2){transform:rotate(-5deg) translateY(-2px);z-index:1}.mini-card:nth-child(3){transform:rotate(5deg) translateY(-2px);z-index:1}.mini-card:nth-child(4){transform:rotate(15deg) translateY(12px)}.home-card{position:relative;width:min(420px,92vw);background:linear-gradient(180deg,#1e2d3d 0%,var(--panel-solid) 100%);border:1px solid #2f465e;border-radius:18px;padding:30px 30px 26px;box-shadow:0 30px 80px #0009,inset 0 1px #ffffff0d}.home-card h1{margin:0 0 6px;font-size:36px;font-weight:800;letter-spacing:-.8px}.brand-accent{color:var(--accent)}.tagline{color:var(--muted);margin:0 0 6px;font-size:14px;line-height:1.45}.home-card label{display:block;margin:16px 0 0;font-size:12px;letter-spacing:.5px;text-transform:uppercase;color:var(--muted);font-weight:600}.home-buttons{display:flex;gap:10px;margin-top:22px}.home-buttons button{flex:1}.home-buttons.stacked{flex-direction:column}.home-buttons.stacked button{width:100%;padding:12px;font-size:15px}.hint{color:var(--muted);font-size:12.5px;line-height:1.4;margin-top:14px}.hint.warn{color:var(--teamB)}.room{position:fixed;top:0;right:0;bottom:0;left:0}.room:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:5;background:radial-gradient(120% 90% at 50% 45%,transparent 55%,rgba(0,0,0,.45) 100%)}.room canvas,.table-placeholder{position:absolute;top:0;right:0;bottom:0;left:0}.table-placeholder{background:radial-gradient(1100px 800px at 50% 40%,var(--felt-light) 0%,var(--felt) 46%,var(--felt-dark) 100%)}.room-top-left{position:absolute;top:14px;left:14px;z-index:20;display:flex;gap:10px;align-items:center}.conn{color:var(--muted);font-size:13px}.overlay{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.overlay>*{pointer-events:auto}.panel.lobby{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:min(720px,94vw);background:linear-gradient(180deg,#1b2836f0,#141c26f0);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid #2a3d54;border-radius:16px;padding:24px;box-shadow:0 24px 70px #00000080,inset 0 1px #ffffff0a}.lobby-head{display:flex;justify-content:space-between;align-items:center;gap:12px}.lobby-head h1{margin:0;font-size:24px;letter-spacing:-.4px}.roomcode{color:var(--muted);display:flex;gap:10px;align-items:center;font-size:13px}.roomcode b{color:var(--text);letter-spacing:3px;font-size:15px;background:#0e1620;border:1px solid #2a3d54;border-radius:8px;padding:4px 10px}.felt{position:relative;height:290px;margin:40px 30px 44px;border-radius:150px;background:radial-gradient(120% 130% at 50% 30%,#1a6d54,#0f4a3c 55%,#0c3730);border:9px solid #16232f;box-shadow:inset 0 0 46px #0000008c,inset 0 2px #ffffff0d,0 18px 44px #00000073}.felt-center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);text-align:center;pointer-events:none}.felt-vs{font-size:12px;letter-spacing:1px;text-transform:uppercase;font-weight:700;color:#e6f5f08c}.tseat{position:absolute;width:132px;display:flex;flex-direction:column;align-items:center;gap:5px;transform:translate(-50%,-50%)}.tseat.pos-0{left:50%;top:100%}.tseat.pos-1{left:100%;top:50%}.tseat.pos-2{left:50%;top:0%}.tseat.pos-3{left:0%;top:50%}.tseat-av{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;font-size:27px;background:#0e1620;border:3px solid #34506e;box-shadow:0 6px 16px #00000080;transition:box-shadow .15s}.tseat.team-A .tseat-av{border-color:var(--teamA)}.tseat.team-B .tseat-av{border-color:var(--teamB)}.tseat.mine .tseat-av{box-shadow:0 0 0 3px #4da3ff73,0 6px 16px #00000080}.tseat-empty .tseat-av{border-style:dashed;color:#5b6f85;background:#0e162099}.tseat-name{font-size:14px;font-weight:600;white-space:nowrap}.tseat-name .empty{color:#7e93a8;font-style:italic;font-weight:400}.tseat-team{font-size:10px;letter-spacing:.6px;text-transform:uppercase;font-weight:700}.tseat.team-A .tseat-team{color:var(--teamA)}.tseat.team-B .tseat-team{color:var(--teamB)}.lobby-buttons{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:4px}.hud-top{position:absolute;top:29%;left:50%;transform:translate(-50%);display:flex;gap:16px;align-items:center;background:var(--panel);border:1px solid #2a3d54;border-radius:12px;padding:8px 16px;z-index:15;pointer-events:none}.score b{font-size:20px;margin-left:6px}.score.team-A b{color:var(--teamA)}.score.team-B b{color:var(--teamB)}.hand-info{color:var(--muted);font-size:13px}.turn-row{position:absolute;bottom:29%;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:10px;z-index:15}.turn-banner{background:#141c26e6;border-radius:20px;padding:7px 20px;font-size:14px;color:var(--muted);pointer-events:none;white-space:nowrap}.turn-banner.you{color:#06121f;background:var(--accent);font-weight:600}.sort-pills{display:flex;gap:6px;pointer-events:auto}.sort-pill{background:#141c26e6;border:1px solid #34506e;color:var(--text);border-radius:20px;padding:7px 14px;font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap}.sort-pill:hover{border-color:var(--accent);filter:brightness(1.1)}.pile-btn{background:var(--accent);border:none;color:#06121f;font-weight:700;padding:8px 14px;border-radius:9px;white-space:nowrap;box-shadow:0 6px 18px #00000080;cursor:pointer}.pile-btn:hover{filter:brightness(1.12)}.actionbar{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;gap:10px;align-items:center;flex-wrap:wrap;justify-content:center;background:#141c26d1;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border:1px solid #2a3d54;border-radius:12px;padding:12px 16px;max-width:620px;box-shadow:0 10px 30px #00000073}.actionbar .sel{color:var(--text);font-size:14px}.actionbar .tip{color:var(--muted);font-size:12px}.toast{position:absolute;bottom:90px;left:50%;transform:translate(-50%);background:#3a2330;color:#ffd9c7;border:1px solid #6d3a44;padding:10px 16px;border-radius:10px;z-index:30}