:root{font-family:Inter,"PingFang SC","Microsoft YaHei",system-ui,sans-serif;color:#173e35;background:#f3f4ec;font-synthesis:none;--green:#17684f;--muted:#75877c;--line:#d7e0d2;--paper:#fffef8;--gold:#e8bf58}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 100% 0,#dbe8da70,transparent 50%),#f3f4ec}button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:default;opacity:.43}button:focus-visible,a:focus-visible,input:focus-visible,.history:focus-visible{outline:3px solid #deac39;outline-offset:3px}a{color:inherit}button{touch-action:manipulation}.nav{max-width:1192px;margin:auto;padding:23px 24px;display:flex;align-items:center;justify-content:space-between;gap:14px}.brand{display:flex;align-items:center;gap:11px;font-size:19px;font-weight:850;text-decoration:none}.brand small{display:block;letter-spacing:.22em;font-size:9px;font-weight:550;margin-top:3px;color:#729181}.logo{display:grid;place-items:center;font-size:30px;background:#1a634e;color:#ffe3a1;border-radius:12px;width:43px;height:48px;transform:rotate(-7deg);font-weight:900;box-shadow:3px 3px 0 #c6d7be}.nav-right{display:flex;align-items:center;gap:16px}.connection{color:#6b8372;font-size:11px;white-space:nowrap}.connection:before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:#409276;margin-right:6px}.connection.off:before{background:#bf604b}.btn{border:1px solid #cad6c5;background:#fffef8;color:#224b3c;min-height:45px;padding:11px 18px;font-weight:750;border-radius:11px;display:inline-flex;align-items:center;justify-content:center;gap:7px;text-decoration:none;transition:background .15s}.btn:hover:not(:disabled){background:#e5eddc}.btn.primary{background:#1a684f;color:#fff8df;border-color:#1a684f}.btn.primary:hover:not(:disabled){background:#104f3c}.btn.gold{background:#f2cf71;color:#2f3c26;border-color:#f2cf71}.btn.gold:hover:not(:disabled){background:#ffe199}.btn.quiet{background:transparent}.btn.small{font-size:12px;min-height:35px;padding:7px 12px;border-radius:9px}.btn.full{width:100%}.btn.danger{color:#a1463e;border-color:#e7c7bd}.hero{max-width:1070px;margin:32px auto 37px;padding:0 24px;display:grid;grid-template-columns:1.2fr 1fr;align-items:center;gap:30px}.eyebrow{font-size:11px;font-weight:800;letter-spacing:.22em;color:#7a9179}.hero h1{font-size:clamp(44px,5.3vw,70px);line-height:1.12;letter-spacing:-.065em;margin:17px 0 22px;font-weight:900}.hero h1 em{font-style:normal;color:#469b6b}.hero p{color:#788977;font-size:14px;max-width:400px;line-height:1.9}.hero-tags{display:flex;gap:13px;flex-wrap:wrap;font-size:11px;font-weight:700;margin-top:23px}.hero-tags span:before{content:'✓';margin-right:5px;color:#419c70}.hero-art{height:225px;position:relative;display:flex;justify-content:center;align-items:center;background:radial-gradient(ellipse,#dbe8d6 0,transparent 68%)}.hero-art .art-card{position:absolute;width:112px;height:159px;border-radius:15px;border:5px solid #fffdf4;box-shadow:0 13px 20px #35513b20;display:grid;place-items:center;font-weight:900;font-size:73px;color:#fff7db;background:#d18a55;transform:rotate(-21deg) translateX(-72px)}.hero-art .art-card:nth-child(2){background:#1c806a;transform:rotate(4deg);z-index:2}.hero-art .art-card:nth-child(3){background:#d5a83f;transform:rotate(23deg) translateX(72px);z-index:3}.hero-art .art-card small{position:absolute;top:5px;left:6px;font-size:13px}.hero-art .spark{position:absolute;right:13%;top:3px;font-size:35px;color:#c89b3c}.landing{max-width:970px;margin:0 auto;padding:0 24px;display:grid;grid-template-columns:1fr 1fr;gap:20px}.panel{background:var(--paper);border:1px solid var(--line);border-radius:20px;padding:25px;box-shadow:0 6px 20px #254a3010}.panel h2{font-size:19px;margin:0 0 8px;letter-spacing:-.02em}.panel p{color:var(--muted);line-height:1.8;font-size:12px;margin:0 0 22px}.panel-number{color:#9aab8a;font-size:10px;font-weight:800;letter-spacing:.18em;margin-bottom:10px}label{display:block;font-size:12px;font-weight:750;margin-bottom:7px}.field{width:100%;background:#f7f8f1;color:#244938;min-height:44px;border:1px solid #d9e1d1;border-radius:10px;padding:10px 12px;outline:none}.field:focus{border-color:#6b9473}.field::placeholder{color:#99a78f}.field-group{margin-bottom:17px}.field-row{display:grid;grid-template-columns:1.5fr 1fr;gap:12px}.helper{font-size:11px;color:#8a9981;line-height:1.7;margin:7px 0 0}.recent{max-width:970px;margin:22px auto 0;padding:0 24px;display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:11px;color:var(--muted)}.intro-strip{max-width:920px;margin:30px auto;display:flex;justify-content:space-between;gap:20px;padding:20px;border-top:1px solid var(--line);font-size:11px;color:var(--muted)}.intro-strip strong{display:block;color:#4d7256;font-size:12px;margin-bottom:5px}.footer{max-width:1150px;margin:45px auto 0;padding:20px 24px 28px;border-top:1px solid #dbe2d4;color:#92a086;font-size:11px;display:flex;justify-content:space-between;gap:12px}.footer span{font-size:10px}.room-shell{max-width:1192px;margin:auto;padding:10px 24px 0}.room-header{display:flex;justify-content:space-between;align-items:center;gap:16px;margin:10px 0 20px}.room-header h1{font-size:25px;margin:6px 0;letter-spacing:-.035em}.room-meta{font-size:11px;color:#819174}.room-nav{display:flex;gap:8px;flex-wrap:wrap}.room-grid{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:20px;align-items:start}.room-grid>*{min-width:0}.table{background:radial-gradient(ellipse at 50% 0,#2f7058 0,#174c3f 60%,#153d35);padding:24px;border:6px solid #c1c9a7;border-radius:28px;box-shadow:0 8px 0 #a9b897,0 20px 32px #19452c16;color:#f3f6e9;position:relative;overflow:hidden}.table-top{display:flex;align-items:center;justify-content:space-between;font-size:10px;letter-spacing:.13em;color:#a3c6b1;margin:0 2px 15px}.round-chip{background:#ffffff12;border:1px solid #ffffff24;padding:5px 8px;border-radius:6px;font-size:10px;letter-spacing:.04em}.table-center{min-height:178px;display:flex;align-items:center;justify-content:center;gap:25px;padding:7px 0 20px}.deck{width:80px;height:113px;border:4px solid #eee8cd;border-radius:12px;background:repeating-linear-gradient(45deg,#183f36 0,#183f36 5px,#1d4c3f 5px,#1d4c3f 7px);box-shadow:3px 3px 0 #718e72,6px 6px 0 #dedcc1;display:flex;align-items:center;justify-content:center;flex-direction:column;color:#d9d8b6}.deck b{font-size:43px;line-height:1.1}.deck span{font-size:8px;letter-spacing:.2em}.deck-wrap{text-align:center}.deck-wrap>small{display:block;font-size:9px;color:#a5bfa7;margin-top:12px}.center-arrow{color:#80a98e;font-size:24px}.last-card{text-align:center;min-width:100px}.last-card>small{font-size:10px;display:block;color:#b4d1bb;margin-top:10px}.card{width:37px;height:54px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;position:relative;border:2px solid #fff7df;border-radius:7px;background:var(--card-color,#d0a444);color:#fffcdf;box-shadow:1px 3px 0 #0b362345;font-size:24px;font-weight:900;line-height:1}.card:before{content:attr(data-corner);position:absolute;left:3px;top:2px;font-size:6px;font-weight:750}.card.mod{font-size:18px;background:#796288}.card.special{background:#d2b951;color:#263f32;font-size:19px}.card.large{width:80px;height:113px;border-radius:12px;border-width:4px;font-size:53px;animation:cardIn .22s ease-out}.card.large:before{font-size:10px;top:5px;left:5px}.card.large.mod{font-size:34px}.card.large.special{font-size:36px}.card.large .special-label{font-size:11px}.special-label{font-size:8px;position:absolute;bottom:7px;text-align:center;line-height:1.3;left:0;right:0}.turn-banner{padding:13px 16px;border:1px solid #9fc39944;border-radius:12px;background:#0f322e80;display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:16px}.turn-banner strong{display:block;font-size:14px;line-height:1.5;color:#e6e8be}.turn-banner span{font-size:10px;color:#a1c4b0;line-height:1.7}.turn-banner.mine{background:#d6e8a7;border-color:#d6e8a7}.turn-banner.mine strong{color:#254f38}.turn-banner.mine span{color:#53744c}.seats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.seat{border:1px solid #aecba92b;border-radius:14px;background:#092e2b40;padding:13px;min-width:0}.seat.mine{border-color:#b8d58280}.seat.current{box-shadow:0 0 0 2px #e4cf7b;border-color:#e4cf7b}.seat.bust{background:#4f2b2840}.seat.bust .cards{opacity:.45}.seat-top{display:flex;align-items:center;justify-content:space-between;gap:7px;margin-bottom:13px}.identity{display:flex;gap:8px;align-items:center;min-width:0}.avatar{border-radius:9px;width:31px;height:31px;flex:0 0 31px;background:var(--avatar,#7e9b6e);color:#f9f9dc;display:grid;place-items:center;font-weight:800;font-size:14px}.identity strong{display:block;font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:125px}.identity small{font-size:9px;color:#afc8b3}.status{font-size:9px;color:#abc9b5;white-space:nowrap}.status.ready{color:#dbe4a7}.status.bust{color:#f2b6a0}.cards{display:flex;gap:5px;flex-wrap:wrap;min-height:54px}.empty-hand{font-size:10px;align-self:center;color:#799f8b}.seat-bottom{display:flex;justify-content:space-between;gap:8px;align-items:center;margin-top:11px;font-size:9px;color:#a4c4aa}.seat-bottom b{font-size:17px;font-variant-numeric:tabular-nums;color:#e7eabc}.chance{font-size:9px;background:#c7dfa31c;border:1px solid #b4cf8f50;border-radius:5px;padding:3px 5px;color:#d6e5a6}.controls{display:flex;gap:9px;margin-top:18px}.controls .btn{flex:1}.controls .btn.quiet{color:#e3efd8;border-color:#739776}.turn-help{font-size:10px;color:#9dbba5;text-align:center;margin:10px 0 0;line-height:1.8}.target-buttons{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}.target-buttons .btn{font-size:12px;min-height:39px;padding:8px 13px}.target-panel{padding:14px;background:#d9e5bd;border-radius:13px;color:#315b3c;margin-top:16px}.target-panel strong{font-size:13px}.target-panel p{font-size:10px;line-height:1.7;margin:7px 0}.side-panel{background:#fffef8;border:1px solid var(--line);padding:20px;border-radius:18px;margin-bottom:16px}.side-panel h2{font-size:14px;margin:0 0 17px}.side-panel h3{font-size:13px;margin:0 0 10px}.score-row{display:flex;align-items:center;gap:9px;margin:13px 0}.score-rank{font-size:10px;min-width:16px;color:#9ba88a}.score-name{flex:1;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.score-row b{font-size:20px;font-variant-numeric:tabular-nums}.score-row small{color:#9aa88f;font-size:9px}.score-row:first-of-type b{color:#a47b28}.score-row.me .score-name{font-weight:800}.side-note{font-size:10px;color:#8b9b80;line-height:1.8}.history{overflow:auto;max-height:330px;border:1px solid #e0e6d6;border-radius:10px}.history table{border-spacing:0;width:100%;font-size:11px;text-align:center;font-variant-numeric:tabular-nums}.history th,.history td{white-space:nowrap;padding:10px;min-width:55px;border-bottom:1px solid #e6eadf}.history th{background:#eef2e5;font-size:10px;font-weight:700;color:#708568}.history tr>:first-child{position:sticky;left:0;background:#f4f6ec}.history thead th{position:sticky;top:0;z-index:1}.history thead tr>:first-child{z-index:2}.history tfoot td,.history tfoot th{background:#e5edda;color:#406344;font-weight:800}.empty-history{color:#93a087;font-size:11px;padding:13px 0}.log{margin-top:27px}.log summary{font-size:12px;font-weight:750;cursor:pointer;padding:10px 0}.log ol{list-style:none;padding:0;max-height:220px;overflow:auto;margin:5px 0}.log li{font-size:11px;line-height:1.9;color:#8b9e83;padding:5px 0;border-bottom:1px solid #dfe5d7}.log time{font-size:9px;color:#a1af96;margin-right:9px}.lobby-roster{display:grid;gap:9px;margin-top:16px}.lobby-seat{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px;background:#edf2e6;border-radius:11px}.lobby-seat .identity strong{color:#3e6247;max-width:180px}.lobby-seat .identity small{color:#93a287}.lobby-seat>small{color:#8d9b7a;font-size:10px}.lobby-tools{display:flex;gap:6px}.lobby-tools .btn{font-size:10px;padding:5px 8px;min-height:30px}.lobby-card h2{margin:0 0 8px;font-size:24px}.lobby-card>p{font-size:12px;color:#a8c8b2;line-height:1.9}.lobby-card .lobby-seat{background:#082e2a50;color:#e9f0df;border:1px solid #b5ceae24}.lobby-card .lobby-seat strong{color:#edf2db}.lobby-card .lobby-seat small{color:#b5cda9}.lobby-card .lobby-seat .btn{background:transparent;color:#c7d8ba;border-color:#7a9e7950}.lobby-count{font-size:10px;margin:24px 0 5px;color:#90b29e}.join-box{margin-top:22px;padding:18px;background:#f0f1dd;border-radius:13px;color:#28533c}.join-box h3{font-size:14px;margin:0 0 8px}.join-box .helper{color:#839274}.lobby-actions{display:flex;gap:9px;margin-top:23px}.lobby-actions .btn{flex:1}.game-result{text-align:center;background:#f2e8be;color:#5d5e33;border-radius:13px;padding:19px;margin:10px 0 18px}.game-result strong{display:block;font-size:20px;color:#526238;margin-bottom:6px}.game-result p{font-size:11px;line-height:1.8;margin:4px 0}.invite-code{font-size:25px;letter-spacing:.15em;line-height:1.4;font-weight:900;white-space:nowrap;color:#416148;margin:12px 0}.inline-form{display:flex;gap:8px;align-items:end}.inline-form .field-group{margin:0;flex:1}.inline-form .field{min-width:0}.notice{padding:13px 16px;background:#fff0ce;color:#7a6736;border:1px solid #e8d7aa;border-radius:12px;margin:0 0 15px;font-size:12px;line-height:1.8}.notice.error{background:#f9e5dc;color:#9a5444;border-color:#eec9ba}.loading{padding:90px 24px;text-align:center;color:#8c9c7c;font-size:14px}.toast{position:fixed;bottom:28px;left:50%;transform:translateX(-50%);background:#193f32;color:#fff9dc;padding:12px 21px;border-radius:12px;box-shadow:0 8px 28px #16352235;z-index:50;max-width:90vw;font-size:12px;line-height:1.7}.toast.error{background:#8a4d3e}.overlay{position:fixed;inset:0;background:#193e3277;backdrop-filter:blur(4px);z-index:60;padding:20px;display:flex;align-items:center;justify-content:center}.dialog{background:#fffef5;border-radius:21px;padding:26px;max-width:500px;width:100%;max-height:85vh;overflow:auto;color:#3c6048}.dialog h2{margin:0 0 18px;font-size:22px}.dialog h3{font-size:13px;margin:19px 0 7px}.dialog p,.dialog li{font-size:12px;line-height:1.9;color:#7b8d72}.dialog ul{padding-left:19px}.dialog .btn{margin-top:12px}.dialog a{color:#4f8063}.retry-notice .btn{margin-left:8px}.room-shell .notice{margin:0 0 16px}@keyframes cardIn{from{opacity:.2;transform:translateY(9px) rotateY(45deg)}to{opacity:1;transform:none}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}@media(max-width:950px){.room-grid{grid-template-columns:minmax(0,1fr) 270px}.table{padding:18px}.seats{grid-template-columns:1fr}.seat .cards{min-height:48px}.card{width:36px;height:51px}.identity strong{max-width:170px}}@media(max-width:700px){.nav{padding:16px}.nav-right{gap:9px}.brand{font-size:17px}.brand small{font-size:8px}.connection{font-size:9px}.hero{margin:18px auto 25px;grid-template-columns:1fr;padding:0 22px;gap:12px}.hero h1{font-size:48px;margin:13px 0 14px}.hero p{font-size:13px}.hero-art{height:175px;margin-top:0}.hero-art .art-card{width:90px;height:127px;font-size:58px}.hero-tags{margin-top:13px}.landing{grid-template-columns:1fr;padding:0 16px;gap:15px}.panel{padding:22px}.hero-art .spark{right:20%;font-size:26px}.intro-strip{margin:21px 16px;gap:14px;padding:16px 0;flex-wrap:wrap}.footer{padding:19px 16px;margin-top:30px;flex-direction:column;font-size:10px}.room-shell{padding:6px 14px 0}.room-header{align-items:start;margin:7px 0 16px}.room-header h1{font-size:22px}.room-nav{justify-content:end;max-width:155px;gap:5px}.room-nav .btn{font-size:10px;padding:6px 8px}.room-grid{grid-template-columns:1fr;gap:25px}.table{padding:17px 13px;border-width:4px;border-radius:22px}.table-top{font-size:9px}.table-center{min-height:160px;padding-bottom:16px}.turn-banner{padding:11px;margin-bottom:13px}.turn-banner strong{font-size:13px}.turn-banner span{font-size:9px}.seats{grid-template-columns:1fr 1fr;gap:8px}.seat{padding:10px}.seat-top{gap:5px;margin-bottom:11px;flex-wrap:wrap}.identity{gap:6px}.identity strong{font-size:11px;max-width:90px}.identity small{font-size:8px}.avatar{height:26px;width:26px;flex-basis:26px;font-size:12px;border-radius:7px}.status{font-size:8px}.cards{gap:4px;min-height:44px}.card{width:29px;height:43px;font-size:21px;border-radius:5px}.card.mod{font-size:15px}.card.special{font-size:16px}.card:before{font-size:5px;left:2px;top:1px}.special-label{font-size:6px;bottom:4px}.seat-bottom{font-size:8px;flex-wrap:wrap;margin-top:10px;gap:4px}.seat-bottom b{font-size:15px}.chance{font-size:7px}.controls{position:sticky;bottom:10px;z-index:5;background:#164a3eed;padding:8px;border-radius:12px;border:1px solid #6e987055}.controls .btn{font-size:13px;min-height:47px}.side-panel{padding:18px}.side-columns{display:grid;grid-template-columns:1fr 1fr;gap:13px}.side-columns .side-panel{margin:0}.side-panel.history-panel{grid-column:1/-1}.lobby-card .lobby-seat{padding:12px}.lobby-card h2{font-size:22px}.lobby-actions{flex-wrap:wrap}.recent{padding:0 16px}.log{margin-top:21px}}@media(max-width:380px){.seats{grid-template-columns:1fr}.card{width:34px;height:48px}.identity strong{max-width:170px}.side-columns{grid-template-columns:1fr}.hero h1{font-size:43px}.nav-right .connection{display:none}.invite-code{font-size:21px}.table-center{gap:20px}}

/* Keep player actions available while scrolling through a full table. */
.table{overflow:visible}.controls{position:sticky;top:10px;bottom:auto;z-index:5;background:#164a3ef5;padding:8px;border-radius:12px;border:1px solid #6e987055;margin:0 0 15px}
/* Draw from the shared deck, turn the face up, and deliver to its sorted slot. */
.card.large{animation:none}.awaiting-deal{visibility:hidden}.dealing .last-card .card{visibility:hidden}
.flying-card{position:fixed;z-index:45;width:80px;height:113px;pointer-events:none;perspective:900px;transform-origin:center;will-change:transform;filter:drop-shadow(0 12px 12px #12332744)}
.flip-shell{position:relative;width:100%;height:100%;transform-style:preserve-3d;transform:rotateY(180deg)}
.flight-back,.flight-face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.flight-back{transform:rotateY(180deg)}.flight-back .deck{box-shadow:none}.flight-face .card{margin:0;animation:none}
.flight-face .card.large{width:80px;height:113px;font-size:53px}.flight-face .card.large.mod{font-size:34px}.flight-face .card.large.special{font-size:36px}
@media(prefers-reduced-motion:reduce){.flying-card{display:none}.awaiting-deal,.dealing .last-card .card{visibility:visible}}
