:root{color:#eee7d8;font-synthesis:none;text-rendering:optimizelegibility;--multiui-shell:#080b0c;--multiui-surface:#101516;--multiui-border:#34302a;--multiui-brass:#c7a86b;--multiui-brass-light:#ead2a0;--multiui-muted:#999b96;--multiui-green:#57d36d;--multiui-red:#b43222;--multiui-shadow:0 20px 45px #0006;background:#080b0c;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html{background:var(--multiui-shell);min-width:320px}body{background:radial-gradient(circle at 46% 42%,#17221d 0,#080b0c 48%,#050708 100%);min-width:320px;min-height:100vh;margin:0}button,input{font:inherit}button{color:inherit}button:focus-visible,input:focus-visible{outline:2px solid var(--multiui-brass-light);outline-offset:2px}p2p-lockstep-multi-app{min-height:100vh;display:block}.multi-app-shell{flex-direction:column;height:100vh;min-height:100vh;display:flex;overflow:hidden}.topbar{z-index:20;background:#070b0df0;border-bottom:1px solid #3c3428;flex:0 0 64px;grid-template-columns:minmax(190px,auto) 1fr auto;align-items:center;gap:24px;height:64px;padding:0 22px;display:grid;position:relative;box-shadow:0 8px 26px #00000047}.brand{color:var(--multiui-brass-light);align-items:center;gap:11px;display:flex}.brand strong{letter-spacing:.1em;font:700 24px/1 Georgia,Noto Serif SC,serif}.brand-tile{aspect-ratio:.78;color:#1f211b;background:linear-gradient(145deg,#fff7e5,#d9c397);border:1px solid #b39155;border-radius:5px;place-items:center;width:34px;font:800 18px/1 Georgia,serif;display:inline-grid;box-shadow:0 5px 12px #00000059}.topbar-meta{color:#c3bba9;align-items:center;font-size:13px;display:flex}.topbar-meta span{border-left:1px solid #2f2c27;padding:0 20px}.topbar-actions{align-items:center;gap:10px;display:flex}.network-health{color:var(--multiui-green);align-items:center;gap:7px;font-size:13px;display:inline-flex}.network-health i{background:currentColor;border-radius:50%;width:8px;height:8px;box-shadow:0 0 10px}.network-health.is-offline{color:#e0ad55}.connection-landing{text-align:center;flex:1;place-content:center;justify-items:center;padding:28px;display:grid}.connection-landing>.brand-tile{width:52px;font-size:25px}.connection-landing>p{color:var(--multiui-brass);letter-spacing:.22em;margin:24px 0 8px;font-size:10px;font-weight:750}.connection-landing h1{color:#f2e6cc;margin:0;font:700 clamp(32px,5vw,56px)/1.1 Georgia,Noto Serif SC,serif}.connection-landing>span:not(.brand-tile){max-width:520px;color:var(--multiui-muted);margin-top:15px;font-size:13px;line-height:1.7}.connection-landing>button{min-width:210px;margin-top:28px}.connection-landing>small{color:var(--multiui-brass);margin-top:13px}.button-primary{color:#fff1e7;cursor:pointer;border-radius:7px;padding:12px 18px;font-weight:750;background:linear-gradient(145deg,#d84a35,#8d1f16)!important;border:1px solid #d75542!important}.lobby-layout{flex:1;grid-template-columns:minmax(0,1fr) 340px;gap:16px;width:min(1120px,100%);min-height:0;margin:0 auto;padding:clamp(18px,4vh,44px) 18px;display:grid;overflow:auto}.lobby-main,.lobby-card{box-shadow:var(--multiui-shadow);background:linear-gradient(150deg,#151b1bf7,#090d0efa);border:1px solid #55472f;border-radius:12px}.lobby-main{flex-direction:column;min-width:0;padding:clamp(24px,4vw,46px);display:flex}.lobby-intro{max-width:620px}.lobby-intro p{color:var(--multiui-brass);letter-spacing:.18em;margin:0 0 10px;font-size:11px;font-weight:750}.lobby-intro h1{color:#f2e6cc;margin:0;font:700 clamp(28px,4vw,48px)/1.08 Georgia,Noto Serif SC,serif}.lobby-intro>span{color:var(--multiui-muted);margin-top:13px;font-size:13px;line-height:1.7;display:block}.lobby-members{border-top:1px solid #39342b;margin-top:clamp(24px,5vh,48px)}.lobby-members>header,.lobby-card>header{justify-content:space-between;align-items:center;gap:12px;display:flex}.lobby-members>header{padding:18px 0 12px}.lobby-members h2,.lobby-card h2{color:var(--multiui-brass-light);margin:0;font:700 14px/1.2 Georgia,Noto Serif SC,serif}.lobby-members header span,.lobby-card header span{color:var(--multiui-muted);font-size:11px}.lobby-member-tools{align-items:center;gap:10px;display:flex}.lobby-member-tools button{color:var(--multiui-brass);cursor:pointer;background:0 0;border:0;padding:4px 0;font-size:11px}.lobby-members ol{grid-template-columns:1fr 1fr;gap:10px;margin:0;padding:0;list-style:none;display:grid}.lobby-member{background:#050a0b6b;border:1px solid #3c3932;border-radius:8px;grid-template-columns:42px minmax(0,1fr) auto;align-items:center;gap:11px;min-width:0;min-height:72px;padding:12px;display:grid}.lobby-member.is-empty{color:#656760;border-style:dashed}.member-avatar{color:#251f15;background:linear-gradient(145deg,#f0dfb9,#a9894e);border:1px solid #725b32;border-radius:8px;place-items:center;width:42px;height:42px;font:800 18px/1 Georgia,serif;display:grid}.is-empty .member-avatar{color:#77746a;background:#171b1b;border-color:#3e403c}.member-copy{gap:5px;min-width:0;display:grid}.member-copy small{color:var(--multiui-muted);font-size:10px}.member-copy small.status-connected{color:var(--multiui-green)}.member-name{align-items:center;gap:6px;min-width:0;display:flex}.member-name strong{text-overflow:ellipsis;white-space:nowrap;font-size:13px;overflow:hidden}.member-name em{color:var(--multiui-brass);border:1px solid #5b4c32;border-radius:999px;flex:none;padding:2px 5px;font-size:8px;font-style:normal}.member-ready{color:#6f716d;white-space:nowrap;font-size:10px}.member-ready.is-ready{color:#8bd49a}.display-name-editor{background:#050a0b94;border:1px solid #4c4436;border-radius:8px;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:9px;margin:0 0 12px;padding:12px;display:grid}.display-name-editor label{color:var(--multiui-brass-light);font-size:11px}.display-name-editor input{color:#f0e8d9;background:#0c1112;border:1px solid #514838;border-radius:6px;min-width:0;padding:9px 10px}.display-name-editor>div{gap:7px;display:flex}.display-name-editor button{cursor:pointer;background:#171c1c;border:1px solid #4c473f;border-radius:6px;min-height:35px;padding:7px 10px}.display-name-editor small{color:#f18d7e;grid-column:2/-1;font-size:10px}.lobby-controls{grid-template-columns:1fr 1.2fr;gap:10px;margin-top:auto;padding-top:clamp(24px,5vh,44px);display:grid}.lobby-controls button,.table-invite button{color:#eee4d1;cursor:pointer;background:#171c1c;border:1px solid #4c473f;border-radius:7px;min-height:48px;padding:11px 14px;font-weight:700}.lobby-controls button:disabled,.control-panel button:disabled{opacity:.38;cursor:not-allowed}.lobby-controls button:only-child{grid-column:1/-1}.lobby-sidebar{flex-direction:column;gap:12px;min-width:0;display:flex}.lobby-card{box-shadow:none;overflow:hidden}.lobby-card>header{border-bottom:1px solid #38342c;min-height:40px;padding:0 14px}.table-invite{padding-bottom:13px}.invite-share{gap:10px;padding:16px 14px 4px;display:grid}.invitation-qr-stage{place-items:center;padding:4px 0;display:grid}.invitation-qr{color:#5d5a53;background:#fff;border:1px solid #d8d4cb;border-radius:20px;place-items:center;width:fit-content;padding:12px;display:grid;box-shadow:0 12px 28px #0000003d}.invitation-qr img,.invitation-qr span{border-radius:10px;place-items:center;width:184px;height:184px;display:grid}.invite-hint,.copy-notice{color:var(--multiui-muted);text-align:center;margin:0;font-size:10px}.table-invite .invite-primary{background:linear-gradient(145deg,#15543d,#0a3528);border-color:#567860;border-radius:999px;width:100%;min-height:44px;margin:0}.manual-invite{border-top:1px solid #34342f;margin:10px 14px 0}.manual-invite summary{color:var(--multiui-muted);cursor:pointer;padding:10px 0 1px;font-size:10px}.manual-invite label{color:var(--multiui-muted);margin:10px 0 6px;font-size:10px;display:block}.manual-invite code{overflow-wrap:anywhere;color:#e9ddc5;background:#080c0d;border:1px solid #3e3b35;border-radius:6px;padding:10px;font:10px/1.55 ui-monospace,monospace;display:block}.manual-invite button{width:100%;min-height:38px;margin:9px 0 0}.table-invite>.copy-notice{color:#e8c679;margin:8px 14px 0}.lobby-events{flex:1;min-height:160px}.lobby-events ol{margin:0;padding:8px 14px 12px;list-style:none}.lobby-events li{color:#c8c4bb;grid-template-columns:33px 1fr;gap:8px;padding:6px 0;font-size:11px;display:grid}.lobby-events time{color:#847e73}.game-layout{flex:1;grid-template-columns:minmax(0,1fr) 326px;gap:12px;height:calc(100vh - 64px);min-height:0;padding:12px;display:grid;overflow:hidden}.game-stage,.multi-board-host{min-width:0;height:100%;min-height:0}.session-panel{scrollbar-width:thin;flex-direction:column;gap:8px;min-height:0;display:flex;overflow:auto}.panel-section{background:linear-gradient(160deg,#14191af5,#0a0d0efa);border:1px solid #55472f;border-radius:7px;overflow:hidden}.panel-section>header{height:34px;color:var(--multiui-brass-light);border-bottom:1px solid #38342c;justify-content:space-between;align-items:center;padding:0 13px;display:flex}.panel-section h2{margin:0;font:700 14px/1 Georgia,Noto Serif SC,serif}.panel-section header span{color:var(--multiui-muted);font-size:11px}.session-summary dl{margin:0;padding:7px 13px 9px}.session-summary dl div{justify-content:space-between;gap:12px;padding:3px 0;display:flex}.session-summary dt{color:var(--multiui-muted);font-size:12px}.session-summary dd{text-overflow:ellipsis;white-space:nowrap;max-width:170px;margin:0;font-size:12px;overflow:hidden}.participants-panel ul{margin:0;padding:5px 12px 8px;list-style:none}.participants-panel li{border-bottom:1px solid #292c2b;grid-template-columns:30px minmax(0,1fr) auto 46px;align-items:center;gap:8px;min-height:31px;display:grid}.participants-panel li:last-child{border:0}.roster-seat{width:27px;height:27px;color:var(--multiui-brass-light);border:1px solid #725b32;border-radius:5px;place-items:center;font-size:10px;display:grid;overflow:hidden}.roster-name{text-overflow:ellipsis;white-space:nowrap;font-size:12px;overflow:hidden}.roster-status{color:var(--multiui-muted);font-size:10px}.status-connected{color:var(--multiui-green)}.status-failed,.status-disconnected{color:#d88958}.ready-dot{color:#0000;font-size:9px}.ready-dot.is-ready{color:#8bd49a}.control-panel{gap:8px;padding-bottom:10px;display:grid}.control-panel button{cursor:pointer;background:#171b1c;border:1px solid #45413a;border-radius:6px;margin:0 10px;padding:10px 7px;font-size:12px}.event-panel{flex:170px;min-height:160px}.event-panel ol{max-height:260px;margin:0;padding:7px 12px 12px;list-style:none;overflow:auto}.event-panel li{color:#c8c4bb;grid-template-columns:33px 1fr;gap:9px;padding:5px 0;font-size:11px;display:grid}.event-panel time{color:#847e73}@media (width<=1050px){.multi-app-shell{height:auto;overflow:visible}.topbar{grid-template-columns:auto 1fr}.topbar-meta{display:none}.game-layout{grid-template-columns:1fr;height:auto;overflow:visible}.game-stage,.multi-board-host{min-height:520px}.session-panel{grid-template-columns:1fr 1fr;display:grid;overflow:visible}.lobby-layout{grid-template-columns:minmax(0,1fr) 310px}}@media (width<=680px){body{background:#080b0c}.topbar{flex-basis:58px;grid-template-columns:1fr auto;gap:8px;height:58px;padding:0 12px}.brand strong{font-size:19px}.brand-tile{width:28px;font-size:15px}.network-health{font-size:11px}.game-layout{gap:10px;padding:8px}.game-stage,.multi-board-host{min-height:640px}.lobby-layout{flex-direction:column;padding:10px 8px 18px;display:flex}.lobby-main{padding:22px 16px 16px}.lobby-intro h1{font-size:28px}.lobby-members ol,.display-name-editor{grid-template-columns:1fr}.display-name-editor small{grid-column:1}.lobby-controls{grid-template-columns:1fr;padding-top:24px}.session-panel{grid-template-columns:1fr;display:grid}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}:root{--mahjong-brass:#c7a86b;--mahjong-brass-light:#ead2a0;--mahjong-border-brass:#725b32;--mahjong-muted:#999b96;--mahjong-green:#57d36d;--mahjong-red:#b43222;--mahjong-shadow:0 20px 45px #0006}.mahjong-game{grid-template-rows:auto minmax(0,1fr) auto auto;gap:10px;min-width:0;height:100%;min-height:0;display:grid}.mahjong-waiting{height:100%;color:var(--mahjong-muted);place-items:center;display:grid}.turn-banner{justify-content:space-between;align-items:baseline;gap:16px;min-height:28px;padding:0 8px;display:flex}.turn-banner span{color:var(--mahjong-brass-light);font-family:Georgia,Noto Serif SC,serif;font-weight:700}.turn-banner small{color:var(--mahjong-muted);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.table-frame{aspect-ratio:1.34;max-width:100%;height:100%;min-height:0;box-shadow:var(--mahjong-shadow), inset 0 0 0 5px #080a0b, inset 0 0 0 7px #29251f;background:linear-gradient(145deg,#181b1b,#080a0b);border:1px solid #443d31;border-radius:12px;justify-self:center;padding:18px}.felt-table{background:radial-gradient(circle,#0000 0 22%,#ddc9970d 22.5% 23%,#0000 23.5%),repeating-linear-gradient(82deg,#ffffff03 0 1px,#0000 1px 7px),linear-gradient(145deg,#135c43,#0b4934 58%,#083b2a);border:1px solid #092b20;border-radius:6px;height:100%;position:relative;overflow:hidden;box-shadow:inset 0 0 55px #00000059}.felt-table:after{content:"东　南　西　北";color:#ebdcaf0d;letter-spacing:.4em;pointer-events:none;place-items:center;font:700 clamp(36px,5vw,82px)/1 Georgia,serif;display:grid;position:absolute;inset:23%;transform:rotate(-24deg)}.player-seat{z-index:5;background:#080d0ed1;border:1px solid #c7a86b7a;border-radius:7px;align-items:center;gap:9px;min-width:132px;padding:7px 10px;display:flex;position:absolute;box-shadow:0 8px 18px #00000047}.player-seat.is-current{border-color:var(--mahjong-brass-light);box-shadow:0 0 0 2px #c7a86b26,0 8px 18px #00000052}.player-seat.is-winner{border-color:#74b97e;box-shadow:0 0 0 2px #5cb66926,0 8px 18px #00000052}.seat-north{top:2%;left:50%;transform:translate(-50%)}.seat-south{bottom:1.5%;left:50%;transform:translate(-50%)}.seat-west{top:48%;left:1.2%;transform:translateY(-50%)}.seat-east{top:48%;right:1.2%;transform:translateY(-50%)}.wind-mark{color:#f6e7bd;background:linear-gradient(145deg,#8a6b31,#443319);border-radius:5px;flex:0 0 34px;place-items:center;width:34px;height:34px;font:700 21px/1 Georgia,serif;display:grid}.seat-east .wind-mark{background:linear-gradient(145deg,#a83c2b,#5d1c15)}.seat-west .wind-mark{background:linear-gradient(145deg,#3d6697,#1f3654)}.seat-north .wind-mark{background:linear-gradient(145deg,#497f3b,#23451e)}.player-copy{flex-direction:column;gap:2px;min-width:0;display:flex}.player-copy strong{text-overflow:ellipsis;white-space:nowrap;max-width:100px;font-size:13px;overflow:hidden}.player-copy small{color:var(--mahjong-green);font-size:11px}.player-copy small:not(.connection-connected){color:#d5a250}.seat-game-meta{color:#d6c59d;white-space:nowrap;font-size:9px}.dealer-mark{color:var(--mahjong-brass);border:1px solid var(--mahjong-border-brass);border-radius:50%;padding:2px;font-size:11px}.opponent-hand{z-index:3;gap:1px;display:flex;position:absolute}.opponent-north{top:14%;left:50%;transform:translate(-50%)}.opponent-west{top:50%;left:12%;transform:translate(-50%,-50%)rotate(90deg)}.opponent-east{top:50%;right:12%;transform:translate(50%,-50%)rotate(90deg)}.tile-back{aspect-ratio:.72;background:linear-gradient(90deg,#dbc697,#fff7e0 52%,#c8ae75);border:1px solid #d4bf91;border-radius:3px;width:clamp(12px,1.8vw,23px);padding:2px;display:inline-flex;box-shadow:0 4px 6px #00000040}.tile-back span{background:linear-gradient(145deg,#2e714d,#123e2c);border-radius:2px;flex:1}.table-center{z-index:2;place-items:center;display:grid;position:absolute;inset:25% 24% 28%}.discard-river{grid-template-columns:repeat(5,minmax(24px,1fr));align-content:center;justify-items:center;gap:5px;width:100%;height:100%;padding:12%;display:grid}.round-dial{aspect-ratio:1;width:clamp(88px,10vw,128px);color:var(--mahjong-brass-light);background:linear-gradient(145deg,#1d2222,#0e1112);border:2px solid #9b7a3c;border-radius:16px;place-items:center;display:grid;position:absolute;box-shadow:0 9px 20px #00000061}.round-dial strong{font:700 clamp(18px,2vw,28px)/1 Georgia,serif}.round-dial span{color:#bbb39f;font-size:12px}.local-hand{z-index:6;justify-content:center;align-items:flex-end;gap:clamp(1px,.22vw,4px);min-height:74px;display:flex;position:absolute;bottom:11.5%;left:1%;right:1%}.local-melds{z-index:6;gap:8px;display:flex;position:absolute;bottom:25%;left:2%}.meld-group{background:#04161075;border:1px solid #c7a86b4d;border-radius:6px;gap:2px;padding:4px;display:inline-flex}.hand-placeholder{color:#f0e6cba6;background:#04171059;border:1px dashed #c7a86b59;border-radius:6px;padding:12px 18px}.local-hand .mahjong-tile{flex:1 1 0;width:auto;min-width:0;max-width:56px}.mahjong-tile{aspect-ratio:.69;color:#1e211a;background:linear-gradient(105deg,#d7c59e 0 4%,#fff9ea 8% 70%,#e5d6b7 100%);border:1px solid #baa271;border-radius:6px;flex:0 auto;place-items:center;width:clamp(29px,3.8vw,56px);padding:5px 3px 8px;font-family:Georgia,Noto Serif SC,serif;display:inline-grid;position:relative;transform:translateY(0);box-shadow:0 5px #9a7d43,0 9px 12px #00000057}button.mahjong-tile{cursor:pointer;transition:transform .14s,box-shadow .14s}button.mahjong-tile:hover{transform:translateY(-5px)}.mahjong-tile.is-selected{border-color:#ffdf91;transform:translateY(-12px);box-shadow:0 5px #9a7d43,0 0 0 2px #d4aa58,0 12px 18px #0000006b}.mahjong-tile.is-compact{border-radius:4px;width:clamp(23px,2.25vw,34px);padding:2px;box-shadow:0 3px #92763f,0 5px 7px #0000003d}.tile-label{writing-mode:vertical-rl;text-orientation:upright;letter-spacing:-.18em;font-size:clamp(15px,1.65vw,25px);font-weight:800}.is-compact .tile-label{font-size:clamp(11px,1vw,15px)}.tile-index{color:#886d36;font:700 8px/1 ui-sans-serif,sans-serif;position:absolute;bottom:2px;right:3px}.tile-characters .tile-label{color:#8c261c}.tile-dots .tile-label{color:#1e5c68}.tile-bamboo .tile-label{color:#206442}.tile-honor .tile-label{color:#2e5037}.tile-honor:nth-child(3n) .tile-label{color:#a02d21}.action-bar{grid-template-columns:1.25fr repeat(4,1fr);gap:10px;display:grid}.action-bar.phase-actions{grid-template-columns:minmax(120px,1fr) minmax(180px,1.4fr);align-items:center}.action-bar.phase-actions>span{color:var(--mahjong-brass-light);text-align:center;font:700 15px/1 Georgia,Noto Serif SC,serif}.action-bar.dingque-actions{grid-template-columns:minmax(110px,1fr) repeat(3,1fr)}.action-bar button{border:1px solid var(--mahjong-border-brass);color:#eadfc8;letter-spacing:.1em;cursor:pointer;background:linear-gradient(145deg,#17201d,#101515);border-radius:7px;min-height:52px;font:700 18px/1 Georgia,Noto Serif SC,serif}.action-bar button:not(:disabled):hover{border-color:var(--mahjong-brass-light);transform:translateY(-1px)}.action-bar .action-primary{background:linear-gradient(145deg,#d84a35,#8d1f16);border-color:#d75542}.action-bar button:disabled{opacity:.42;cursor:not-allowed}.settlement-strip{color:#d8c9a6;gap:10px;font-size:11px;display:flex;overflow-x:auto}.settlement-strip span{white-space:nowrap;background:#101516;border:1px solid #55472f;border-radius:999px;padding:6px 10px}.settlement-strip strong{color:#e6c77b;margin-right:6px}@media (width<=1050px){.mahjong-game{min-height:620px}.table-frame{width:min(100%,860px);height:auto;min-height:430px}}@media (width<=680px){.mahjong-game{min-height:640px}.turn-banner{gap:2px;min-height:35px;padding:0 3px;display:grid}.turn-banner small{font-size:10px}.table-frame{aspect-ratio:.82;border-radius:10px;width:100%;min-height:0;padding:9px}.player-seat{gap:5px;min-width:0;padding:5px 7px}.player-copy strong{max-width:74px;font-size:10px}.player-copy small{font-size:8px}.wind-mark{flex-basis:27px;width:27px;height:27px;font-size:16px}.seat-north{top:1%}.seat-south{bottom:3.5%}.seat-west{top:46%;left:0}.seat-east{top:46%;right:0}.opponent-north{top:13%}.opponent-west{left:12%}.opponent-east{right:12%}.tile-back{width:clamp(9px,2.8vw,15px)}.table-center{inset:27% 18% 31%}.round-dial{width:76px}.round-dial strong{font-size:16px}.discard-river{grid-template-columns:repeat(5,1fr);gap:3px;padding:5%}.mahjong-tile.is-compact{width:clamp(20px,5vw,28px)}.local-hand{scrollbar-width:none;justify-content:flex-start;gap:1px;min-height:60px;padding:15px 3px 8px;bottom:14%;left:2%;right:2%;overflow-x:auto}.local-melds{gap:4px;max-width:72%;bottom:25%;left:3%;overflow-x:auto}.local-hand::-webkit-scrollbar{display:none}.local-hand .mahjong-tile{flex:none;width:clamp(30px,7.1vw,43px)}.local-hand .tile-label{font-size:15px}.action-bar{z-index:15;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#0c0f10f0;border:1px solid #312d26;border-radius:14px;gap:5px;padding:9px;position:sticky;bottom:0}.action-bar.phase-actions{grid-template-columns:1fr 1.4fr}.action-bar.dingque-actions{grid-template-columns:repeat(3,1fr)}.action-bar.dingque-actions>span{grid-column:1/-1}.action-bar button{letter-spacing:.02em;min-height:48px;font-size:14px}}