*,:before,:after{box-sizing:border-box}:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg-void:#0b0a12;--bg-deep:#121018;--panel:#1c1a29;--panel-raised:#221f33;--border:#322f47;--border-soft:#241f3d;--text:#e8e6f0;--text-muted:#9a94b8;--text-faint:#78708f;--accent:#6c5ce7;--accent-bright:#8b7cf0;--accent-glow:#6c5ce759;--good:#4ade80;--bad:#f87171;font:16px/1.45 system-ui,Segoe UI,Roboto,sans-serif}html,body{height:100dvh;margin:0;overflow:hidden}body{background:radial-gradient(ellipse 900px 500px at 20% -10%, #6c5ce729, transparent 60%), radial-gradient(ellipse 700px 500px at 90% 15%, #48c8dc14, transparent 55%), radial-gradient(ellipse 1000px 700px at 50% 110%, #5a288c1f, transparent 60%), url(/brand/background.jpg) center / cover no-repeat fixed, var(--bg-void)}#root{height:100%}.game{max-width:480px;height:100%;color:var(--text);margin:0 auto;padding:2rem 1.25rem 8rem;font-family:system-ui,sans-serif;overflow-y:auto}.brand-header{border:1px solid var(--border);background:linear-gradient(160deg,#1c1a298c,#121018b8),url(/brand/header-banner.png) 50% 40%/cover no-repeat;border-radius:14px;flex-wrap:wrap;align-items:center;gap:.5rem 1rem;padding:1rem 1.25rem;display:flex;position:relative;overflow:hidden;box-shadow:0 8px 24px #00000059}.hamburger-btn{border:1px solid var(--border);background:var(--bg-deep);cursor:pointer;border-radius:8px;flex-direction:column;flex-shrink:0;justify-content:center;align-items:center;gap:4px;width:38px;height:38px;transition:border-color .15s,box-shadow .15s;display:flex}.hamburger-btn:hover{border-color:var(--accent);box-shadow:0 0 12px var(--accent-glow)}.hamburger-btn span{background:var(--text);border-radius:1px;width:18px;height:2px;display:block}.nav-scrim{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);opacity:0;pointer-events:none;z-index:199;background:#06050a99;transition:opacity .2s;position:fixed;inset:0}.nav-scrim.open{opacity:1;pointer-events:auto}.nav-drawer{background:linear-gradient(180deg, var(--panel-raised), var(--bg-deep));border-right:1px solid var(--border);z-index:200;flex-direction:column;width:min(300px,85vw);padding:1.1rem .9rem;transition:transform .22s;display:flex;position:fixed;top:0;bottom:0;left:0;overflow-y:auto;transform:translate(-100%);box-shadow:8px 0 40px #00000080}.nav-drawer.open{transform:translate(0)}.nav-drawer-header{border-bottom:1px solid var(--border);align-items:center;gap:.6rem;margin-bottom:.75rem;padding-bottom:.9rem;font-weight:600;display:flex}.nav-drawer-logo{width:30px;height:30px;box-shadow:0 0 0 1px var(--border), 0 0 14px var(--accent-glow);border-radius:7px}.nav-drawer-header .close-btn{margin-left:auto}.nav-section-label{text-transform:uppercase;letter-spacing:.06em;color:var(--text-faint);padding:.6rem .5rem .35rem;font-size:.72rem}.nav-list{flex-direction:column;gap:.2rem;margin:0;padding:0;list-style:none;display:flex}.nav-item{width:100%;color:var(--text);text-align:left;cursor:pointer;background:0 0;border:1px solid #0000;border-radius:8px;align-items:center;gap:.6rem;padding:.55rem .6rem;font-size:.9rem;transition:border-color .15s,background .15s;display:flex}.nav-item:hover{border-color:var(--border);background:#6c5ce714}.nav-item-icon{width:24px;height:24px;box-shadow:0 0 0 1px var(--border);border-radius:6px;flex-shrink:0}.nav-item-emoji{text-align:center;flex-shrink:0;width:24px;font-size:1.05rem}.nav-item-name{flex:1}.nav-item-level{color:var(--text-muted);white-space:nowrap;font-size:.78rem}.brand-logo{width:52px;height:52px;box-shadow:0 0 0 1px var(--border), 0 0 22px var(--accent-glow);border-radius:12px;flex-shrink:0}.brand-title{flex:1}.cloud-status{white-space:nowrap;border:1px solid var(--border);color:var(--text-muted);background:#0003;border-radius:999px;padding:.25rem .55rem;font-size:.75rem}.cloud-status.synced{color:var(--good);border-color:#2f5c42}.cloud-status.error{color:var(--bad);border-color:#6b3939}.header-actions{flex-direction:column;flex-shrink:0;align-items:flex-end;gap:.4rem;margin-left:auto;display:flex}.leaderboard-btn{border:1px solid var(--border);background:var(--panel);color:var(--text);cursor:pointer;white-space:nowrap;border-radius:6px;padding:.3rem .65rem;font-size:.75rem;transition:border-color .15s,box-shadow .15s}.leaderboard-btn:hover{border-color:var(--accent);box-shadow:0 0 12px var(--accent-glow)}.leaderboard-overlay{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);z-index:100;background:#06050ac7;justify-content:center;align-items:flex-start;padding:2rem 1rem;display:flex;position:fixed;inset:0;overflow-y:auto}.leaderboard-panel{background:linear-gradient(165deg, var(--panel-raised), var(--panel));border:1px solid var(--border);border-radius:14px;width:100%;max-width:420px;padding:1.25rem;box-shadow:0 20px 60px #00000080}.leaderboard-header{justify-content:space-between;align-items:center;margin-bottom:.75rem;display:flex}.leaderboard-header h2{margin:0;font-size:1.2rem}.close-btn{color:var(--text-muted);cursor:pointer;background:0 0;border:none;padding:.25rem;font-size:1.1rem;line-height:1}.close-btn:hover{color:var(--text)}.account-submit-btn{border:1px solid var(--accent);background:var(--accent);color:var(--text);cursor:pointer;border-radius:8px;align-self:flex-start;padding:.55rem 1.1rem;font-weight:600;transition:box-shadow .15s,opacity .15s}.account-submit-btn:hover:not(:disabled){box-shadow:0 0 14px var(--accent-glow)}.account-submit-btn:disabled{opacity:.5;cursor:default}.display-name-row{justify-content:space-between;align-items:center;gap:.75rem;margin-bottom:1.25rem;display:flex}.display-name-row label{color:var(--text-muted);font-size:.85rem}.display-name-row input{background:var(--bg-deep);border:1px solid var(--border);max-width:180px;color:var(--text);border-radius:6px;flex:1;padding:.4rem .6rem;font-size:.9rem}.display-name-row input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow);outline:none}.leaderboard-board{margin-bottom:1.25rem}.leaderboard-board h3{color:#c4bfe0;margin:0 0 .5rem;font-size:.95rem}.leaderboard-board ol{margin:0;padding:0;list-style:none}.leaderboard-board li{border-bottom:1px solid var(--border-soft);justify-content:space-between;padding:.3rem 0;font-size:.9rem;display:flex}.leaderboard-board li.self{color:var(--accent-bright);font-weight:600}.achievement-list{flex-direction:column;gap:.6rem;margin:0;padding:0;list-style:none;display:flex}.achievement-item{border:1px solid var(--border);opacity:.5;border-radius:8px;padding:.6rem .8rem}.achievement-item.unlocked{opacity:1;border-color:var(--accent);background:#6c5ce714}.achievement-name{font-size:.9rem;font-weight:600}.achievement-desc{color:var(--text-muted);margin:.2rem 0 0;font-size:.8rem;font-style:italic}.achievement-date{color:var(--accent-bright);margin:.3rem 0 0;font-size:.75rem}.achievement-toast-desc{color:var(--text-muted);font-size:.85rem;font-style:italic}h1,.brand-wordmark{letter-spacing:.02em;text-shadow:0 0 18px var(--accent-glow);font-family:Cinzel,Georgia,serif;font-weight:700}h1{margin-bottom:.1rem;font-size:1.6rem}.brand-wordmark{font-size:1.05rem}.subtitle{color:var(--text-muted);margin-top:0;font-size:.9rem}.panel{background:linear-gradient(165deg, #1c1a29b8, #121018f0 60%), url(/brand/storeroom.png) top center / cover no-repeat, var(--panel);border:1px solid var(--border);border-radius:12px;margin:1rem 0;padding:1rem 1.25rem;box-shadow:0 6px 18px #00000047}.panel h2{margin:0 0 .6rem;font-size:1.05rem}.panel-header-toggle{cursor:pointer;width:100%;color:inherit;font:inherit;text-align:left;background:0 0;border:none;justify-content:space-between;align-items:center;margin:0;padding:0;display:flex}.panel-header-toggle h2{margin:0}.toggle-chevron{color:var(--text-muted);flex-shrink:0;padding-left:.75rem;font-size:.9rem}.panel h3{margin:0 0 .6rem;font-size:.95rem}.skill-group{margin-top:1.75rem}.skill-group-header{border-bottom:1px solid var(--border);align-items:center;gap:.6rem;padding-bottom:.4rem;display:flex}.skill-icon{width:30px;height:30px;box-shadow:0 0 0 1px var(--border), 0 0 14px #6c5ce733;border-radius:7px;flex-shrink:0}.skill-group-header h2{flex:1;margin:0;font-size:1.15rem}.skill-group-level{color:var(--text-muted);white-space:nowrap;font-size:.8rem}.flavor-text{color:#7d76a0;margin:.5rem 0 0;font-size:.85rem;font-style:italic}.panel.action-card{background:linear-gradient(165deg,#1c1a29bf,#121018e0),url(/brand/panel-banner.png) 50% 45%/cover no-repeat;position:relative}.action-card.locked{opacity:.55;box-shadow:none}.zone-art{object-fit:cover;object-position:top center;width:100%;height:220px;box-shadow:0 0 0 1px var(--border);border-radius:9px;margin-bottom:.75rem;display:block}.zone-art.locked{filter:grayscale()brightness(.5)}.locked-note{color:var(--text-faint);margin:0;font-size:.85rem}.stat-row{justify-content:space-between;padding:.15rem 0;font-size:.95rem;display:flex}.stat-row span{color:var(--text-muted)}.activity-toggle{background:linear-gradient(155deg, var(--accent-bright), var(--accent));color:#fff;cursor:pointer;width:100%;box-shadow:0 6px 16px var(--accent-glow);border:none;border-radius:10px;padding:.9rem;font-size:1rem;font-weight:600;transition:transform .1s,box-shadow .15s}.activity-toggle:hover{box-shadow:0 6px 22px var(--accent-glow)}.activity-toggle:active{transform:translateY(1px)}.activity-toggle:disabled{color:var(--text-faint);cursor:not-allowed;box-shadow:none;background:#38344c}.action-card.active{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent), 0 8px 28px var(--accent-glow)}.offline-banner{background:linear-gradient(165deg,#2e2850,#241f3d);border:1px solid #4a4470;border-radius:12px;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1rem;padding:.85rem 1rem;font-size:.9rem;display:flex;box-shadow:0 6px 18px #00000047}.offline-banner button{background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:6px;padding:.4rem .8rem}.hp-bar-label{color:var(--text-muted);justify-content:space-between;margin-top:.5rem;font-size:.85rem;display:flex}.hp-bar{background:var(--bg-deep);border-radius:5px;height:10px;margin-bottom:.3rem;overflow:hidden;box-shadow:inset 0 0 0 1px #ffffff0a}.hp-bar-fill{border-radius:5px;height:100%;transition:width .2s}.hp-bar-fill.player{background:linear-gradient(90deg, #34a45f, var(--good));box-shadow:0 0 8px #4ade8080}.hp-bar-fill.enemy{background:linear-gradient(90deg, #d94d4d, var(--bad));box-shadow:0 0 8px #f8717180}.cycle-bar-label{color:var(--text-muted);justify-content:space-between;margin:.6rem 0 .3rem;font-size:.8rem;display:flex}.cycle-bar{background:var(--bg-deep);border-radius:4px;height:6px;margin:.6rem 0 .9rem;overflow:hidden;box-shadow:inset 0 0 0 1px #ffffff0a}.cycle-bar-fill{transform-origin:0;background:linear-gradient(90deg, var(--accent), var(--accent-bright));width:100%;height:100%;box-shadow:0 0 8px var(--accent-glow);border-radius:4px;animation-name:cycle-fill;animation-timing-function:linear;animation-iteration-count:infinite}@keyframes cycle-fill{0%{transform:scaleX(0)}to{transform:scaleX(1)}}@media (prefers-reduced-motion:reduce){.cycle-bar-fill{animation:none;transform:scaleX(.5)}}.style-picker{gap:.5rem;margin:.85rem 0;display:flex}.style-btn{text-transform:capitalize;border:1px solid var(--border);background:var(--bg-deep);color:var(--text-muted);cursor:pointer;border-radius:8px;flex:1;padding:.5rem;font-size:.85rem;transition:border-color .15s,background .15s,color .15s}.style-btn:hover{border-color:var(--accent);color:var(--text)}.style-btn.selected{border-color:var(--accent);color:var(--text);background:var(--border-soft);box-shadow:0 0 10px var(--accent-glow)}.upgrades{flex-direction:column;gap:.5rem;margin-top:.75rem;display:flex}.upgrade-btn{border:1px solid var(--border);background:var(--bg-deep);color:var(--text);cursor:pointer;border-radius:8px;padding:.6rem;font-size:.85rem;transition:border-color .15s}.upgrade-btn:hover:not(:disabled){border-color:var(--accent)}.upgrade-btn:disabled{color:var(--text-faint);cursor:not-allowed}.prestige-gate{margin-bottom:.5rem}.gate-met{color:var(--good)}.prestige-upgrade{text-align:left;width:100%}.prestige-upgrade-title{justify-content:space-between;font-size:.85rem;font-weight:600;display:flex}.prestige-upgrade .achievement-desc{color:var(--text-muted)}@media (width>=900px){.game{max-width:720px;margin:0 auto 0 max(340px,50% - 360px)}.hamburger-btn,.nav-scrim{display:none}.nav-drawer{box-shadow:none;border-right:1px solid var(--border);transform:translate(0)}.nav-drawer-header .close-btn{display:none}}