*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}:root{--bg: #1a120b;--panel: #2b1c14;--panel2: #3a271b;--gold: #ffdf85;--cream: #f5e9c8;--muted: rgba(245, 233, 200, .6);--green: #2e9e5b;--red: #d84a3f}body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;background:radial-gradient(900px 500px at 85% -10%,rgba(255,183,77,.14),transparent 60%),radial-gradient(700px 420px at -10% 110%,rgba(62,140,111,.18),transparent 60%)}html,body{height:100%;overflow:hidden;background:linear-gradient(180deg,#241609 0%,var(--bg) 55%,#140d06 100%);font-family:system-ui,-apple-system,Segoe UI,sans-serif;color:var(--cream);-webkit-user-select:none;user-select:none;touch-action:manipulation}#game-container{position:fixed;inset:0}#game-container canvas{display:block;max-width:100vw!important;max-height:100vh!important;object-fit:contain!important}#ui-root{position:fixed;inset:0;pointer-events:none;z-index:10}.screen{position:absolute;inset:0;display:none;flex-direction:column;align-items:center;padding:calc(env(safe-area-inset-top,0px) + 18px) 18px calc(env(safe-area-inset-bottom,0px) + 18px);pointer-events:auto;overflow-y:auto}.screen.active{display:flex}.screen.overlay{background:#0a0603d1;backdrop-filter:blur(6px);justify-content:center}button{font-family:inherit;color:inherit;border:none;background:none;cursor:pointer}.btn{background:var(--panel2);border:1px solid rgba(255,215,106,.25);color:var(--cream);border-radius:14px;padding:13px 22px;font-size:16px;font-weight:600}.btn:disabled{opacity:.35}.btn-primary{background:linear-gradient(180deg,#f7c95c,#d19a2b);color:#241505;border:none;box-shadow:0 3px 14px #e8b84b59}.btn-danger{background:linear-gradient(180deg,#d84a3f,#a92f26);color:#fff;border:none}.btn-gold{background:linear-gradient(180deg,#e8b84b,#c98f2a);color:#241505}.btn-small{padding:9px 14px;font-size:14px;border-radius:10px}.btn-back{font-size:40px;line-height:1;color:var(--gold);padding:4px 14px}.spinner{width:46px;height:46px;border-radius:50%;border:4px solid rgba(255,215,106,.2);border-top-color:var(--gold);animation:spin .9s linear infinite;margin:40vh auto 14px}@keyframes spin{to{transform:rotate(360deg)}}.boot-text{text-align:center;color:var(--muted)}#screen-home{justify-content:space-between;max-width:520px;margin:0 auto;width:100%}.home-top{display:flex;justify-content:space-between;width:100%}.chip{background:var(--panel);border:1px solid rgba(255,215,106,.18);border-radius:20px;padding:8px 14px;font-size:15px;display:flex;align-items:center;gap:8px}.ava{font-size:20px}.logo{text-align:center;margin:8px 0}.logo h1{font-size:46px;letter-spacing:3px;color:#ffe08a;text-shadow:0 3px 0 rgba(0,0,0,.55),0 0 26px rgba(255,200,90,.45)}.logo-sub{letter-spacing:6px;font-size:11px;color:var(--muted);margin-top:4px}.logo-tiles{display:flex;justify-content:center;gap:6px;margin-bottom:10px}.lt{font-style:normal;width:40px;height:54px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:800;background:linear-gradient(180deg,#faf5e6,#e8dfc8);box-shadow:0 4px 8px #00000073;transform:rotate(-4deg)}.lt-b{transform:rotate(2deg) translateY(-4px);color:#2b6bd4}.lt-r{color:#d23b3b}.lt-y{transform:rotate(5deg);color:#c99a00}#resume-card{width:100%}.resume{width:100%;padding:13px;border-radius:14px;font-size:16px;font-weight:700;background:#2e9e5b2e;border:1px solid rgba(46,158,91,.5);color:#b8ecd0;margin-bottom:10px}.mode-list{width:100%;display:flex;flex-direction:column;gap:10px}.mode{border-radius:16px;padding:15px 18px;text-align:left;display:flex;flex-direction:column;gap:2px;border:1px solid rgba(255,215,106,.22);background:var(--panel)}.mode b{font-size:19px;letter-spacing:1px}n.mode{box-shadow:0 4px 18px #00000059}.mode span{font-size:13px;color:var(--muted)}.mode.ranked b{color:var(--gold)}.mode.quick b{color:#7ec8ff}.offline-block{border-radius:16px;padding:12px 14px;background:var(--panel);border:1px solid rgba(255,215,106,.14)}.offline-head{display:flex;flex-direction:column;margin-bottom:8px}.offline-head b{font-size:16px;letter-spacing:1px;color:#b8ecd0}.offline-head span{font-size:12px;color:var(--muted)}.diff-row{display:flex;gap:8px}.diff{flex:1;padding:11px 4px;border-radius:12px;background:var(--panel2);border:1px solid rgba(255,215,106,.16);font-size:13px;font-weight:700}.diff:active{transform:scale(.96)}.home-links{display:flex;gap:8px;width:100%;justify-content:center}.link{background:var(--panel);border-radius:12px;padding:11px 13px;font-size:14px;border:1px solid rgba(255,215,106,.14)}.screen-head{display:flex;align-items:center;gap:8px;width:100%;max-width:520px;margin-bottom:14px}.screen-head h2{font-size:22px;color:var(--gold)}.season-line{color:var(--muted);font-size:14px;margin-bottom:12px}.lb-list{width:100%;max-width:520px;display:flex;flex-direction:column;gap:6px}.lb-row{display:flex;align-items:center;gap:10px;background:var(--panel);border-radius:12px;padding:10px 14px;border:1px solid rgba(255,215,106,.1)}.lb-row.me{border-color:#ffd76a80;background:#ffd76a14}.lb-rank{width:30px;color:var(--gold)}.lb-name{flex:1;font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lb-score{color:var(--gold);font-size:16px}.lb-empty{color:var(--muted);text-align:center;padding:30px}.profile-body,.settings-body,.rules-body{width:100%;max-width:520px;display:flex;flex-direction:column;gap:14px}.pf-row label,.set-row span{font-size:14px;color:var(--muted)}.pf-row{display:flex;flex-direction:column;gap:8px}.pf-nick,.pf-id{display:flex;gap:8px;align-items:center}.pf-nick input{flex:1;background:var(--panel);border:1px solid rgba(255,215,106,.2);color:var(--cream);border-radius:10px;padding:12px;font-size:16px;outline:none}.pf-id code{flex:1;background:var(--panel);padding:12px;border-radius:10px;font-size:18px;letter-spacing:3px;color:var(--gold)}.avatar-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:6px}.ava-btn{font-size:24px;padding:8px 0;background:var(--panel);border-radius:10px;border:2px solid transparent}.ava-btn.sel{border-color:var(--gold);background:#ffd76a1f}.pf-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:6px}.pf-stats div{background:var(--panel);border-radius:12px;padding:12px 4px;text-align:center}.pf-stats b{display:block;font-size:20px;color:var(--gold)}.pf-stats span{font-size:12px;color:var(--muted)}.set-row{display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--panel);border-radius:12px;padding:12px 14px}.toggle{width:52px;height:30px;border-radius:15px;background:#4a3826;position:relative;transition:background .2s}.toggle.on{background:var(--green)}.toggle:after{content:"";position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;background:#fff;transition:transform .2s}.toggle.on:after{transform:translate(22px)}.lang-row,.cosmetic-row{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}.lang,.cos{background:var(--panel2);border:1px solid rgba(255,215,106,.18);border-radius:10px;padding:8px 12px;font-size:13px}.lang.sel,.cos.sel{background:#ffd76a2e;border-color:var(--gold)}.cos.locked{opacity:.45}.rule{display:flex;gap:10px;background:var(--panel);border-radius:12px;padding:12px 14px;align-items:flex-start}.rule b{color:var(--gold);min-width:20px}.rule span{font-size:14.5px;line-height:1.45}.rules-ok{margin:18px auto 0}.queue-box{display:flex;flex-direction:column;align-items:center;gap:18px}.queue-spinner{width:60px;height:60px;border-radius:50%;border:5px solid rgba(255,215,106,.2);border-top-color:var(--gold);animation:spin .9s linear infinite}.queue-title{font-size:18px}.result-box{width:100%;max-width:460px;background:var(--panel);border:1px solid rgba(255,215,106,.3);border-radius:20px;padding:22px;display:flex;flex-direction:column;gap:14px}.res-title{text-align:center;font-size:28px;font-weight:800;letter-spacing:1px}.res-title.gold{color:var(--gold);text-shadow:0 2px 12px rgba(255,215,106,.4)}.flag{text-align:center;display:block;color:#ffb27a;font-size:14px}.res-rows{display:flex;flex-direction:column;gap:6px}.res-row{display:flex;align-items:center;gap:8px;background:var(--panel2);border-radius:10px;padding:9px 12px}.res-row.winner{border:1px solid rgba(255,215,106,.55)}.res-row.me{background:#ffd76a14}.res-name{flex:1;font-size:15px}.res-tag{font-size:11px;color:var(--muted)}.res-pen{color:var(--red);font-size:16px}.res-pen.opp{color:#ffb27a}.res-xp{text-align:center;color:#b8ecd0;font-weight:700}.res-btns{display:flex;gap:10px;justify-content:center}.confirm-box{background:var(--panel);border-radius:18px;padding:24px;max-width:360px;text-align:center;display:flex;flex-direction:column;gap:16px}#hud{position:absolute;inset:0;pointer-events:none}#hud.hidden{display:none}#action-bar{position:absolute;left:0;right:0;bottom:calc(env(safe-area-inset-bottom,0px) + 8px);display:flex;gap:8px;justify-content:center;padding:0 12px;pointer-events:auto}.ab{background:#2b1c14f2;border:1px solid rgba(255,215,106,.35);color:var(--cream);border-radius:14px;min-width:62px;height:54px;font-size:15px;font-weight:700;padding:6px 12px 4px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}.ab .ab-label{font-size:11px;font-weight:600;letter-spacing:.4px;opacity:.9}.ab svg{display:block}.ab:disabled{opacity:.35}.ab.primary{background:linear-gradient(180deg,#e8b84b,#c98f2a);color:#241505;border:none}.ab.primary.hidden,#hud .hidden{display:none}#emoji-bar{position:absolute;right:10px;bottom:calc(env(safe-area-inset-bottom,0px) + 148px);display:flex;flex-direction:column;gap:6px;pointer-events:auto}.em{background:#241812e6;border:1px solid rgba(255,215,106,.25);border-radius:50%;width:44px;height:44px;font-size:21px}#hud-menu{position:absolute;top:calc(env(safe-area-inset-top,0px) + 12px);right:12px;display:flex;flex-direction:column;gap:8px;pointer-events:auto;z-index:30}.mm{background:#241812f5;border:1px solid rgba(255,215,106,.3);border-radius:12px;padding:12px 18px;font-size:15px;text-align:left}#toast{position:fixed;top:18%;left:50%;transform:translate(-50%) translateY(-8px);background:#140c06f2;border:1px solid rgba(255,215,106,.4);color:var(--cream);padding:11px 20px;border-radius:14px;font-size:15px;opacity:0;transition:all .25s;z-index:60;pointer-events:none}#toast.show{opacity:1;transform:translate(-50%) translateY(0)}.ad-sim{position:fixed;inset:0;background:#000000e6;display:flex;align-items:center;justify-content:center;z-index:100}.ad-sim-box{background:#222;border:1px solid #444;border-radius:16px;padding:30px;text-align:center;display:flex;flex-direction:column;gap:14px;min-width:260px}.ad-sim-tag{color:#888;font-size:11px;letter-spacing:2px}.ad-sim-name{color:#fff;font-size:18px}.ad-sim-count{color:var(--gold);font-size:34px;font-weight:800}@media(max-width:420px){#action-bar{gap:5px;padding:0 5px}.ab{min-width:54px;height:52px;font-size:13px;padding:5px 8px 3px;border-radius:12px}.ab .ab-label{font-size:10px}.ab.primary{font-size:12px;padding:5px 10px 3px}}.mode.friend b{color:#ffb27a}.rm-code-box{background:var(--panel);border:1px solid rgba(255,215,106,.3);border-radius:16px;padding:18px;display:flex;align-items:center;gap:12px;justify-content:center;margin-bottom:14px}.rm-code-box span{color:var(--muted);font-size:14px}.rm-code-box code{font-size:34px;letter-spacing:10px;color:var(--gold);font-weight:800}.rm-seats{display:flex;flex-direction:column;gap:8px;margin-bottom:16px}.rm-seat{display:flex;align-items:center;gap:10px;background:var(--panel);border-radius:12px;padding:12px 14px;border:1px solid rgba(255,215,106,.1)}.rm-seat.me{border-color:#ffd76a80}.rm-seat.empty{opacity:.45}.rm-seat .rm-name{flex:1;font-size:15px}.rm-seat .rm-tag{font-size:12px;color:var(--gold)}.rm-actions{display:flex;flex-direction:column;gap:10px;margin-top:6px}.rm-wait{text-align:center;color:var(--muted);padding:12px}@media(orientation:landscape){#action-bar{inset:50% 10px auto auto;transform:translateY(-50%);flex-direction:column;width:fit-content;gap:8px;padding:8px 6px;background:#140c068c;border-radius:16px}.ab{min-width:74px}#emoji-bar{inset:50% auto auto 10px;transform:translateY(-50%)}}