:root{--bg: #17110c;--bg-deep: #0f0a06;--panel: #241a12;--panel-2: #2e2218;--panel-3: #382a1d;--line: #3d2e1f;--line-hi: rgba(255, 205, 140, .14);--text: #f4e8d4;--muted: #a68c6c;--accent: #ff9f36;--accent-2: #ffc46a;--accent-deep: #b35f10;--green: #86d873;--green-deep: #3f7a34;--blue: #6fb7e8;--purple: #b78aff;--danger: #e06a4e;--radius: 16px;--font-display: "Lilita One", system-ui, sans-serif;--font-body: "Nunito", system-ui, sans-serif;--font-mono: "IBM Plex Mono", ui-monospace, monospace;--surface: linear-gradient(180deg, var(--panel-3) 0%, var(--panel) 55%);--raised: inset 0 1px 0 var(--line-hi), inset 0 -2px 0 rgba(0, 0, 0, .35), 0 10px 24px rgba(0, 0, 0, .5);--well: inset 0 3px 8px rgba(0, 0, 0, .55), inset 0 -1px 0 var(--line-hi)}*{margin:0;padding:0;box-sizing:border-box}[hidden]{display:none!important}body{font-family:var(--font-body);background:radial-gradient(1100px 520px at 50% -8%,rgba(44,32,19,.85) 0%,transparent 62%),url(/img/bg.png) center / 1024px auto repeat fixed,var(--bg);color:var(--text);min-height:100vh;font-size:16px}.gold-text{background:linear-gradient(180deg,#fff3c4,#f6cd66 38%,#d89a26 62%,#f9e2a0);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:#f6cd66;filter:drop-shadow(0 3px 2px rgba(0,0,0,.65))}body:after{content:"";position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:999;opacity:.05;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E")}button{font-family:inherit}canvas{display:block}.ic{width:22px;height:22px;flex-shrink:0}.ic-s{width:16px;height:16px}.ic-dim{color:var(--muted);margin-left:auto}.ic-purple{color:var(--purple)}.ic-orange{color:var(--accent)}.screen{display:none;min-height:100vh}.screen.active{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:1.5rem}#screen-menu.active,#screen-match.active,#screen-login.active{justify-content:flex-start}#screen-login.active{justify-content:center}.panel{position:relative;background:var(--surface);border:1px solid #66471f;border-radius:var(--radius);padding:1.75rem;box-shadow:inset 0 0 0 1px #0000008c,inset 0 2px #ffe0a024,inset 0 -3px #0006,0 12px 30px #0000008c}.panel:before{content:"";position:absolute;inset:1px 1px auto 1px;height:42%;border-radius:calc(var(--radius) - 2px) calc(var(--radius) - 2px) 50% 50%;background:linear-gradient(180deg,#ffecbe12,#ffecbe00);pointer-events:none}.panel.narrow{width:min(460px,100%);display:flex;flex-direction:column;gap:.9rem}.panel.wide{width:min(900px,100%)}.panel h2{font-family:var(--font-display);font-size:1.6rem;letter-spacing:.02em;display:flex;align-items:center;gap:.6rem}.panel h3{font-family:var(--font-display);font-size:1.1rem;color:var(--accent-2);display:flex;align-items:center;gap:.45rem}.panel-head{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}.panel-head h2{flex:1}.hint{color:var(--muted);font-size:.9rem}.centered-panel{align-items:center;text-align:center}.btn{border:1px solid var(--line);border-radius:12px;padding:.8rem 1.4rem;font-size:1rem;font-weight:800;cursor:pointer;background:linear-gradient(180deg,var(--panel-3),var(--panel-2));color:var(--text);box-shadow:inset 0 1px 0 var(--line-hi),0 4px #00000073;transition:transform .08s ease,box-shadow .08s ease,filter .12s ease;display:inline-flex;align-items:center;justify-content:center;gap:.55rem}.btn:hover{filter:brightness(1.12)}.btn:active{transform:translateY(3px);box-shadow:inset 0 1px 0 var(--line-hi),0 1px #00000073}.btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.btn:disabled{opacity:.45;cursor:not-allowed;filter:none}.btn-primary{position:relative;background:linear-gradient(180deg,#ffefb0,#f6cd66 30%,#e2a52f 52%,#c9861a 55%,#eab54a);border-color:#8f5f0a;color:#3a2503;text-shadow:0 1px 0 rgba(255,240,190,.6);box-shadow:inset 0 2px #ffffff8c,inset 0 -3px 4px #7a4a0673,0 4px #7a4c06,0 8px 14px #0006;overflow:hidden}.btn-primary:after{content:"";position:absolute;top:0;right:0;bottom:52%;left:0;background:linear-gradient(180deg,#ffffff73,#ffffff0d);border-radius:12px 12px 60% 60%;pointer-events:none}.btn-primary:active{box-shadow:inset 0 2px #ffffff8c,inset 0 -3px 4px #7a4a0673,0 1px #7a4c06}.btn-secondary{border-color:var(--accent-deep);color:var(--accent-2)}.btn-ghost{background:transparent;color:var(--muted);box-shadow:none;border-color:transparent}.btn-ghost:hover{color:var(--text);border-color:var(--line)}.btn-ghost:active{transform:none}.btn-small{padding:.4rem .9rem;font-size:.85rem}.btn-block{width:100%}.form-error{color:var(--danger);font-size:.9rem}.form-error.centered{text-align:center;margin-top:.75rem}input[type=text]{background:var(--bg-deep);border:1px solid var(--line);border-radius:12px;color:var(--text);font-family:var(--font-body);font-size:1rem;padding:.8rem 1rem;width:100%;box-shadow:var(--well)}input[type=text]:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.icon-plate{width:52px;height:52px;border-radius:14px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line);background:radial-gradient(120% 120% at 30% 20%,var(--panel-3),var(--bg-deep));box-shadow:inset 0 1px 0 var(--line-hi),inset 0 -3px 6px #00000073,0 4px 10px #00000059}.icon-plate .ic{width:26px;height:26px}.plate-green{color:var(--green);box-shadow:inset 0 1px 0 var(--line-hi),inset 0 -3px 6px #00000073,0 0 18px #86d87326}.plate-gold{color:var(--accent-2);box-shadow:inset 0 1px 0 var(--line-hi),inset 0 -3px 6px #00000073,0 0 18px #ff9f362e}.plate-blue{color:var(--blue);box-shadow:inset 0 1px 0 var(--line-hi),inset 0 -3px 6px #00000073,0 0 18px #6fb7e826}.plate-purple{color:var(--purple);box-shadow:inset 0 1px 0 var(--line-hi),inset 0 -3px 6px #00000073,0 0 18px #b78aff26}.login-scene{position:absolute;left:0;right:0;bottom:0;width:100%;height:min(52vh,460px);object-fit:cover;object-position:center bottom;opacity:.85;pointer-events:none;mask-image:linear-gradient(180deg,transparent,black 42%);-webkit-mask-image:linear-gradient(180deg,transparent,black 42%)}#screen-login{position:relative;overflow:hidden}.login-layout{position:relative;z-index:1;flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2.5rem;width:100%}.login-box{text-align:center;display:flex;flex-direction:column;align-items:center;gap:1.1rem;max-width:440px}.login-logo{width:168px;height:168px;filter:drop-shadow(0 10px 28px rgba(0,0,0,.6)) drop-shadow(0 0 34px rgba(255,200,110,.22));animation:logo-float 4.5s ease-in-out infinite}@keyframes logo-float{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.brand-logo{width:34px;height:34px}.game-title{font-family:var(--font-display);font-size:clamp(2.6rem,7vw,3.6rem);line-height:1.05;letter-spacing:.01em}.login-tagline{color:var(--muted);max-width:34ch}.login-buttons{display:flex;flex-direction:column;gap:.7rem;width:min(340px,100%)}.btn-wallet{justify-content:flex-start;text-align:left;padding:.9rem 1.1rem}.btn-guest{justify-content:center}.btn-guest small{display:block;font-weight:400;font-size:.75rem;opacity:.8}.gate-note{color:var(--muted);font-size:.85rem;max-width:40ch}.social-row{display:flex;gap:.7rem;justify-content:center}.social-btn{width:44px;height:44px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:var(--surface);border:1px solid var(--line);box-shadow:var(--raised);color:var(--text);transition:transform .15s ease,color .15s ease,border-color .15s ease}.social-btn:hover{transform:translateY(-2px);color:var(--accent-2);border-color:var(--accent-deep)}.social-btn .ic{width:20px;height:20px}.foot-social{display:flex;align-items:center;gap:.5rem}.foot-social .social-btn{width:32px;height:32px;box-shadow:none}.foot-social .social-btn .ic{width:15px;height:15px}a.btn{text-decoration:none}.docs-link{color:var(--accent-2);font-size:.9rem;font-weight:700;text-decoration:none;border-bottom:1px dashed var(--accent-deep);padding-bottom:1px}.docs-link:hover{color:var(--accent);border-bottom-style:solid}.steps-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;width:min(860px,100%)}.step-card{position:relative;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--raised);padding:1.2rem 1.2rem 1.1rem;display:flex;flex-direction:column;gap:.4rem}.step-card .ic{color:var(--accent-2);width:26px;height:26px}.step-card h4{font-family:var(--font-display);font-size:1.05rem}.step-card p{color:var(--muted);font-size:.85rem;line-height:1.45}.step-num{position:absolute;top:.9rem;right:1rem;font-family:var(--font-display);font-size:1.6rem;color:#ffc46a38}.site-footer{width:100%;margin-top:auto;padding:1.1rem 1.5rem;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;background:#0f0a0680}.foot-brand{font-family:var(--font-display);color:var(--accent);display:flex;align-items:center;gap:.5rem;font-size:.95rem}.foot-brand .ic{width:18px;height:18px}.foot-note{color:var(--muted);font-size:.8rem}.preview-well{margin:0 auto;padding:10px;border-radius:50%;background:var(--bg-deep);box-shadow:var(--well);border:1px solid var(--line)}#create-preview{border-radius:50%}.color-row{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center}.color-swatch{width:36px;height:36px;border-radius:50%;border:3px solid transparent;cursor:pointer;padding:0;box-shadow:inset 0 -4px 6px #00000059,inset 0 2px 3px #ffffff4d,0 3px 6px #0006;transition:transform .1s ease}.color-swatch.selected{border-color:var(--text);transform:scale(1.15)}.topbar{width:100%;display:flex;align-items:center;gap:.8rem;padding:.7rem 1.5rem;border-bottom:1px solid #6b4c22;box-shadow:0 1px #ffdc9614,0 8px 24px #00000073;background:linear-gradient(180deg,#241a12eb,#140d08eb);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.brand{font-family:var(--font-display);font-size:1.15rem;color:var(--accent);margin-right:auto;display:flex;align-items:center;gap:.5rem}.brand .ic{width:22px;height:22px}.wallet-chip,.gate-chip{font-family:var(--font-mono);font-size:.78rem;background:var(--bg-deep);border:1px solid var(--line);border-radius:999px;padding:.32rem .85rem;color:var(--muted);box-shadow:var(--well)}.gate-chip.pass{color:var(--green);border-color:var(--green-deep)}.gate-chip.fail{color:var(--danger);border-color:var(--danger)}.scene-banner{position:relative;width:min(1200px,calc(100% - 3rem));margin:1.25rem auto 0;height:210px;border-radius:var(--radius);overflow:hidden;border:1px solid #6b4c22;box-shadow:inset 0 0 0 2px #ffdc961f,0 14px 34px #0000008c}.scene-banner img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;object-position:center 68%;display:block}.scene-caption{position:absolute;left:1.4rem;bottom:1rem;font-family:var(--font-display);font-size:1.35rem}.rejoin-banner{width:min(1200px,calc(100% - 3rem));margin:1rem auto 0;display:flex;align-items:center;gap:.8rem;background:linear-gradient(180deg,#ff9f3629,#ff9f3614);border:1px solid var(--accent-deep);border-radius:var(--radius);padding:.8rem 1.2rem;box-shadow:var(--raised);color:var(--accent-2);font-weight:800}.rejoin-banner .btn{margin-left:auto}.menu-grid{width:min(1200px,100%);display:grid;grid-template-columns:290px 1fr 270px;gap:1.25rem;padding:1.5rem;align-items:start}.hamster-card{display:flex;flex-direction:column;align-items:center;gap:.6rem;text-align:center}.portrait-ring{padding:8px;border-radius:50%;background:conic-gradient(from 210deg,var(--accent),#6b3f10,var(--accent));box-shadow:0 6px 18px #00000080}#menu-portrait{background:var(--bg-deep);border-radius:50%}.hamster-card h2{font-family:var(--font-display);font-size:1.35rem}.level-line{display:flex;gap:.5rem}.level-badge,.rating-badge{font-family:var(--font-mono);font-size:.8rem;background:var(--bg-deep);border:1px solid var(--line);border-radius:999px;padding:.25rem .75rem;box-shadow:var(--well);display:inline-flex;align-items:center;gap:.35rem}.level-badge{color:var(--accent-2)}.xp-bar{width:100%;height:14px;border-radius:999px;background:var(--bg-deep);border:1px solid var(--line);overflow:hidden;box-shadow:var(--well)}.xp-fill{height:100%;width:0%;background:linear-gradient(180deg,var(--accent-2),var(--accent));border-radius:999px;box-shadow:inset 0 1px #fff6;transition:width .6s ease}.xp-label{font-size:.82rem;color:var(--muted)}.record-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;width:100%}.record-cell{background:var(--bg-deep);border:1px solid var(--line);border-radius:10px;box-shadow:var(--well);padding:.5rem .3rem;display:flex;flex-direction:column;gap:.1rem}.record-cell b{font-family:var(--font-mono);font-size:.95rem;color:var(--accent-2)}.record-cell span{font-size:.68rem;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}.equipped-line{display:flex;flex-direction:column;gap:.15rem;margin-top:.3rem}.equipped-label{font-size:.7rem;text-transform:uppercase;letter-spacing:.12em;color:var(--muted)}.equipped-skills{font-size:.9rem;color:var(--accent-2);font-weight:700}.mode-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem}.mode-card{position:relative;background:var(--surface);border:1px solid #66471f;border-radius:var(--radius);box-shadow:inset 0 0 0 1px #0000008c,inset 0 2px #ffe0a024,inset 0 -3px #0006,0 12px 30px #0000008c;padding:1.4rem 1.3rem 1.1rem;display:flex;flex-direction:column;align-items:flex-start;gap:.5rem;cursor:pointer;color:var(--text);text-align:left;transition:transform .14s ease,border-color .14s ease,box-shadow .14s ease}.mode-card:hover:not(:disabled){transform:translateY(-4px);border-color:var(--accent-deep);box-shadow:var(--raised),0 14px 34px #ff9f361f}.mode-card:active:not(:disabled){transform:translateY(-1px)}.mode-card:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.mode-name{font-family:var(--font-display);font-size:1.3rem}.mode-desc{color:var(--muted);font-size:.88rem;line-height:1.4}.mode-foot{margin-top:.3rem;font-family:var(--font-mono);font-size:.7rem;color:var(--muted);border-top:1px solid var(--line);padding-top:.55rem;width:100%}.mode-card:disabled{cursor:not-allowed;opacity:.55}.mode-lock{margin-top:.35rem;font-size:.72rem;color:var(--danger);font-weight:800;display:inline-flex;align-items:center;gap:.3rem}.leaderboard h3{margin-bottom:.7rem}.board-list{display:flex;flex-direction:column;gap:.45rem}.board-row{display:flex;align-items:center;gap:.6rem;background:linear-gradient(180deg,var(--panel-2),var(--panel));border:1px solid var(--line);border-radius:10px;padding:.55rem .7rem;font-size:.88rem;box-shadow:inset 0 1px 0 var(--line-hi)}.board-row .dot{width:14px;height:14px;border-radius:50%;flex-shrink:0;box-shadow:inset 0 -2px 3px #0006,0 0 6px currentColor}.board-row .grow{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.board-row .num{font-family:var(--font-mono);font-size:.78rem;color:var(--muted)}.board-row.me{border-color:var(--accent-deep)}.board-row.finished{border-color:var(--green-deep)}.board-row .place{font-family:var(--font-display);width:1.7rem;color:var(--accent-2)}.info-row{width:min(1200px,100%);display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem;padding:0 1.5rem 1.75rem}.info-box{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--raised);padding:1.3rem;display:flex;flex-direction:column;gap:.55rem}.info-box h4{font-family:var(--font-display);font-size:1.05rem}.info-box p{color:var(--muted);font-size:.86rem;line-height:1.5}.sp-badge{font-family:var(--font-mono);font-size:.85rem;color:var(--accent);border:1px solid var(--accent-deep);border-radius:999px;padding:.3rem .85rem;background:var(--bg-deep);box-shadow:var(--well)}.loadout-strip{margin-top:1rem;display:flex;align-items:center;gap:1rem;flex-wrap:wrap;background:var(--bg-deep);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--well);padding:.9rem 1.2rem}.loadout-label{font-family:var(--font-display);color:var(--accent-2)}.loadout-slots{display:flex;gap:.6rem}.loadout-slot{width:54px;height:54px;border-radius:14px;border:2px dashed var(--line);display:flex;align-items:center;justify-content:center;color:var(--muted)}.loadout-slot.filled{border-style:solid;border-color:var(--accent-deep);background:radial-gradient(120% 120% at 30% 20%,var(--panel-3),var(--bg-deep));color:var(--accent-2);box-shadow:0 0 14px #ff9f3633}.loadout-slot .ic{width:24px;height:24px}.loadout-hint{color:var(--muted);font-size:.8rem;margin-left:auto}.tree-branches{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;margin-top:1.3rem}.branch-title{font-family:var(--font-display);margin-bottom:.8rem}.branch-nodes{display:flex;flex-direction:column}.tree-link{width:3px;height:22px;margin-left:38px;background:var(--line);position:relative}.tree-link.open{background:var(--accent-deep);box-shadow:0 0 8px #ff9f3666}.skill-node{background:var(--surface);border:1px solid var(--line);border-radius:14px;box-shadow:var(--raised);padding:.9rem 1rem;display:flex;gap:.9rem}.skill-node.locked{opacity:.55}.skill-node.equipped{border-color:var(--green-deep);box-shadow:var(--raised),0 0 16px #86d8731f}.skill-node .icon-plate{width:56px;height:56px;align-self:flex-start}.skill-body{flex:1;display:flex;flex-direction:column;gap:.3rem}.skill-node .skill-top{display:flex;align-items:baseline;gap:.6rem;flex-wrap:wrap}.skill-node .skill-name{font-family:var(--font-display);font-size:1.05rem}.skill-node .skill-meta{font-family:var(--font-mono);font-size:.7rem;color:var(--muted)}.skill-node .skill-desc{font-size:.85rem;color:var(--muted);line-height:1.4}.skill-node .skill-actions{display:flex;gap:.5rem;margin-top:.45rem;align-items:center}.equip-tag{font-size:.72rem;color:var(--green);font-weight:800;display:inline-flex;gap:.3rem;align-items:center}.lobby-shell{width:min(1100px,100%);display:flex;flex-direction:column;gap:1rem;padding:1.25rem 0}.lobby-head{display:flex;align-items:center;gap:1rem;flex-wrap:wrap;padding:1.1rem 1.5rem}.lobby-head h2{flex:1}.lobby-head-actions{display:flex;gap:.6rem;flex-wrap:wrap}.make-room-form{display:flex;gap:.6rem;align-items:center;padding:.9rem 1.2rem}.make-room-form input{flex:1}.lobby-columns{display:grid;grid-template-columns:1fr 260px;gap:1rem;align-items:stretch;min-height:320px}.room-list-panel{display:flex;flex-direction:column;padding:1.1rem 1.2rem}.room-list-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:.8rem;flex-wrap:wrap}.room-list-title{font-family:var(--font-display);color:var(--accent-2);font-size:1.05rem}.room-list{display:flex;flex-direction:column;gap:.55rem;overflow-y:auto;max-height:340px}.room-row{display:flex;align-items:center;gap:.9rem;background:linear-gradient(180deg,var(--panel-2),var(--panel));border:1px solid var(--line);border-radius:12px;padding:.65rem .9rem;box-shadow:inset 0 1px 0 var(--line-hi);transition:border-color .12s ease,transform .12s ease}.room-row:hover{border-color:var(--accent-deep);transform:translate(3px)}.room-num{font-family:var(--font-display);font-size:1rem;background:var(--bg-deep);border:1px solid var(--line);border-radius:9px;padding:.3rem .55rem;color:var(--accent-2);box-shadow:var(--well);min-width:52px;text-align:center}.room-info{flex:1;min-width:0}.room-name{font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.room-host{font-size:.75rem;color:var(--muted)}.room-count{font-family:var(--font-mono);font-size:.8rem;color:var(--muted)}.room-stamp{font-family:var(--font-display);font-size:.72rem;letter-spacing:.1em;padding:.25rem .6rem;border-radius:8px;transform:rotate(-4deg);border:2px solid var(--green);color:var(--green)}.room-stamp.full{border-color:var(--muted);color:var(--muted)}.room-list-empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;color:var(--muted);padding:2rem 0;text-align:center}.room-list-empty .ic{width:34px;height:34px;opacity:.6}.online-panel{display:flex;flex-direction:column;padding:1.1rem 1.2rem}.online-count{font-family:var(--font-mono);font-size:.78rem;color:var(--muted);margin-left:.3rem}.online-scroll{overflow-y:auto;max-height:340px;margin-top:.7rem}.chat-dock{display:flex;flex-direction:column;gap:.6rem;padding:1rem 1.2rem}.chat-dock.in-room{border:1px solid var(--line);border-radius:12px;background:var(--bg-deep);box-shadow:var(--well)}.chat-messages{height:130px;overflow-y:auto;display:flex;flex-direction:column;gap:.25rem;font-size:.88rem;padding-right:.4rem}.chat-line{line-height:1.4;overflow-wrap:anywhere}.chat-line b{font-weight:800}.chat-line.system{color:var(--muted);font-style:italic;font-size:.8rem}.chat-input-row{display:flex;gap:.5rem}.chat-input-row input{flex:1;padding:.55rem .9rem}.room-view{width:min(620px,100%);display:flex;flex-direction:column;gap:.9rem}.code-plate{display:flex;align-items:center;gap:.3rem;background:var(--bg-deep);border:1px solid var(--accent-deep);border-radius:12px;padding:.35rem .5rem .35rem 1rem;box-shadow:var(--well)}.lobby-code{font-family:var(--font-mono);color:var(--accent);letter-spacing:.25em;font-size:1.25rem;font-weight:600}.code-join-row{display:flex;gap:.6rem}.code-join-row.compact input{width:110px;padding:.45rem .7rem}.code-join-row input{text-transform:uppercase;letter-spacing:.2em;font-family:var(--font-mono)}.member-grid{display:grid;grid-template-columns:1fr 1fr;gap:.7rem;margin:.4rem 0}.member-card{display:flex;align-items:center;gap:.7rem;background:linear-gradient(180deg,var(--panel-2),var(--panel));border:1px solid var(--line);border-radius:12px;box-shadow:inset 0 1px 0 var(--line-hi);padding:.6rem .8rem}.member-card canvas{border-radius:50%;background:var(--bg-deep)}.member-info{flex:1;min-width:0}.member-name{font-weight:800;font-size:.9rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.member-level{font-family:var(--font-mono);font-size:.72rem;color:var(--muted)}.member-slot-empty{display:flex;align-items:center;justify-content:center;gap:.5rem;border:2px dashed var(--line);border-radius:12px;color:var(--muted);font-size:.82rem;min-height:58px}.ready-tag{font-size:.72rem;font-weight:800;color:var(--green);display:inline-flex;align-items:center;gap:.25rem}.ready-tag.waiting{color:var(--muted)}.host-tag{font-size:.68rem;color:var(--accent);font-weight:800;letter-spacing:.08em}.lobby-actions{display:flex;gap:.6rem;flex-wrap:wrap}.wheel{position:relative;width:130px;height:130px;margin-bottom:.6rem}.wheel-svg{position:absolute;top:0;right:0;bottom:0;left:0;color:var(--accent);filter:drop-shadow(0 0 12px rgba(255,159,54,.35));animation:wheel-spin 1.4s linear infinite}#queue-hamster{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);animation:hamster-bob .4s ease-in-out infinite alternate}@keyframes wheel-spin{to{transform:rotate(360deg)}}@keyframes hamster-bob{0%{transform:translate(-50%,-54%)}to{transform:translate(-50%,-46%)}}.match-layout{width:min(1200px,100%);display:grid;grid-template-columns:1fr 260px;gap:1.25rem;padding:1.25rem;align-items:start}.arena-wrap{display:flex;flex-direction:column;gap:.8rem}.arena-head{display:flex;align-items:center;justify-content:space-between}.mode-tag{font-family:var(--font-display);color:var(--accent-2);text-transform:capitalize;font-size:1.05rem}.match-timer{font-family:var(--font-mono);color:var(--muted);display:inline-flex;align-items:center;gap:.4rem}.terrarium{position:relative;align-self:center;max-width:100%;border-radius:20px;padding:12px;background:linear-gradient(180deg,#33261a,#1f160f);border:1px solid #4a3826;box-shadow:inset 0 1px 0 var(--line-hi),inset 0 14px 40px #0000008c,0 0 70px #ff9f3614,0 22px 55px #0000008c}.terrarium:after{content:"";position:absolute;top:12px;right:12px;bottom:12px;left:12px;border-radius:10px;pointer-events:none;background:linear-gradient(115deg,rgba(255,255,255,.05) 0%,transparent 24%)}#match-canvas{max-width:100%;max-height:calc(100vh - 240px);width:auto;height:auto;margin:0 auto;border-radius:10px}.skill-bar{display:flex;gap:.8rem;justify-content:center;min-height:70px}.skill-btn{position:relative;width:70px;height:70px;border-radius:16px;border:1px solid var(--accent-deep);background:radial-gradient(120% 120% at 30% 20%,var(--panel-3),var(--bg-deep));color:var(--accent-2);cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;overflow:hidden;box-shadow:inset 0 1px 0 var(--line-hi),0 4px #00000073;transition:transform .08s ease,box-shadow .08s ease}.skill-btn:hover:not(:disabled){filter:brightness(1.15)}.skill-btn:active:not(:disabled){transform:translateY(3px);box-shadow:inset 0 1px 0 var(--line-hi),0 1px #00000073}.skill-btn:disabled{cursor:default;border-color:var(--line);color:var(--muted)}.skill-btn .ic{width:26px;height:26px}.skill-btn .skill-key{font-family:var(--font-mono);font-size:.6rem;color:var(--muted)}.skill-btn .cooldown-shade{position:absolute;top:0;right:0;bottom:0;left:0;background:#0a0704cc;display:flex;align-items:center;justify-content:center;font-family:var(--font-mono);font-weight:600;font-size:1.05rem;color:var(--accent-2);transform-origin:bottom}.standings h3{margin-bottom:.7rem}.levelup-note{color:var(--accent);font-weight:800;text-align:center;animation:levelup-pop .5s ease}@keyframes levelup-pop{0%{transform:scale(.6);opacity:0}to{transform:scale(1);opacity:1}}.delta-up{color:var(--green);font-family:var(--font-mono);font-size:.8rem}.delta-down{color:var(--danger);font-family:var(--font-mono);font-size:.8rem}.bgm-btn{position:fixed;right:1.1rem;bottom:1.1rem;z-index:1000;width:48px;height:48px;border-radius:50%;border:1px solid var(--accent-deep);background:radial-gradient(120% 120% at 30% 20%,var(--panel-3),var(--bg-deep));color:var(--accent-2);cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:inset 0 1px 0 var(--line-hi),0 6px 16px #00000080;transition:transform .1s ease,filter .12s ease}.bgm-btn:hover{filter:brightness(1.15);transform:translateY(-2px)}.bgm-btn.off{color:var(--muted);border-color:var(--line)}.bgm-btn .ic{width:22px;height:22px}@media (max-width: 1000px){.menu-grid,.match-layout,.tree-branches,.info-row,.steps-strip,.member-grid,.lobby-columns{grid-template-columns:1fr}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}