*{box-sizing:border-box}body{margin:0;font:16px/1.5 system-ui,sans-serif;color:#202622}header{display:flex;justify-content:space-between;align-items:center;padding:20px 5%;border-bottom:1px solid #dfe4df}main{max-width:1240px;margin:auto;padding:30px 22px}h1{font-size:clamp(36px,6vw,54px);margin:5px 0}.intro p{margin:6px 0 22px}.eyebrow{font-size:12px;letter-spacing:.12em}.settings{display:flex;gap:12px;flex-wrap:wrap;align-items:end;padding:16px;border:1px solid #dfe4df;border-radius:12px 12px 0 0}label{display:grid;font-size:12px;font-weight:650;gap:5px}select,button{font:inherit;border:1px solid #bbc8bd;border-radius:7px;padding:10px;min-height:44px}button{cursor:pointer}button:disabled{cursor:default;opacity:.48}.buttons{display:flex;gap:8px;flex-wrap:wrap}.matchline{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:13px;padding:12px;background:#f6f8f5}#table{--felt:#184d3c;--felt-dark:#10362b;position:relative;height:450px;background:radial-gradient(ellipse at center,var(--felt),var(--felt-dark));border:12px solid #49352a;border-radius:90px;color:#fff5de;box-shadow:inset 0 0 0 3px #b59a6277,inset 0 0 70px #0005}.walnut{--felt:#744b32!important;--felt-dark:#3a251d!important}.midnight{--felt:#293e53!important;--felt-dark:#111f2e!important}.paper{--felt:#e8e7de!important;--felt-dark:#cecec0!important;color:#24362a!important}#table .seat{position:absolute;text-align:center;font-size:13px;z-index:2;padding:6px 12px;border:1px solid transparent;border-radius:12px;background:#0002;max-width:165px}.seat strong,.seat span{display:block}.seat.active{border-color:#f3d28a!important;box-shadow:0 0 0 3px #f3d28a33}.north{left:50%;top:14px;transform:translateX(-50%)}.south{left:50%;bottom:8px;transform:translateX(-50%)}.west{left:14px;top:37%}.east{right:14px;top:37%}.card-backs{height:40px;display:flex;justify-content:center;margin:8px 10px 0}.card-backs i{width:27px;height:36px;border:2px solid #fff8e6;border-radius:4px;margin-left:-10px;background:repeating-linear-gradient(45deg,#274a78 0 2px,#183456 2px 5px);box-shadow:1px 2px 3px #0005}.red .card-backs i{background:repeating-linear-gradient(45deg,#8c2f40 0 2px,#551b2a 2px 5px)}.plain .card-backs i{background:#25322e}.center{position:absolute;inset:118px 160px 68px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px}#status{text-align:center;margin:6px 0;font-size:14px;min-height:22px;color:inherit!important}#trick{height:160px;min-width:280px;display:flex;justify-content:center;align-items:center;gap:10px}.played{text-align:center;animation:deal .22s ease-out}.played small{display:block;margin-top:4px}.played.player0{transform:rotate(-5deg)}.played.player1{transform:rotate(6deg)}.played.player2{transform:rotate(-3deg)}.played.player3{transform:rotate(4deg)}.card{position:relative;width:76px;height:112px;min-width:76px;padding:0;background:#fffdf8!important;color:#182225!important;border:1px solid #d8d3c7!important;border-radius:7px!important;box-shadow:0 3px 5px #0005!important;font-family:Georgia,'Times New Roman',serif!important;line-height:1!important;flex:none;touch-action:pan-x}.card.red-suit{color:#b12738!important}.corner{position:absolute;display:grid;gap:1px;font-size:16px;z-index:1}.corner.top{left:5px;top:5px}.corner.bottom{right:5px;bottom:5px;transform:rotate(180deg)}.corner span{font-size:13px}.pips{position:absolute;inset:17px 13px;font-size:20px}.pips>span{position:absolute;transform:translate(-50%,-50%)}.pips.court{display:grid;place-items:center;font-size:42px}.court:not(:empty){border:1px solid currentColor;border-radius:3px}#hand{display:flex;gap:7px;padding:18px 10px 14px;overflow-x:auto;overscroll-behavior-x:contain;scroll-padding-inline:10px;min-height:148px;background:#f3f1e9;border:1px solid #deded2;touch-action:pan-x;scrollbar-width:thin}#hand .card{cursor:pointer}body[data-skyvison-theme] #hand .card:disabled{opacity:.5;filter:saturate(.65)}body[data-skyvison-theme] #hand .card.selected{transform:translateY(-9px);outline:3px solid #bd830e;outline-offset:1px;opacity:1}.handbar{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 2px 8px}.handbar span{font-size:12px;display:block;color:#617063}.handbar strong{font-size:17px}#bid-panel{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap}#bid-panel[hidden],#next[hidden],#veil[hidden]{display:none}#bid-panel label{color:inherit}#bid{color:#202622;background:#fff!important;min-width:65px}#suggestion{font-size:11px;max-width:220px}#coach{font-size:14px;min-height:22px;color:#52613e}.guide{max-width:880px;margin:32px 0}.guide p{color:#59665c;line-height:1.8}summary{cursor:pointer;padding:12px 0;font-weight:650}table{border-collapse:collapse;width:100%;font-size:14px;min-width:420px}th,td{text-align:left;padding:10px;border-bottom:1px solid #dfe4df}.score-scroll{overflow-x:auto}#last-trick{font-size:13px}#history li{margin:8px 0;font-size:14px}#veil{position:absolute;inset:0;background:#10251cf5;z-index:5;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:70px;padding:25px;text-align:center}#veil h2,#veil p{color:white!important}body.game-full{overflow:hidden}#player:fullscreen,#player.full-window{background:#fff;overflow:auto;padding:12px;display:flex;flex-direction:column;min-height:100dvh;width:100%;height:100dvh}#player.full-window{position:fixed;inset:0;z-index:9999}#player:fullscreen #table,#player.full-window #table{flex:1;min-height:320px}#player:fullscreen .settings,#player.full-window .settings{padding:6px;gap:6px}#player:fullscreen details,#player.full-window details{display:none}#player:fullscreen #coach,#player.full-window #coach{margin:3px 0}button:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #bd830e!important;outline-offset:3px}@keyframes deal{from{opacity:0;translate:0 -10px}to{opacity:1;translate:0 0}}@media(prefers-reduced-motion:reduce){.played{animation:none}*{scroll-behavior:auto!important}}@media(max-width:700px){main{padding:22px 10px}.settings{gap:8px;padding:12px}.settings label{flex:1 1 100px}.settings select{width:100%}.settings .buttons{width:100%}.settings button{flex:1;font-size:12px}#table{height:440px;border-width:7px;border-radius:38px}.center{inset:125px 14px 65px}.west,.east{top:20%;font-size:10px!important;padding:5px!important;max-width:100px!important}.west{left:8px}.east{right:8px}.north{top:6px}.card-backs{height:25px;margin-top:4px}.card-backs i{width:18px;height:24px}.card-backs+small{font-size:10px}#trick{gap:5px;min-width:0;width:100%;height:145px}#trick .card{width:62px;min-width:62px;height:94px}#trick .corner{font-size:14px}#trick .pips{font-size:17px;inset:17px 9px}#trick .court{font-size:32px}.played small{font-size:11px}.handbar{align-items:start}.handbar .buttons{flex-wrap:nowrap}.handbar button{font-size:13px;padding:8px;white-space:nowrap}#hand{gap:8px}#bid-panel button{font-size:13px;padding:8px}#status{font-size:13px}#veil{border-radius:25px}.matchline{font-size:11px;padding:8px}#saved{font-size:10px}}@media(max-height:520px) and (min-width:600px){#player:fullscreen .settings label,#player.full-window .settings label{display:none}#player:fullscreen #table,#player.full-window #table{min-height:220px;border-radius:30px}#player:fullscreen .center,#player.full-window .center{inset:45px 155px 25px}#player:fullscreen .north,#player.full-window .north{left:17%;top:5px}#player:fullscreen .south,#player.full-window .south{left:17%;bottom:5px}#player:fullscreen .west,#player.full-window .west{left:8px;top:35%}#player:fullscreen .east,#player.full-window .east{right:8px;top:35%}#player:fullscreen #trick,#player.full-window #trick{height:105px}#player:fullscreen #trick .card,#player.full-window #trick .card{height:84px;width:58px;min-width:58px}#player:fullscreen #hand,#player.full-window #hand{min-height:105px;padding:12px 8px 6px}#player:fullscreen #hand .card,#player.full-window #hand .card{height:84px;width:58px;min-width:58px}#player:fullscreen .handbar,#player.full-window .handbar{padding:3px 0}#player:fullscreen .handbar span,#player.full-window .handbar span{display:none}#player:fullscreen .pips,#player.full-window .pips{font-size:15px;inset:16px 9px}#player:fullscreen .court,#player.full-window .court{font-size:30px}}
body[data-skyvison-theme] #hand .card:disabled{opacity:1;filter:none}body[data-skyvison-theme] #hand .card.illegal{opacity:.42;filter:saturate(.65)}
@media(max-height:520px) and (min-width:600px){#player:fullscreen,#player.full-window{display:grid;grid-template-columns:minmax(0,1fr) 225px;grid-template-rows:44px 24px minmax(0,1fr) 46px;gap:4px;min-height:0;padding:6px}#player:fullscreen .settings,#player.full-window .settings{grid-column:1/-1;grid-row:1;padding:0;border:0}#player:fullscreen .settings .buttons,#player.full-window .settings .buttons{width:auto}#player:fullscreen .matchline,#player.full-window .matchline{grid-column:1/-1;grid-row:2;padding:0}#player:fullscreen #table,#player.full-window #table{grid-column:1;grid-row:3/5;min-height:0;height:100%;border-width:5px}#player:fullscreen #hand,#player.full-window #hand{grid-column:2;grid-row:3;display:grid;grid-template-columns:repeat(3,58px);align-content:start;justify-content:center;gap:8px;min-height:0;height:100%;overflow:auto;touch-action:pan-y}#player:fullscreen .handbar,#player.full-window .handbar{grid-column:2;grid-row:4;padding:0}#player:fullscreen .handbar>div:first-child,#player.full-window .handbar>div:first-child{display:none}#player:fullscreen #coach,#player.full-window #coach{display:none}#player:fullscreen .center,#player.full-window .center{inset:40px 105px 30px}#player:fullscreen .seat,#player.full-window .seat{font-size:10px;max-width:105px;padding:2px 4px}#player:fullscreen .card-backs,#player.full-window .card-backs{display:none}#player:fullscreen .north,#player.full-window .north{left:50%;top:2px}#player:fullscreen .south,#player.full-window .south{left:50%;bottom:2px}#player:fullscreen .west,#player.full-window .west{top:40%}#player:fullscreen .east,#player.full-window .east{top:40%}#player:fullscreen #trick,#player.full-window #trick{gap:3px}#player:fullscreen #trick .card,#player.full-window #trick .card{width:48px;min-width:48px;height:75px}#player:fullscreen #status,#player.full-window #status{font-size:11px}#player:fullscreen #suggestion,#player.full-window #suggestion{display:none}}
body[data-skyvison-theme] #player .card.red-suit{color:#b12738!important}body[data-skyvison-theme] #player .card.black-suit{color:#182225!important}
.online-panel{border:1px solid #dfe4df;border-radius:12px;padding:20px;margin:24px 0;background:#f7f8f6}.online-panel>p{font-size:14px;color:#59665c}.online-heading,.online-options,.room-top{display:flex;gap:10px;flex-wrap:wrap;align-items:end}.online-heading{align-items:center}.online-heading h2{margin:0 auto 0 0}.online-options label{flex:1 1 130px;max-width:220px}.online-options input{font:inherit;min-width:0;min-height:44px;padding:10px;width:100%;border:1px solid #b6c4b9;border-radius:6px;background:white}#online-status{min-height:24px;color:#27533b;font-weight:600}#online-players{padding-left:22px;display:flex;gap:20px;flex-wrap:wrap}#online-players li{font-size:14px}#online-players button{margin-left:6px;min-height:36px;font-size:12px;padding:6px}.room-top{align-items:center;padding-top:12px;border-top:1px solid #dfe4df}.room-top a{padding:8px}#series-score{padding:14px 0;font-weight:650;font-size:14px}#turn-clock{font-size:12px}.dialog-heading{display:flex;align-items:center;justify-content:space-between;gap:20px}#ratings-dialog{border:1px solid #dfe4df;border-radius:12px;max-width:min(720px,96vw);max-height:90dvh;overflow:auto;padding:22px}#ratings-dialog p{font-size:14px}#ratings-dialog::backdrop{background:#11251dcc}#online-room[hidden],#online-start[hidden],#online-next-match[hidden],#cancel-queue[hidden],#player[hidden]{display:none!important}
.played{animation:none}.played.fresh-card{animation:card-arrive .38s ease-out both}.player0{--from-x:0px;--from-y:110px}.player1{--from-x:140px;--from-y:0px}.player2{--from-x:0px;--from-y:-110px}.player3{--from-x:-140px;--from-y:0px}.deal-card{animation:hand-deal .4s ease-out backwards}#trick.collecting .played{animation:take-trick .3s .7s ease-in both}@keyframes card-arrive{from{opacity:0;translate:var(--from-x) var(--from-y);scale:.82}to{opacity:1;translate:0 0;scale:1}}@keyframes hand-deal{from{opacity:0;translate:0 45px;rotate:-6deg}to{opacity:1;translate:0 0;rotate:0deg}}@keyframes take-trick{from{opacity:1;translate:0 0}to{opacity:0;translate:var(--take-x) var(--take-y);scale:.6}}@media(prefers-reduced-motion:reduce){.played.fresh-card,.deal-card,#trick.collecting .played{animation:none}}
@media(max-width:700px){.online-panel{padding:14px}.online-heading h2{width:100%;font-size:21px}.online-heading button,.online-options button,.room-top button{font-size:13px}.online-options label{max-width:none}.online-options button{flex:1 1 140px}.room-top strong{width:100%}#ratings-dialog table{min-width:0}#ratings-dialog th,#ratings-dialog td{padding:8px 4px;font-size:12px}}