.movement { position:absolute; bottom:5px; left:7px; right:7px; display:grid; grid-template-columns:repeat(3,1fr); gap:5px; z-index:10; }
.movement button { min-height:44px; padding:5px; background:#f8efd8f5; color:#54472e; border:1px solid #ac9261; font-size:12px; font-weight:700; touch-action:manipulation; }
.movement button.selected { color:#fff9e8; background:#5c7440; border-color:#c4d89a; }
.lane-zones { position:absolute; left:0; right:0; top:43%; bottom:53px; display:grid; grid-template-columns:repeat(3,1fr); pointer-events:none; z-index:1; }
.lane-zones>div { border-right:1px dashed #fff9; border-top:1px solid #fff4; position:relative; background:#edf4d11a; }
.lane-zones>div:last-child { border-right:0; }
.lane-zones span { position:absolute; left:2px; right:2px; top:3px; text-align:center; color:#fff; text-shadow:0 1px 3px #111; font-size:11px; font-weight:800; }
.lane-zones .danger { background:repeating-linear-gradient(135deg,#d6444866 0 10px,#a51f3650 10px 20px); border:2px solid #f66660; }
.lane-zones .gather { background:#3993c455; border:2px solid #b5edff; }
.lane-zones .opening { background:linear-gradient(#ffeaa8aa,#fbbf3933); border:2px solid #ffe18a; }
.lane-zones .opening span { color:#47300a; text-shadow:0 1px #fff; }
.tactical-arena .actors, .tactical-arena .fx { bottom:52px; --tactical-clearance:120px; }
body.in-game .tactical-arena .boss-hud { height:44px; }
body.in-game .tactical-arena .boss-heading { height:0; margin:0; }
body.in-game .tactical-arena .boss-heading>div,body.in-game .tactical-arena .boss-number { display:none; }
body.in-game .tactical-arena #fight-time { position:absolute; top:4px; right:7px; }
body.in-game .tactical-arena .boss-meter { margin-right:45px; }
body.in-game .tactical-arena .telegraph { top:58px; }
.tactical-arena .hero-actor { bottom:18px!important; height:clamp(28px,calc((100% - var(--tactical-clearance)) * .5 - 10px),150px)!important; width:var(--hero-width,25%)!important; transition:left .18s ease; }
.tactical-arena .boss-actor { left:50%; top:var(--tactical-clearance); bottom:auto!important; height:clamp(30px,calc((100% - var(--tactical-clearance)) * .5 - 20px),180px)!important; }
.tactical-arena .arena-caption { display:none; }
.tactical-arena .actor-job { display:none!important; }
.tactical-arena .actor-label { max-width:76px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.actor.marked .ground-ring { border:3px dashed #f99aff; box-shadow:0 0 16px #b719c9; }
.actor.marked .actor-label::before { content:'● '; color:#fdc3ff; }
.actor.casting .body { filter:drop-shadow(0 0 6px #ffe39a); }
.telegraph.opening { background:#395d36f2; border-color:#e5cc66; }
.telegraph.opening small { color:#f5eac3; }
.telegraph.opening .cast-track i { background:#f5d975; }
.action.opening-ready { border-color:#80a756!important; box-shadow:inset 0 0 0 1px #8ca959,0 0 10px #b6c26766; }
.action.recoil-risk:not(:disabled) { border-color:#b17b60; }
.weak-number { color:#fff2a4; font-size:26px; }
@media(max-width:820px) and (orientation:portrait), (max-width:1100px) and (max-height:500px) and (orientation:landscape) {
 body.in-game .tactical-arena .actors,body.in-game .tactical-arena .fx { --tactical-clearance:86px; }
 body.in-game .tactical-arena .boss-hud { height:31px; }
 body.in-game .tactical-arena .boss-heading { height:0; margin:0; }
 body.in-game .tactical-arena .boss-heading>div,body.in-game .tactical-arena .boss-number { display:none; }
 body.in-game .tactical-arena #fight-time { position:absolute; top:2px; right:5px; }
 body.in-game .tactical-arena .boss-meter { margin-right:34px; }
 .movement button { font-size:11px; }
 .lane-zones span { font-size:9px; }
 body.in-game .tactical-arena .telegraph { top:40px; width:94%; min-width:0; max-width:94%; padding:3px 6px; line-height:12px; }
 body.in-game .tactical-arena .telegraph .cast-track { height:2px; margin:2px 0; }
 body.in-game .tactical-arena .telegraph small { font-size:9px; line-height:10px; margin-top:2px; }
 body.in-game .tactical-arena .boss-actor { width:33%; }
}
@media(prefers-reduced-motion:reduce) { .tactical-arena .hero-actor { transition:none; } }
