:root{color-scheme:dark;font-family:Inter,Microsoft YaHei,system-ui,sans-serif;background:#101010;color:#f7f1df}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:#101010}button,select,input{font:inherit}button{transition:transform .1s ease-out,filter .14s ease,box-shadow .14s ease,border-color .14s ease}button:not(.hand-card):not(:disabled):active{transform:scale(.93);transition-duration:80ms}button:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid #22d3ee;outline-offset:2px}button:disabled{cursor:not-allowed;opacity:.45}input{min-height:44px;border:1px solid #4a453e;background:#111;color:#f7f1df;padding:0 12px}.lobby-shell{display:grid;place-items:center;min-height:100vh;padding:18px;background:linear-gradient(#0c0c0c9e,#0c0c0cc7),radial-gradient(circle at 50% 16%,#394b4b,transparent 36%),linear-gradient(180deg,#22221f,#0f0f0f)}.lobby-card{width:min(440px,100%);border:1px solid #3e3931;background:#161616f0;box-shadow:0 22px 60px #0000006b}.lobby-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:18px;border-bottom:1px solid #34302a}.lobby-head span,.invite-panel span{display:block;color:#f7bd39;font-size:12px}.lobby-head h1{margin:4px 0 0;font-size:24px;letter-spacing:0}.join-panel,.player-list,.lobby-actions,.invite-panel{margin:14px}.join-panel{display:grid;gap:12px}.join-panel label{display:grid;gap:7px;color:#d3ccbd;font-size:13px}.join-row{display:grid;grid-template-columns:1fr 86px;gap:10px}.join-row button,.invite-panel button,.lobby-actions button,.wide{min-height:46px;border:0;color:#fff;background:#44423d;cursor:pointer}.wide{width:100%}.invite-panel{display:grid;grid-template-columns:1fr 78px;gap:10px;align-items:center;padding:12px;background:#24231f;border:1px solid #3c372f}.invite-panel strong{display:block;overflow:hidden;margin-top:4px;color:#f4efe3;font-size:13px;text-overflow:ellipsis;white-space:nowrap}.player-list{display:grid;gap:8px}.lobby-player{display:grid;grid-template-columns:34px 1fr 16px;gap:10px;align-items:center;min-height:58px;padding:10px;background:#1b1b1b;border:1px solid #34302a}.lobby-player strong,.lobby-player span{display:block}.lobby-player span{color:#c8c0aa;font-size:12px}.lobby-player i{width:12px;height:12px;border:1px solid #6f6658;background:#37322b}.lobby-player i.ready{border-color:#8cffc1;background:#2e9d69}.lobby-actions{display:grid;grid-template-columns:1fr 1fr 1.1fr;gap:10px}.status-text{min-height:20px;margin:0 14px 14px;color:#ffd45f;font-size:13px}.app-shell{display:grid;grid-template-columns:minmax(320px,430px) minmax(280px,380px);justify-content:center;gap:18px;min-height:100vh;padding:18px}.table-surface{position:relative;display:grid;grid-template-rows:auto auto 1fr auto;overflow:hidden;min-height:calc(100vh - 36px);border:1px solid #34302a;background:radial-gradient(circle at 50% 12%,rgba(255,255,255,.12),transparent 34%),linear-gradient(180deg,#d8d7d2,#bcbab4 58%,#77756f)}.topbar{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:18px auto 0;width:min(86%,340px);padding:9px 11px;border:2px solid #d99c18;background:#432d06eb;box-shadow:4px 4px #00000052}.topbar strong,.topbar span{display:block}.eyebrow{color:#ffd45f;font-size:11px}.backend-pill{padding:5px 7px;background:#e44a3d;color:#fff;font-size:12px;white-space:nowrap}.backend-pill.online{background:#2e9d69}.opponents{display:grid;gap:8px;width:min(86%,340px);margin:14px auto 0}.player-seat{display:flex;align-items:center;gap:9px;padding:7px;border:1px solid rgba(255,255,255,.18);background:#1314159e}.player-seat span{display:block;color:#c8c0aa;font-size:12px}.avatar{display:grid;place-items:center;width:28px;height:28px;background:#21252a;border:1px solid #6d6147}.center-lane{position:relative;display:grid;place-content:center;gap:16px;min-height:260px;border:2px dashed transparent;transition:border-color .14s ease,background .14s ease}.center-lane.drop-ready{border-color:#ffd24ae0;background:#ffd24a14}.drop-hint{display:grid;place-items:center;min-height:34px;padding:0 12px;border:1px solid rgba(255,210,74,.85);background:#1c1609c7;color:#ffd45f;font-size:13px;font-weight:700}.discard-card{display:grid;place-items:center;width:92px;height:128px;transform:rotate(-8deg);border:2px solid #241f1a;background:linear-gradient(145deg,#501b1c,#1c1d21 62%);box-shadow:0 14px 24px #00000059}.discard-card span,.phase-panel span{color:#d7c6a1;font-size:12px}.discard-card strong{font-size:22px}.phase-panel{display:flex;align-items:center;gap:10px;padding:8px;background:#0006}.phase-panel select{border:1px solid #575148;background:#191919;color:#fff;padding:6px}.response-bar{position:absolute;left:18px;right:18px;bottom:146px;display:grid;grid-template-columns:1fr auto auto;gap:8px;align-items:center;padding:8px;border:1px solid #f2b937;background:#9a5c12;box-shadow:0 6px 16px #00000059}.timer-track{height:10px;margin-top:5px;border:1px solid #f6d68c;background:#332618}.timer-track i{display:block;width:68%;height:100%;background:#ffd44c}.log-panel{width:min(86%,340px);margin:0 auto 132px;padding:8px;background:#0c0c0c7a}.log-panel p{margin:4px 0;color:#eee3c3;font-size:12px}.log-panel span{margin-right:7px;color:#f7bd39}.hand-dock{position:fixed;left:50%;bottom:18px;transform:translate(calc(-50% - 199px));width:min(430px,calc(100vw - 36px));padding:8px 10px calc(10px + env(safe-area-inset-bottom));background:#161616e0;border:1px solid #34302a}.jinnang-strip{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(82px,1fr);gap:6px;overflow-x:auto;padding-bottom:8px}.jinnang-card,.hand-card,.bottom-actions button{border:1px solid transparent;color:#fff;cursor:pointer}.jinnang-card{position:relative;min-height:42px;background:#3b3b37}.jinnang-card.playable{border-color:#20a3fff2;box-shadow:inset 0 0 0 1px #20a3ffe6,0 0 10px #20a3ff61}.jinnang-card.selected{border-color:#ffd24a;background:#6a4d16;box-shadow:inset 0 0 0 1px #ffd84af5,0 0 16px #ffd84a73;animation:selected-pulse .76s ease-in-out infinite alternate}.hand-row{display:flex;justify-content:center;min-height:124px;padding:4px 0 0}.hand-card{position:relative;display:grid;align-content:space-between;width:70px;height:112px;margin-left:-15px;padding:8px;border:2px solid #101010;background:#303030;transform:rotate(var(--tilt, 0deg));transition:transform .14s ease,margin .14s ease,border-color .14s ease;box-shadow:0 12px 16px #00000040}.hand-card:before,.hand-card:after{content:"";position:absolute;top:4px;right:4px;bottom:4px;left:4px;pointer-events:none;opacity:0}.hand-card:before{border:2px solid rgba(32,163,255,.95);box-shadow:0 0 14px #20a3ff99}.hand-card:after{border:2px solid rgba(255,216,74,.98);box-shadow:0 0 18px #ffd84aad}.hand-card:first-child{margin-left:0}.hand-card:hover,.hand-card.selected{z-index:2;transform:translateY(-14px) scale(1.04)}.hand-card.playable:before{opacity:1}.hand-card.selected:before{opacity:0}.hand-card.selected:after{opacity:1;animation:selected-pulse .76s ease-in-out infinite alternate}.hand-card:not(.playable):not(.selected){filter:saturate(.82) brightness(.86)}.hand-card.red{background:linear-gradient(145deg,#7a2628,#241d1d)}.hand-card.blue{background:linear-gradient(145deg,#294f94,#1c2230)}.hand-card.green{background:linear-gradient(145deg,#34764d,#1e2a20)}.hand-card.yellow{background:linear-gradient(145deg,#8c752a,#2c2619)}.hand-card.wild{background:linear-gradient(145deg,#4c3b77,#1b1b1f)}.hand-card span{color:#f8d86a;font-size:12px}.hand-card strong{font-size:24px}.bottom-actions{display:grid;grid-template-columns:auto auto minmax(64px,1fr) minmax(70px,1fr) minmax(64px,.85fr) minmax(92px,1.15fr);gap:8px;align-items:center;padding-top:8px}.bottom-actions button{min-height:44px}.bottom-actions button:not(:disabled):hover,.join-row button:not(:disabled):hover,.invite-panel button:not(:disabled):hover,.lobby-actions button:not(:disabled):hover,.wide:not(:disabled):hover{filter:brightness(1.12)}.secondary{background:#44423d}.primary{background:#f28a23}.pass{background:#f7d94c;color:#141414!important;font-weight:700}.prompt{animation:action-prompt .84s ease-in-out infinite alternate}@keyframes selected-pulse{0%{transform:scale(1);opacity:.78}to{transform:scale(1.035);opacity:1}}@keyframes action-prompt{0%{box-shadow:0 0 #ffd84a00;transform:scale(1)}to{box-shadow:0 0 18px #ffd84a7a;transform:scale(1.055)}}.deck-count{display:flex;align-items:center;gap:5px;min-width:42px;color:#f4efe3;font-size:12px}.deck-count i{width:12px;height:12px;flex:0 0 12px}.uno-dot{background:#1d2638}.jn-dot{background:#d88cb5}.side-panel{align-self:start;max-height:calc(100vh - 36px);overflow:auto;padding:18px;border:1px solid #34302a;background:#191919}.side-panel h2{margin:0 0 10px;font-size:16px}.side-panel h2:not(:first-child){margin-top:20px}.side-panel ul{margin:0;padding-left:18px}.side-panel li,.side-panel dd,.side-panel p{color:#d3ccbd;line-height:1.45}.side-panel dl,.side-panel dd{margin:0}.side-panel div+div{margin-top:10px}.side-panel dt{color:#ffd45f;font-weight:700}@media(max-width:820px){.app-shell{display:block;padding:0}.table-surface{min-height:100vh;border:0}.hand-dock{left:0;right:0;bottom:0;width:100%;transform:none;border-left:0;border-right:0}.side-panel{display:none}.log-panel{margin-bottom:150px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}