@import url('data:text/css,');
:root{color-scheme:dark;--ink:#e8e0cb;--muted:#a6ad9f;--gold:#d4bc85;--line:#d0c6a62b;--paper:#dfd6bb;--green:#2d4a40;--red:#b77965;font-family:'Microsoft YaHei','PingFang SC',sans-serif;font-size:14px}*{box-sizing:border-box}body{margin:0;background:#121d1b;color:var(--ink);height:100dvh;min-height:640px;overflow:hidden}button,input{font:inherit}button{cursor:pointer;color:inherit;border:0;transition:background .2s,transform .2s,opacity .2s}button:disabled{opacity:.32;cursor:not-allowed}button:not(:disabled):active{transform:translateY(2px)}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--gold);outline-offset:4px}a{color:inherit;text-decoration:none}button,input{border-radius:3px}input{min-width:0;background:#0d19155e;border:1px solid #d7cba437;padding:15px 16px;color:var(--ink);outline:none}input:focus{border-color:var(--gold)}input::placeholder{color:#9caa9680}h1,h2,h3,p{margin:0}h1,h2,.wordmark,.waiting-title{font-family:'STKaiti','KaiTi','Noto Serif SC','Songti SC',serif}#world{position:fixed;inset:0}#world canvas{display:block;width:100%;height:100%}.vignette{position:fixed;inset:0;background:linear-gradient(90deg,#0b1715d9 0%,#10201b40 45%,#0b17159c 100%),linear-gradient(0deg,#0c1715d9,transparent 50%,#0b151170);pointer-events:none}.grain{position:fixed;inset:0;opacity:.045;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='white' filter='url(%23n)' opacity='.8' d='M0 0h160v160H0z'/%3E%3C/svg%3E")}.topbar{height:104px;position:relative;z-index:20;display:flex;align-items:center;justify-content:space-between;margin:0 4%;border-bottom:1px solid var(--line)}.wordmark{display:flex;align-items:center;gap:14px;font-size:21px;letter-spacing:3px}.wordmark small{display:block;font-size:9px;letter-spacing:4px;color:var(--muted);margin-top:6px}.seal{border:1px solid #bdc4ab85;padding:4px 9px;font-size:29px;color:#d9ddc2;box-shadow:inset 0 0 0 3px #9fac8d10}.toptools{display:flex;align-items:center;gap:25px;font-size:12px}.connection{color:var(--muted);display:flex;align-items:center;gap:8px}.connection:before{content:'';width:5px;height:5px;border-radius:50%;background:#d4b16e}.connection.online:before{background:#a7b997;box-shadow:0 0 8px #9ec295}.icon-button,.text-button{background:none;padding:8px 2px;color:var(--muted);white-space:nowrap}.icon-button:hover,.text-button:hover{color:var(--ink)}.home{position:relative;height:calc(100dvh - 104px);min-height:536px}.hero-copy{position:absolute;top:18%;left:9%}.eyebrow{font-size:11px;letter-spacing:4px;color:var(--gold)}h1{font-size:clamp(80px,8vw,126px);font-weight:400;letter-spacing:13px;margin:24px 0 20px;line-height:1.1;text-shadow:0 4px 30px #070e0d66;position:relative}.title-stamp{position:absolute;right:-34px;top:20px;writing-mode:vertical-rl;letter-spacing:3px;font-family:serif;font-size:11px;background:#7b3d30b0;color:#e5d4b4;padding:9px 5px;border:1px solid #d6ba8950}.hero-line{font-family:serif;line-height:2.2;color:#c7caba;letter-spacing:3px;font-size:16px}.hero-details{display:flex;align-items:center;gap:16px;margin-top:45px;color:#9ba897;font-size:11px;letter-spacing:2px}.hero-details i{height:3px;width:3px;background:#b9ac86;transform:rotate(45deg)}.entry-panel{position:absolute;right:8%;width:330px;top:22%;padding:26px 0}.panel-heading{display:flex;align-items:center;gap:15px;margin-bottom:12px}.panel-heading h2{font-size:27px;font-weight:400;white-space:nowrap}.little-rule{height:1px;background:linear-gradient(90deg,transparent,#b5b58a90);flex:1}.little-rule:last-child{transform:rotate(180deg)}.entry-panel>.muted{text-align:center;font-size:12px;letter-spacing:1px;margin-bottom:28px}.muted{color:var(--muted)}.entry-panel label{display:block;font-size:11px;letter-spacing:2px;margin-bottom:10px;color:#c9c6af}.entry-panel>input{display:block;width:100%;margin-bottom:14px}.primary{background:var(--paper);color:#24372f;padding:14px 26px;font-weight:600;letter-spacing:2px;border:1px solid #f0e9cf40;box-shadow:0 4px 20px #0002}.primary:hover:not(:disabled){background:#eee5c9}.wide{width:100%}.primary span{float:right;font-size:17px}.secondary{background:#263a2e82;border:1px solid #d5c9a03d;padding:13px 20px;white-space:nowrap}.secondary:hover:not(:disabled){background:#405141}.join-row{display:flex;gap:8px;margin-top:12px}.join-row input{width:100%;font-size:12px;letter-spacing:1px}.entry-footer{display:flex;justify-content:space-between;align-items:center;margin-top:22px;border-top:1px solid var(--line);padding-top:17px;font-size:11px;color:#a1a794}.entry-footer button{color:#d0bd8e}.home-footer{position:absolute;bottom:31px;left:4%;right:4%;display:flex;justify-content:space-between;font-size:10px;letter-spacing:4px;color:#7f9285}.hidden{display:none!important}.game{position:absolute;inset:104px 0 0;pointer-events:none}.game button,.game .hand,.game .history{pointer-events:auto}.room-bar{position:absolute;left:4%;right:4%;top:17px;display:flex;justify-content:space-between;align-items:center}.room-bar>div{display:flex;align-items:center;gap:20px}.room-code{background:#111e197d;padding:8px 14px;color:#aaa994;font-size:11px;border:1px solid #879a7e30}.room-code strong{color:var(--ink);font-family:monospace;font-size:15px;letter-spacing:3px;margin:0 10px}.room-code span{font-size:17px}.seat{position:absolute;width:152px;text-align:center;transform:translate(-50%,-50%);transition:opacity .4s}.seat-1{left:20%;top:37%}.seat-2{left:50%;top:13%}.seat-3{left:80%;top:37%}.seat-0{left:8%;bottom:33%;transform:none}.seat-name{font-size:14px;font-family:serif;letter-spacing:2px;background:#13221cba;display:inline-block;padding:7px 14px;border:1px solid #8b9e752e}.seat.current .seat-name{border-color:#d7c28b;color:#f2d9a5;box-shadow:0 0 22px #d8b86e25}.seat.out{opacity:.48}.seat-detail{display:flex;justify-content:center;gap:10px;font-size:10px;color:#c4c4ae;margin-top:7px}.seat-status{font-size:10px;margin-bottom:8px;letter-spacing:1px;color:#d7be87}.seat .meter{height:2px;background:#e1d5a82a;margin:7px auto 0;width:104px;overflow:hidden}.seat .meter i{display:block;height:100%;background:#bfa16a}.seat .bot-remove{font-size:10px;padding:3px;color:#c0ac87}.table-center{position:absolute;top:34%;left:50%;transform:translate(-50%,-50%);text-align:center;min-width:220px;text-shadow:0 2px 8px #0009}.table-center h2{font-weight:400;font-size:31px;letter-spacing:4px;margin:10px 0}.table-center p{font-size:12px;letter-spacing:2px;color:#d5cfb6}.pile-label{margin-top:10px;font-size:10px;color:#d4c39b;letter-spacing:1px}.waiting{position:absolute;left:50%;top:54%;transform:translate(-50%,-50%);width:540px;text-align:center;background:radial-gradient(ellipse,#14221af0,transparent 70%);padding:35px 20px;pointer-events:auto}.waiting-title{font-size:31px;letter-spacing:4px}.waiting p{font-size:12px;color:#b8c1a9;margin:13px 0 20px}.waiting-buttons{display:flex;justify-content:center;gap:12px}.small{font-size:11px!important;line-height:1.8}.hand-area{position:absolute;left:17%;right:17%;bottom:20px;pointer-events:auto}.hand-meta{display:flex;align-items:center;gap:20px;margin-bottom:10px;color:#c0c8b2;font-size:11px}.hand-meta #self-name{color:#e4dcc1;letter-spacing:2px}.hand-meta button{margin-left:auto;font-size:10px}.hand{display:flex;justify-content:center;align-items:flex-end;height:151px;padding:20px 12px 0;position:relative;overflow-x:auto;overflow-y:visible;scrollbar-width:thin;scrollbar-color:#b6a57644 transparent}.card{flex:0 0 72px;position:relative;height:124px;background:linear-gradient(135deg,#e5dcc0,#c9bc97);border:1px solid #f7ebc4;color:#343d30;margin-left:-16px;box-shadow:2px 3px 8px #0006;border-radius:4px;padding:0;transition:transform .18s,filter .18s;transform-origin:50% 100%;font-family:'KaiTi','STKaiti',serif}.card:first-child{margin-left:0}.card:before{content:'';position:absolute;inset:5px;border:1px solid #776f4e60;pointer-events:none}.card .corner{position:absolute;top:9px;left:9px;font-size:15px}.card .value{font-size:39px;display:block;line-height:1}.card .card-bottom{position:absolute;bottom:12px;left:0;right:0;font-size:8px;letter-spacing:3px;color:#68705a}.card.wild{background:linear-gradient(135deg,#b9a267,#e4cf8b 50%,#b7a06b);color:#57431d}.card.special:after{content:'首';position:absolute;top:8px;right:8px;background:#8b4935;color:#eddbc2;padding:2px;font-size:9px}.card.selected{transform:translateY(-18px);outline:2px solid #d9ca94;z-index:2;filter:brightness(1.12)}.card:hover{transform:translateY(-12px);z-index:3}.card.selected:hover{transform:translateY(-21px)}.card:disabled{opacity:1;cursor:default}.card:disabled:hover{transform:none}.action-bar{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #c5cba333;margin-top:12px;padding-top:16px;gap:15px}.turn-info{display:flex;align-items:center;gap:12px}.timer{font-size:23px;font-family:serif;color:var(--gold);display:flex;align-items:center;justify-content:center;border:1px solid #b3b58d50;border-radius:50%;width:42px;height:42px;flex-shrink:0}.timer.urgent{color:#e29375;border-color:#e29375;animation:pulse 1s infinite}.turn-info strong{font-weight:400;font-size:12px;letter-spacing:1px}.turn-info small{display:block;color:#9baa95;font-size:10px;margin-top:5px}.actions{display:flex;gap:12px;align-items:center}.actions button{font-size:12px}.danger{background:#754a38cc;border:1px solid #d6ac7660;color:#f0d9b2;padding:14px 20px;letter-spacing:2px}.danger:hover:not(:disabled){background:#8c5941}.history{position:absolute;left:4%;bottom:34px;width:145px;max-height:135px;overflow:auto;mask-image:linear-gradient(transparent,black 20%);padding-top:24px;scrollbar-width:none}.history p{color:#a7b29c;font-size:10px;line-height:1.9;margin:4px 0}.history p:last-child{color:#dbcfaa}.announcement{position:absolute;top:28%;left:50%;transform:translateX(-50%);text-align:center;pointer-events:none;z-index:25;min-width:360px;padding:25px 40px;background:radial-gradient(ellipse,#101c17f5 35%,#101c1780 65%,transparent 75%);animation:appear .35s ease}.announcement h2{font-size:36px;letter-spacing:6px;margin-bottom:12px;color:#e8d5a8}.announcement p{font-size:13px;color:#e3dbc0;line-height:1.9}.announcement .reveal-cards{display:flex;justify-content:center;margin:14px 0;gap:6px;max-width:80vw;flex-wrap:wrap}.announcement .card{width:57px;flex:0 0 57px;height:91px;margin:0;animation:flip .6s both}.announcement .card .value{font-size:30px}.announcement .card .corner{font-size:11px}.announcement .card .card-bottom{font-size:6px}.result{position:absolute;z-index:30;left:50%;top:40%;transform:translate(-50%,-50%);text-align:center;padding:45px 65px;background:#14231ef5;border:1px solid #c8b57d60;box-shadow:0 20px 80px #0008;pointer-events:auto;min-width:410px}.result h2{font-size:42px;margin:18px 0;letter-spacing:5px}.result p{color:#bdbda4;margin-bottom:25px}.result button{margin:5px}.toast{position:fixed;z-index:100;bottom:30px;left:50%;transform:translateX(-50%);background:#e7dec3;color:#293c31;padding:14px 26px;box-shadow:0 8px 40px #0008;max-width:90vw;text-align:center}dialog{color:var(--ink);background:#1a2a22;border:1px solid #bca87777;border-radius:5px;max-width:540px;width:90%;padding:35px;box-shadow:0 20px 100px #000a}dialog::backdrop{background:#07110ee0;backdrop-filter:blur(6px)}dialog h2{font-size:30px;font-weight:400;margin:13px 0 16px;letter-spacing:2px}.dialog-close{position:absolute;right:15px;top:10px;background:none;color:#bdc6ad;font-size:25px}.numbers{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin:25px 0}.numbers button{background:#354638;color:#dcd1ac;font-size:26px;font-family:serif;border:1px solid #bcb48940;padding:15px 0}.numbers button.chosen{background:#dbcfaa;color:#2a3d30;border-color:#eee0b4}.rules{max-height:56vh;overflow:auto;padding-right:8px}.rules p{font-size:12px;line-height:1.9;margin:17px 0;color:#bdc5b0}.rules b{display:block;color:#e4d7b5;margin-bottom:5px;font-weight:400;font-size:14px}.dialog-actions{display:flex;gap:12px;justify-content:flex-end;margin-top:25px}#fx{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:22}.flying-card{position:absolute;width:44px;height:68px;background:repeating-linear-gradient(45deg,#4c6253 0 2px,#405346 2px 6px);border:3px double #d6c28d;border-radius:3px;box-shadow:2px 5px 10px #0007}.playing .vignette{background:linear-gradient(0deg,#0a1412f5 0%,#0b171560 28%,transparent 57%,#0b171550),linear-gradient(90deg,#0b171566,transparent 25%,transparent 75%,#0b171566)}.playing .topbar{height:77px}.playing .game{top:77px}.playing .wordmark{font-size:17px}.playing .wordmark small{font-size:8px}.playing .seal{font-size:23px}.webgl-fallback{background:radial-gradient(ellipse at 50% 45%,#596048 0,#283d30 27%,#14231e 62%)}.webgl-fallback:after{content:'';position:absolute;left:25%;right:25%;top:30%;height:35%;border-radius:50%;background:repeating-linear-gradient(3deg,#403a2b,#403a2b 8px,#494332 10px);border:12px solid #5b5035;box-shadow:0 30px 10px #0005;transform:perspective(600px) rotateX(30deg)}@keyframes flip{from{transform:rotateY(90deg)}to{transform:rotateY(0)}}@keyframes appear{from{opacity:0;transform:translate(-50%,15px)}to{opacity:1;transform:translate(-50%,0)}}@keyframes pulse{50%{opacity:.5}}@media(min-width:1600px){.entry-panel{right:12%;width:370px}.hero-copy{left:12%}.hand-area{left:22%;right:22%}}@media(max-width:1000px){.hero-copy{left:6%}.entry-panel{right:5%;width:300px}h1{font-size:83px}.hand-area{left:15%;right:10%}.seat-1{left:16%}.seat-3{left:84%}.history{width:110px;left:2%}.card{flex-basis:64px;height:112px}.seat-0{left:3%}}@media(max-width:720px){body{min-height:580px}.topbar{height:80px}.toptools{gap:12px}.connection{font-size:0}.wordmark{font-size:17px}.wordmark small{font-size:7px}.home{height:calc(100dvh - 80px)}.hero-copy{top:7%;left:7%}.hero-copy h1{font-size:61px;margin:15px 0}.hero-line{font-size:12px}.hero-details{display:none}.entry-panel{top:auto;bottom:7%;right:7%;left:7%;width:auto;padding:17px 20px;background:#12221bca;border:1px solid var(--line)}.entry-panel>.muted{margin-bottom:17px}.entry-footer{margin-top:10px;padding-top:7px}.home-footer{bottom:12px;font-size:8px;letter-spacing:1px}.home-footer span:last-child{display:none}.playing .topbar{height:62px}.playing .game{top:62px}.topbar .seal{font-size:22px}.room-bar{top:10px}.room-bar>div{gap:8px}.room-bar .eyebrow{display:none}.seat{width:115px}.seat-2{top:18%}.seat-1{left:15%;top:37%}.seat-3{left:85%;top:37%}.seat-0{display:none}.seat-name{font-size:12px;padding:5px 10px}.seat-detail{font-size:9px;gap:5px}.seat-status{font-size:9px}.table-center{top:38%;min-width:160px}.table-center h2{font-size:25px}.table-center .eyebrow{font-size:9px}.table-center p{font-size:10px}.waiting{width:95%;top:58%;padding:20px 5px}.waiting-title{font-size:25px}.waiting-buttons{gap:6px}.waiting-buttons button{font-size:12px;padding:12px}.hand-area{left:3%;right:3%;bottom:12px}.hand{justify-content:flex-start;height:132px;padding-left:3px;padding-right:3px}.card{flex-basis:60px;height:102px;margin-left:-26px}.card .value{font-size:32px}.card .corner{font-size:12px}.card .card-bottom{font-size:7px}.hand-meta{gap:8px;font-size:10px;margin-bottom:0}.hand-meta button{font-size:9px}.action-bar{gap:7px;padding-top:11px;margin-top:8px}.actions{gap:7px}.actions button{font-size:10px;padding:12px 9px;letter-spacing:0}.turn-info{gap:7px}.turn-info strong{font-size:10px}.turn-info small{font-size:9px}.timer{width:32px;height:32px;font-size:19px}.history{display:none}.announcement{min-width:290px;top:26%;padding:24px 15px}.announcement h2{font-size:29px}.announcement p{font-size:11px}.result{padding:30px 20px;min-width:300px}.result h2{font-size:33px}dialog{padding:24px}.numbers{gap:7px}.numbers button{padding:12px 0}.toptools .icon-button{font-size:11px}}@media(max-height:650px) and (min-width:721px){.topbar{height:65px}.home{height:calc(100dvh - 65px)}.hero-copy{top:12%}.entry-panel{top:5%}.playing .topbar{height:55px}.playing .game{top:55px}.hand-area{bottom:10px}.hand{height:113px}.card{height:96px;flex-basis:60px}.hand-meta{margin-bottom:0}.action-bar{padding-top:8px;margin-top:7px}.seat-2{top:12%}.table-center{top:29%}.history{max-height:100px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* Table readability and grouped hand revision */
.table-center{top:26%;z-index:4}.table-center h2{font-size:36px;color:#fff3cf;text-shadow:0 2px 3px #17251d,0 0 12px #17251d}.table-center .eyebrow{color:#fff0c1;font-size:13px}.table-bottom{position:absolute;top:49%;left:50%;transform:translateX(-50%);text-align:center;z-index:4;padding:8px 18px;background:#12231dd9;border:1px solid #dac79260;border-radius:4px;white-space:nowrap}.table-bottom p{font-size:18px;color:#fff3d0}.table-bottom .pile-label{font-size:15px;color:#f0dba6;margin-top:6px}.seat-detail,.seat-status{font-size:12px;color:#f2e6c6}.seat-name{font-size:17px}.hand-meta{font-size:14px;color:#f0e5c6}.turn-info strong{font-size:15px}.turn-info small{font-size:12px}.hand{height:190px;gap:10px;padding-top:55px;align-items:flex-end}.card-stack{position:relative;flex:0 0 72px;height:124px;margin-top:40px}.stack-layer{position:absolute;bottom:calc(var(--layer) * 13px);left:0;width:100%;height:124px;pointer-events:none}.stack-layer .card{width:100%;height:100%;margin:0;pointer-events:auto}.card.selected{transform:translateY(-7px) translateX(5px);outline:3px solid #fff3a9}.turn-arrows{position:absolute;inset:0;pointer-events:none}.turn-arrow{position:absolute;color:#cbb77d55;font-size:27px;text-shadow:0 1px 4px #000}.turn-arrow.active{color:#fff3a4;text-shadow:0 0 8px #ffbf39,0 0 20px #ffb438;animation:pulse 1.4s infinite}.arrow-0{left:49%;top:59%}.arrow-1{left:32%;top:40%}.arrow-2{left:49%;top:30%}.arrow-3{right:32%;top:40%}body:has(#waiting:not(.hidden)) .table-bottom,body:has(#waiting:not(.hidden)) .turn-arrows,body:has(#result:not(.hidden)) .table-bottom{display:none}@media(max-width:720px){.table-center{top:27%}.table-center h2{font-size:28px}.table-bottom{top:47%;padding:6px 10px}.table-bottom p{font-size:15px}.table-bottom .pile-label{font-size:12px}.hand{height:170px;gap:7px}.card-stack{flex-basis:57px;height:102px}.stack-layer{height:102px;bottom:calc(var(--layer) * 12px)}.seat-name{font-size:14px}.seat-detail,.seat-status{font-size:10px}.hand-meta{font-size:11px}.arrow-0{top:56%}.arrow-1{left:29%}.arrow-3{right:29%}}
.stack-layer{z-index:calc(30 - var(--layer))}.table-center .eyebrow{display:none}.table-center h2{margin:0}.seat-0{display:none}.turn-arrow.active{color:#fff090;filter:drop-shadow(0 0 5px #ffbc22);opacity:1;animation:none}