:root{--bg: #0a0810;--panel: #171325;--panel-2: #1f1a30;--panel-3: #2a2340;--edge: #453a63;--gold: #ffc861;--gold-2: #c9973a;--ink: #efe8f5;--ink-dim: #a89fbe;--ink-faint: #6f6786;--good: #6fdc7a;--bad: #ff6a5a;--blue: #6fb6ff;--hp: linear-gradient(180deg, #ff7a6a, #c02a1e);--xp: linear-gradient(180deg, #ffd978, #d89320);--zone: linear-gradient(180deg, #8fe0ff, #2d86c9);--boss: linear-gradient(180deg, #ff8a5a, #a5160f);--common: #9a94aa;--fine: #7ddb8a;--rare: #61a6f5;--epic: #c07bff;--legendary: #ffb444;--mythic: #ff6a6a;--safe-top: env(safe-area-inset-top, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;height:100%;overflow:hidden;background:var(--bg);color:var(--ink);font:14px/1.4 Inter,Segoe UI,system-ui,sans-serif;overscroll-behavior:none;user-select:none}#app{position:fixed;inset:0;display:flex;justify-content:center;background:#05040a}.stage{position:relative;width:min(100vw,50vh);height:100%;overflow:hidden;background:#0b0912;box-shadow:0 0 60px #000c}@media (max-aspect-ratio: 1/1){.stage{width:100vw}}#field{position:absolute;inset:0;width:100%;height:100%;display:block;image-rendering:pixelated}button{font:inherit;color:var(--ink);cursor:pointer;background:none;box-shadow:none;padding:8px 14px;border:13px solid transparent;border-image:var(--ui-btn) 13 fill / 13px stretch;display:inline-flex;align-items:center;gap:6px;justify-content:center;text-shadow:0 1px 2px rgba(0,0,0,.65)}button:hover:not(:disabled){filter:brightness(1.18)}button:active:not(:disabled){filter:brightness(.88);transform:translateY(1px)}button:disabled{opacity:.42;cursor:not-allowed}button.primary{filter:saturate(1.5) brightness(1.12);font-weight:700}button.primary:hover:not(:disabled){filter:saturate(1.5) brightness(1.3)}button.danger{filter:hue-rotate(160deg) saturate(1.6)}button.danger:hover:not(:disabled){filter:hue-rotate(160deg) saturate(1.6) brightness(1.2)}button.link{background:none;border:none;border-image:none;box-shadow:none;color:var(--blue);text-decoration:underline;padding:4px;text-shadow:none}button.link:hover:not(:disabled){filter:none;color:var(--gold)}button.big{padding:12px;font-size:15px;width:100%;border-width:13px 48px;border-image:var(--ui-cta) 13 48 fill / 13px 48px stretch}input,select{font:inherit;color:var(--ink);background:#0c0a14;border:1px solid var(--edge);border-radius:6px;padding:9px 10px;min-width:0}input:focus,select:focus{outline:none;border-color:var(--gold-2)}input.short{width:76px;flex:none}h1,h2,h3{margin:0 0 6px;font-weight:700;letter-spacing:.01em}h2{font-size:18px;color:var(--gold)}h3{font-size:12px;text-transform:uppercase;letter-spacing:.1em;color:var(--gold-2);margin:14px 0 8px}p{margin:0 0 6px}.small{font-size:12px}.meta{font-size:11px;color:var(--ink-dim);display:block}.muted{color:var(--ink-faint)}.good{color:var(--good)}.hint{color:var(--ink-dim);font-size:12px;font-style:italic}.error{color:var(--bad);font-size:12px}.row{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin:6px 0}.sprite{display:inline-block;background-repeat:no-repeat;image-rendering:pixelated;flex:none;vertical-align:middle}.portrait{border-radius:6px;border:2px solid var(--gold-2);background:#0c0a14}.bar{position:relative;height:12px;background:#0a0810;border:1px solid #000;border-radius:7px;overflow:hidden;box-shadow:inset 0 1px 3px #000000e6}.bar>i{display:block;height:100%;background:var(--hp);transition:width .18s linear}.bar>b{position:absolute;inset:0;font-size:9px;line-height:12px;text-align:center;color:#fff;text-shadow:0 1px 2px #000;font-weight:600}.bar.xp{height:7px}.bar.xp>i{background:var(--xp)}.bar.xp>b{line-height:7px;font-size:8px}.bar.zone>i{background:var(--zone)}.bar.boss{height:15px}.bar.boss>i{background:var(--boss)}.bar.boss>b{line-height:15px;font-size:10px}.bar.small{height:8px}.bar.small>b{line-height:8px;font-size:8px}.hud{position:absolute;inset:0;display:flex;flex-direction:column;pointer-events:none}.hud>*{pointer-events:auto}.hud-top{padding:calc(6px + var(--safe-top)) 8px 0;display:flex;flex-direction:column;gap:5px}.purse{display:flex;gap:4px;flex-wrap:wrap}.coin{display:inline-flex;align-items:center;gap:3px;font-size:11px;font-weight:600;background:#0a0812c7;border:1px solid var(--edge);border-radius:11px;padding:1px 7px 1px 3px}.hero-line{display:flex;align-items:center;gap:8px;background:#0a0812b8;border:1px solid var(--edge);border-radius:9px;padding:5px 8px}.avatar{position:relative;padding:0;border:none;border-image:none;background:none;box-shadow:none}.avatar .lvl{position:absolute;right:-4px;bottom:-4px;background:linear-gradient(180deg,#e0a03c,#8a4f0c);color:#24160a;font-size:10px;font-weight:800;border-radius:9px;padding:0 5px;border:1px solid #ffd98a}.vitals{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}.namerow{display:flex;align-items:baseline;gap:5px;font-size:12px}.hname{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tag{color:var(--gold);font-size:11px}.cls{color:var(--ink-faint);font-size:10px;margin-left:auto}.online{display:flex;align-items:center;gap:3px;font-size:11px;color:var(--ink-dim)}.zone-bar{background:#0a0812b8;border:1px solid var(--edge);border-radius:9px;padding:5px 8px}.zrow{display:flex;justify-content:space-between;font-size:11px;margin-bottom:3px}.zname{font-weight:700;color:var(--gold)}.zstage{color:var(--ink-dim)}.boss-call{width:100%;margin-top:5px;font-weight:700;padding:10px;border-width:13px 48px;border-image:var(--ui-cta) 13 48 fill / 13px 48px stretch;filter:hue-rotate(160deg) saturate(1.7) brightness(1.05)}.boss-call:hover:not(:disabled){filter:hue-rotate(160deg) saturate(1.7) brightness(1.25)}.boss-bar{background:#180606cc;border:1px solid #a5382c;border-radius:9px;padding:5px 8px}.brow{display:flex;justify-content:space-between;font-size:12px;margin-bottom:3px}.bname{font-weight:800;color:#ffb9a4}.blvl{color:var(--ink-dim);font-size:11px}.hud-mid{flex:1;display:flex;justify-content:space-between;align-items:flex-start;padding:6px 8px;min-height:0}.loot-feed{display:flex;flex-direction:column;gap:3px;max-width:58%}.loot{display:flex;align-items:center;gap:5px;font-size:10px;background:#08060eb8;border-left:3px solid var(--common);border-radius:4px;padding:2px 6px 2px 4px;transition:opacity .3s}.loot .ltext{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.loot .lkind{margin-left:auto;color:var(--ink-faint);font-size:9px}.loot.fine{border-color:var(--fine)}.loot.rare{border-color:var(--rare)}.loot.epic{border-color:var(--epic)}.loot.legendary{border-color:var(--legendary)}.loot.mythic{border-color:var(--mythic)}.loot.equipped .lkind{color:var(--good)}.right-col{display:flex;flex-direction:column;align-items:flex-end;gap:6px}.minimap{border:1px solid var(--edge);border-radius:6px;background:#08060eb3;width:64px;height:100px}.side-nav{display:flex;flex-direction:column;gap:4px}.nav-btn{position:relative;flex-direction:column;gap:0;padding:1px 2px;width:50px;font-size:9px;background:none;border-style:solid;border-color:transparent;border-width:6px 12px;border-image:var(--ui-bar) 9 20 fill / 6px 12px stretch}.nav-btn.active{filter:brightness(1.45) saturate(1.3)}.nav-btn span{color:var(--ink-dim)}.nav-btn.active span{color:var(--gold)}.nav-btn.small{width:auto;flex:1;min-width:0;padding:1px 0;font-size:8px;border-width:5px 6px;border-image-width:5px 6px}.nav-btn.small span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}.badge{position:absolute;top:-4px;right:-4px;background:#d8372a;color:#fff;font-size:9px;font-style:normal;font-weight:700;border-radius:9px;padding:0 4px;border:1px solid #ff9a8a}.idle-card{position:absolute;left:8px;right:8px;bottom:150px;display:flex;align-items:center;gap:9px;text-align:left;background:linear-gradient(180deg,#302410f2,#1a1208f2);border:1px solid var(--gold-2);border-radius:10px;padding:9px 11px}.idle-card strong{display:block;color:var(--gold);font-size:13px}.idle-card span{font-size:11px;color:var(--ink-dim)}.banner{position:absolute;left:0;right:0;top:30%;text-align:center;pointer-events:none;transition:opacity .4s}.banner h2{font-size:26px;color:#fff;text-shadow:0 2px 10px #000,0 0 24px rgba(255,180,80,.8);margin:0}.banner p{font-size:12px;color:var(--ink-dim);text-shadow:0 1px 4px #000}.toasts{position:absolute;left:8px;right:8px;bottom:210px;display:flex;flex-direction:column;gap:4px;pointer-events:none}.toast{background:#0e0a16f0;border:1px solid var(--edge);border-left-width:3px;border-radius:6px;padding:6px 9px;font-size:12px}.toast.good{border-left-color:var(--good)}.toast.bad{border-left-color:var(--bad)}.hud-bottom{padding:0 8px calc(6px + var(--safe-bottom));display:flex;flex-direction:column;gap:5px}.skill-bar{display:flex;align-items:flex-end;gap:6px}.auto-btn{flex-direction:column;gap:1px;padding:5px 7px;font-size:9px;width:52px}.auto-btn.on{border-color:var(--good);box-shadow:0 0 8px #6fdc7a66}.auto-btn.on span{color:var(--good)}.skills{flex:1;display:flex;gap:5px;justify-content:flex-end}.skill{position:relative;width:50px;height:50px;padding:0;overflow:hidden;border-radius:10px;border:2px solid var(--gold-2);background:radial-gradient(circle at 50% 30%,#3a2f52,#191428)}.skill .slvl{position:absolute;right:2px;bottom:1px;font-size:9px;font-weight:700;color:var(--gold);text-shadow:0 1px 2px #000}.skill .cd{position:absolute;left:0;right:0;bottom:0;background:#06040cb8;pointer-events:none}.skill .cdnum{position:absolute;inset:0;display:grid;place-items:center;font-size:15px;font-weight:800;color:#fff;text-shadow:0 1px 3px #000}.skill.cooling{border-color:#4a4160}.bottom-nav{display:flex;gap:3px}.panel-wrap{position:absolute;inset:0;background:#040309d1;display:flex;align-items:flex-end;z-index:20}.side-nav,.bottom-nav{position:relative;z-index:30}.hud.covered .side-nav,.hud.covered .minimap,.hud.covered .skill-bar,.hud.covered .loot-feed{display:none}.panel{width:100%;max-height:88%;display:flex;flex-direction:column;background:#14111f;border:4px solid transparent;border-image:var(--ui-panel) 4 fill / 4px stretch;box-shadow:0 -8px 40px #000000b3}.panel.rise{animation:rise .2s ease-out}@keyframes rise{0%{transform:translateY(22px);opacity:.4}to{transform:none;opacity:1}}.panel>header{display:flex;align-items:flex-start;gap:8px;padding:12px 14px 8px;border-bottom:1px solid var(--edge)}.panel>header p{font-size:11px;color:var(--ink-dim);margin:0}.panel .close{margin-left:auto;padding:5px}.panel-body{overflow-y:auto;padding:10px 14px calc(78px + var(--safe-bottom));-webkit-overflow-scrolling:touch}.tabs{display:flex;gap:4px;overflow-x:auto;padding-bottom:4px;margin-bottom:8px}.tab{font-size:12px;padding:6px 10px;white-space:nowrap;border-width:9px 14px;border-image:var(--ui-bar) 9 20 fill / 9px 14px stretch}.tab.active{color:var(--gold);filter:brightness(1.5) saturate(1.3)}.card-list{display:flex;flex-direction:column;gap:8px}.card{background:linear-gradient(180deg,#221c36,#1a1529);border:1px solid var(--edge);border-radius:9px;padding:9px 10px}.card.locked{opacity:.55}.card.featured{border-color:var(--gold-2);box-shadow:inset 0 0 20px #ffc86114}.card.ready{border-color:var(--gold);box-shadow:0 0 10px #ffc8614d}.card.here{border-color:var(--good)}.card.done{opacity:.6}.card-head{display:flex;align-items:center;gap:9px;margin-bottom:5px}.card-head strong{font-size:13px}.zthumb{border-radius:5px;border:1px solid var(--edge)}.reward{display:inline-flex;gap:8px;flex-wrap:wrap;align-items:center;font-size:11px}.reward span{display:inline-flex;align-items:center;gap:2px}.slot{position:relative;width:52px;height:52px;display:grid;place-items:center;border-radius:8px;border:2px solid var(--common);background:#0a0812d9}.slot.empty{border-color:#322a48;border-style:dashed}.slot.fine{border-color:var(--fine)}.slot.rare{border-color:var(--rare)}.slot.epic{border-color:var(--epic);box-shadow:0 0 9px #c07bff66}.slot.legendary{border-color:var(--legendary);box-shadow:0 0 11px #ffb44480}.slot.mythic{border-color:var(--mythic);box-shadow:0 0 13px #ff6a6a8c}.slot .plus{position:absolute;right:2px;top:1px;font-size:9px;font-style:normal;font-weight:800;color:var(--gold);text-shadow:0 1px 2px #000}.slot .setdot{position:absolute;left:3px;top:3px;width:6px;height:6px;border-radius:50%;background:var(--good)}.slot .lockdot{position:absolute;left:1px;bottom:1px}.slot-label{font-size:9px;color:var(--ink-faint)}.doll{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin:10px 0}.doll-slot{flex-direction:column;gap:2px;padding:3px;background:none;border:none;border-image:none;box-shadow:none}.doll-slot .dname{font-size:8px;color:var(--ink-faint)}.doll-slot.picked .slot{outline:2px solid var(--gold);outline-offset:1px}.item-list{display:flex;flex-direction:column;gap:8px}.item-card{background:#1b1628;padding:11px 12px;position:relative;border:6px solid transparent;border-image:var(--ui-inner) 6 fill / 6px stretch}.item-card:before{content:"";position:absolute;left:-3px;top:6px;bottom:6px;width:3px;border-radius:2px;background:var(--common)}.item-card.fine:before{background:var(--fine)}.item-card.rare:before{background:var(--rare)}.item-card.epic:before{background:var(--epic)}.item-card.legendary:before{background:var(--legendary)}.item-card.mythic:before{background:var(--mythic)}.item-head{display:flex;gap:9px;align-items:center}.item-head strong{font-size:13px;display:block}.score{font-size:11px;color:var(--gold);display:inline-flex;align-items:center;gap:3px}.affixes{list-style:none;margin:7px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:1px 10px;font-size:11px}.affixes li{display:flex;justify-content:space-between;color:var(--ink-dim)}.affixes b{color:var(--ink)}.setnote{font-size:10px;color:var(--good);margin-top:5px}.char-head{display:flex;gap:11px;align-items:center}.rating{display:flex;align-items:center;gap:5px;font-size:15px;color:var(--gold)}.rating b{font-size:19px}.setbox{background:#3c5a3229;border:1px solid #3d6b3a;border-radius:8px;padding:8px 10px;margin:8px 0}.enhance{background:#0a081299;border:1px solid var(--edge);border-radius:9px;padding:10px;margin:8px 0}.stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:3px 10px}.stat{display:flex;justify-content:space-between;font-size:12px;padding:3px 0;border-bottom:1px solid rgba(255,255,255,.05)}.stat span{color:var(--ink-dim)}.pull-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(84px,1fr));gap:7px}.pull{display:flex;flex-direction:column;align-items:center;gap:3px;text-align:center}.pull .small{font-size:10px;line-height:1.2}.ladder{display:flex;flex-direction:column;gap:3px}.lrow{display:flex;align-items:center;gap:8px;padding:5px 7px;border-radius:7px;background:#0a081280}.lrow.me{background:#ffc86124;border:1px solid var(--gold-2)}.lrow .place{width:24px;font-weight:800;color:var(--gold-2);text-align:center}.lrow div{flex:1;min-width:0}.lrow strong{font-size:12px}.row-line{display:flex;align-items:center;gap:8px;padding:5px 0;border-bottom:1px solid rgba(255,255,255,.05);font-size:12px}.chat-log{height:44vh;overflow-y:auto;background:#0b0912;border:1px solid var(--edge);border-radius:8px;padding:7px;display:flex;flex-direction:column;gap:3px}.chat-line{font-size:12px;display:flex;gap:6px}.chat-line .who{color:var(--blue);font-weight:600;flex:none}.chat-line .body{color:var(--ink);word-break:break-word}.chat-line.system .who{color:var(--gold-2)}.chat-line.system .body{color:var(--ink-dim);font-style:italic}.chat-line.me .who{color:var(--gold)}.chat-input{flex:1}.auth{position:absolute;inset:0;display:grid;place-items:center;padding:18px;overflow-y:auto;background:radial-gradient(ellipse at 50% 0%,rgba(120,70,200,.3),transparent 62%),radial-gradient(ellipse at 50% 100%,rgba(200,90,40,.24),transparent 58%),#07060d}.auth-card{width:100%;max-width:360px;display:flex;flex-direction:column;gap:9px}.logo{text-align:center;margin-bottom:6px}.logo h1{font-size:40px;letter-spacing:.04em;margin:0;background:linear-gradient(180deg,#fff3cf,#ffc861 48%,#b0701a);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 2px 0 rgba(0,0,0,.65))}.logo p{font-size:12px;color:var(--ink-dim);font-style:italic}.class-picker{display:grid;grid-template-columns:1fr 1fr;gap:7px}.class-card{flex-direction:column;gap:3px;padding:9px 7px;text-align:center}.class-card strong{font-size:13px;color:var(--gold)}.class-card .small{font-size:10px;color:var(--ink-dim);line-height:1.25}.class-card.picked{border-color:var(--gold);box-shadow:0 0 12px #ffc86166}.splash{position:absolute;inset:0;display:grid;place-items:center;text-align:center;color:var(--gold)}.splash .bar{width:190px;margin-top:11px}[hidden]{display:none!important}