@font-face{font-family:Cinzel;src:url(../fonts/Cinzel.ttf) format("truetype");font-weight:400 900;font-display:swap}@font-face{font-family:Inter;src:url(../fonts/Inter.ttf) format("truetype");font-weight:100 900;font-display:swap}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;height:100%;overflow:hidden;background:var(--c-bg);color:var(--c-text);font-family:var(--font-body);font-size:var(--fs-body);-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;overscroll-behavior:none;touch-action:none}#app{position:fixed;inset:0}button{font:inherit;color:inherit}input{font:inherit;-webkit-user-select:text;user-select:text}h1,h2,h3,.heading{font-family:var(--font-heading);font-weight:700;letter-spacing:.05em;color:var(--gold-gold1);margin:0}.panel{position:relative;background:linear-gradient(180deg,var(--hud-glass-hi),var(--hud-glass));border:1px solid var(--hud-edge);border-radius:var(--r-md);box-shadow:inset 0 0 0 1px var(--hud-edge-lo),inset 0 1px 0 var(--hud-sheen),0 6px 18px var(--hud-shadow)}.panel.ornate:before,.panel.ornate:after{content:"";position:absolute;width:9px;height:9px;top:-5px;background:var(--gold-gold1);transform:rotate(45deg);box-shadow:0 0 0 2px var(--hud-board-edge),0 0 6px var(--gold-gold2)}.panel.ornate:before{left:14px}.panel.ornate:after{right:14px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--sp-xs);min-height:40px;padding:0 var(--sp-lg);font-family:var(--font-heading);font-weight:700;font-size:var(--fs-body);letter-spacing:.08em;text-transform:uppercase;color:var(--gold-gold1);background:linear-gradient(180deg,var(--hud-slot-hi),var(--hud-slot));border:1px solid var(--gold-gold2);border-radius:var(--r-sm);box-shadow:inset 0 1px 0 var(--hud-sheen),0 2px 6px var(--hud-shadow);cursor:pointer}.btn:active{transform:translateY(1px);filter:brightness(1.2)}.btn.primary{color:var(--c-bg);background:linear-gradient(180deg,var(--gold-gold1),var(--gold-gold2));border-color:var(--gold-gold1);text-shadow:0 1px 0 var(--hud-sheen)}.btn.ghost{background:transparent;border-color:var(--hud-edge)}.btn.small{min-height:30px;padding:0 var(--sp-md);font-size:var(--fs-small)}.btn:disabled{opacity:.45;pointer-events:none}.btn.danger{color:var(--c-text);border-color:var(--c-danger);background:linear-gradient(180deg,var(--hud-slot-hi),var(--hud-slot))}.ic{display:inline-block;width:1em;height:1em;background-color:currentColor;-webkit-mask:center / contain no-repeat;mask:center / contain no-repeat;flex:none}.field{display:flex;flex-direction:column;gap:var(--sp-xxs)}.field label{font-size:var(--fs-small);color:var(--c-text-muted);letter-spacing:.04em}.field input{height:42px;padding:0 var(--sp-md);color:var(--c-text);background:var(--hud-slot);border:1px solid var(--hud-edge);border-radius:var(--r-sm);outline:none}.field input:focus{border-color:var(--gold-gold1);box-shadow:0 0 0 2px var(--hud-edge-lo)}.error{color:var(--c-danger);font-size:var(--fs-small);min-height:1.2em}.muted{color:var(--c-text-muted)}.gold{color:var(--gold-gold1)}.bar{position:relative;height:10px;background:var(--c-hp-bg);border:1px solid var(--hud-board-edge);border-radius:var(--r-xs);overflow:hidden}.bar>i{position:absolute;inset:0 auto 0 0;display:block;background:linear-gradient(180deg,var(--c-hp),var(--c-hp-bg));transition:width .25s ease-out}.bar.hp>i{background:linear-gradient(180deg,var(--con-red),var(--c-hp))}.bar.res{background:var(--c-resource-bg)}.bar.res>i{background:linear-gradient(180deg,var(--c-power),var(--c-resource-bg))}.bar.res.stamina>i{background:linear-gradient(180deg,var(--c-endurance),var(--gold-gold3))}.bar.xp{height:4px;background:var(--hud-slot)}.bar.xp>i{background:var(--c-xp)}.bar>span{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:var(--fs-tiny);font-weight:700;color:var(--c-text);text-shadow:0 1px 1px var(--hud-board-edge),0 0 2px var(--hud-board-edge);line-height:1}.screen{position:absolute;inset:0;display:flex;overflow:hidden}.backdrop{position:absolute;inset:0;overflow:hidden;background:var(--hud-board-edge)}.backdrop canvas{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(1.05);filter:brightness(.5) saturate(.85)}.backdrop:after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at center,transparent 30%,var(--hud-vignette) 100%)}.boot{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--sp-md);background:var(--c-bg);z-index:var(--z-boot);transition:opacity .4s}.boot .spinner{width:44px;height:44px;border:3px solid var(--hud-edge-lo);border-top-color:var(--gold-gold1);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.title-block{text-align:center}.title-block h1{font-size:var(--fs-hero);text-shadow:0 2px 10px var(--hud-board-edge)}.title-block .sub{font-family:var(--font-heading);color:var(--c-text-muted);letter-spacing:.2em;text-transform:uppercase;font-size:var(--fs-small);margin-top:var(--sp-xs)}.auth{position:relative;margin:auto;display:flex;gap:var(--sp-xl);align-items:center;padding:max(var(--sp-lg),env(safe-area-inset-top)) max(var(--sp-lg),env(safe-area-inset-right)) max(var(--sp-lg),env(safe-area-inset-bottom)) max(var(--sp-lg),env(safe-area-inset-left));max-height:100%;overflow-y:auto}.auth .card{width:min(340px,86vw);padding:var(--sp-xl) var(--sp-lg) var(--sp-lg);display:flex;flex-direction:column;gap:var(--sp-md)}.auth .switch{background:none;border:none;color:var(--gold-gold1);font-size:var(--fs-small);text-decoration:underline;cursor:pointer;padding:var(--sp-xs)}.auth .server-row{display:flex;gap:var(--sp-xs);align-items:end}.auth .server-row .field{flex:1}@media(orientation:portrait){.auth{flex-direction:column}}.chars{position:relative;flex:1;display:flex;flex-direction:column;padding:max(var(--sp-md),env(safe-area-inset-top)) max(var(--sp-lg),env(safe-area-inset-right)) max(var(--sp-md),env(safe-area-inset-bottom)) max(var(--sp-lg),env(safe-area-inset-left));gap:var(--sp-md);min-height:0}.chars header{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-md)}.chars header h2{font-size:var(--fs-title)}.chars .scroll{flex:1;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;touch-action:pan-y}.hero-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:var(--sp-md)}.hero{display:flex;align-items:center;gap:var(--sp-md);padding:var(--sp-md);cursor:pointer}.hero canvas{width:56px;height:56px;flex:none}.hero .name{font-family:var(--font-heading);font-size:var(--fs-large);color:var(--gold-gold1)}.hero .meta{font-size:var(--fs-small);color:var(--c-text-muted)}.hero:active{filter:brightness(1.2)}.empty-note{text-align:center;color:var(--c-text-muted);padding:var(--sp-xl);font-style:italic}.realms{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-md)}@media(orientation:portrait){.realms{grid-template-columns:1fr}}.realm-card{padding:var(--sp-md);display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--sp-xs);cursor:pointer;border-width:2px}.realm-card canvas{width:76px;height:76px}.realm-card h3{font-size:var(--fs-title)}.realm-card .tag{font-size:var(--fs-small);color:var(--c-text);line-height:1.35;min-height:2.7em}.realm-card .stat{font-size:var(--fs-tiny);color:var(--c-text-muted);letter-spacing:.04em}.realm-card .bonus{font-size:var(--fs-tiny);color:var(--c-friendly);font-weight:700}.realm-card.sel{box-shadow:inset 0 0 0 1px var(--hud-edge-lo),0 0 0 2px var(--gold-gold1),0 0 18px var(--gold-gold2)}.creator{flex:1;min-height:0;display:grid;grid-template-columns:220px 1fr;gap:var(--sp-md)}@media(orientation:portrait){.creator{grid-template-columns:1fr;grid-template-rows:auto 1fr}}.class-list{display:flex;flex-direction:column;gap:var(--sp-xs);overflow-y:auto;touch-action:pan-y}@media(orientation:portrait){.class-list{flex-direction:row;overflow-x:auto;touch-action:pan-x}}.class-item{display:flex;align-items:center;gap:var(--sp-sm);padding:var(--sp-sm);cursor:pointer;min-width:170px}.class-item canvas{width:40px;height:40px;flex:none}.class-item .n{font-family:var(--font-heading);color:var(--gold-gold1);font-weight:700}.class-item .a{font-size:var(--fs-tiny);color:var(--c-text-muted);text-transform:uppercase;letter-spacing:.08em}.class-item.sel{box-shadow:inset 0 0 0 1px var(--hud-edge-lo),0 0 0 2px var(--gold-gold1)}.class-detail{display:flex;flex-direction:column;min-height:0;padding:var(--sp-md);gap:var(--sp-sm)}.class-detail .blurb{font-style:italic;color:var(--c-text)}.class-detail .chips{display:flex;flex-wrap:wrap;gap:var(--sp-xs)}.chip{font-size:var(--fs-tiny);padding:3px var(--sp-sm);border:1px solid var(--hud-edge);border-radius:var(--r-pill);color:var(--gold-gold1);background:var(--hud-glass-lo);letter-spacing:.04em}.abilities{flex:1;min-height:0;overflow-y:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:var(--sp-xs);touch-action:pan-y}.ability{display:flex;gap:var(--sp-sm);padding:var(--sp-xs) var(--sp-sm);border-radius:var(--r-sm);background:var(--hud-glass-lo);border:1px solid var(--hud-edge-lo)}.ability .ic{font-size:26px;color:var(--gold-gold1);margin-top:2px}.ability .t{font-weight:700;font-size:var(--fs-small)}.ability .t em{font-style:normal;color:var(--c-text-muted);font-weight:400;margin-left:var(--sp-xs)}.ability .d{font-size:var(--fs-tiny);color:var(--c-text-muted);line-height:1.35}.create-bar{display:flex;gap:var(--sp-sm);align-items:end}.create-bar .field{flex:1}.game{position:absolute;inset:0}.game canvas.board{position:absolute;inset:0;width:100%;height:100%;display:block}.vignette{position:absolute;inset:0;pointer-events:none;z-index:var(--z-vignette);background:radial-gradient(ellipse at center,transparent 55%,var(--hud-vignette) 140%)}#hud{position:absolute;inset:0;pointer-events:none;z-index:var(--z-hud);--safe-l: max(var(--sp-sm), env(safe-area-inset-left));--safe-r: max(var(--sp-sm), env(safe-area-inset-right));--safe-t: max(var(--sp-sm), env(safe-area-inset-top));--safe-b: max(var(--sp-sm), env(safe-area-inset-bottom))}#hud>*{pointer-events:auto}#hud .pass{pointer-events:none}#hud .pass>*{pointer-events:auto}.unit{position:absolute;display:flex;align-items:center;gap:var(--sp-sm);padding:var(--sp-xs) var(--sp-sm) var(--sp-xs) var(--sp-xs)}.unit .portrait{position:relative;width:46px;height:46px;flex:none}.unit .portrait canvas{width:100%;height:100%}.unit .lvl{position:absolute;right:-4px;bottom:-3px;min-width:18px;height:18px;padding:0 3px;border-radius:var(--r-pill);background:var(--hud-slot);border:1px solid var(--gold-gold2);color:var(--gold-gold1);font-size:var(--fs-tiny);font-weight:800;display:flex;align-items:center;justify-content:center}.unit .info{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}.unit .nm{font-family:var(--font-heading);font-weight:700;font-size:var(--fs-small);color:var(--gold-gold1);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.unit .sub{font-size:var(--fs-tiny);color:var(--c-text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.unit .bar{height:12px}.unit .bar.res{height:11px}.conds{display:flex;gap:3px;flex-wrap:wrap;min-height:0}.cond{font-size:9px;padding:1px 5px;border-radius:var(--r-pill);background:var(--hud-slot);border:1px solid var(--hud-edge-lo);color:var(--c-text);letter-spacing:.03em}.cond.bad{border-color:var(--c-danger);color:var(--fx-damage)}.cond.good{border-color:var(--c-friendly);color:var(--fx-heal)}#me{left:var(--safe-l);top:var(--safe-t);width:214px}#target{left:50%;top:var(--safe-t);transform:translate(-50%);width:230px}#target.hidden{opacity:0;pointer-events:none;transform:translate(-50%) translateY(-8px)}#target{transition:opacity .15s,transform .15s}#target .portrait{width:40px;height:40px}#party{left:var(--safe-l);top:calc(var(--safe-t) + 66px);display:flex;flex-direction:column;gap:3px;width:160px}.pm{display:flex;align-items:center;gap:var(--sp-xs);padding:3px var(--sp-xs);font-size:var(--fs-tiny)}.pm .bar{flex:1;height:7px}#tracker{left:var(--safe-l);top:calc(var(--safe-t) + 66px);width:196px;padding:var(--sp-sm);display:flex;flex-direction:column;gap:var(--sp-xs);max-height:34vh;overflow:hidden}#tracker.empty{display:none}#tracker h4{margin:0;font-family:var(--font-heading);font-size:var(--fs-tiny);letter-spacing:.12em;text-transform:uppercase;color:var(--c-text-muted)}.tq .qn{font-family:var(--font-heading);font-size:var(--fs-small);color:var(--gold-gold1);font-weight:700}.tq .qo{font-size:var(--fs-tiny);color:var(--c-text);display:flex;justify-content:space-between;gap:var(--sp-xs)}.tq .qo.done{color:var(--c-friendly)}.tq.ready .qn:after{content:" ?";color:var(--fx-quest-ready)}#minimap{right:var(--safe-r);top:var(--safe-t);width:116px;height:116px;padding:4px;position:absolute;border-radius:50%}#minimap canvas{width:100%;height:100%;border-radius:50%;display:block}#minimap .zone-name{position:absolute;left:50%;bottom:-10px;transform:translate(-50%);white-space:nowrap;font-family:var(--font-heading);font-size:var(--fs-tiny);color:var(--gold-gold1);padding:1px var(--sp-sm);background:var(--hud-glass-hi);border:1px solid var(--hud-edge);border-radius:var(--r-pill)}.round-btn{position:absolute;width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--gold-gold1);font-size:20px;cursor:pointer;padding:0;border:1px solid var(--hud-edge);background:radial-gradient(circle at 35% 30%,var(--hud-slot-hi),var(--hud-slot));box-shadow:0 3px 8px var(--hud-shadow),inset 0 0 0 1px var(--hud-edge-lo)}.round-btn:active{filter:brightness(1.3)}.round-btn .badge{position:absolute;top:-2px;right:-2px;width:10px;height:10px;border-radius:50%;background:var(--c-danger);box-shadow:0 0 0 2px var(--hud-board-edge);display:none}.round-btn.alert .badge{display:block}#menuBtn{right:calc(var(--safe-r) + 124px);top:var(--safe-t)}#logBtn{right:calc(var(--safe-r) + 124px);top:calc(var(--safe-t) + 46px)}#chatBtn{right:calc(var(--safe-r) + 124px);top:calc(var(--safe-t) + 92px)}#stick{left:calc(var(--safe-l) + 12px);bottom:calc(var(--safe-b) + 12px);width:136px;height:136px;position:absolute;touch-action:none}#stick .base{position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle,var(--hud-glass-lo) 0%,var(--hud-glass) 70%);border:1px solid var(--hud-edge);box-shadow:inset 0 0 0 6px var(--hud-glass-lo),inset 0 0 0 7px var(--hud-edge-lo),0 4px 14px var(--hud-shadow)}#stick .base:before{content:"";position:absolute;inset:36%;border-radius:50%;border:1px dashed var(--hud-edge-lo)}#stick .knob{position:absolute;left:50%;top:50%;width:58px;height:58px;margin:-29px;border-radius:50%;background:radial-gradient(circle at 35% 30%,var(--gold-gold1),var(--gold-gold2) 45%,var(--gold-gold3));box-shadow:0 4px 10px var(--hud-shadow),inset 0 -3px 6px var(--hud-inset);border:1px solid var(--gold-gold1)}#stick.active .base{border-color:var(--gold-gold1)}#abilities{position:absolute;right:calc(var(--safe-r) + 6px);bottom:calc(var(--safe-b) + 6px);width:192px;height:186px;pointer-events:none}#abilities>*{pointer-events:auto}.ab{position:absolute;width:46px;height:46px;border-radius:50%;padding:0;cursor:pointer;border:none;background:none}.ab .plate{position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 35% 30%,var(--hud-slot-hi),var(--hud-slot));border:2px solid var(--gold-gold2);box-shadow:0 3px 8px var(--hud-shadow),inset 0 0 0 2px var(--hud-board-edge),inset 0 0 10px var(--hud-inset);overflow:hidden}.ab .ic{position:absolute;left:50%;top:50%;width:60%;height:60%;transform:translate(-50%,-50%);color:var(--gold-gold1)}.ab .cd{position:absolute;inset:0;border-radius:50%;display:none;align-items:center;justify-content:center;font-weight:800;font-size:var(--fs-large);color:var(--c-text);background:var(--hud-cooldown);text-shadow:0 1px 2px var(--hud-board-edge)}.ab.cooling .cd{display:flex}.ab .cost{position:absolute;right:-2px;bottom:-2px;min-width:16px;height:16px;padding:0 3px;border-radius:var(--r-pill);font-size:9px;font-weight:800;display:flex;align-items:center;justify-content:center;background:var(--c-resource-bg);border:1px solid var(--c-power);color:var(--c-text)}.ab.stamina .cost{border-color:var(--c-endurance)}.ab.locked .plate{filter:grayscale(1) brightness(.5)}.ab .lock{position:absolute;inset:0;display:none;align-items:center;justify-content:center;font-size:var(--fs-tiny);font-weight:800;color:var(--c-text-muted)}.ab.locked .lock{display:flex}.ab.locked .ic,.ab.locked .cost{opacity:.35}.ab.poor .ic{opacity:.45}.ab.ready .plate{border-color:var(--hud-ready-glow);box-shadow:0 0 0 2px var(--hud-ready-glow),0 0 16px var(--hud-ready-glow),inset 0 0 12px var(--gold-gold2);animation:readyPulse 1s ease-in-out infinite}@keyframes readyPulse{50%{box-shadow:0 0 0 3px var(--hud-ready-glow),0 0 26px var(--hud-ready-glow),inset 0 0 16px var(--gold-gold2)}}.ab:active .plate{filter:brightness(1.35)}.ab.attack{width:72px;height:72px;right:6px;bottom:6px}.ab.attack .plate{border-width:3px}.ab.attack .ic{width:54%;height:54%}.ab.attack svg.timer{position:absolute;inset:-7px;width:calc(100% + 14px);height:calc(100% + 14px);transform:rotate(-90deg);pointer-events:none}.ab.attack svg.timer circle{fill:none;stroke-width:3}.ab.attack svg.timer .track{stroke:var(--hud-glass-lo)}.ab.attack svg.timer .run{stroke:var(--gold-gold1);stroke-linecap:round}.ab.attack.engaged .plate{border-color:var(--fx-hostile-ring)}.fortune{position:absolute;width:56px;height:30px;right:14px;bottom:92px;display:flex;align-items:center;justify-content:center;gap:5px;border-radius:var(--r-pill);cursor:pointer;padding:0 var(--sp-sm);border:1px solid var(--gold-gold2);background:linear-gradient(180deg,var(--hud-slot-hi),var(--hud-slot));box-shadow:0 2px 6px var(--hud-shadow)}.fortune i{width:10px;height:10px;border:1px solid var(--gold-gold2);background:var(--hud-slot);display:block;transform:rotate(45deg);border-radius:2px}.fortune i.on{background:radial-gradient(circle at 35% 30%,var(--gold-gold1),var(--gold-gold2));box-shadow:0 0 6px var(--gold-gold2)}.fortune.armed{border-color:var(--hud-ready-glow);box-shadow:0 0 12px var(--hud-ready-glow)}.fortune .lbl{display:none}#context{position:absolute;right:calc(var(--safe-r) + 204px);bottom:calc(var(--safe-b) + 14px);display:flex;flex-direction:column;gap:var(--sp-xs);align-items:flex-end}#context .btn{min-height:36px}#trayAnchor{position:absolute;left:calc(var(--safe-l) + 160px);right:calc(var(--safe-r) + 206px);bottom:calc(var(--safe-b) + 4px);height:96px;pointer-events:none}#chatline{position:absolute;left:calc(var(--safe-l) + 160px);right:calc(var(--safe-r) + 244px);bottom:calc(var(--safe-b) + 104px);display:flex;flex-direction:column;gap:2px;pointer-events:none}#chatline .cl{align-self:flex-start;max-width:100%;font-size:var(--fs-tiny);padding:2px var(--sp-sm);border-radius:var(--r-sm);background:var(--hud-glass-lo);color:var(--c-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;animation:fadeLine 9s forwards}#chatline .cl b{color:var(--gold-gold1);font-weight:700}#chatline .cl.realm b{color:var(--c-friendly)}#chatline .cl.system{color:var(--c-text-muted);font-style:italic}@keyframes fadeLine{0%,80%{opacity:1}to{opacity:0}}#toasts{position:absolute;left:50%;top:calc(var(--safe-t) + 66px);transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:4px;pointer-events:none;z-index:var(--z-toast)}.toast{font-size:var(--fs-small);padding:4px var(--sp-md);border-radius:var(--r-pill);background:var(--hud-glass-hi);border:1px solid var(--hud-edge);color:var(--c-text);animation:toastIn .2s ease-out,fadeLine 4s forwards;white-space:nowrap;max-width:80vw;overflow:hidden;text-overflow:ellipsis}.toast.warn{border-color:var(--c-danger);color:var(--fx-damage)}.toast.quest{border-color:var(--gold-gold1);color:var(--gold-gold1);font-family:var(--font-heading);font-weight:700}.toast.realm{border-color:var(--c-friendly)}@keyframes toastIn{0%{transform:translateY(-6px);opacity:0}}#banner{position:absolute;left:0;right:0;top:26%;text-align:center;pointer-events:none;z-index:var(--z-toast);opacity:0}#banner.show{animation:bannerIn 2.8s ease-out forwards}#banner .big{font-family:var(--font-heading);font-weight:900;font-size:var(--fs-banner);color:var(--gold-gold1);text-shadow:0 0 18px var(--gold-gold2),0 3px 0 var(--hud-board-edge);letter-spacing:.06em}#banner .small{font-family:var(--font-heading);color:var(--c-text);letter-spacing:.25em;text-transform:uppercase;font-size:var(--fs-small);margin-top:var(--sp-xs);text-shadow:0 2px 4px var(--hud-board-edge)}@keyframes bannerIn{0%{opacity:0;transform:scale(.85)}12%{opacity:1;transform:scale(1.04)}20%{transform:scale(1)}80%{opacity:1}to{opacity:0}}#net{position:absolute;left:50%;top:40%;transform:translate(-50%,-50%);padding:var(--sp-md) var(--sp-xl);display:none;align-items:center;gap:var(--sp-md);z-index:var(--z-overlay)}#net.show{display:flex}#net .row{display:flex;gap:var(--sp-sm)}#net.actions{flex-direction:column;text-align:center}#net.actions .spinner{display:none}#net .spinner{width:20px;height:20px;border:2px solid var(--hud-edge-lo);border-top-color:var(--gold-gold1);border-radius:50%;animation:spin 1s linear infinite}#death{position:absolute;inset:0;display:none;flex-direction:column;align-items:center;justify-content:center;gap:var(--sp-md);z-index:var(--z-overlay);background:radial-gradient(ellipse at center,var(--hud-backdrop),var(--hud-board-edge))}#death.show{display:flex;animation:toastIn .6s ease-out}#death h2{font-size:var(--fs-banner);color:var(--c-danger);text-shadow:0 0 20px var(--c-hp-bg)}#sheets{position:absolute;inset:0;pointer-events:none;z-index:var(--z-sheet)}.sheet-wrap{position:absolute;inset:0;pointer-events:auto;background:var(--hud-backdrop);display:flex;align-items:center;justify-content:center;animation:fadeIn .15s ease-out;padding:var(--safe-t) var(--safe-r) var(--safe-b) var(--safe-l)}@keyframes fadeIn{0%{opacity:0}}.sheet{width:min(640px,100%);max-height:100%;display:flex;flex-direction:column;animation:sheetIn .2s ease-out}@keyframes sheetIn{0%{transform:translateY(14px);opacity:0}}.sheet>header{display:flex;align-items:center;gap:var(--sp-md);padding:var(--sp-sm) var(--sp-sm) var(--sp-sm) var(--sp-lg);border-bottom:1px solid var(--hud-edge-lo)}.sheet>header h2{flex:1;font-size:var(--fs-large)}.sheet>header .x{width:36px;height:36px;border-radius:50%;border:1px solid var(--hud-edge);background:var(--hud-slot);color:var(--gold-gold1);font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center}.sheet .body{padding:var(--sp-md) var(--sp-lg);overflow-y:auto;-webkit-overflow-scrolling:touch;touch-action:pan-y;min-height:0;display:flex;flex-direction:column;gap:var(--sp-md)}.sheet .tabs{display:flex;gap:var(--sp-xs);padding:var(--sp-sm) var(--sp-lg) 0}.sheet .tabs button{flex:1;min-height:34px;border:1px solid var(--hud-edge-lo);border-bottom:none;border-radius:var(--r-sm) var(--r-sm) 0 0;background:var(--hud-slot);color:var(--c-text-muted);font-family:var(--font-heading);font-weight:700;letter-spacing:.06em;cursor:pointer}.sheet .tabs button.on{color:var(--gold-gold1);background:var(--hud-slot-hi);border-color:var(--hud-edge)}.sheet section h3{font-size:var(--fs-small);letter-spacing:.14em;text-transform:uppercase;color:var(--c-text-muted);margin-bottom:var(--sp-xs)}.menu-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-sm)}.menu-grid button{min-height:72px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--sp-xs);border-radius:var(--r-md);border:1px solid var(--hud-edge);background:linear-gradient(180deg,var(--hud-slot-hi),var(--hud-slot));color:var(--gold-gold1);font-family:var(--font-heading);font-weight:700;letter-spacing:.05em;cursor:pointer}.menu-grid button .ic{font-size:28px}.stats{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:var(--sp-xs)}.stat{display:flex;justify-content:space-between;align-items:baseline;padding:var(--sp-xs) var(--sp-sm);background:var(--hud-glass-lo);border:1px solid var(--hud-edge-lo);border-radius:var(--r-sm)}.stat .k{font-size:var(--fs-small);color:var(--c-text-muted)}.stat .v{font-weight:800;color:var(--gold-gold1);font-size:var(--fs-large)}.stat .v small{font-size:var(--fs-tiny);color:var(--c-text-muted);font-weight:600;margin-left:3px}.gear{display:grid;grid-template-columns:repeat(auto-fill,minmax(68px,1fr));gap:var(--sp-xs)}.slot{position:relative;aspect-ratio:1;border-radius:var(--r-sm);background:var(--hud-slot);border:1px solid var(--hud-edge-lo);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;cursor:pointer;padding:2px;overflow:hidden}.slot .ic{font-size:26px;color:var(--c-text-muted)}.slot .sl{font-size:9px;color:var(--c-text-muted);text-transform:uppercase;letter-spacing:.06em}.slot .n{position:absolute;right:3px;bottom:1px;font-size:var(--fs-tiny);font-weight:800;color:var(--c-text);text-shadow:0 1px 1px var(--hud-board-edge)}.slot.filled .ic{color:var(--rarity-common)}.slot.r-uncommon{border-color:var(--rarity-uncommon)}.slot.r-uncommon .ic{color:var(--rarity-uncommon)}.slot.r-rare{border-color:var(--rarity-rare)}.slot.r-rare .ic{color:var(--rarity-rare)}.slot.r-epic{border-color:var(--rarity-epic)}.slot.r-epic .ic{color:var(--rarity-epic)}.slot.sel{box-shadow:0 0 0 2px var(--gold-gold1)}.bag{display:grid;grid-template-columns:repeat(auto-fill,minmax(54px,1fr));gap:var(--sp-xs)}.item-card{display:flex;gap:var(--sp-md);padding:var(--sp-sm) var(--sp-md);align-items:flex-start;background:var(--hud-glass-lo);border:1px solid var(--hud-edge-lo);border-radius:var(--r-sm)}.item-card .ic{font-size:36px}.item-card .nm{font-family:var(--font-heading);font-weight:700}.item-card .actions{display:flex;gap:var(--sp-xs);flex-wrap:wrap;margin-top:var(--sp-xs)}.rar-common{color:var(--rarity-common)}.rar-uncommon{color:var(--rarity-uncommon)}.rar-rare{color:var(--rarity-rare)}.rar-epic{color:var(--rarity-epic)}.qcard{padding:var(--sp-sm) var(--sp-md);background:var(--hud-glass-lo);border:1px solid var(--hud-edge-lo);border-radius:var(--r-sm);display:flex;flex-direction:column;gap:var(--sp-xs)}.qcard .qn{font-family:var(--font-heading);font-weight:700;color:var(--gold-gold1)}.qcard .qt{font-size:var(--fs-small);line-height:1.45;color:var(--c-text);font-style:italic}.qcard .row{display:flex;gap:var(--sp-xs);align-items:center;justify-content:space-between;flex-wrap:wrap}.obj{font-size:var(--fs-small);display:flex;justify-content:space-between}.obj.done{color:var(--c-friendly)}.dialog-head{display:flex;gap:var(--sp-md);align-items:center}.dialog-head canvas{width:54px;height:54px;flex:none}.dialog-text{font-size:var(--fs-body);line-height:1.5;font-style:italic;color:var(--c-text)}.shop-row{display:flex;align-items:center;gap:var(--sp-sm);padding:var(--sp-xs) var(--sp-sm);background:var(--hud-glass-lo);border:1px solid var(--hud-edge-lo);border-radius:var(--r-sm)}.shop-row .ic{font-size:26px}.shop-row .nm{flex:1;font-weight:600;font-size:var(--fs-small)}.log-list{display:flex;flex-direction:column;gap:2px;font-size:var(--fs-small);font-family:var(--font-body)}.log-list .l{padding:3px var(--sp-sm);border-left:2px solid var(--hud-edge-lo);color:var(--c-text-muted)}.log-list .l.mine{border-color:var(--gold-gold1);color:var(--c-text)}.log-list .l.onme{border-color:var(--c-danger);color:var(--c-text)}.log-list .l.kill{border-color:var(--c-xp);color:var(--c-xp)}.log-list .l.heal{border-color:var(--c-friendly)}.chat-sheet .lines{display:flex;flex-direction:column;gap:3px;font-size:var(--fs-small)}.chat-sheet .lines .cl b{color:var(--gold-gold1)}.chat-input{display:flex;gap:var(--sp-xs);padding:var(--sp-sm) var(--sp-lg) var(--sp-md);border-top:1px solid var(--hud-edge-lo)}.chat-input input{flex:1;height:40px;padding:0 var(--sp-md);color:var(--c-text);background:var(--hud-slot);border:1px solid var(--hud-edge);border-radius:var(--r-sm);outline:none}.seg{display:flex;border:1px solid var(--hud-edge);border-radius:var(--r-sm);overflow:hidden}.seg button{border:none;background:var(--hud-slot);color:var(--c-text-muted);padding:0 var(--sp-sm);min-height:40px;font-size:var(--fs-small);cursor:pointer}.seg button.on{color:var(--c-bg);background:var(--gold-gold1);font-weight:700}.toggle-row{display:flex;align-items:center;justify-content:space-between;padding:var(--sp-sm) 0;border-bottom:1px solid var(--hud-edge-lo)}.toggle{width:52px;height:28px;border-radius:var(--r-pill);background:var(--hud-slot);border:1px solid var(--hud-edge);position:relative;cursor:pointer;padding:0}.toggle:after{content:"";position:absolute;left:3px;top:3px;width:20px;height:20px;border-radius:50%;background:var(--c-text-muted);transition:left .15s}.toggle.on{background:var(--gold-gold3);border-color:var(--gold-gold1)}.toggle.on:after{left:27px;background:var(--gold-gold1)}.credits p{font-size:var(--fs-small);line-height:1.55;margin:0}.map-wrap{position:relative;align-self:center;width:min(520px,calc(100vh - 120px),calc(100vw - 300px));aspect-ratio:1}.map-wrap canvas{width:100%;height:100%;border-radius:var(--r-sm);border:1px solid var(--hud-edge);display:block}.map-wrap .pin{position:absolute;transform:translate(-50%,-50%);font-size:9px;font-weight:700;color:var(--c-text);text-shadow:0 1px 2px var(--hud-board-edge),0 0 3px var(--hud-board-edge);white-space:nowrap;pointer-events:none;display:flex;flex-direction:column;align-items:center}.map-wrap .pin .ic{font-size:14px;color:var(--gold-gold1);filter:drop-shadow(0 1px 1px var(--hud-board-edge))}.map-layout{display:grid;grid-template-columns:auto 200px;gap:var(--sp-md);align-items:start;justify-content:center}@media(orientation:portrait){.map-layout{grid-template-columns:1fr}.map-wrap{width:min(100%,520px)}}.war-row{display:flex;align-items:center;gap:var(--sp-sm);font-size:var(--fs-small);padding:3px 0}.war-row .sw{width:10px;height:10px;border-radius:2px;flex:none}.war-row .bar{flex:1;height:6px}.infocard{position:absolute;z-index:var(--z-dialog);width:min(320px,90vw);padding:var(--sp-md);display:flex;flex-direction:column;gap:var(--sp-xs);left:50%;top:50%;transform:translate(-50%,-50%)}.infocard .nm{font-family:var(--font-heading);font-weight:700;font-size:var(--fs-large)}.infocard .lore{font-size:var(--fs-small);line-height:1.45;font-style:italic;color:var(--c-text)}.infocard .tac{font-size:var(--fs-small);line-height:1.45;color:var(--c-text-muted)}.prompt{position:absolute;left:50%;top:30%;transform:translate(-50%);z-index:var(--z-dialog);padding:var(--sp-md) var(--sp-lg);display:flex;flex-direction:column;gap:var(--sp-sm);align-items:center}.prompt .row{display:flex;gap:var(--sp-sm)}@media(orientation:portrait){#trayAnchor{left:var(--safe-l);right:var(--safe-r);bottom:calc(var(--safe-b) + 198px)}#chatline{left:var(--safe-l);right:var(--safe-r);bottom:calc(var(--safe-b) + 298px)}#context{right:var(--safe-r);bottom:calc(var(--safe-b) + 198px)}#target{top:calc(var(--safe-t) + 132px)}#tracker{top:calc(var(--safe-t) + 64px);width:170px}#toasts{top:calc(var(--safe-t) + 196px)}}@media(max-height:360px){#tracker{max-height:26vh}#stick{width:118px;height:118px}}#banner .band{display:inline-block;margin-top:var(--sp-sm);padding:2px var(--sp-md);border:1px solid;border-radius:var(--r-pill);background:var(--travel-band);font-family:var(--font-heading);font-weight:700;font-size:var(--fs-body);letter-spacing:.08em;text-shadow:0 1px 2px var(--hud-board-edge)}#banner .band b{font-weight:700}#banner.show:has(.band){animation-duration:4.2s}#alert{position:absolute;left:50%;top:calc(var(--safe-t) + 58%);transform:translate(-50%);max-width:min(520px,70vw);display:none;align-items:center;gap:var(--sp-sm);padding:var(--sp-sm) var(--sp-lg);border-radius:var(--r-md);background:var(--travel-warn-bg);border:2px solid var(--travel-warn-edge);box-shadow:0 0 24px var(--travel-warn-glow),0 4px 12px var(--hud-shadow);color:var(--c-text);font-weight:700;font-size:var(--fs-body);line-height:1.35;z-index:var(--z-toast);pointer-events:auto}#alert.show{display:flex;animation:toastIn .25s ease-out,fadeLine 6.5s forwards}#alert .ic{width:24px;height:24px;flex:none;background:var(--travel-warn-edge)}#fade{position:absolute;inset:0;background:var(--travel-fade);opacity:0;pointer-events:none;transition:opacity .35s ease-in-out;display:flex;align-items:center;justify-content:center;gap:var(--sp-md);font-family:var(--font-heading);color:var(--gold-gold1);letter-spacing:.15em}#fade.on{opacity:1;pointer-events:auto;transition-duration:.28s}#fade .spinner{width:20px;height:20px;border:2px solid var(--hud-edge-lo);border-top-color:var(--gold-gold1);border-radius:50%;animation:spin 1s linear infinite}.tq .qh{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px var(--sp-xs)}.qlv{font-size:9px;font-weight:800;padding:0 4px;border:1px solid;border-radius:var(--r-pill);line-height:13px;white-space:nowrap}.qzone{font-size:9px;color:var(--c-text-muted);font-style:italic;white-space:nowrap}.qcard .qmeta{display:flex;gap:var(--sp-xs);align-items:center;margin-left:var(--sp-xs)}.reward-items{display:flex;flex-wrap:wrap;gap:var(--sp-xs) var(--sp-sm);font-size:var(--fs-small)}.reward-items .ri{display:inline-flex;align-items:center;gap:4px}.reward-items .ic{width:16px;height:16px}.con-line{font-weight:800;font-size:var(--fs-small);letter-spacing:.06em;text-transform:uppercase}.con-hint{font-size:var(--fs-small);color:var(--c-text-muted)}.road{display:flex;flex-direction:column;gap:var(--sp-md)}.road .chain{display:flex;align-items:stretch;gap:0}.road .node{flex:1 1 0;min-width:0;position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;gap:3px;padding:var(--sp-sm) var(--sp-xs);border-radius:var(--r-md);border:1px solid var(--hud-edge-lo);background:var(--hud-glass-lo)}.road .node.here{border-color:var(--gold-gold1);box-shadow:0 0 0 1px var(--gold-gold2),0 0 14px var(--gold-gold3);background:var(--hud-glass-hi)}.road .node .tier{width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--font-heading);font-weight:900;font-size:var(--fs-small);border:2px solid;background:var(--hud-slot)}.road .node .zn{font-family:var(--font-heading);font-weight:700;font-size:var(--fs-small);color:var(--gold-gold1);line-height:1.15}.road .node .lv{font-size:var(--fs-tiny);font-weight:800}.road .node .hub{font-size:9px;color:var(--c-text-muted)}.road .node .you{position:absolute;top:-9px;left:50%;transform:translate(-50%);font-size:8px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--hud-board-edge);background:var(--gold-gold1);border-radius:var(--r-pill);padding:1px 6px;white-space:nowrap}.road .link{flex:0 0 14px;align-self:center;height:3px;background:repeating-linear-gradient(90deg,var(--gold-gold2) 0 4px,transparent 4px 7px)}.road .marches{display:flex;align-items:center;gap:var(--sp-md)}.road .marches .node{flex:0 0 auto;min-width:150px}.road .marches .note{font-size:var(--fs-small);color:var(--c-text-muted);line-height:1.4}.road h3{margin:0;font-family:var(--font-heading);font-size:var(--fs-small);letter-spacing:.12em;text-transform:uppercase;color:var(--c-text-muted)}.map-wrap .pin.lair .ic{font-size:16px}.map-wrap .pin .pl{font-size:8px;font-weight:800;color:var(--c-text-muted)}@media(orientation:portrait){.road .chain{flex-direction:column}.road .link{flex:0 0 10px;width:3px;height:auto;align-self:center;background:repeating-linear-gradient(180deg,var(--gold-gold2) 0 4px,transparent 4px 7px)}.road .marches{flex-direction:column;align-items:stretch}}