:root{--battle-footer-height:256px}.battle-footer{min-height:0;height:calc(var(--battle-footer-height) + env(safe-area-inset-bottom,0px));padding-bottom:env(safe-area-inset-bottom,0px);flex:none;position:relative}.battle-hud{grid-template-rows:38px 46px minmax(0,1fr);gap:8px;height:100%;min-height:0;padding:8px 12px;display:grid}.battle-hud [data-primary-action-row]{min-height:0;margin:0}.battle-hud [data-primary-action-row]>button{padding-top:4px;padding-bottom:4px}.battle-skills{overscroll-behavior:contain;touch-action:pan-y;scrollbar-width:thin;min-height:0;overflow-y:auto}.battle-skills-grid{grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:62px;gap:8px;padding:2px;display:grid}.battle-footer-overlay{z-index:40;overscroll-behavior:contain;padding:12px;padding-bottom:max(12px,env(safe-area-inset-bottom));background:#0f172a;position:absolute;inset:0;overflow-y:auto}.battle-footer-overlay:empty{display:none}.battle-footer-message{height:100%;padding:12px;overflow-y:auto}@media (height<=650px){:root{--battle-footer-height:210px}}@media (orientation:landscape) and (height<=550px){:root{--battle-footer-height:166px}.battle-hud{grid-template-rows:32px 44px minmax(0,1fr);gap:4px;padding:4px 12px}}.battle-skills-grid>div>button,.battle-skills-grid>button{padding-top:4px;padding-bottom:4px}.battle-skills-more.compact-only{display:none}@media (height<=650px){.battle-skills-more.compact-only{display:inline}}.battle-idle-message{flex-direction:column;display:flex}.battle-player-turn{text-align:center;color:#f8fafc;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:4px;min-height:0;font-size:clamp(24px,5vw,38px);font-weight:800;line-height:1.15;display:flex}.battle-player-turn strong{color:#67e8f9}.battle-turn-message{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:16px;height:100%;padding:18px;display:flex;overflow-y:auto}.battle-turn-heading{color:#e2e8f0;flex-shrink:0;font-size:clamp(24px,5vw,36px);font-weight:800;line-height:1.15}.battle-turn-enemy .battle-turn-heading{color:#fda4af}.battle-turn-quote{color:#e2e8f0;max-width:34ch;margin:0;font-size:clamp(15px,3.5vw,20px);line-height:1.4}@media (width>=600px){.battle-turn-enemy{flex-direction:row;gap:28px}.battle-turn-quote{text-align:left}}@media (height<=550px){.battle-turn-message{gap:8px;padding:10px}.battle-player-turn{font-size:24px}}@media (prefers-reduced-motion:no-preference){.battle-turn-message{animation:.18s ease-out turn-arrival}@keyframes turn-arrival{0%{opacity:0}to{opacity:1}}}.battle-observer{grid-template-rows:54px 44px minmax(0,1fr)}.observer-accent{color:#fda4af}.battle-observer-allied .observer-accent{color:#6ee7b7}.observer-action-strip{justify-content:space-between;align-items:center;gap:8px;min-width:0;display:flex}.observer-basic{color:#e2e8f0;background:#1e293b;border:1px solid #475569;border-radius:8px;justify-content:center;align-items:center;width:36px;min-height:44px;display:flex}.observer-skill{color:#f8fafc;background:#1e293b;border:1px solid #475569;border-radius:8px;flex-direction:column;justify-content:center;align-items:center;gap:2px;min-width:0;padding:4px;display:flex;overflow:hidden}.observer-basic[data-active=true],.observer-skill[data-active=true]{background:#881337;border-color:#fda4af;box-shadow:inset 0 0 0 1px #fda4af}.battle-observer-allied [data-active=true]{background:#065f46;border-color:#6ee7b7;box-shadow:inset 0 0 0 1px #6ee7b7}.observer-unit-ring{pointer-events:none;border:2px solid #fda4af;border-radius:12px;position:absolute;inset:5%;box-shadow:0 0 8px #fb7185}.observer-unit-ring[data-team=player]{border-color:#6ee7b7;box-shadow:0 0 8px #34d399}@media (orientation:landscape) and (height<=550px){.battle-observer{grid-template-rows:44px 44px minmax(0,1fr)}}@media (width<=360px){.battle-observer{padding-left:6px;padding-right:6px}.observer-basic{width:30px}}.observed-commander .observer-accent{color:#d8b4fe}.observed-environment .observer-accent{color:#fdba74}.observed-commander [data-active=true]{background:#581c87;border-color:#d8b4fe;box-shadow:inset 0 0 0 1px #d8b4fe}.observed-environment [data-active=true]{background:#7c2d12;border-color:#fdba74;box-shadow:inset 0 0 0 1px #fdba74}.battle-player-turn .battle-turn-question{color:#cbd5e1;margin-top:4px;font-size:clamp(15px,3.5vw,20px);font-weight:500}
