:root{color-scheme:dark;--bg:#080d13;--panel:#0d141d;--panel2:#111a25;--text:#edf3fb;--muted:#8290a3;--line:rgba(255,255,255,.09);--accent:#dfeeff;--blue:#85bcff;--red:#ffaaa6;--safe-bottom:env(safe-area-inset-bottom,0px);--safe-top:env(safe-area-inset-top,0px)}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}button,input,select{font:inherit;color:inherit}button{-webkit-tap-highlight-color:transparent}.app-shell{height:100dvh;display:grid;grid-template-rows:auto auto auto auto minmax(0,1fr) auto;background:radial-gradient(circle at 50% 40%,#101a26 0,#080d13 55%)}
.topbar{min-height:57px;padding:calc(8px + var(--safe-top)) 11px 7px;display:flex;align-items:center;justify-content:space-between;gap:8px;border-bottom:1px solid var(--line);background:rgba(8,13,19,.96);z-index:20}.brand{font-size:18px;font-weight:950;letter-spacing:.15em}.subtitle{font-size:7px;letter-spacing:.16em;color:#7c8a9d;margin-top:2px}.top-actions{display:flex;align-items:center;gap:6px}.round-button{width:36px;height:36px;border-radius:12px;border:1px solid var(--line);background:rgba(255,255,255,.035);font-size:18px}.engine-badge{font-size:7px;font-weight:900;letter-spacing:.08em;border-radius:999px;padding:4px 7px;border:1px solid rgba(137,235,173,.28);color:#b9f4d0;background:rgba(16,52,32,.34);white-space:nowrap}.engine-badge.offline{color:#c5aeb0;border-color:rgba(255,160,160,.18);background:rgba(75,22,22,.18)}
.mode-strip{display:flex;gap:5px;overflow-x:auto;padding:7px 9px;border-bottom:1px solid var(--line);background:rgba(8,13,19,.97);scrollbar-width:none}.mode-strip::-webkit-scrollbar,.lens-strip::-webkit-scrollbar{display:none}.mode-tab{flex:0 0 auto;height:29px;padding:0 10px;border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,.025);font-size:8px;font-weight:900;letter-spacing:.075em;color:#8190a2}.mode-tab.active{color:#f6f9fd;border-color:rgba(218,234,251,.42);background:rgba(213,230,249,.10);box-shadow:0 0 16px rgba(192,220,251,.07)}
.control-panel{padding:7px 9px 6px;border-bottom:1px solid var(--line);background:rgba(10,16,23,.96);min-width:0}.search-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px}.search-input{height:34px;min-width:0;border-radius:11px;border:1px solid var(--line);background:#0a1119;padding:0 11px;outline:none}.search-input:focus{border-color:rgba(210,229,250,.38)}.result-count{min-width:45px;height:34px;display:grid;place-items:center;border:1px solid var(--line);border-radius:11px;font-size:10px;font-weight:900;color:#b8c7d9;background:rgba(255,255,255,.025)}
.lens-area[hidden]{display:none!important}.lens-strip{display:flex;gap:5px;overflow-x:auto;padding:7px 0 3px;scrollbar-width:none}.lens-chip{flex:0 0 auto;height:27px;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.027);padding:0 9px;font-size:8px;font-weight:850;letter-spacing:.055em;color:#8795a6}.lens-chip.active{color:#f5f9ff;border-color:rgba(218,233,250,.42);background:rgba(213,230,249,.10)}.parameter-row{display:flex;align-items:center;gap:7px;min-width:0;padding:4px 0 1px;overflow-x:auto;scrollbar-width:none}.parameter-label{flex:0 0 auto;font-size:8px;letter-spacing:.1em;color:#718096;font-weight:850}.parameter-select{height:29px;max-width:min(70vw,300px);border:1px solid var(--line);border-radius:9px;background:#0a1119;padding:0 25px 0 8px;font-size:9px}.mode-readout{display:flex;gap:7px;align-items:baseline;min-width:0;padding-top:4px}.mode-readout strong{flex:0 0 auto;font-size:8px;letter-spacing:.1em}.mode-readout span{min-width:0;font-size:8px;color:#78879a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.status-row{height:26px;display:flex;align-items:center;justify-content:space-between;gap:7px;padding:0 10px;border-bottom:1px solid rgba(255,255,255,.055);font-size:8px;font-weight:900;letter-spacing:.06em;color:#bac6d4}.status-row span:last-child{color:#8391a3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.field-wrap{position:relative;min-height:0;overflow:hidden;touch-action:none}.field{width:100%;height:100%;display:block;user-select:none;-webkit-user-select:none;cursor:grab}.field.dragging{cursor:grabbing}.loading{position:absolute;inset:0;display:grid;place-items:center;color:#778291;font-size:9px;letter-spacing:.16em;pointer-events:none}.loading.error{color:#ff9da2;padding:28px;text-align:center;pointer-events:auto}.zoom-controls{position:absolute;right:8px;bottom:8px;z-index:30;display:flex;gap:4px;padding:4px;border-radius:13px;border:1px solid rgba(255,255,255,.1);background:rgba(5,9,13,.76);backdrop-filter:blur(9px)}.zoom-controls button{height:29px;min-width:31px;padding:0 7px;border:0;border-radius:9px;background:rgba(255,255,255,.055);font-size:11px;font-weight:900}.zoom-controls #fitButton{font-size:7px;letter-spacing:.08em}
.closure-layer,.combat-layer{pointer-events:none}.hex-cell{cursor:pointer;transition:opacity .27s ease,filter .27s ease}.base-hex{fill:#0f1721;stroke:rgba(255,255,255,.11);stroke-width:1.25;vector-effect:non-scaling-stroke}.candidate-ring{fill:none;stroke:var(--blue);stroke-width:4;opacity:0;filter:url(#cellGlow);vector-effect:non-scaling-stroke}.hex-cell.candidate .candidate-ring{opacity:.55;animation:breathe 1.6s ease-in-out infinite}.hex-cell.selected .base-hex{stroke:#f4f8fd;stroke-width:2}.hex-cell.team-member .base-hex{stroke:#9fd0ff;stroke-width:2.2;fill:#122131}.hex-cell.red-threat .base-hex{stroke:#ffaaa6;stroke-width:2}.hex-cell.dim{opacity:.16}.hex-cell.not-focus{opacity:.34}.hex-cell.top-rank{filter:drop-shadow(0 0 7px rgba(213,235,255,.24))}.sprite{pointer-events:none;image-rendering:pixelated}.mon-name{font-size:6.2px;font-weight:850;fill:#aebccc;text-anchor:middle;paint-order:stroke;stroke:#080d13;stroke-width:2px;pointer-events:none}.metric-badge{fill:#eaf4ff;font-size:6.5px;font-weight:950;text-anchor:middle;paint-order:stroke;stroke:#080d13;stroke-width:2px;pointer-events:none}.metric-bg{fill:rgba(6,10,15,.88);stroke:rgba(255,255,255,.18);stroke-width:.7}.type-dot{pointer-events:none}.tactic-badge-bg{display:none}.tactic-badge{display:none}
.cluster-halo{fill:rgba(223,235,249,.025);stroke:#dfeaf7;stroke-width:10;opacity:.11;filter:url(#softBlur);vector-effect:non-scaling-stroke;stroke-linejoin:round}.cluster-line{fill:rgba(11,16,22,.04);stroke:#f3f7fc;stroke-width:2;opacity:.78;vector-effect:non-scaling-stroke;stroke-linejoin:round}.cluster-line.closed{stroke:#cfe3ff;stroke-width:2.4;opacity:1}.cluster-halo.closed{stroke:#9fc7ff;opacity:.17}@keyframes breathe{0%,100%{stroke-width:3;opacity:.35}50%{stroke-width:5;opacity:.78}}
.cell-hp{display:none;pointer-events:none}.hex-cell.royale-alive .cell-hp,.hex-cell.battle-player .cell-hp,.hex-cell.battle-rival .cell-hp{display:block}.cell-hp-bg{fill:rgba(2,5,8,.82);stroke:rgba(255,255,255,.18);stroke-width:.7}.cell-hp-fill{fill:#dce7f3;transition:width .32s cubic-bezier(.2,.8,.2,1)}.cell-hp-status{font-size:5px;fill:#fff;text-anchor:end;font-weight:900}.hex-cell.low-hp .base-hex{stroke:#ffd1a8}.hex-cell.critical-hp .base-hex{stroke:#ff9a9a;stroke-width:2.2}.hex-cell.eliminated{opacity:.075!important;pointer-events:none;filter:grayscale(1)}.hex-cell.eliminated .base-hex{fill:#05080b;stroke:rgba(255,255,255,.03)}
.bottom-dock{min-height:105px;max-height:178px;padding:8px 10px calc(8px + var(--safe-bottom));display:flex;align-items:center;gap:10px;border-top:1px solid var(--line);background:rgba(9,14,21,.98);backdrop-filter:blur(16px);overflow:auto}.dock-copy{min-width:0;flex:1}.dock-heading{display:flex;align-items:center;gap:7px;min-width:0}.dock-heading strong{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tier-pill{font-size:7px;color:#8b9bad;border:1px solid var(--line);border-radius:999px;padding:2px 5px}.remove-button{margin-left:auto;border:1px solid rgba(255,160,160,.2);border-radius:9px;background:rgba(255,80,80,.05);padding:4px 7px;font-size:7px;font-weight:900}.picked-meta{font-size:8px;color:#8090a2;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.picked-state{margin-top:4px;font:700 8px/1.25 ui-monospace,SFMono-Regular,Consolas,monospace;color:#afbece;white-space:normal}.insight-strip{display:flex;gap:4px;overflow-x:auto;margin-top:5px;scrollbar-width:none}.insight-chip{flex:0 0 auto;border:1px solid rgba(255,255,255,.07);border-radius:999px;background:rgba(255,255,255,.025);padding:3px 6px;font-size:7px;color:#9dacbd}.insight-chip.warn{border-color:rgba(255,170,166,.22);color:#ffc2bf}.insight-chip.good{border-color:rgba(152,225,181,.2);color:#b9efcd}.run-message{margin-top:4px;font-size:8px;color:#8594a6;line-height:1.25}.fight-button{flex:0 0 auto;width:54px;height:48px;border:1px solid rgba(184,213,255,.4);border-radius:17px;background:rgba(115,173,255,.11);font-size:23px}.fight-button:disabled{opacity:.28}.post-action-panel{margin-top:6px;display:flex;gap:6px;flex-wrap:wrap}.post-action-panel[hidden]{display:none!important}.post-action-button{border:1px solid rgba(190,220,255,.22);border-radius:10px;background:rgba(115,173,255,.08);padding:5px 7px;font-size:8px;font-weight:900}.post-action-button.active{border-color:rgba(210,235,255,.64);background:rgba(115,173,255,.18)}
/* Combat is always rendered on the same SVG fabric. No duel screen exists. */
.combat-hud{position:absolute;z-index:35;left:50%;top:7px;transform:translateX(-50%);max-width:min(93%,760px);display:flex;align-items:center;gap:7px;padding:5px 8px;border-radius:999px;background:rgba(5,9,13,.76);border:1px solid rgba(230,240,252,.14);backdrop-filter:blur(8px);pointer-events:none;white-space:nowrap}.combat-hud[hidden]{display:none!important}.combat-turn{font:950 8px/1 ui-monospace,SFMono-Regular,Consolas,monospace;color:#eef5ff}.combat-event{min-width:0;max-width:60vw;overflow:hidden;text-overflow:ellipsis;font:800 9px/1.15 ui-monospace,SFMono-Regular,Consolas,monospace;color:#c7d5e5}.combat-field{font-size:8px;color:#a9bbce}.combat-result{position:absolute;z-index:38;left:50%;top:48%;transform:translate(-50%,-50%);font-size:clamp(30px,8vw,62px);font-weight:1000;letter-spacing:.08em;filter:drop-shadow(0 5px 18px rgba(0,0,0,.75));pointer-events:none}.combat-result[hidden]{display:none!important}.combat-dev-log{display:none!important}.field-wrap.combat-live .hex-cell:not(.battle-player):not(.battle-rival):not(.eliminated){opacity:.20}.hex-cell.battle-player .base-hex{stroke:#9fd0ff;stroke-width:2.8;fill:#122131}.hex-cell.battle-rival .base-hex{stroke:#ffaba5;stroke-width:2.8;fill:#26191b}.hex-cell.battle-active .candidate-ring{opacity:1;stroke:#fff;animation:gridActivePulse .72s ease-in-out infinite}.hex-cell.battle-active .sprite{filter:drop-shadow(0 0 7px rgba(255,255,255,.72))}.hex-cell.grid-attacking .sprite{animation:gridAttacker .27s ease}.hex-cell.grid-hit .sprite{animation:gridVictim .25s ease}.hex-cell.grid-switching .sprite{animation:gridSwitch .3s ease}.hex-cell.grid-healing .sprite{animation:gridHeal .34s ease}.hex-cell.grid-extinct-now{animation:gridFaintBlink .52s steps(2,end)}.hex-cell.battle-ko{opacity:.10!important;filter:grayscale(1)}
@keyframes gridActivePulse{0%,100%{stroke-width:3;opacity:.38}50%{stroke-width:6;opacity:1}}@keyframes gridAttacker{0%,100%{filter:none}45%{filter:brightness(1.9) drop-shadow(0 0 8px rgba(255,255,255,.9))}}@keyframes gridVictim{0%,100%{opacity:1;filter:none}25%{opacity:.18;filter:brightness(2.2)}55%{opacity:1}75%{opacity:.28}}@keyframes gridSwitch{0%{opacity:.25;filter:brightness(1.7)}100%{opacity:1;filter:none}}@keyframes gridHeal{0%,100%{filter:none}50%{filter:brightness(1.7) drop-shadow(0 0 9px rgba(190,255,210,.85))}}@keyframes gridFaintBlink{0%{opacity:1}18%{opacity:.08}36%{opacity:1}54%{opacity:.06}72%{opacity:.75}100%{opacity:.12;filter:grayscale(1)}}.combat-beam{stroke:#f4f8ff;stroke-width:3;stroke-linecap:round;vector-effect:non-scaling-stroke;filter:url(#cellGlow);stroke-dasharray:12 8;animation:combatBeam .28s linear infinite}.combat-impact{fill:none;stroke:#fff;stroke-width:2.5;vector-effect:non-scaling-stroke;animation:combatImpact .35s ease-out forwards}.combat-move-label{fill:#f5f8fc;stroke:#071019;stroke-width:3px;paint-order:stroke;font-size:8px;font-weight:950}.combat-strike{pointer-events:none}@keyframes combatBeam{to{stroke-dashoffset:-20}}@keyframes combatImpact{0%{r:4;opacity:1}100%{r:21;opacity:0}}
@media(min-width:760px){.app-shell{max-width:1020px;margin:auto;border-inline:1px solid var(--line)}.brand{font-size:20px}.bottom-dock{min-height:112px}.mode-tab{font-size:9px}}
@media(max-width:430px){.topbar{min-height:53px}.brand{font-size:16px}.subtitle{font-size:6.5px}.engine-badge{font-size:6px;padding:3px 5px}.mode-strip{padding-block:6px}.mode-tab{height:27px;font-size:7px;padding-inline:8px}.control-panel{padding-top:6px}.lens-chip{height:25px;font-size:7px}.parameter-select{max-width:72vw}.status-row{height:24px;font-size:7px}.bottom-dock{min-height:101px;max-height:158px}.dock-heading strong{font-size:13px}.picked-state,.run-message{font-size:7.5px}.fight-button{width:50px;height:45px}.combat-event{max-width:55vw;font-size:8px}.combat-turn,.combat-field{font-size:7px}.combat-move-label{font-size:7px}.zoom-controls{right:5px;bottom:5px}}

/* P0.15 stabilization: the stack tray is a real row and SVG owns gestures. */
.app-shell{grid-template-rows:auto auto auto auto auto minmax(0,1fr) auto}
.stack-tray[hidden]{display:none!important}
.stack-tray{min-width:0;border-bottom:1px solid var(--line);background:rgba(8,13,19,.96);padding:6px 8px;overflow:hidden}
.stack-slots{display:flex;gap:5px;min-width:0;overflow-x:auto;scrollbar-width:none}
.stack-slots::-webkit-scrollbar{display:none}
.stack-slot{flex:1 1 0;min-width:47px;height:47px;border:1px solid var(--line);border-radius:11px;background:rgba(255,255,255,.025);display:grid;grid-template-rows:29px 10px;place-items:center;padding:2px;color:#708095;overflow:hidden}
.stack-slot img{width:30px;height:30px;object-fit:contain;image-rendering:auto}
.stack-slot span{max-width:100%;font-size:6.5px;line-height:1;letter-spacing:.04em;font-weight:850;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stack-slot.filled{color:#dce8f6;border-color:rgba(181,214,248,.22);background:rgba(123,180,237,.055)}
.stack-slot.active{border-color:rgba(222,239,255,.58);box-shadow:0 0 14px rgba(164,207,250,.12)}
.stack-slot.locked{opacity:.28}
.stack-slot .slot-empty{font-size:13px;color:#5e6a78}
.field-wrap{touch-action:manipulation}
.field{touch-action:none}
.zoom-controls{pointer-events:auto;user-select:none;-webkit-user-select:none}
.zoom-controls button{touch-action:manipulation;cursor:pointer}
.zoom-controls button:active{transform:scale(.93);background:rgba(255,255,255,.12)}
.zoom-value{height:29px;min-width:38px;padding:0 4px;display:grid;place-items:center;font-size:7px;font-weight:900;color:#9badc0;letter-spacing:.03em}
@media (max-width:520px){.stack-slot{flex:0 0 48px}.mode-readout span{max-width:58vw}.zoom-controls{right:6px;bottom:6px}}