:root{--bg:#EEF2F8;--bg2:#DFE8F7;--surface:#FFFFFF;--surface-2:#F3F6FB;--ink:#131C2E;--muted:#58657C;--line:#DCE3EE;--accent:#1F5FD6;--accent-ink:#FFFFFF;--accent-soft:#E4EDFC;--gold:#C9A227;--gold-soft:#F6EBC4;--gold-ink:#6E5200;--red:#C4353B;--suit-red:#C62828;--good:#15803D;--bad:#C4353B;--head1:#0B2352;--head2:#143A80;--head-ink:#F2F6FF;--head-muted:#B5C6E6;--felt1:#1C58A6;--felt2:#0B2A5C;--felt-ink:#F3F7FF;--felt-muted:#C3D5F2;--card:#FFFDF7;--card-line:#D8D0BF;--card-red:#C62828;--card-black:#1B1D1C;--shadow:0 1px 2px rgba(16,28,52,.06),0 8px 24px rgba(16,28,52,.08);--radius:18px;--cw:54px;--ch:78px;--font:"Bricolage Grotesque",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color-scheme:light}@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#080D18;--bg2:#0E1A33;--surface:#0F1727;--surface-2:#16213A;--ink:#E8EEF9;--muted:#97A6C0;--line:#233252;--accent:#5B9BFF;--accent-ink:#06122A;--accent-soft:#16294D;--gold:#E0BC4A;--gold-soft:#3A3113;--gold-ink:#F0CF63;--red:#E5484D;--suit-red:#FF7B7B;--good:#4ADE80;--bad:#FF8A80;--head1:#050B18;--head2:#0D1F45;--head-ink:#EAF0FB;--head-muted:#93A8CC;--felt1:#16498C;--felt2:#071C42;--shadow:0 1px 2px rgba(0,0,0,.4),0 10px 28px rgba(0,0,0,.35);color-scheme:dark}}:root[data-theme=dark]{--bg:#080D18;--bg2:#0E1A33;--surface:#0F1727;--surface-2:#16213A;--ink:#E8EEF9;--muted:#97A6C0;--line:#233252;--accent:#5B9BFF;--accent-ink:#06122A;--accent-soft:#16294D;--gold:#E0BC4A;--gold-soft:#3A3113;--gold-ink:#F0CF63;--red:#E5484D;--suit-red:#FF7B7B;--good:#4ADE80;--bad:#FF8A80;--head1:#050B18;--head2:#0D1F45;--head-ink:#EAF0FB;--head-muted:#93A8CC;--felt1:#16498C;--felt2:#071C42;--shadow:0 1px 2px rgba(0,0,0,.4),0 10px 28px rgba(0,0,0,.35);color-scheme:dark}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{margin:0;min-height:100vh;background:var(--bg);background-image:radial-gradient(1100px 520px at 50% -160px,var(--bg2),transparent);background-repeat:no-repeat;color:var(--ink);font-family:var(--font);font-size:15px;line-height:1.45;-webkit-font-smoothing:antialiased}.wrap{width:100%;max-width:560px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right))}main.wrap{padding-bottom:calc(36px + env(safe-area-inset-bottom))}section{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:16px;margin-top:14px;box-shadow:var(--shadow)}h2{font-size:17px;font-weight:800;letter-spacing:-.01em;margin:0 0 8px}p{margin:0 0 10px}.hint{color:var(--muted);font-size:14px;margin:0 0 12px}.muted{color:var(--muted)}.center{text-align:center}.warn{margin:10px 0 0;padding:10px 12px;border-radius:12px;background:color-mix(in srgb,var(--red) 11%,var(--surface));color:var(--red);font-weight:600;font-size:14px}code.k{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;background:var(--surface-2);padding:2px 6px;border-radius:6px;font-size:.9em}button{font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;transition:transform .12s ease,background .15s ease,box-shadow .15s ease,filter .15s ease}button:disabled{cursor:not-allowed;opacity:.5}:focus-visible{outline:3px solid var(--gold);outline-offset:2px}header.top{position:sticky;top:0;z-index:20;background:linear-gradient(160deg,var(--head1),var(--head2));color:var(--head-ink);padding:calc(env(safe-area-inset-top) + 12px) 0 14px;box-shadow:0 6px 24px #0000002e;border-bottom:1px solid rgba(224,188,74,.25)}.brand{display:flex;align-items:center;justify-content:space-between;gap:12px}.brand h1{margin:0;font-size:20px;font-weight:800;letter-spacing:-.015em;display:flex;align-items:baseline;gap:8px;min-width:0}.brand h1:before{content:"♠";color:var(--gold);font-size:18px;transform:translateY(1px)}.brand h1 small{font-size:13px;font-weight:600;color:var(--head-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hbtns{display:flex;gap:8px;flex:none}button.ghost{min-height:40px;min-width:40px;padding:0 14px;border-radius:999px;border:1px solid rgba(255,255,255,.2);background:#ffffff1a;color:var(--head-ink);font-weight:700;font-size:14px}button.ghost:hover{background:#ffffff2e}.hsub{color:var(--head-muted);margin:8px 0 0;font-size:14px}.hlines{margin-top:10px;display:flex;flex-direction:column;gap:6px;font-size:13px}.hr{display:flex;flex-wrap:wrap;gap:6px;align-items:center}.hr>span{padding:4px 10px;border-radius:999px;background:#ffffff14;border:1px solid rgba(255,255,255,.12);overflow-wrap:anywhere}.hr b{font-weight:800}.hsym{font-size:15px;margin:0 3px 0 4px;color:#fff}.hsym.red,.hred{color:#ff9b9b}.hm{color:var(--head-muted)}.codebox{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px;padding:12px 14px;border-radius:16px;background:#ffffff12;border:1px solid rgba(255,255,255,.14)}.codebig{font-size:40px;font-weight:800;letter-spacing:.18em;color:var(--gold);line-height:1.1}label.f{display:block;font-weight:700;font-size:14px;margin-bottom:8px}input.t{width:100%;min-height:50px;border-radius:14px;border:1px solid var(--line);background:var(--surface-2);color:var(--ink);font:inherit;font-size:17px;padding:0 14px}input.t:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}input.t.code{text-transform:uppercase;letter-spacing:.35em;text-align:center;font-weight:800;font-size:24px}select{width:100%;min-height:48px;border-radius:12px;border:1px solid var(--line);background:var(--surface-2);color:var(--ink);font:inherit;padding:0 12px}button.primary{display:block;width:100%;margin-top:14px;min-height:50px;border:0;border-radius:14px;background:var(--accent);color:var(--accent-ink);font-weight:800;font-size:16px;box-shadow:0 6px 16px color-mix(in srgb,var(--accent) 30%,transparent)}button.primary:hover:not(:disabled){filter:brightness(1.07)}button.primary:active:not(:disabled),button.secondary:active:not(:disabled){transform:translateY(1px) scale(.99)}button.secondary{display:block;min-height:48px;padding:0 16px;border-radius:14px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font-weight:700;font-size:15px}button.secondary:hover:not(:disabled){background:var(--surface-2)}button.secondary.armed{border-color:var(--red);color:var(--red);background:color-mix(in srgb,var(--red) 8%,var(--surface))}button.linkish{background:none;border:0;padding:6px 0;color:var(--accent);font-weight:700;text-decoration:underline;text-underline-offset:3px}.row2{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}.row2 button{width:100%;margin-top:0}.seg{display:flex;gap:4px;padding:4px;background:var(--surface-2);border:1px solid var(--line);border-radius:14px}.seg button{flex:1;min-height:40px;padding:0 8px;border:0;border-radius:10px;background:transparent;color:var(--muted);font-weight:700;font-size:14px}.seg button[aria-pressed=true]{background:var(--surface);color:var(--accent);box-shadow:var(--shadow)}.seg button:disabled{opacity:.6;cursor:default}.seg button:disabled[aria-pressed=true]{opacity:1}.switch{position:relative;flex:none;width:52px;height:30px;padding:0;border:0;border-radius:999px;background:var(--line)}.switch:after{content:"";position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;background:#fff;box-shadow:0 1px 3px #0000004d;transition:transform .2s ease}.switch[aria-checked=true]{background:var(--accent)}.switch[aria-checked=true]:after{transform:translate(22px)}.stepper{display:inline-flex;align-items:center;gap:6px;flex:none;padding:4px;border-radius:999px;background:var(--surface-2);border:1px solid var(--line)}.stepper button{width:40px;height:40px;border:0;border-radius:50%;background:var(--surface);color:var(--ink);font-size:20px;font-weight:700;box-shadow:var(--shadow)}.stepper output{min-width:3.2ch;text-align:center;font-weight:800;font-size:18px;font-variant-numeric:tabular-nums}.setting{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-top:1px solid var(--line)}.setting>div:first-child{font-weight:600}.setting small{display:block;margin-top:2px;color:var(--muted);font-size:13px;font-weight:500}.setting.block{flex-direction:column;align-items:stretch}.prow{display:flex;align-items:center;gap:10px;margin:0 -6px;padding:10px 12px;border-radius:12px}.prow+.prow{margin-top:2px}.prow.turn{background:var(--accent-soft);box-shadow:inset 3px 0 0 var(--accent)}.dot{flex:none;width:10px;height:10px;border-radius:50%;background:var(--muted);opacity:.45}.dot.on{background:var(--good);opacity:1;box-shadow:0 0 0 3px color-mix(in srgb,var(--good) 22%,transparent)}.pname{flex:1;min-width:0;font-weight:600;line-height:1.3;overflow-wrap:anywhere}.pname small{display:block;margin-top:2px;color:var(--muted);font-size:13px;font-weight:500}.tag{display:inline-block;vertical-align:middle;margin-left:6px;padding:2px 8px;border-radius:999px;font-size:11px;font-weight:700;white-space:nowrap;background:var(--surface-2);color:var(--muted);border:1px solid var(--line)}.tag.b{background:var(--gold-soft);color:var(--gold-ink);border-color:transparent}.tag.p{background:var(--accent-soft);color:var(--accent);border-color:transparent}.tot{min-width:3ch;text-align:right;font-weight:800;font-size:18px;font-variant-numeric:tabular-nums}.pos{color:var(--good)}.neg{color:var(--bad)}.zero{color:var(--muted)}.mv{display:flex;gap:6px;flex:none}.mv button{width:40px;height:40px;border-radius:10px;border:1px solid var(--line);background:var(--surface-2);color:var(--ink);font-size:16px;font-weight:700}.mshead{margin-bottom:10px;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}.msgrid{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:8px}.msgrid>div{padding:10px 8px;border-radius:12px;background:var(--surface-2);text-align:center}.msgrid b{display:block;font-size:22px;font-weight:800;font-variant-numeric:tabular-nums}.msgrid small{display:block;margin-top:2px;color:var(--muted);font-size:12px}.msnote{margin:10px 0 0;font-weight:600}.feltbox{position:relative;overflow:hidden;margin-top:14px;min-height:180px;padding:22px 16px;border-radius:24px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;color:var(--felt-ink);background:radial-gradient(120% 90% at 50% 15%,var(--felt1),var(--felt2));box-shadow:inset 0 0 0 6px #00000024,inset 0 14px 40px #00000047,var(--shadow)}.feltbox:before{content:"";position:absolute;inset:9px;border-radius:17px;border:1px solid rgba(224,188,74,.35);pointer-events:none}.feltbox.compact{min-height:0;padding:18px 16px}.tmsg{position:relative;text-align:center;font-weight:700;font-size:17px}.tmsg small{display:block;margin-top:4px;color:var(--felt-muted);font-size:13px;font-weight:500}.winmsg{display:flex;flex-direction:column;align-items:center;gap:2px}.wtitle{color:var(--gold);font-weight:800;font-size:19px}.wsub{font-size:14px;font-weight:600}.wsub.light{color:var(--felt-muted);font-weight:500;font-size:13px}.trick{position:relative;display:flex;flex-wrap:wrap;justify-content:center;gap:12px 14px}.tcard{display:flex;flex-direction:column;align-items:center;gap:6px;animation:deal .28s cubic-bezier(.2,.8,.3,1.2)}.tcard .n{max-width:84px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--felt-muted);font-size:12px;font-weight:600}.tcard.win .card{transform:translateY(-4px) scale(1.06);box-shadow:0 0 0 3px var(--gold),0 0 26px #e0bc4a99}.tcard.win .card.trumpc{box-shadow:inset 0 0 0 2px var(--gold),0 0 0 3px var(--gold),0 0 26px #e0bc4a99}.tcard.win .n{color:var(--gold)}@keyframes deal{0%{opacity:0;transform:translateY(14px) scale(.92)}to{opacity:1;transform:none}}.card{position:relative;display:inline-flex;align-items:center;justify-content:center;width:var(--cw);height:var(--ch);border-radius:9px;background:linear-gradient(180deg,#FFFFFF,var(--card));border:1px solid var(--card-line);color:var(--card-black);line-height:1;-webkit-user-select:none;user-select:none;box-shadow:0 1px 1px #00000014,0 5px 12px #00000024;transition:transform .15s ease,box-shadow .15s ease}.card.red{color:var(--card-red)}.card .cr{position:absolute;top:6px;left:7px;font-weight:800;font-size:calc(var(--cw) * .3);letter-spacing:-.03em}.card .cs{font-size:calc(var(--cw) * .56);transform:translateY(12%)}.card.trumpc{box-shadow:inset 0 0 0 2px var(--gold),0 5px 12px #00000024}.card.trumpc:after{content:"";position:absolute;top:7px;right:7px;width:7px;height:7px;border-radius:50%;background:var(--gold)}.hand{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;padding:10px 0 2px}.hand button{padding:0;border:0;background:none;border-radius:10px}.hand button:disabled{opacity:1;cursor:default}.hand button:not(:disabled):hover .card{transform:translateY(-5px)}.hand button:not(:disabled) .card{box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 55%,transparent),0 5px 12px #00000024}.hand button.sel .card{transform:translateY(-14px);box-shadow:0 0 0 3px var(--gold),0 12px 22px #00000047}.hand button.dim .card{opacity:.4;filter:grayscale(.7);box-shadow:none}.yourturn{display:flex;align-items:center;gap:10px;color:var(--ink);font-weight:800;font-size:16px;line-height:1.3}.yourturn:before{content:"";flex:none;width:10px;height:10px;border-radius:50%;background:var(--gold);animation:ping 1.8s ease-out infinite}@keyframes ping{0%{box-shadow:0 0 color-mix(in srgb,var(--gold) 60%,transparent)}to{box-shadow:0 0 0 10px transparent}}section:has(.yourturn){border-color:color-mix(in srgb,var(--gold) 55%,var(--line));box-shadow:0 0 0 1px color-mix(in srgb,var(--gold) 30%,transparent),var(--shadow)}.bidrow{display:flex;align-items:center;gap:12px;margin-top:12px}.bidrow button.primary{margin-top:0;flex:1}.suitbtns{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:8px 0 4px}.suitbtns button{display:flex;flex-direction:column;align-items:center;gap:3px;min-height:66px;border-radius:14px;border:2px solid var(--line);background:var(--surface-2);color:var(--ink);font-size:26px;line-height:1}.suitbtns button.red{color:var(--suit-red)}.suitbtns button small{color:var(--muted);font-size:11px;font-weight:700}.suitbtns button[aria-pressed=true]{border-color:var(--accent);background:var(--accent-soft)}.sel2{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:8px}.res{display:grid;grid-template-columns:1fr auto auto auto;align-items:center;margin-top:4px}.res>span{padding:9px 6px;border-bottom:1px solid var(--line)}.res .h{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}.res .r{text-align:right;font-variant-numeric:tabular-nums}.banner{display:flex;align-items:center;gap:14px}.banner h2{margin:0;font-size:24px}.cup{font-size:50px;line-height:1;filter:drop-shadow(0 6px 12px rgba(201,162,39,.45))}.tablewrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--line);border-radius:12px}table{width:100%;border-collapse:collapse;font-size:13px;font-variant-numeric:tabular-nums}th,td{padding:8px 10px;text-align:center;white-space:nowrap;border-bottom:1px solid var(--line)}th{background:var(--surface-2);color:var(--muted);font-size:12px;font-weight:700}th:first-child,td:first-child{position:sticky;left:0;text-align:left;background:var(--surface)}thead th:first-child,tfoot td:first-child{background:var(--surface-2)}tfoot td{background:var(--surface-2);font-weight:800}.s{margin-right:4px;color:var(--muted);font-size:11px}.toast{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom));z-index:50;transform:translate(-50%);max-width:min(92vw,480px);padding:12px 18px;border-radius:14px;background:#0d1526;color:#f2f7f4;font-weight:600;box-shadow:0 12px 32px #00000052;border:1px solid rgba(224,188,74,.3);animation:toastin .2s ease}@keyframes toastin{0%{opacity:0;transform:translate(-50%,8px)}to{opacity:1;transform:translate(-50%)}}@media(max-width:370px){:root{--cw:47px;--ch:68px}.hand{gap:6px}.codebig{font-size:34px}}@media(min-width:640px){:root{--cw:62px;--ch:88px}}@media(min-width:1024px){:root{--cw:70px;--ch:100px}body:has(main.tlayout) header.top .wrap,main.tlayout{max-width:1200px}main.tlayout{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:0 24px;align-items:start}.feltbox{min-height:360px;padding:36px 28px}.trick{gap:18px 22px}.tcard .n{max-width:120px;font-size:13px}.hand{gap:10px}body:has(.codebig) header.top .wrap,body:has(.codebig) main.wrap{max-width:1000px}body:has(.codebig) main.wrap{display:grid;grid-template-columns:1fr 1fr;gap:0 20px;align-items:start}body:has(.codebig) main.wrap>button[data-leave]{grid-column:1/-1}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}