/* A single battlefield fits the visual viewport; detail views use native dialogs. */
:root{--card-rim:#a68a50;--card-paper:#ece1bf;--card-dark:#27383a}
.card{border:3px solid #8a754c;border-radius:28px 28px 12px 12px;padding:5px;background:linear-gradient(130deg,#d1b66e,#6a624e 23%,#b6a375 52%,#47565d);box-shadow:inset 0 0 0 2px #dacc9d,0 5px 12px #0008;overflow:hidden}
.card .cardhead{background:none;min-height:35px;padding:2px 7px;color:#f9edb1;font-weight:800;justify-content:space-between;text-shadow:0 1px 3px #000}
.card .cardhead .cost{border:2px solid #a5d9ef;background:linear-gradient(135deg,#7bd3f8,#164988 75%);color:#fff;box-shadow:0 0 0 2px #474b60,0 2px 4px #0009;border-radius:35% 35% 40% 40%;font-size:25px;width:34px;height:34px;line-height:30px;transform:rotate(-7deg)}
.card .card-art{margin:0 6px;height:110px;border-radius:48% 48% 15% 15%;border:3px solid #5d685f;box-shadow:0 0 0 2px #d1c196;overflow:hidden}.card .card-art:after{display:none}
.card .cardbody{background:var(--card-paper);border-radius:4px;padding:0 9px 12px;margin:3px 4px 0;border:1px solid #867956;color:var(--card-dark)}
.card .cardbody h3{background:linear-gradient(#617179,#31454f);color:#f7f0d9;border:1px solid #cfba82;border-radius:3px;margin:-5px -12px 9px;padding:7px 8px;position:relative;font-size:17px;text-align:center;box-shadow:0 2px 4px #0007;text-shadow:0 1px #000}
.card .cardbody p{color:#243433;font-size:14px;line-height:1.65}.card .condition{color:#21597b;font-size:12px}
.card .cardslots{border:0;background:#ece1bf;padding:7px 6px 4px;margin:0 4px 4px;justify-content:center;border-radius:0 0 5px 5px}.card .cardslots small{color:#425451;line-height:1.4;text-align:center}
.module-orb{width:18px;height:18px;border-radius:50%;margin-right:7px;border:1px solid #fff9;box-shadow:0 0 0 1px #294248,0 1px 4px #0007;background:radial-gradient(circle at 28% 24%,#fff,var(--orb) 33%,#15212d 100%)}
.module-orb.Free{--orb:#e0e8e7}.module-orb.slot-orb{margin:0;width:18px;height:18px;vertical-align:middle}.module-orb.empty{opacity:.65;box-shadow:0 0 0 2px #554f43,inset 0 1px 3px #0007}.module-orb.equipped{box-shadow:0 0 0 2px #b5a065,0 0 7px var(--orb)}
.nexus-only{display:inline-block;border:1px solid #74ba82;background:#174a2b;color:#d8ffda;padding:1px 7px;font-size:12px;margin:0 6px 6px 0;border-radius:4px;white-space:nowrap}.module-reward strong{margin-top:4px}.nexus-only+strong{display:inline}.equip-label .module-orb{vertical-align:-3px}
.pixel-sprite{display:block;width:100%;height:100%;overflow:hidden;image-rendering:pixelated;filter:drop-shadow(0 5px 4px #0008)}
body.battle-mode{height:100vh;height:100dvh;min-width:320px;overflow:hidden;overscroll-behavior:none}
#app.combat-app{height:100vh;height:100dvh;max-height:100dvh;display:grid;grid-template-rows:64px minmax(0,1fr);padding:env(safe-area-inset-top,0px) env(safe-area-inset-right,0px) env(safe-area-inset-bottom,0px) env(safe-area-inset-left,0px);width:100%;overflow:hidden}
.combat-hud{display:flex;align-items:center;gap:12px;background:linear-gradient(110deg,#123038,#071b25);border-bottom:2px solid #79bcc75a;padding:6px 16px;min-width:0;z-index:2}
.battle-menu{font-size:24px;width:40px;height:44px;flex-shrink:0}.hud-vitals{flex:1;max-width:520px;min-width:0}.hud-vitals>div:first-child{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:14px}.hud-vitals small{font-size:12px;font-weight:400;color:var(--muted)}.hud-health{position:relative;margin-top:2px}.hud-health>b{position:relative;z-index:1;display:block;line-height:24px;font-size:15px;padding-left:8px;text-shadow:0 1px 3px #000}.hud-health .bar{height:24px;position:absolute;inset:0;border:1px solid #9fe2d380;background:#142b32;border-radius:3px}.hud-health .bar i{background:linear-gradient(90deg,#26715e,#75c989)}.hud-tp{display:flex;align-items:center;gap:8px;background:radial-gradient(circle,#397d9a55,#0b1d2c);border:1px solid #89d1e077;border-radius:25%;padding:0 10px;min-width:66px;height:48px}.hud-tp span{font-size:14px;font-weight:800;color:#a9e6ff}.hud-tp strong{font-size:34px;line-height:1;color:#efffff;text-shadow:0 0 10px #70dbff}
body.battle-mode .pocket-battle{width:100%;max-width:1400px;min-height:0;height:100%;padding:0 10px 6px;margin:auto;display:grid;grid-template-rows:minmax(140px,1fr) 30px 96px 26px minmax(110px,23dvh) 48px;gap:3px;overflow:hidden}
.pocket-battle .battle-stage{min-height:0;max-height:100%;height:100%;margin:0 -10px;display:block;border-top:0;background-position:center 68%;overflow:hidden}
.pocket-battle .battle-frodia{left:0;bottom:4%;width:30%;height:84%;z-index:0;opacity:1;display:flex;align-items:flex-end;pointer-events:none}.pocket-battle .battle-frodia .pixel-sprite{height:100%;width:100%;object-fit:contain}.pocket-battle .actor-name{font-size:16px;bottom:0;left:16%;letter-spacing:.12em}
.pocket-battle .enemies{width:72%;height:100%;margin:0 1% 0 27%;padding:8px 0 5px;display:flex;align-items:stretch;gap:8px;position:relative}
.pocket-battle .enemy{flex:1;max-width:340px;min-width:0;min-height:0;display:grid;grid-template-rows:24px 18px 5px minmax(0,1fr) 40px 24px;gap:3px;padding:0 5px;background:transparent;box-shadow:none;border:0;align-items:stretch;justify-content:stretch}
.pocket-battle .enemy>*{order:unset!important}.pocket-battle .enemy.selected{background:linear-gradient(transparent,#9decdb12);box-shadow:inset 0 -1px var(--cyan)}
.pocket-battle .enemy h2{font-size:16px;text-align:center;margin:0;min-height:0;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pocket-battle .enemy-hp{font-size:14px;text-align:center;display:block;line-height:18px;padding:0 2px;white-space:nowrap;background:#092126b8}.pocket-battle .enemy-hp small{font-size:12px}.pocket-battle .enemy-hp>span{margin-left:4px;color:#9cd4f1}.pocket-battle .bar{margin:0;height:5px;border:0}
.pocket-battle .enemy .enemy-art{width:100%;max-width:none;min-height:0;height:100%;aspect-ratio:auto;margin:0;background:none;filter:none;display:flex;justify-content:center;align-items:flex-end}.pocket-battle .enemy .pixel-sprite{max-width:240px;height:100%;margin:auto}
.pocket-battle .enemy:after{bottom:65px;left:7%;right:7%;height:15px;top:auto}.pocket-battle .intent{display:flex;flex-direction:row;align-items:center;gap:6px;padding:3px 5px;min-height:0;height:100%;margin:0;background:#061b27d9}.pocket-battle .count{font-size:26px;min-width:36px;display:flex;gap:2px;line-height:1}.pocket-battle .count small{font-size:12px;line-height:1}.pocket-battle .intent>span:last-child{font-size:13px;line-height:1.3;min-height:0}.pocket-battle .enemy-status{min-height:0;height:24px;gap:2px;display:flex;justify-content:center;flex-wrap:nowrap;overflow:hidden;margin:0}.pocket-battle .status{font-size:12px;padding:0 3px;line-height:20px;white-space:nowrap}.pocket-battle .target-label{top:auto;bottom:66px;font-size:12px;line-height:1.2;padding:1px 5px;letter-spacing:0}
.combat-status{display:flex;align-items:center;justify-content:space-between;gap:7px;padding:0 5px;background:#0c2730c9;border-bottom:1px solid var(--line);font-size:13px;white-space:nowrap;overflow:hidden}.combat-status>span{color:var(--blue)}.combat-status>button{font-size:12px;padding:3px;max-width:43%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.combat-status .nexus-mini{color:var(--green)}
.hand-focus{border:1px solid #7eb7c463;background:#0c2631ed;border-radius:6px;padding:7px 12px;min-height:0;overflow:hidden;display:flex;flex-direction:column;justify-content:center;gap:3px}.hand-focus>div{display:flex;justify-content:space-between;align-items:center;gap:8px}.hand-focus h3{font-size:17px;color:#f6edce;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.4}.hand-focus button{font-size:14px;text-decoration:underline;text-underline-offset:3px;color:var(--cyan);flex-shrink:0}.hand-focus p{font-size:14px;line-height:1.45;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.hand-focus small,.hand-focus.idle span{font-size:12px;color:var(--muted);line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hand-focus.idle p{color:#d3e5e2}.hand-focus.idle span{margin-top:4px}
.pocket-battle .hand-heading{margin:0;display:flex;align-items:center;justify-content:space-between;gap:6px;padding:0 3px}.pocket-battle .hand-heading>span{font-size:12px;white-space:nowrap}.pocket-battle .hand-heading>div{gap:12px;display:flex}.pocket-battle .hand-heading button{font-size:12px;padding:0;line-height:23px}
.pocket-battle .hand-rack{width:100%;height:100%;min-height:0;margin:0;padding:3px 2px;display:grid;grid-template-columns:repeat(var(--hand-cols),minmax(0,1fr));grid-template-rows:repeat(var(--hand-rows),minmax(0,1fr));gap:7px;overflow:visible;background:none;justify-content:center;align-items:stretch;scroll-snap-type:none;max-width:900px;justify-self:center}
.pocket-battle .hand-rack .card{position:relative;display:flex;width:100%;height:100%;min-height:0;max-width:none;flex:none;transform:none;border-radius:18px 18px 7px 7px;padding:3px;border-width:2px;box-shadow:inset 0 0 0 1px #e3cf9e,0 2px 4px #0008;overflow:hidden}
.pocket-battle .hand-rack .card.armed{border-color:#c8f2ff;box-shadow:0 0 0 2px var(--cyan),0 0 12px #93ece977;transform:translateY(-2px);z-index:3;filter:none;opacity:1}.pocket-battle .hand-rack .card:hover{transform:none}.pocket-battle .hand-rack .card.armed:hover{transform:translateY(-2px)}
.pocket-battle .hand-rack .cardhead{position:absolute;top:3px;left:3px;padding:0;min-height:0;background:none;text-shadow:0 1px #000;z-index:2}.pocket-battle .hand-rack .cardhead>span:not(.cost){display:none}.pocket-battle .hand-rack .cost{width:25px;height:25px;font-size:19px;line-height:21px;border-width:1px;box-shadow:0 0 0 1px #23445c,0 1px 3px #000b}
.pocket-battle .hand-rack .card-art{height:56%;min-height:0;flex-shrink:1;width:calc(100% - 4px);margin:1px 2px;border-width:2px;border-radius:45% 45% 12% 12%;box-shadow:0 0 0 1px #d9d3ab}.pocket-battle .hand-rack .cardbody{margin:3px 1px 0;padding:0;flex:1;min-height:0;display:flex;align-items:center;justify-content:center}.pocket-battle .hand-rack .cardbody h3{margin:0;border:0;box-shadow:none;border-radius:0;background:none;color:#1d333a;text-shadow:none;font-size:13px;font-weight:800;line-height:1.3;padding:2px;text-align:center;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.pocket-battle .hand-rack .cardbody p,.pocket-battle .hand-rack .condition{display:none}.pocket-battle .hand-rack .cardslots{flex-shrink:0;margin:0 1px 1px;padding:3px 0 2px;gap:4px;min-height:0}.pocket-battle .hand-rack .cardslots small{display:none}.pocket-battle .hand-rack .module-orb{height:12px;width:12px;border-width:1px;margin:0}.pocket-battle .hand-rack .module-orb.empty{box-shadow:0 0 0 1px #716142}.pocket-battle .hand-rack .module-orb.equipped{box-shadow:0 0 0 1px #d6c57c,0 0 3px var(--orb)}
.pocket-battle .hand-rack.multiple-rows{gap:5px}.pocket-battle .multiple-rows .card-art{height:40%}.pocket-battle .multiple-rows .cardbody h3{font-size:12px;-webkit-line-clamp:1}.pocket-battle .multiple-rows .cardslots{padding:2px 0}.pocket-battle .many-cards .card-art,.pocket-battle .many-cards .cardslots{display:none}.pocket-battle .many-cards .card{border-radius:8px;padding:2px}.pocket-battle .many-cards .cardbody{margin:0 0 0 22px;padding:0}.pocket-battle .many-cards .cost{height:20px;width:20px;line-height:18px;font-size:16px}.pocket-battle .many-cards .cardbody h3{-webkit-line-clamp:2;font-size:12px;padding:1px;line-height:1.2}.pocket-battle .empty-hand{padding:15px;align-self:center;justify-self:center;font-size:14px;grid-column:1/-1}
.combat-actions{display:flex;align-items:stretch;justify-content:space-between;gap:12px;padding:2px 0 0;min-height:0}.combat-actions button{min-height:0;height:100%;font-size:15px;letter-spacing:0;padding:5px 18px;text-align:center;justify-content:center}.combat-actions .endturn{flex:1;min-width:0;background:#173d4b;color:#e5f4f0;border:1px solid #81afba7a}.combat-actions .use-card{flex:1.4;min-width:0}.combat-actions button:disabled{opacity:.4}.combat-menu-actions{display:grid;gap:12px;margin-top:20px}.status-detail h3{margin:20px 0 8px;color:var(--cyan)}.status-detail p{font-size:14px}.status-detail .card,.hand-detail-card .card{max-width:280px;width:100%;margin:12px auto}.status-detail>.muted{line-height:1.8;margin-top:20px}.status-detail .status{margin-right:5px}
.forest-event .event-choices{gap:14px}.forest-event .choice{border-left:3px solid #89c9aa;background:linear-gradient(110deg,#10312fed,#0b202ada)}.forest-event .choice p{font-size:15px;max-width:90%}.forest-event .choice:disabled{opacity:.45}.forest-event .choice h2{font-size:22px}
@media(max-width:700px){#app.combat-app{grid-template-rows:62px minmax(0,1fr)}.combat-hud{gap:7px;padding:5px 8px}.battle-menu{width:32px;font-size:23px}.hud-tp{min-width:60px;padding:0 8px;gap:6px}.hud-tp strong{font-size:30px}.hud-vitals>div:first-child{font-size:13px;gap:4px}.hud-vitals>div:first-child span{font-size:12px}.hud-health>b{font-size:14px}.hud-tp span{font-size:13px}
body.battle-mode .pocket-battle{max-width:none;padding:0 7px 4px;grid-template-rows:minmax(115px,1fr) 27px 92px 24px minmax(102px,22dvh) 46px;gap:3px}.pocket-battle .battle-stage{margin:0 -7px}.pocket-battle .battle-frodia{left:0;bottom:10%;width:25%;height:70%}.pocket-battle .actor-name{font-size:12px;left:8%;letter-spacing:.02em}.pocket-battle .enemies{width:75%;margin:0 0 0 25%;gap:3px;padding:6px 3px 2px 0}.pocket-battle .enemy{grid-template-rows:36px 16px 4px minmax(0,1fr) 44px 20px;gap:2px;padding:0 2px}.pocket-battle .enemy h2{font-size:13px;white-space:normal;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.pocket-battle .enemy-hp{font-size:12px;line-height:16px}.pocket-battle .enemy-hp small{font-size:12px}.pocket-battle .enemy-hp>span{display:none}.pocket-battle .intent{gap:2px;padding:2px;flex-wrap:nowrap;align-items:center}.pocket-battle .count{font-size:23px;min-width:25px;gap:2px;flex-direction:column;align-items:center}.pocket-battle .count small{font-size:12px;line-height:1}.pocket-battle .intent>span:last-child{font-size:12px;line-height:1.2;overflow:hidden;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical}.pocket-battle .enemy:after{bottom:64px;height:12px}.pocket-battle .target-label{bottom:62px;font-size:12px;padding:0 2px}.pocket-battle .enemy-status{height:20px;justify-content:flex-start}.pocket-battle .status{font-size:12px;padding:0 2px;line-height:18px}.combat-status{padding:0 2px;gap:4px;font-size:12px}.combat-status>button{font-size:12px;padding:2px 0}.hand-focus{padding:5px 8px;gap:2px}.hand-focus h3{font-size:15px}.hand-focus p{font-size:14px;line-height:1.35}.hand-focus small{font-size:12px}.pocket-battle .hand-heading>div{gap:9px}.pocket-battle .hand-rack{gap:5px;padding:3px 1px}.pocket-battle .hand-rack .card{padding:2px}.pocket-battle .hand-rack .cardbody h3{font-size:12px}.pocket-battle .hand-rack .cardslots{gap:3px}.pocket-battle .hand-rack .module-orb{width:11px;height:11px}.combat-actions{gap:9px}.combat-actions button{font-size:14px;padding:4px 9px}.forest-event .choice p{font-size:14px}.card .cardbody h3{font-size:16px}.card .card-art{height:108px}}
@media(max-height:640px) and (orientation:portrait){body.battle-mode .pocket-battle{grid-template-rows:minmax(106px,1fr) 23px 74px 22px 106px 42px;gap:2px}.pocket-battle .enemy{grid-template-rows:30px 16px 4px minmax(0,1fr) 32px 0;gap:1px}.pocket-battle .enemy-status{display:none}.pocket-battle .enemy:after,.pocket-battle .target-label{bottom:34px}.pocket-battle .intent>span:last-child{-webkit-line-clamp:2}.hand-focus p{-webkit-line-clamp:2}.hand-focus small{display:none}.pocket-battle .hand-rack .card-art{height:45%}.combat-status .nexus-mini{max-width:39%}.pocket-battle .battle-frodia{height:76%;bottom:4%}}
@media(orientation:landscape) and (max-height:650px){#app.combat-app{grid-template-rows:49px minmax(0,1fr)}.combat-hud{padding:2px 12px}.hud-vitals{max-width:440px}.hud-tp{height:40px}.hud-tp strong{font-size:27px}.hud-health .bar{height:19px}.hud-health>b{line-height:19px;font-size:13px}.hud-vitals>div:first-child{font-size:12px}
body.battle-mode .pocket-battle{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);grid-template-rows:26px minmax(65px,1fr) minmax(84px,1.3fr) 42px;gap:5px 10px;padding:2px 9px 4px}.pocket-battle .battle-stage{grid-column:1;grid-row:1/5;margin:0;min-height:0}.pocket-battle .combat-status{grid-column:2;grid-row:1}.pocket-battle .hand-focus{grid-column:2;grid-row:2}.pocket-battle .hand-heading{display:none}.pocket-battle .hand-rack{grid-column:2;grid-row:3}.pocket-battle .combat-actions{grid-column:2;grid-row:4}.pocket-battle .enemy{grid-template-rows:30px 16px 4px minmax(0,1fr) 37px 20px}.pocket-battle .enemy h2{font-size:13px;white-space:normal;line-height:1.2}.pocket-battle .enemy-hp{font-size:12px}.pocket-battle .intent>span:last-child{font-size:12px}.pocket-battle .battle-frodia{width:25%;height:78%}.pocket-battle .enemies{width:75%;margin-left:25%;gap:3px}.pocket-battle .enemy{padding:0 2px}.hand-focus h3{font-size:15px}.hand-focus p{font-size:13px;line-height:1.3;-webkit-line-clamp:2}.hand-focus small{display:none}.combat-actions button{font-size:13px;padding:3px 8px}.combat-status{font-size:12px}.combat-status>button{font-size:12px}.pocket-battle .hand-rack .cardbody h3{font-size:12px}.pocket-battle .hand-rack .card-art{height:45%}}
@media(prefers-reduced-motion:reduce){.damage-popup,.enemy-hit,.enemy-hit .enemy-art,.card-impact,.cast-label{animation:none!important}.cast-label{opacity:1}}
