:root{--felt: #0f5132;--felt-dark: #0a3a24;--felt-light: #146b43;--ink: #1b1b1b;--paper: #fdfcf8;--card: #fdfcf8;--red: #c62828;--red-on-felt: #ff8a80;--gold: #e8b64a;--accent: #e8b64a;--muted: #6b7a72;--back-a: #7a1f2b;--back-b: #5e1620;--top-gap: calc(env(safe-area-inset-top, 0px) + 16px) ;--display: "Young Serif", Georgia, "Times New Roman", serif;font-family:Figtree,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--ink);background:var(--felt);-webkit-tap-highlight-color:transparent}*{box-sizing:border-box}body{margin:0;min-height:100dvh;background:radial-gradient(ellipse at 50% 35%,var(--felt-light),var(--felt) 60%,var(--felt-dark)) fixed,var(--felt)}button{font:inherit;border:1px solid #c9c9c9;border-radius:10px;padding:10px 14px;background:var(--paper);color:var(--ink);cursor:pointer}button:disabled{opacity:.35;cursor:default}button.primary{background:var(--gold);border-color:#c99a2e;font-weight:700;color:var(--felt-dark)}button.small{padding:4px 10px;font-size:.85rem}button.icon{background:transparent;border:none;color:#fff;font-size:1.3rem;padding:4px 8px}input,select{font:inherit;padding:10px 12px;border-radius:10px;border:1px solid #c9c9c9;width:100%;background:#fff;color:var(--ink)}.red,.suit-red{color:var(--red)}.muted{color:var(--muted)}.muted-on-felt{opacity:.75}.center{text-align:center;padding:2rem;color:#fff}.small{font-size:.85rem}.row{display:flex;gap:8px;align-items:center}.badge{display:inline-block;margin-left:6px;padding:1px 6px;border-radius:6px;background:var(--gold);color:var(--ink);font-size:.7rem;vertical-align:middle}.chip{font-weight:700;border-radius:999px;padding:5px 12px;border:0;background:#ffffffeb;color:var(--ink);white-space:nowrap;font-size:.85rem}.chip.gold{background:var(--gold);color:var(--felt-dark)}.pc{position:absolute;width:var(--w, 58px);height:var(--h, 82px);border-radius:6px;background:var(--card);color:var(--ink);box-shadow:-1px 1px 3px #00000059;border:1px solid #d8d4c8;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}.pc.red{color:var(--red)}.pc .ix{position:absolute;top:3px;left:4px;display:flex;flex-direction:column;align-items:center;line-height:.95;font-weight:800;font-size:calc(var(--w, 58px) * .29)}.pc .ix i{font-style:normal;font-size:.9em}.pc .pip{position:absolute;right:6%;bottom:4%;font-size:calc(var(--w, 58px) * .55);line-height:1;opacity:.9}.pc.back{background:repeating-linear-gradient(45deg,var(--back-a) 0 4px,var(--back-b) 4px 8px);border:2px solid var(--card)}.pc[role=button]{cursor:pointer}.pc.hinted{box-shadow:0 0 0 3px #42a5f5,-1px 1px 3px #00000059}.pc:focus-visible{outline:3px solid var(--gold);outline-offset:1px}.fan{position:relative;flex:none}.fan .pc{left:calc(50% - var(--w) / 2);bottom:8px;transform-origin:50% var(--origin);transform:rotate(var(--a)) translateY(var(--lift, 0px));transition:transform .18s ease,filter .18s ease}.fan .pc.dim{filter:brightness(.82) saturate(.75)}.fan .pc.ok{--lift: -14px}.fan .pc.ok:hover,.fan .pc.ok:focus-visible{--lift: -26px;outline:none}.fan .pc.ok:after,.dummy .pc.ok:after{content:"";position:absolute;inset:-3px;border-radius:8px;box-shadow:0 0 0 2px var(--gold);pointer-events:none}.fan.dealt .pc{animation:fan-in .45s cubic-bezier(.2,.8,.2,1)}@keyframes fan-in{0%{transform:rotate(0) translateY(24px);opacity:.4}}.myfan{height:120px;margin-top:auto}.wide .myfan{height:180px;width:min(100%,760px);margin-left:auto;margin-right:auto}.lobby{max-width:420px;margin:0 auto;padding:calc(var(--top-gap) + 20px) 20px 28px;display:flex;flex-direction:column;gap:14px;min-height:100dvh;color:#fff}.lobby .crest{position:relative;height:112px}.lobby .crest .pc{--w: 58px;--h: 82px;top:14px;left:calc(50% - 29px);transform-origin:50% 160%}.lobby h1{text-align:center;margin:0;font:400 2.1rem/1.05 var(--display)}.lobby h1 small{display:block;font-family:Figtree,system-ui,sans-serif;font-size:.75rem;font-weight:700;letter-spacing:.28em;text-transform:uppercase;color:var(--gold);margin-top:8px}.lobby .tag{text-align:center;margin:0;opacity:.85;font-size:.92rem}.lobby label{display:flex;flex-direction:column;gap:6px;font-weight:600}.lobby .divider{text-align:center;opacity:.8;margin-top:8px}.lobby .code{text-transform:uppercase;letter-spacing:.3em;font-size:1.3rem;text-align:center}.error{color:var(--red-on-felt);text-align:center}.whats-new{margin-top:18px;font-size:.9rem}.whats-new summary{cursor:pointer;font-weight:600;color:var(--gold)}.whats-new h3{font:400 1rem var(--display);margin:12px 0 4px}.whats-new ul{margin:0;padding-left:1.2em;display:grid;gap:4px;line-height:1.4}.sheet .whats-new summary{color:#8a6514}.app{max-width:560px;margin:0 auto;height:100dvh;display:flex;flex-direction:column;color:#fff}.app.wide{max-width:1000px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:8px;flex:none;padding:calc(var(--top-gap) + 4px) 12px 6px;background:#0000004d;font-size:.9rem}.topbar .brand{display:flex;align-items:center;gap:6px}.topbar .m{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:6px;background:var(--gold);color:var(--felt-dark);font:400 15px var(--display)}.topbar .room{font-weight:700;letter-spacing:.08em}.plus{color:#9be7a7}.minus{color:#ffab91}.offline{color:#ffab91;font-weight:700}.contract-bar{display:flex;justify-content:space-between;align-items:center;gap:8px;flex:none;padding:6px 12px;background:#00000029;font-weight:600}.contract-bar .suit-red{color:var(--red-on-felt)}.contract-bar .tricks{font-variant-numeric:tabular-nums}.contract-bar button{color:var(--ink)}.waiting{display:flex;flex-direction:column;gap:12px;align-items:center;padding:28px 18px;text-align:center}.waiting .room-code{font-size:3rem;font-weight:800;letter-spacing:.25em;color:var(--gold)}.waiting code{word-break:break-all;color:#fff}.play-layout{flex:1;min-height:0;display:flex;flex-direction:column;position:relative}.tbl{position:relative;flex:1;min-height:150px;overflow:hidden}.seatfan{position:absolute;width:200px;height:62px}.seatfan .fan{width:100%;height:100%}.seatfan .fan .pc{bottom:0;border-width:2px}.seatfan.top{top:-16px;left:calc(50% - 100px);transform:rotate(180deg)}.seatfan.left{left:-84px;top:calc(50% - 31px);transform:rotate(90deg)}.seatfan.right{right:-84px;top:calc(50% - 31px);transform:rotate(-90deg)}.wide .seatfan{width:300px;height:92px}.wide .seatfan.top{left:calc(50% - 150px);top:-22px}.wide .seatfan.left{left:-118px;top:calc(50% - 46px)}.wide .seatfan.right{right:-118px;top:calc(50% - 46px)}.seatlbl{position:absolute;font-size:.74rem;font-weight:700;white-space:nowrap;padding:1px 8px;border-radius:999px;background:#00000040;z-index:6;max-width:45%;overflow:hidden;text-overflow:ellipsis}.seatlbl .tag{font-weight:500;opacity:.85}.seatlbl.turn{background:var(--gold);color:var(--felt-dark)}.seatlbl.top{top:50px;left:50%;transform:translate(-50%)}.seatlbl.left{left:6px;top:8px}.seatlbl.right{right:6px;top:8px}.seatlbl.bottom{bottom:4px;left:50%;transform:translate(-50%)}.wide .seatlbl{font-size:.85rem}.wide .seatlbl.top{top:76px}.dummy-wrap.top{position:absolute;top:4px;left:0;right:0;display:flex;flex-direction:column;align-items:center;gap:2px;z-index:2}.dummy-wrap.left,.dummy-wrap.right{position:absolute;top:8px;z-index:2;display:flex;flex-direction:column;gap:4px}.dummy-wrap.right{align-items:flex-end}.dummy-wrap.left{left:6px}.dummy-wrap.right{right:6px}.dummy{display:flex;gap:8px;justify-content:center}.dummy.side{flex-direction:column;gap:4px}.dummy-wrap.right .dummy.side{align-items:flex-end}.dcol{position:relative;flex:none}.dcol .pc{left:0;top:0}.dummy.side .dcol .pc{top:0}.dummy .pc.dim{filter:brightness(.82) saturate(.75)}.seatlbl.inflow{position:static;transform:none;max-width:none;align-self:center}.bids{position:absolute;display:flex;gap:3px;z-index:5;max-width:70%;flex-wrap:wrap;justify-content:center}.bids.top{top:72px;left:50%;transform:translate(-50%)}.bids.bottom{bottom:28px;left:50%;transform:translate(-50%)}.bids.left{left:52px;top:50%;transform:translateY(-50%);flex-direction:column}.bids.right{right:52px;top:50%;transform:translateY(-50%);flex-direction:column;align-items:flex-end}.wide .bids.top{top:104px}.wide .bids.left{left:84px}.wide .bids.right{right:84px}.btile{font-weight:800;font-size:.82rem;line-height:1;padding:5px 6px;min-width:32px;text-align:center;border-radius:4px;border:0;background:var(--card);color:var(--ink);box-shadow:0 1px 2px #00000059;opacity:.8;animation:pop .25s ease-out}.wide .btile{font-size:.95rem;padding:6px 8px;min-width:38px}.btile.last,.btile.open{opacity:1;box-shadow:0 0 0 2px var(--gold),0 1px 2px #00000059}.btile.red{color:var(--red)}.btile.pass{background:#cfe8cf}.btile.dbl{background:#f7cccf;color:#8a1c1c}.btile.rdbl{background:#c9ddf3;color:#123e6b}.btile.alert{background-image:linear-gradient(#fff3cd,#fff3cd)}.btile.pending{opacity:.9;box-shadow:0 0 0 2px var(--gold);outline:2px dashed var(--felt-dark);outline-offset:-4px}@keyframes pop{0%{transform:scale(.4);opacity:0}}.trick-area{position:absolute;left:50%;top:52%;width:150px;height:150px;transform:translate(-50%,-50%);z-index:4}.trick-area .pc{--w: 44px;--h: 62px}.trick-area .pc.top{left:calc(50% - 22px);top:0}.trick-area .pc.bottom{left:calc(50% - 22px);bottom:0}.trick-area .pc.left{left:0;top:calc(50% - 31px)}.trick-area .pc.right{right:0;top:calc(50% - 31px)}.wide .trick-area{width:220px;height:200px}.wide .trick-area .pc{--w: 62px;--h: 86px}.wide .trick-area .pc.top,.wide .trick-area .pc.bottom{left:calc(50% - 31px)}.wide .trick-area .pc.left,.wide .trick-area .pc.right{top:calc(50% - 43px)}.trick-banner{position:absolute;left:50%;top:calc(100% + 8px);transform:translate(-50%);white-space:nowrap;overflow:hidden;font-size:.78rem;font-weight:700;background:var(--gold);color:var(--felt-dark);padding:4px 11px;border-radius:999px;border:0}.trick-banner .suit-red{color:var(--red)}.holdbar{position:absolute;left:0;bottom:0;height:3px;width:100%;background:var(--felt-dark);animation:drain linear forwards}@keyframes drain{to{width:0}}.side{flex:none;padding:6px 10px 0;display:flex;flex-direction:column;gap:6px}.bidding-box{display:flex;flex-direction:column;gap:5px}.modes{display:flex;align-items:center;gap:8px;font-size:.78rem}.mode-help{opacity:.75}.seg{display:inline-flex;background:#0000004d;border-radius:999px;padding:2px}.seg button{border:0;background:transparent;color:#fff;padding:3px 11px;border-radius:999px;font-weight:700;font-size:.8rem}.seg button[aria-pressed=true]{background:var(--gold);color:var(--felt-dark)}.gridwrap{position:relative;display:flex;flex-direction:column;gap:5px}.bid-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:5px}.bid-grid.more{position:absolute;left:-6px;right:-6px;top:100%;margin-top:5px;padding:6px;z-index:40;background:#062819f7;border-radius:10px;box-shadow:0 8px 18px #0006}.more-arrow{border:0;border-radius:8px;padding:3px 0;background:#ffffff1f;color:#fff;font-weight:700;font-size:.8rem}.bid{font-weight:800;font-size:1.02rem;padding:7px 0;border-radius:8px;border:1px solid #cfcac0;background:var(--card);touch-action:manipulation;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}.bid.red{color:var(--red)}.bid.nt{font-size:.92rem}.bid:disabled{opacity:.22}.bid.picked{background:var(--gold);border-color:#b8860b}.bid.hinted{box-shadow:0 0 0 3px #42a5f5}.bid.pass{background:#cfe8cf}.bid.dbl{background:#f7cccf;color:#8a1c1c}.bid.rdbl{background:#c9ddf3;color:#123e6b}.bid.pass.picked{background:var(--gold)}.wide .bid{font-size:1.2rem;padding:11px 0}.specials{display:grid;grid-template-columns:2fr 1fr 1fr;gap:5px}.bidnote{min-height:42px;font-size:.84rem;line-height:1.3;background:#00000040;border-radius:8px;padding:6px 9px;display:flex;gap:6px;align-items:center}.bidnote .text{flex:1;min-width:0}.bidnote .text.yours{color:var(--gold);font-weight:700}.bidnote .suit-red,.points .suit-red,.whats-new .suit-red{color:var(--red-on-felt)}.points{display:flex;flex-direction:column;gap:3px;font-size:.78rem;font-variant-numeric:tabular-nums}.pts{display:flex;flex-wrap:wrap;justify-content:center;gap:2px 12px;margin:0}.pts>div{display:flex;gap:4px}.pts dt{opacity:.8}.pts dd{margin:0;font-weight:800}.pts dd.hcp{color:var(--gold)}.need{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:4px 6px}.need b{color:var(--gold)}.tgl{display:inline-flex;align-items:center;gap:4px;background:#00000047;border-radius:999px;padding:2px 9px 2px 5px;font-weight:600;cursor:pointer}.tgl input{width:auto;margin:0;padding:0;accent-color:var(--gold)}.verdict{font-weight:700}.verdict.enough{color:#9be7a7}.verdict.borderline{color:var(--gold)}.verdict.short{color:#ffab91}.play-note{margin-top:2px}.auction-recap summary{cursor:pointer;font-size:.85rem;opacity:.85}.auction{background:var(--paper);color:var(--ink);border-radius:10px;padding:4px;margin-top:4px}.auction table{width:100%;border-collapse:collapse;table-layout:fixed}.auction th{font-size:.7rem;color:var(--muted);font-weight:600}.auction td{text-align:center;padding:1px}.auction td.pending{color:var(--muted)}.auction .call{border:none;background:transparent;padding:2px 4px;font-weight:700;width:100%;border-radius:6px}.auction .call.alert{background:#fff3cd}.auction .call.selected{outline:2px solid var(--gold)}.explanation{margin-top:4px;padding:6px 8px;background:#f2f6f3;border-radius:8px;font-size:.85rem}.deal-overlay{position:absolute;inset:0;z-index:50;background:radial-gradient(ellipse at 50% 40%,var(--felt-light),var(--felt) 70%)}.deal-overlay .flyer{--w: 34px;--h: 48px;left:calc(50% - 17px);top:calc(50% - 24px)}.deal-overlay .skip{position:absolute;left:50%;bottom:24px;transform:translate(-50%);z-index:70}.wide .side{width:100%;max-width:680px;margin:0 auto;padding:10px 16px 0;gap:8px}.wide .points{font-size:.9rem}.wide .bidnote{font-size:.95rem}.wide .modes{font-size:.88rem}.result{background:var(--paper);color:var(--ink);margin:8px;border-radius:12px;padding:12px;display:flex;flex-direction:column;gap:8px;overflow-y:auto}.result h2{margin:0;font:400 1.4rem var(--display)}.result .big{font-size:1.3rem;font-weight:700}.result .score{font-size:1.2rem;font-weight:700}.result .score.plus{color:#2e7d32}.result .score.minus{color:var(--red)}.all-hands{display:grid;grid-template-columns:1fr 1fr;gap:6px}.all-hands .seat-label{color:var(--muted);font-size:.8rem}.hand{background:var(--paper);color:var(--ink);border-radius:10px;padding:4px 6px}.suit-row{display:flex;align-items:center;flex-wrap:wrap;gap:3px;min-height:22px}.suit{width:14px;font-size:.95rem;text-align:center}.void{color:var(--muted);padding-left:4px}.hand .card{min-width:18px;height:22px;padding:0 2px;font-size:.9rem;border:none;background:transparent;font-weight:700}.hand .card:disabled{opacity:1;color:inherit}.hand .card.red{color:var(--red)}.dd{border-collapse:collapse;font-size:.85rem}.dd td,.dd th{border:1px solid #ddd;padding:2px 8px;text-align:center}.review{align-self:stretch;text-align:left;border-top:1px solid #e3e3e3;padding-top:6px}.review h3{margin:4px 0}.review h4{margin:10px 0 4px}.review p{margin:4px 0}.review-head{display:flex;justify-content:space-between;align-items:baseline;gap:8px}.review-head label{display:flex;gap:4px;align-items:center;color:var(--muted)}.review-head input{width:auto}.review-list{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:4px;font-size:.92rem}.review-list li.me,.lost-summary tr.me{font-weight:600}.lost-summary{border-collapse:collapse;font-size:.9rem}.lost-summary td{padding:1px 10px 1px 0}.minus-ink{color:var(--red)}.history{display:flex;gap:10px;overflow-x:auto;font-size:.75rem;padding:4px 10px calc(env(safe-area-inset-bottom) + 4px);opacity:.8;flex:none}.sheet-backdrop{position:fixed;inset:0;background:#00000073;display:flex;align-items:flex-end;z-index:80}.sheet{background:var(--paper);color:var(--ink);width:100%;max-width:560px;margin:0 auto;max-height:calc(100dvh - var(--top-gap) - 24px);overflow-y:auto;border-radius:16px 16px 0 0;margin-top:var(--top-gap);padding:16px 16px calc(env(safe-area-inset-bottom) + 16px)}.sheet h2{margin-top:0;font:400 1.4rem var(--display)}.sheet label{display:block;margin-top:10px}.sheet select{margin-top:4px}.sheet input[type=range]{width:100%;padding:0}.range-labels{display:flex;justify-content:space-between;font-size:.75rem;color:var(--muted)}.conventions{list-style:none;padding:0;display:flex;flex-direction:column;gap:10px}.conventions .learn{margin:4px 0 0 28px}.practice-bar{display:flex;justify-content:space-between;align-items:center;gap:8px;flex:none;padding:4px 12px;background:#1565c0;font-size:.9rem;font-weight:600}.practice-bar button{color:var(--ink)}.lesson h2{margin:10px 0 6px}.lesson p{line-height:1.45}.lesson .example{background:#f3f1ea;border-radius:10px;padding:6px 10px;margin:8px 0}.lesson .example h4{margin:4px 0}.lesson .example ol{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:3px}.lesson .example-seat{display:inline-block;min-width:3.2em;color:var(--muted)}.lesson .example p{margin:4px 0}.sheet .toggle{display:flex;gap:10px;align-items:flex-start;margin-top:14px}.sheet .toggle input{width:auto;margin-top:4px}.conventions label{display:flex;gap:10px;align-items:flex-start}.conventions input{width:auto;margin-top:4px}.sheet code{word-break:break-all}.toast{position:fixed;left:50%;bottom:20px;transform:translate(-50%);background:#333;color:#fff;padding:10px 16px;border-radius:10px;z-index:90;max-width:90vw}@media(prefers-reduced-motion:reduce){.fan .pc,.btile,.fan.dealt .pc{transition:none;animation:none}.holdbar{animation:none}}
