:root{--felt: #12513b;--felt-dark: #0c3a2a;--ink: #f4f1e8;--muted: #b9cbbf;--gold: #f2c14e;--red: #d2322d;--black: #1d2228;--card: #fffdf8;--line: rgba(255, 255, 255, .14)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;height:100%;overscroll-behavior:none}body{background:radial-gradient(ellipse at 50% 35%,#1a6a4d 0%,var(--felt) 45%,var(--felt-dark) 100%) fixed;color:var(--ink);font:16px/1.35 -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;touch-action:manipulation;-webkit-user-select:none;user-select:none}input{-webkit-user-select:text;user-select:text}button{font:inherit;color:inherit;touch-action:manipulation}#app{min-height:100dvh;display:flex;flex-direction:column;padding:env(safe-area-inset-top) 0 env(safe-area-inset-bottom)}.btn{border:0;border-radius:14px;padding:12px 18px;font-weight:650;font-size:16px;background:#ffffff24;color:var(--ink);cursor:pointer;min-height:46px}.btn:active{transform:scale(.97)}.btn.primary{background:var(--gold);color:#2a1e00}.btn.big{padding:15px 22px;font-size:18px;width:100%}.btn.ghost{background:transparent;border:1px solid var(--line)}.btn.danger{background:transparent;border:1px solid rgba(255,120,110,.5);color:#ffb3ab}.btn[disabled]{opacity:.45}.muted{color:var(--muted);font-size:14px}.redt{color:var(--red)}.blackt{color:var(--black)}.status .redt,.btn .redt,.ticker .redt,.mine-score .redt,.took .redt,.muted .redt{color:#ff6d66}.status .blackt,.btn .blackt,.ticker .blackt,.mine-score .blackt,.muted .blackt{color:#fff}.btn.primary .blackt{color:#2a1e00}.btn.primary .redt{color:#a3120d}h1,h2{margin:0}.home{flex:1;display:flex;flex-direction:column;justify-content:center;gap:18px;padding:24px 20px 40px;max-width:460px;margin:0 auto;width:100%}.logo{display:flex;justify-content:center;margin-bottom:4px;height:96px}.logo .card{width:58px;height:82px}.logo .card:nth-child(1){transform:rotate(-14deg) translate(14px,8px)}.logo .card:nth-child(2){transform:translateY(-4px);z-index:1}.logo .card:nth-child(3){transform:rotate(14deg) translate(-14px,8px)}.home h1{text-align:center;font-size:34px;letter-spacing:.5px}.home .tag{text-align:center;color:var(--muted);margin-top:-10px}.field label{display:block;font-size:14px;color:var(--muted);margin-bottom:6px}.field input,.code-in{width:100%;font-size:18px;padding:13px 14px;border-radius:14px;border:1px solid var(--line);background:#00000040;color:var(--ink);outline:none}.join-row{display:flex;gap:8px}.code-in{text-transform:uppercase;letter-spacing:6px;text-align:center;font-weight:700}.panel{background:#00000038;border:1px solid var(--line);border-radius:18px;padding:16px;display:flex;flex-direction:column;gap:10px}.bar{display:flex;align-items:center;gap:8px;padding:10px 12px 6px}.bar .title{flex:1;font-weight:700;font-size:17px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.bar .title small{color:var(--muted);font-weight:500;letter-spacing:1px}.bar .btn{padding:8px 12px;min-height:38px;font-size:15px}.offline{margin:0 12px 6px;background:#7a3a12;border-radius:10px;padding:6px 10px;font-size:14px;text-align:center}.lobby{padding:6px 14px 70px;display:flex;flex-direction:column;gap:14px;max-width:560px;width:100%;margin:0 auto}.seats{display:flex;flex-wrap:wrap;gap:8px}.seat{display:flex;align-items:center;gap:8px;background:#00000040;border-radius:999px;padding:7px 12px;font-weight:600}.seat .x{border:0;background:#ffffff1f;border-radius:999px;width:26px;height:26px;line-height:24px;padding:0;font-size:15px;cursor:pointer}.seat.you{outline:2px solid var(--gold)}.dot{display:inline-block;width:12px;height:12px;border-radius:50%;flex:none}.invite{text-align:center;display:flex;flex-direction:column;align-items:center;gap:10px}.invite img{width:min(64vw,250px);height:auto;aspect-ratio:1;background:#fff;border-radius:14px;padding:10px}.invite .code{font-size:34px;font-weight:800;letter-spacing:8px;color:var(--gold)}.invite .row{display:flex;gap:8px}.games{display:flex;flex-direction:column;gap:10px}.game-card{display:flex;align-items:center;gap:12px;padding:14px;border-radius:16px;background:#00000040;border:1px solid var(--line)}.game-card .gi{flex:1}.game-card .gn{font-weight:750;font-size:18px}.game-card .gp{font-size:13px;color:var(--gold);font-weight:600}.game-card .gb{font-size:14px;color:var(--muted);margin-top:2px}.game-card .gr{font-size:13px;color:var(--muted);text-decoration:underline;background:none;border:0;padding:4px 0 0;cursor:pointer}.game-card.off{opacity:.55}.section-h{font-size:13px;text-transform:uppercase;letter-spacing:1.2px;color:var(--muted);margin:4px 2px -4px}.game{flex:1;display:flex;flex-direction:column;min-height:0;position:relative;padding-bottom:40px}.opps{display:flex;gap:8px;padding:2px 12px 6px;justify-content:center}.opp{flex:1;max-width:200px;background:#00000038;border-radius:14px;padding:7px 10px;border:2px solid transparent;min-width:0}.opp.turn{border-color:var(--gold);box-shadow:0 0 18px #f2c14e59}.opp .who{display:flex;align-items:center;gap:6px;font-weight:700;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.opp .mini{display:flex;align-items:center;height:20px;margin-top:3px}.opp .mini i{width:9px;height:14px;border-radius:2px;background:linear-gradient(135deg,#2b5aa8,#1b3d78);border:1px solid #dfe8ff;margin-right:-4px}.opp .mini span{margin-left:10px;font-size:13px;color:var(--muted)}.opp .sc{font-size:13px;color:var(--muted)}.opp .sc em{color:#9ef0b0;font-style:normal}.ticker{text-align:center;font-size:14px;color:var(--muted);min-height:20px;padding:0 12px}.table-mid{flex:1;display:flex;align-items:center;justify-content:center;gap:22px;min-height:150px;padding:6px}.pile-wrap{display:flex;flex-direction:column;align-items:center;gap:6px}.pile-wrap .card{width:76px;height:106px}.lbl{font-size:13px;color:var(--muted);text-align:center}.suit-now b{font-size:18px}.suit-now .blackt{color:#fff}.suit-now .redt{color:#ff6d66}.pass-note{font-size:20px;text-align:center;padding:0 20px}.status{text-align:center;font-size:17px;font-weight:650;padding:4px 12px;min-height:30px}.status.mine{color:var(--gold)}.actions{display:flex;gap:10px;justify-content:center;padding:4px 12px 8px;min-height:58px;flex-wrap:wrap}.suits{display:flex;gap:10px}.suit-btn{font-size:28px;width:62px;height:56px;padding:0;background:var(--card)!important}.suit-btn.redt{color:var(--red)!important}.suit-btn.blackt{color:var(--black)!important}.hand{padding:6px 10px 0;display:flex;flex-direction:column;align-items:center;gap:6px}.hand-row{display:flex;justify-content:center;align-items:flex-end;min-height:96px}.hand .card{flex:none;transition:transform .12s ease;cursor:pointer}.hand .card.sel{transform:translateY(-18px);box-shadow:0 0 0 3px var(--gold),0 6px 14px #0006}.hand .card.dim{filter:brightness(.62)}.hand .card.ok{box-shadow:0 0 0 2px #f2c14ee6}.hand .card.ok.sel{box-shadow:0 0 0 3px var(--gold),0 6px 14px #0006}.mine-score{text-align:center;font-size:14px;color:var(--muted);padding:6px 12px 12px}.watching{text-align:center;color:var(--muted);padding:20px}.card{position:relative;width:66px;height:92px;border-radius:8px;background:var(--card);box-shadow:0 1px #00000040,0 3px 8px #0000004d;color:var(--black);flex:none}.card.red{color:var(--red)}.card .ix{position:absolute;top:4px;left:5px;font-weight:800;font-size:17px;line-height:.95;text-align:center}.card .ix.br{top:auto;left:auto;bottom:4px;right:5px;transform:rotate(180deg)}.card .pip{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;font-size:30px}.card.back{background:repeating-linear-gradient(45deg,#24509a 0,#24509a 6px,#1c4082 6px,#1c4082 12px);border:3px solid #f4f1e8}.card.empty{background:transparent;border:2px dashed var(--line);box-shadow:none;color:var(--muted);display:flex;align-items:center;justify-content:center;font-size:13px}.card.sm{width:46px;height:64px;border-radius:6px}.card.sm .ix{font-size:13px;top:3px;left:4px}.card.sm .ix.br{display:none}.card.sm .pip{font-size:22px;padding-top:8px}.pulse{animation:pulse 1.4s ease-in-out infinite;cursor:pointer}@keyframes pulse{0%,to{box-shadow:0 0 #f2c14ee6,0 3px 8px #0000004d}50%{box-shadow:0 0 0 7px #f2c14e00,0 3px 8px #0000004d}}.fly-in{animation:fly .28s ease-out}@keyframes fly{0%{transform:translateY(40px) scale(.85);opacity:.2}to{transform:none;opacity:1}}.trick{position:relative;width:230px;height:196px}.trick .tc{position:absolute;display:flex;flex-direction:column;align-items:center;font-size:12px;color:var(--muted);gap:2px}.trick .tc .card{width:54px;height:76px}.trick .tc.b{left:50%;bottom:0;transform:translate(-50%)}.trick .tc.t{left:50%;top:0;transform:translate(-50%)}.trick .tc.l{left:0;top:50%;transform:translateY(-50%)}.trick .tc.r{right:0;top:50%;transform:translateY(-50%)}.trick.n3 .tc.l{top:6%;transform:none;left:12%}.trick.n3 .tc.r{top:6%;transform:none;right:12%}.trick.done .tc{opacity:.6}.took{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);text-align:center;font-weight:700;color:var(--gold);text-shadow:0 1px 4px #000}.scrim{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;z-index:20;display:flex;align-items:flex-end;justify-content:center}.sheet{background:#173f31;border:1px solid var(--line);border-radius:22px 22px 0 0;padding:20px 18px calc(22px + env(safe-area-inset-bottom));width:100%;max-width:560px;max-height:88dvh;overflow-y:auto;display:flex;flex-direction:column;gap:12px;animation:up .22s ease-out}@keyframes up{0%{transform:translateY(40px);opacity:0}to{transform:none;opacity:1}}.sheet h2{font-size:22px}.sheet ul{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:8px}.summary{position:fixed;left:0;right:0;bottom:0;margin:0 auto;z-index:15;box-shadow:0 -10px 40px #00000080}.summary.min{max-height:70px;overflow:hidden;padding-bottom:10px}.scores{width:100%;border-collapse:collapse;font-size:16px}.scores th{font-size:12px;color:var(--muted);font-weight:600;text-align:right;padding:4px 6px}.scores td{padding:7px 6px;text-align:right;border-top:1px solid var(--line)}.scores td:first-child{text-align:left;font-weight:650}.scores tr.hi td{color:var(--gold)}.reveal{background:#0003;border-radius:14px;padding:10px}.rv-name{font-weight:700;margin-bottom:6px}.rv-cards{display:flex;flex-wrap:wrap;gap:8px}.grp{display:flex}.grp .card.sm+.card.sm{margin-left:-22px}.grp.loose{opacity:.85;outline:2px dashed rgba(255,120,110,.6);outline-offset:2px;border-radius:6px}.menu-list{display:flex;flex-direction:column;gap:8px}.menu-list .btn{text-align:left}.peek{text-align:center;font-size:14px;color:var(--muted);background:none;border:0;text-decoration:underline;cursor:pointer;padding:2px}#harbor-join-mobile{display:none!important}