/* One layout tree: playfield + normal-flow controls, with a sibling editor. */
.game-shell{position:fixed;inset:0;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr);width:100%;height:100dvh;overflow:hidden;background:#10291f}
.viewport{grid-area:1/1;display:grid;grid-template-rows:minmax(0,1fr) auto;min-width:0;min-height:0;container:game / size}
.playfield{position:relative;min-width:0;min-height:0;overflow:hidden;background:#294937}
#world{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none;outline-offset:-2px}
.hud-shade{position:absolute;inset:0;background:linear-gradient(#061e183d,transparent 26%,transparent 80%,#08201824);pointer-events:none}
.hud-top{position:absolute;top:12px;left:14px;right:14px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:start;z-index:5;pointer-events:none}
.zonebar{display:flex;align-items:center;gap:9px;min-width:0;pointer-events:none;text-shadow:0 2px 5px #112b20}
.zone-icon{font-size:27px;color:#efdbab}.zonebar>div{min-width:0}#zoneName{font:500 26px/1.05 'Cormorant Garamond',Georgia,serif;overflow-wrap:anywhere}.zone-meta{display:flex;gap:7px;flex-wrap:wrap;font-size:7px;letter-spacing:.5px;color:#c0d1b4;margin-top:5px}
.hud-tools{position:relative;display:flex;pointer-events:auto;min-width:0}.hud-utility{display:flex;align-items:center;background:#102e25e8;border:1px solid #91a27666;border-radius:5px;padding:3px;gap:3px}.hud-tools button{min-width:32px;min-height:32px;border-radius:3px;font-size:10px;padding:5px}.hud-tools #fullscreen{font-size:21px}.hud-tools #hudMenu{display:block;font-size:19px}.hud-tools button:hover{background:#ced08c22}
.hud-nav{display:none;position:absolute;right:0;top:43px;width:232px;padding:6px;grid-template-columns:1fr 1fr;gap:4px;background:#142f26;border:1px solid #81946c99;border-radius:5px;box-shadow:0 8px 25px #071c1980}.menu-open .hud-nav{display:none}.hud-nav button{text-align:left;min-height:36px;font-size:10px}.hud-nav kbd{font-size:6px;margin-left:3px}.hud-nav #help{font-size:16px}
.minimap{position:absolute;right:14px;top:72px;width:108px;height:100px;padding:4px;background:#102e25d9;border:1px solid #a1ae7a88;border-radius:5px;z-index:3;overflow:hidden}.minimap svg{display:block;width:100%;height:76px}.minimap>span{display:block;font-size:6px;letter-spacing:.5px;line-height:14px}.minimap kbd{display:none}
.target-box{position:absolute;right:14px;top:182px;width:132px;padding:8px;background:#18372ee6;border:1px solid #c3a57688;border-radius:4px;font-size:10px;line-height:1.5;z-index:3;pointer-events:none}.target-box small{font-size:8px}.target-box .bar{margin:5px 0}
.toast{position:absolute;left:14px;top:77px;width:min(260px,calc(100% - 144px));padding:7px 9px;font-size:10px;line-height:1.5;background:#15372de6;border-left:2px solid #b8d48b;border-radius:3px;color:#dce8c7;z-index:3;pointer-events:none;max-height:47px;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.destination-label,.interact-prompt{position:absolute;left:50%;bottom:12px;transform:translateX(-50%);max-width:80%;z-index:4;border:1px solid #a1b57b88;background:#12372ce8;border-radius:4px;padding:7px 12px;text-align:center;font-size:10px}.destination-label{pointer-events:none}.interact-prompt{min-height:36px;color:#f0dfaa}
.area-label,.quest-tracker,.world-bottom,.hud-wallet,.active-creature,#journalSource{display:none}
/* Both rows use flow layout: five party cells can never become a vertical stack. */
.combat-hud{display:grid;gap:4px;min-width:0;background:#102a22;border-top:1px solid #6f8d624f;padding:5px 12px;margin:0;z-index:4;height:auto}
.team-strip{display:grid;grid-template-columns:76px minmax(0,1fr) 96px;gap:12px;align-items:center;min-width:0;width:min(100%,900px);margin:auto}
.ranger-control{min-height:40px;padding:6px;font-size:10px;border:1px solid #8ca47766;border-radius:4px;background:#18392b}.ranger-control.selected{border-color:#e8cc8e;color:#ffe0a0}.ranger-control kbd{margin-left:4px}
.party-cards{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));grid-template-rows:1fr;gap:6px;min-width:0;align-items:stretch;padding:0;margin:0;width:100%;height:44px}
.party-card{position:relative;display:grid;grid-template-columns:28px minmax(0,1fr);grid-template-rows:24px repeat(3,2px);gap:2px 4px;padding:4px 5px;min-width:0;width:100%;height:44px;margin:0;text-align:left;background:#1c3c2d;border:1px solid #72966c88;border-radius:4px;overflow:hidden;color:#d9e8cd}
.party-card.active{border-color:#e7cd8f;background:#40503a;box-shadow:inset 0 0 0 1px #daca7a44}.party-card:disabled{opacity:.5}.party-card:not(:disabled):hover{border-color:#e2d6a3}.party-card canvas{position:static;grid-area:1/1;display:block;width:24px;height:24px;margin:0;transform:none}.party-card strong{grid-area:1/2;align-self:center;font-size:10px;line-height:1.2;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500;margin:0}.party-card .bar{grid-column:1/-1;height:2px;margin:0;width:100%}.party-card .bar:not(.mana):not(.xp){grid-row:2}.party-card .bar.mana{grid-row:3}.party-card .bar.xp{grid-row:4}.card-top,.card-health,.creature-level{display:none}.party-card.empty-slot{display:none}#partyCards:not(:has([data-member])) .empty-slot:first-child{display:flex;grid-column:1/-1;align-items:center;justify-content:center;gap:9px;border-style:dashed;font-size:10px}.empty-slot .card-key,.empty-slot small{display:none}.empty-slot strong{font-size:10px;margin:0}.empty-symbol{font-size:18px}
.party-heading{position:static;width:auto;display:grid;gap:4px;justify-content:end;font-size:7px;line-height:1;color:#c2d2b4;margin:0;padding:0}.party-heading>span:first-child{display:none}.team-mana{display:block;grid-row:1;text-align:right;font-size:7px;white-space:nowrap;color:#bfd8c8}.team-switch{grid-row:2}.team-switch #previousMember{display:none}.party-heading b{font-weight:500;margin-left:4px}.team-switch{display:flex;gap:3px}.team-switch button{min-width:27px;height:26px;border:1px solid #718c6266;border-radius:3px;background:#173a2c;font-size:17px;padding:0}
.combat-controls{min-width:0}.action-bar{position:static;display:grid;grid-template-columns:minmax(0,1fr) 50px 82px;align-items:center;gap:9px;min-width:0;width:min(100%,780px);margin:auto;padding:0;height:auto;transform:none;border:0;background:none;box-shadow:none}
.skills{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:7px;min-width:0}.skill-slot{min-width:0;text-align:center}.skill{position:relative;display:block;margin:0 auto;width:min(36px,100%);height:36px;background:linear-gradient(145deg,#40583c,#1b382b);border:1px solid #a8b17d99;border-radius:5px;color:#f1d69b;padding:0}.skill:disabled{opacity:.4}.skill-icon{font-size:22px;line-height:30px}.skill kbd{position:absolute;right:-2px;bottom:-2px;font-size:7px;padding:1px 2px;background:#1a3527}.skill-mp{position:absolute;bottom:2px;left:0;right:0;font-size:5px;text-align:center;color:#c7dcd0}.skill-name{display:block;font-size:9px;line-height:1.2;margin-top:3px;min-height:22px;overflow-wrap:anywhere;color:#dce8ce}.cooldown{position:absolute;inset:0;display:grid;place-items:center;background:#102d25e6;border-radius:4px;font-size:22px}.loadout-button{padding:6px 3px;min-height:38px;font-size:10px;border:1px solid #78946888;border-radius:4px;color:#e3d39e}.loadout-button kbd{display:none}#hudMana{display:block;white-space:nowrap;font-size:8px;margin-top:2px;color:#bad9c7}.capture-action button{display:flex;align-items:center;gap:6px;padding:5px 0;min-height:42px;font-size:10px}.capture-action small{display:block;font-size:7px;margin-top:4px}.capture-action kbd{font-size:7px}
.paused-overlay{position:absolute;inset:0;z-index:15;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:12px;background:#102c25e8}.paused-overlay h2{font-size:38px;margin:0}.paused-overlay p{font-size:12px}
/* A real sibling grid cell reserves menu space; no backdrop covers the canvas. */
#modal{display:none;min-width:0;min-height:0;border:0;border-left:1px solid #80936a77;background:#142e25;color:#e1e7ce;border-radius:0;padding:16px;position:static;inset:auto;margin:0;width:auto;height:100%;max-width:none;max-height:none;overflow:auto;grid-area:1/2;z-index:10;box-shadow:none;scrollbar-width:thin;scrollbar-color:#7e9365 #142e25}
#modal[open]{display:block}.panel-open .game-shell{grid-template-columns:minmax(0,1fr) 360px}.modal-heading{position:sticky;top:-16px;z-index:5;background:#142e25;padding-top:8px}.modal-heading h2{overflow-wrap:anywhere}#modal::backdrop{background:none}

.touch-controls{display:none;grid-template-columns:68px minmax(0,1fr);grid-template-rows:40px 56px;gap:4px 8px;min-width:0;padding:0;width:100%;height:auto;position:static;pointer-events:auto}
.movement-pad{grid-area:1/1/3/2;display:flex;flex-direction:column;align-items:center;justify-content:space-between;gap:4px;min-width:0}.joystick{position:relative;display:grid;place-items:center;width:60px;height:60px;border:1px solid #a4b58388;border-radius:50%;background:#254936;touch-action:none;user-select:none}.stick-cross{font-size:54px;color:#aec09a22;line-height:1}#stickKnob{position:absolute;width:28px;height:28px;border:1px solid #cbd6a588;border-radius:50%;background:#8ca37d66}.touch-capture{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;width:36px;height:36px;border:1px solid #b0b78088;border-radius:50%;padding:2px;background:#274c36}.touch-capture .ball-icon{width:18px;height:18px}.touch-capture .ball-icon:after{inset:4px}.touch-capture small{font-size:4px;line-height:1.2;margin-top:2px}
.touch-actions{grid-area:1/2;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;min-width:0;align-items:center;justify-items:center;position:static;width:auto;height:auto;transform:none}.touch-actions button{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;width:40px;height:40px;border:1px solid #aeb78288;border-radius:50%;background:#254a35;color:#eed7a2;font-size:22px;padding:0;touch-action:none;user-select:none}.touch-actions small{font-size:5px;line-height:1.2;margin-top:2px}.touch-actions b{position:absolute;inset:0;display:none;place-items:center;border-radius:50%;background:#102e26e6;font-size:20px;font-weight:400}.touch-actions .on-cooldown b{display:grid}#touchSkill{display:none}.touch-actions button:disabled{opacity:.4}
.touch-loadout{grid-area:2/2;display:grid;grid-template-columns:repeat(4,minmax(0,1fr)) 24px;grid-template-rows:56px;gap:4px;align-items:start;min-width:0;position:static;width:auto;height:auto;background:none;border:0;transform:none;padding:0}.touch-loadout>div{grid-row:1;text-align:center;min-width:0}.touch-loadout [data-touch-move]{position:relative;display:block;margin:0 auto;width:min(36px,100%);height:36px;border:1px solid #9fae7c88;border-radius:5px;background:#2c5138;color:#f0d7a3;font-size:23px;padding:0;touch-action:none}.touch-loadout kbd{position:absolute;right:1px;top:1px;font-size:6px;border:0;padding:0}.touch-loadout button:disabled{opacity:.4}.touch-move-name{display:block;font-size:7.5px;line-height:1.1;margin-top:2px;min-height:16.5px;overflow-wrap:anywhere}.touch-move-cd{position:absolute;inset:0;display:grid;place-items:center;background:#102d25e6;border-radius:4px;font-size:21px;font-weight:400}.touch-move-cd:empty{display:none}.touch-loadout-edit{grid-row:1;min-width:0;padding:0;align-self:center;font-size:19px;color:#e4d29a}#touchMana{display:none}

@container game (width < 720px){
 .combat-hud{padding:5px 8px;gap:4px}.team-strip{grid-template-columns:48px minmax(0,1fr) 60px;gap:6px}.party-cards{gap:4px;height:44px}.party-card{height:44px;padding:2px;grid-template-columns:1fr;grid-template-rows:22px 8px repeat(3,2px);gap:1px}.party-card canvas{grid-area:1/1;width:22px;height:22px;justify-self:center}.party-card strong{grid-area:2/1;font-size:7px;text-align:center;line-height:8px}.party-card .bar:not(.mana):not(.xp){grid-row:3}.party-card .bar.mana{grid-row:4}.party-card .bar.xp{grid-row:5}.party-heading{justify-content:center;gap:2px}.team-switch button{min-width:26px;height:26px}.team-switch #previousMember{display:none}.ranger-control{font-size:8px;padding:3px;min-height:34px}.ranger-control kbd{display:none}.action-bar{grid-template-columns:minmax(0,1fr) 40px 62px;gap:6px}.skills{gap:4px}.capture-action{font-size:8px}.capture-action button{font-size:8px}.capture-action kbd{display:none}.capture-action small{font-size:6px}
#zoneName{font-size:22px}.zone-icon{font-size:22px}.hud-top{top:10px;left:10px;right:10px;gap:8px}.hud-tools button{min-width:30px;padding:4px;font-size:9px}.hud-tools #pause{font-size:0;min-width:30px}.hud-tools #pause:first-letter{font-size:13px}.zone-meta{font-size:6px}.minimap{right:10px;top:70px;width:86px;height:78px}.minimap svg{height:54px}.minimap>span{font-size:5px;line-height:12px}.target-box{right:10px;top:158px;width:110px;font-size:9px}.toast{left:10px;top:75px;width:calc(100% - 118px);max-width:250px;font-size:9px;padding:5px 7px;max-height:39px}
}
@container game (width < 380px){
 .combat-hud{padding-inline:6px}.team-strip{grid-template-columns:28px minmax(0,1fr) 24px;gap:4px}.team-switch #nextMember{display:none}.ranger-control{font-size:0}.ranger-control:first-letter{font-size:16px}.party-cards{gap:3px}.touch-controls{grid-template-columns:60px minmax(0,1fr);column-gap:6px}.touch-actions{gap:3px}.touch-actions button{width:min(38px,100%);height:38px}.touch-loadout{gap:2px;grid-template-columns:repeat(4,minmax(0,1fr)) 20px}.touch-move-name{font-size:7px}.action-bar{grid-template-columns:minmax(0,1fr) 28px 26px;gap:4px}.capture-action button>span:not(.ball-icon){display:none}.loadout-button{font-size:7px;padding:2px}.skills{gap:2px}.skill-name{font-size:7px;line-height:1.2;min-height:18px}.skill kbd{font-size:5px}
}
@container game (height < 500px) and (width >= 600px) and (width < 1100px){
 .combat-hud{padding:4px 10px;gap:4px}.team-strip{grid-template-columns:48px minmax(0,1fr) 60px;gap:6px}.party-cards{height:44px}.party-card{height:44px;grid-template-columns:24px minmax(0,1fr);grid-template-rows:24px repeat(3,2px);padding:3px;gap:1px 3px}.party-card canvas{width:24px;height:24px;grid-area:1/1}.party-card strong{grid-area:1/2;font-size:8px}.party-card .bar:not(.mana):not(.xp){grid-row:2}.party-card .bar.mana{grid-row:3}.party-card .bar.xp{grid-row:4}.ranger-control{font-size:8px}.ranger-control kbd{display:none}
 .touch-controls{grid-template-columns:60px 34px minmax(0,1fr) 140px;grid-template-rows:60px;gap:8px}.movement-pad{display:contents}.joystick{grid-area:1/1;width:58px;height:58px;align-self:center}.touch-capture{grid-area:1/2;align-self:center;width:32px;height:32px}.touch-loadout{grid-area:1/3;grid-template-rows:56px;gap:3px}.touch-actions{grid-area:1/4;gap:4px}.touch-actions button{width:32px;height:32px;font-size:17px}.touch-actions small{font-size:4px}
}
/* Dock placement uses the outer screen; the inner HUD adapts independently. */
@media(max-width:850px){
 .panel-open .game-shell{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) min(280px,42dvh)}.panel-open #modal{grid-area:2/1;border-left:0;border-top:1px solid #80936a77;padding:10px 14px}.panel-open .combat-hud{display:none}.panel-open .modal-heading{top:-10px;padding-top:3px;padding-bottom:7px}.panel-open .modal-heading h2{font-size:21px}.panel-open .modal-heading .eyebrow{display:none}.panel-open .modal-intro{font-size:10px;margin:7px 0}.panel-open .loadout-grid{grid-template-columns:1fr 1fr;gap:6px}.panel-open .loadout-grid label{padding:3px 0}.panel-open .loadout-grid select{font-size:10px}.panel-open .loadout-member{display:grid;grid-template-columns:70px 1fr;align-items:center;gap:8px;margin:8px 0}.panel-open .loadout-member select{min-height:32px}.panel-open #modalBody>.modal-intro:last-of-type{display:none}
}
@media(max-width:1100px) and (min-width:600px) and (max-height:500px){.panel-open .game-shell{grid-template-columns:minmax(0,1fr) 300px;grid-template-rows:minmax(0,1fr)}.panel-open #modal{grid-area:1/2;border-top:0;border-left:1px solid #80936a77}.panel-open .combat-hud{display:none}.panel-open .loadout-grid{grid-template-columns:1fr}}

.menu-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-top:14px}.menu-grid button{min-height:44px;padding:7px 5px;font-size:10px;line-height:1.3;overflow-wrap:anywhere}

/* Joystick controls belong to touch input, not every narrow desktop window. */
body[data-controls="pointer"] .action-bar{display:grid}body[data-controls="pointer"] .touch-controls{display:none}
body[data-controls="touch"] .action-bar{display:none}body[data-controls="touch"] .touch-controls{display:grid}
.skill-name,.touch-move-name{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}.skill-name{max-height:22px}.touch-move-name{max-height:16.5px}

.floor-status{position:absolute;z-index:6;left:12px;bottom:12px;display:flex;align-items:center;gap:6px;max-width:55%;padding:6px 8px;background:#173c30e8;border:1px solid #9bb68877;border-radius:4px;font-size:9px;color:#e1dfb6}.floor-status button{min-width:30px;min-height:28px;border:1px solid #8da57c77;border-radius:3px}.floor-status span{min-width:0;overflow-wrap:anywhere}

.potion-stock{display:flex;align-items:center;gap:6px;padding:8px 0;border-bottom:1px solid #79956733;font-size:11px}.potion-stock>span{flex:1;min-width:0}.potion-stock small{display:block;font-size:9px;line-height:1.4;color:#b9cbb3}.potion-stock button{font-size:9px;padding:6px}.potion-stock [aria-pressed=true]{border-color:#ead49a;color:#ffe4a4}
.quick-ball{display:block;width:100%;min-width:0;margin:0;border:1px solid #738f6666;border-radius:3px;background:#17392c;color:#e3e8cd;font:8px/1.2 'DM Sans',sans-serif;padding:1px;height:19px}.quick-ball option{font-size:12px}.capture-action{min-width:0}.capture-action button{min-height:32px}.ball-icon{background:linear-gradient(var(--ball-color,#bda66a) 44%,#183a2a 44%,#183a2a 57%,#e5d8ae 57%)}
.movement-pad{position:relative}.touch-ball-select{position:absolute;bottom:0;left:0;height:17px;font-size:7px}.touch-capture{margin-bottom:17px}
@container game (height < 500px) and (width >= 600px) and (width < 1100px){.touch-ball-select{position:static;grid-area:1/2;align-self:end;z-index:1}.touch-capture{margin-bottom:17px}.capture-action button{min-height:28px}}
.touch-capture{height:20px;min-height:20px;flex-shrink:0;border-radius:4px}.touch-capture .ball-icon{width:16px;height:16px}.touch-capture .ball-icon:after{inset:3px}.touch-capture small{display:none}
/* Skill cards stay beside the action being inspected. */
.skill-tooltip{position:fixed;z-index:40;max-width:calc(100vw - 20px);padding:13px 14px;background:#122e27f5;border:1px solid #c5b47c;border-radius:7px;color:#e5ebd7;box-shadow:0 8px 28px #061a16aa;font-size:11px;line-height:1.45;pointer-events:none}.skill-tooltip strong{display:block;padding-right:22px;font-size:14px;color:#f2deb0}.skill-tooltip>b{display:block;margin-top:5px;font-size:22px;font-weight:500;color:#b7ebcc}.skill-tooltip p{margin:6px 0;color:#c3d2c0}.skill-tooltip ul{list-style:none;padding:0;margin:5px 0;font-size:10px;color:#d7dfc6}.skill-tooltip li+li{margin-top:2px}.skill-tooltip>small{display:block;color:#e9bf8f}.tip-close{position:absolute;right:5px;top:3px;min-width:28px;height:28px;padding:0;font-size:21px;pointer-events:auto}.skill-slot:has(button:disabled),.touch-loadout>div:has(button:disabled){touch-action:manipulation}.skill-slot button:disabled,.touch-loadout button:disabled{pointer-events:none}
/* A dialogue dock reserves its own space and keeps the map visible. */
.npc-chat-open .game-shell{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) min(270px,40dvh)}.npc-chat-open .viewport{grid-area:1/1}.npc-chat-open .combat-hud{display:none}.npc-chat-open #modal{grid-area:2/1;height:100%;padding:12px max(16px,calc((100vw - 1080px)/2));border-left:0;border-top:1px solid #b3a47688;overflow:hidden}.npc-chat-open .modal-heading{display:none}.npc-chat-open #modalBody{height:100%;min-height:0}.npc-dialogue{display:grid;grid-template-columns:170px minmax(0,1fr);gap:22px;height:100%;min-height:0}.npc-face{width:100%;aspect-ratio:1;align-self:center;background-size:400% 400%;background-repeat:no-repeat;background-color:#254331;border:1px solid #b9aa7777;border-radius:9px;box-shadow:0 5px 20px #061b1655}.npc-dialogue-main{display:grid;grid-template-rows:auto minmax(0,1fr) auto auto;gap:7px;min-height:0;min-width:0}.npc-dialogue header{display:flex;align-items:center;justify-content:space-between;min-width:0}.npc-dialogue h2{font-size:25px;line-height:1.1;margin:3px 0}.npc-dialogue .eyebrow{font-size:8px;letter-spacing:1px}.npc-page{min-height:0;overflow:hidden;font-size:14px;line-height:1.55;color:#e1e6d0;align-content:center}.npc-page p{margin:5px 0}.npc-page small{font-size:9px;color:#c9c89c}.npc-actions{display:flex;align-items:center;gap:7px;flex-wrap:wrap}.npc-actions button,.npc-dialogue footer button{font-size:11px;min-height:32px;padding:6px 10px}.npc-dialogue footer{display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0}.npc-page-nav{display:flex;align-items:center;gap:8px;font-size:10px;color:#c7d4b8}.npc-page-nav button{min-width:32px;padding:3px 8px}.npc-shop-tabs{display:flex;align-items:center;gap:6px;font-size:10px}.npc-shop-tabs button{border:1px solid #87976466;border-radius:4px;min-height:28px;padding:3px 7px}.npc-shop-tabs [aria-pressed=true]{border-color:#e6d19e;background:#c2b45922;color:#f1da9f}.npc-shop-tabs>span{margin-left:auto;color:#e5cf91;white-space:nowrap}.npc-shop-item{padding:7px 0}.npc-shop-item strong{font-size:17px;font-weight:500}.npc-shop-item small{font-size:10px;margin-left:7px}.npc-shop-item p{font-size:11px;color:#c8d9c1;margin:4px 0}.npc-starter{display:grid;grid-template-columns:85px 1fr;gap:12px;align-items:center}.npc-starter canvas{width:85px;height:72px}.npc-starter strong{font-size:16px}.npc-starter p{font-size:11px}
@media(max-width:600px){.npc-chat-open .game-shell{grid-template-rows:minmax(0,1fr) min(310px,46dvh)}.npc-chat-open #modal{padding:10px 12px}.npc-dialogue{grid-template-columns:80px minmax(0,1fr);gap:10px}.npc-face{align-self:start;margin-top:5px}.npc-dialogue h2{font-size:20px}.npc-dialogue .eyebrow{font-size:7px;letter-spacing:.3px}.npc-dialogue-main{gap:5px}.npc-page{font-size:12px;line-height:1.5}.npc-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px}.npc-actions button,.npc-dialogue footer button{font-size:9px;line-height:1.25;padding:5px 6px;min-height:30px}.npc-dialogue footer{gap:5px}.npc-page-nav{gap:4px;font-size:9px}.npc-page-nav button{min-width:25px;padding:3px 5px}.npc-starter{grid-template-columns:50px minmax(0,1fr);gap:5px}.npc-starter canvas{width:50px;height:45px}.npc-starter strong{font-size:12px}.npc-starter p{font-size:10px;line-height:1.35;margin:3px 0}.npc-shop-tabs{gap:3px;font-size:8px;flex-wrap:wrap}.npc-shop-tabs button{font-size:8px;padding:3px 5px}.npc-shop-item strong{font-size:14px}.npc-shop-item small{font-size:8px;display:block;margin:1px 0}.npc-shop-item p{font-size:10px}}
@media(max-height:500px) and (min-width:600px){.npc-chat-open .game-shell{grid-template-columns:minmax(0,1fr) 340px;grid-template-rows:minmax(0,1fr)}.npc-chat-open #modal{grid-area:1/2;padding:10px;border-top:0;border-left:1px solid #b3a47688}.npc-dialogue{grid-template-columns:75px minmax(0,1fr);gap:10px}.npc-face{align-self:start}.npc-dialogue h2{font-size:20px}.npc-page{font-size:12px}.npc-actions button,.npc-dialogue footer button{font-size:9px}}
.skill-tooltip{pointer-events:auto;max-height:calc(100dvh - 30px);overflow-y:auto;width:290px}.skill-tooltip p{font-size:10px;line-height:1.4}.skill-tooltip>b{font-size:20px}.skill-tooltip .tip-tabs{display:flex;gap:4px;margin:0 22px 8px 0}.tip-tabs button{padding:3px 9px;font-size:10px;border:1px solid #7f9c7777;border-radius:3px;min-height:26px}.tip-tabs [aria-pressed=true]{color:#f6e4b3;background:#b8a96722;border-color:#cbb982}.tip-tabs[hidden]{display:none}
/* Phones retain the desktop portrait column; controls wrap within the dock. */
@media(max-width:600px){
 .npc-chat-open .game-shell{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) min(calc(340px + env(safe-area-inset-bottom,0px)),56dvh)}
 .npc-chat-open:has(.npc-dialogue[data-view="shop"],.npc-dialogue[data-view="starters"]) .game-shell{grid-template-rows:minmax(0,1fr) min(calc(360px + env(safe-area-inset-bottom,0px)),60dvh)}
 .npc-chat-open #modal{grid-area:2/1;padding:8px 10px max(8px,env(safe-area-inset-bottom,0px));border-left:0;border-top:1px solid #b3a47688}
 .npc-dialogue{display:grid;grid-template-columns:clamp(112px,44vw,170px) minmax(0,1fr);gap:10px;height:100%}
 .npc-face{position:static;width:100%;height:auto;aspect-ratio:1;align-self:center;margin:0;border-radius:9px;box-shadow:0 5px 20px #061b1655}
 .npc-dialogue-main{height:100%;gap:5px;grid-template-rows:auto minmax(0,1fr) auto auto}
 .npc-dialogue header{padding-left:0;gap:4px}.npc-dialogue header>div{min-width:0}.npc-dialogue h2{font-size:18px;margin:2px 0;line-height:1.1;overflow-wrap:anywhere}.npc-dialogue .eyebrow{font-size:7px;letter-spacing:.2px}
 .npc-page{font-size:12px;line-height:1.4}.npc-actions{gap:4px}.npc-actions button{min-height:32px;padding:4px 6px;font-size:10px;line-height:1.2;overflow-wrap:anywhere}
 .npc-dialogue footer{height:auto;flex-wrap:wrap;gap:4px}.npc-dialogue footer button{min-height:30px;font-size:10px;padding:3px 7px}.npc-page-nav{font-size:9px;gap:5px}.npc-page-nav button{min-width:30px}
 .npc-shop-item{padding:4px 0}.npc-shop-item small{display:block;margin:1px 0}.npc-starter{grid-template-columns:minmax(0,1fr)}.npc-starter canvas{justify-self:center}
}
@media(pointer:coarse) and (max-height:500px) and (min-width:601px){
 .npc-chat-open .game-shell{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) min(calc(270px + env(safe-area-inset-bottom,0px)),64dvh)}
 .npc-chat-open #modal{grid-area:2/1;padding:8px 12px max(8px,env(safe-area-inset-bottom,0px));border-left:0;border-top:1px solid #b3a47688}
 .npc-dialogue{display:grid;grid-template-columns:min(170px,calc(64dvh - 24px)) minmax(0,1fr);gap:18px;height:100%}
 .npc-face{position:static;width:100%;height:auto;aspect-ratio:1;align-self:center;margin:0;border-radius:9px}
 .npc-dialogue-main{height:100%;gap:4px;grid-template-rows:auto minmax(0,1fr) auto auto}.npc-dialogue header{padding-left:0}.npc-dialogue h2{font-size:20px}.npc-dialogue .eyebrow{font-size:8px}
 .npc-actions{display:flex;flex-wrap:wrap;gap:5px}.npc-actions button,.npc-dialogue footer button{font-size:11px;min-height:32px;padding:4px 8px}.npc-dialogue footer{flex-wrap:wrap;gap:5px}.npc-page{font-size:13px;line-height:1.4}.npc-starter{grid-template-columns:60px minmax(0,1fr)}.npc-starter canvas{width:60px;height:51px}
}

.joystick[data-pace="run"]{border-color:#e5ce8c;box-shadow:0 0 0 2px #d9bd6726,inset 0 0 16px #e0c56c18}

/* Recovery has its own normal-flow belt. Selectors never cover use targets. */
.combat-controls{display:grid;grid-template-columns:minmax(0,1fr) 216px;align-items:center;gap:14px;width:min(100%,1040px);margin:auto}
.combat-controls .action-bar{width:100%;margin:0;grid-template-columns:minmax(0,1fr) 40px 62px;gap:8px}
.potion-belt{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;min-width:0;align-self:center}
.potion-slot{display:grid;grid-template-rows:44px 24px;gap:4px;min-width:0;text-align:center;touch-action:manipulation}
.potion-use{position:relative;display:grid;place-items:center;grid-template-rows:28px 12px;min-width:0;min-height:44px;width:100%;height:44px;padding:1px 3px;background:linear-gradient(#365044,#1b352c);border:1px solid var(--recovery-color);border-radius:6px;color:#eee4c3;touch-action:manipulation;cursor:pointer}
.potion-use:hover:not(:disabled){background:#3b5744}.potion-use:disabled{opacity:.6;cursor:default;pointer-events:none}.potion-slot[data-cooling=true] .potion-use{opacity:.8}
.potion-vial{display:block;width:22px;height:26px}.potion-use kbd{position:absolute;left:3px;top:3px;font-size:7px;padding:0;border:0;background:none;color:#e8dbae}.potion-count{position:absolute;right:3px;top:3px;font:9px/1 monospace;color:#f0ead5}.potion-effect{font:8px/1 sans-serif;color:var(--recovery-color);white-space:nowrap}
.potion-cooldown{position:absolute;inset:0;display:grid;place-items:center;border-radius:5px;background:#102c25ed;color:#f2dfb2;font:20px/1 sans-serif;pointer-events:none}
.potion-select{position:static;display:block;width:100%;min-width:0;height:24px;min-height:24px;margin:0;padding:1px 0;border:1px solid #8aa27c88;border-radius:4px;background:#19392d;color:#e1e8d0;font:9px/1.2 sans-serif;cursor:pointer;text-overflow:ellipsis}.potion-select option{font-size:13px}
.potion-use:focus-visible,.potion-select:focus-visible{outline:2px solid #ffe5a0;outline-offset:2px}
.potion-stock button[data-assign-slot]{min-width:28px;min-height:32px;padding:4px}
@container game (width < 600px){body[data-controls=pointer] .combat-controls{grid-template-columns:minmax(0,1fr);gap:4px}body[data-controls=pointer] .potion-belt{width:240px;max-width:100%;justify-self:center}}
/* On phones: movement | recovery + skills | target / evade / attack. */
body[data-controls=touch] .combat-controls{grid-template-columns:60px minmax(0,1fr) 44px;grid-template-rows:76px 56px;gap:4px 8px;max-width:600px}
body[data-controls=touch] .combat-controls>.touch-controls{display:contents}
body[data-controls=touch] .potion-belt{grid-area:1/2;align-self:start;width:100%}
body[data-controls=touch] .potion-use kbd{display:none}
body[data-controls=touch] .movement-pad{grid-area:1/1/3/2;display:flex;flex-direction:column;justify-content:center;gap:4px}
body[data-controls=touch] .joystick{width:56px;height:56px;flex-shrink:0}
body[data-controls=touch] .touch-capture{width:44px;height:24px;min-height:24px;margin:0;flex-shrink:0}
body[data-controls=touch] .touch-ball-select{position:static;width:100%;height:24px;min-height:24px;flex-shrink:0}
body[data-controls=touch] .touch-loadout{grid-area:2/2;grid-template-columns:repeat(4,minmax(0,1fr)) 20px;gap:3px;grid-template-rows:56px;align-self:start}
body[data-controls=touch] .touch-actions{grid-area:1/3/3/4;grid-template-columns:44px;grid-template-rows:repeat(3,44px);gap:2px;align-self:center}
body[data-controls=touch] .touch-actions button{width:44px;height:44px;min-height:44px;font-size:21px}
body[data-controls=touch] .touch-actions small{font-size:6px}
@container game (height < 500px) and (width >= 600px){
 body[data-controls=touch] .combat-controls{grid-template-columns:56px minmax(0,1fr) 174px 140px;grid-template-rows:88px;gap:8px;max-width:1040px}
 body[data-controls=touch] .movement-pad{grid-area:1/1;gap:2px}
 body[data-controls=touch] .joystick{width:44px;height:44px}
 body[data-controls=touch] .touch-capture{height:20px;min-height:20px}
 body[data-controls=touch] .touch-ball-select{height:20px;min-height:20px}
 body[data-controls=touch] .touch-loadout{grid-area:1/2;align-self:center}
 body[data-controls=touch] .potion-belt{grid-area:1/3;align-self:center}
 body[data-controls=touch] .touch-actions{grid-area:1/4;grid-template-columns:repeat(3,44px);grid-template-rows:44px;gap:4px}
}
@container game (height >= 500px) and (width >= 900px){
 body[data-controls=touch] .combat-controls{grid-template-columns:60px minmax(0,1fr) 216px 140px;grid-template-rows:112px;gap:12px;max-width:1040px}
 body[data-controls=touch] .movement-pad{grid-area:1/1}
 body[data-controls=touch] .touch-loadout{grid-area:1/2;align-self:center}
 body[data-controls=touch] .potion-belt{grid-area:1/3;align-self:center}
 body[data-controls=touch] .touch-actions{grid-area:1/4;grid-template-columns:repeat(3,44px);grid-template-rows:44px;gap:4px}
}
.combat-hud{padding-bottom:max(5px,env(safe-area-inset-bottom,0px))}

.frontier-atlas{aspect-ratio:11/6;min-height:210px}.frontier-atlas .atlas-node{min-width:0;width:22px;height:22px}.frontier-atlas .atlas-node>span{width:19px;height:19px;font-size:11px}.frontier-atlas .atlas-node strong,.frontier-atlas .atlas-node small{display:none}.frontier-atlas .atlas-node.current{z-index:3}.frontier-atlas .atlas-node.current>span{border-width:2px}.atlas-search{display:grid;gap:5px;margin:12px 0;color:#c5d3b7;font-size:10px}.atlas-search input{min-width:0;min-height:36px;padding:7px 10px;border:1px solid #86976c88;border-radius:4px;background:#19372c;color:#e4dfc5}

/* Telegram fullscreen reserves system and Mini App chrome around actual controls. */
html[data-mini-app=true] .game-shell{height:var(--app-height,100dvh);padding:var(--app-safe-top,0px) var(--app-safe-right,0px) var(--app-safe-bottom,0px) var(--app-safe-left,0px)}