/* Two facing vertical squads; the open center is the attack lane. */
.world[data-view=battle]{height:auto;min-height:max(100svh,820px);isolation:isolate;overflow:hidden;background:#a9c653!important}
.world[data-view=battle]::before{position:absolute;inset:0;background:url('assets/battle-meadow-v2.webp') center/cover no-repeat;filter:none}
.world[data-view=battle]::after{display:none}
.world[data-view=battle] .topbar{min-height:62px;padding:10px 24px;background:none;box-shadow:none;border:0;display:flex;justify-content:space-between;gap:12px}
.world[data-view=battle] .topbar .brand,.world[data-view=battle] .topbar .back,.world[data-view=battle] .topbar .energy,.world[data-view=battle] .topbar .save-status{display:none}
.world[data-view=battle] .topbar>.row:first-child{display:none}
.world[data-view=battle] .topbar .hud{padding:6px 14px;border:2px solid #dabb79;border-radius:16px;background:#20383cef;color:#fff4d8;gap:18px}
.world[data-view=battle] .topbar .round{color:#fff4d8;font-size:18px}.world[data-view=battle] .topbar .round small{color:inherit}
.world[data-view=battle] button{background:#24423fef;color:#fff1d1;border:1px solid #d9bd7e;border-radius:12px;box-shadow:0 2px #6d5634}
.world[data-view=battle] .main{display:block;position:relative;max-width:1200px;margin:auto;padding:0 20px 12px;min-height:0}
.world[data-view=battle] .section-heading{display:flex;justify-content:flex-end;min-height:32px;margin:0 0 16px;padding:0;background:none}
.world[data-view=battle] .section-heading h2{display:none}
.world[data-view=battle] .battle-field{display:grid;grid-template-columns:minmax(0,1fr) 140px minmax(0,1fr);gap:0;width:min(780px,100%);height:calc(100svh - 175px);min-height:645px;margin:0 auto;padding:26px 0 0;position:relative;background:none;border:0;box-shadow:none}
.world[data-view=battle] .squad{position:relative;display:block;min-width:0;height:100%;padding:0;background:none;border:0}
.world[data-view=battle] .squad h3{position:absolute;top:-28px;left:0;right:0;margin:0;text-align:center;writing-mode:horizontal-tb;font-size:18px;line-height:24px;color:#fff5dc;text-shadow:0 2px #243d37}
.world[data-view=battle] .ally-squad h3{color:#174e49;text-shadow:0 1px #fffbd9}
.world[data-view=battle] .enemy-squad h3{color:#913a32;text-shadow:0 1px #fffbd9}
.world[data-view=battle] .squad h3 small{display:none}
.world[data-view=battle] .battle-field .slot-row{display:grid!important;grid-template-columns:minmax(0,1fr)!important;grid-template-rows:repeat(6,minmax(0,1fr));gap:7px!important;width:100%;height:100%;margin:0;padding:0;align-items:stretch}
.world[data-view=battle] .combat-unit{display:flex;flex-direction:column;position:relative;isolation:isolate;width:min(155px,100%);height:100%!important;min-height:0;margin:0 auto;padding:14px 0 0;overflow:visible;background:none;border:0;box-shadow:none}
.world[data-view=battle] .combat-unit .pet-motion{width:100%;height:0;min-height:0;max-height:none;flex:1}
.world[data-view=battle] .combat-unit .pet-visual{height:100%!important;max-height:none!important}
.world[data-view=battle] .combat-unit .unit-hud{position:static!important;height:25px;flex:none;width:100%}
.world[data-view=battle] .combat-unit .hp-track{display:none}
.world[data-view=battle] .combat-unit .stats{position:static;display:flex;justify-content:center;gap:3px;max-width:88px;height:25px;margin:0 auto}
.world[data-view=battle] .combat-unit .stat.hp,.world[data-view=battle] .combat-unit .stat.atk{height:25px;width:31px;flex:0 1 31px;max-width:none;font-size:min(17px,calc(44px / var(--digits,2)));line-height:1}
.world[data-view=battle] .combat-unit .stat.hp{order:0}.world[data-view=battle] .combat-unit .stat.atk{order:1}
.world[data-view=battle] .combat-unit .pet-level{position:absolute;top:0;left:50%;transform:translateX(-50%);font-size:11px;line-height:13px;padding:0 4px;border-radius:4px;background:#24403ec9;color:#fff8de}
.world[data-view=battle] .combat-unit .merge-count{top:0;right:10%;left:auto;font-size:10px!important;line-height:13px;height:13px;min-width:0}
.world[data-view=battle] .combat-unit::after{bottom:13px;height:17%;width:65%;left:17.5%;background:#476d372b;box-shadow:none}
.world[data-view=battle] .versus{display:flex;flex-direction:column;align-items:center;justify-content:center;align-self:stretch;gap:8px;padding:0;background:none;border:0;pointer-events:none;color:#395a36aa}
.world[data-view=battle] .versus strong{font-size:30px;line-height:1}.world[data-view=battle] .versus small{font-size:12px;writing-mode:horizontal-tb;margin:0;text-align:center}
.world[data-view=battle] .battle-log{height:34px;max-width:780px;margin:8px auto 0;overflow:auto;border:0;background:#f8f2d6b8;color:#34513b;font-size:11px;border-radius:9px;padding:4px 10px}
.world[data-view=battle] .result-panel{position:absolute;z-index:30;left:50%;top:48%;transform:translate(-50%,-50%);width:min(420px,calc(100% - 24px));max-height:70svh;overflow:auto;background:#fff5dceb;border:2px solid #bea76c;border-radius:18px;box-shadow:0 15px 50px #183b3855}
@media(max-width:600px) and (orientation:portrait){
 .world[data-view=battle]::before{background-image:url('assets/battle-meadow-mobile-v2.webp')}
 .world[data-view=battle] .topbar{padding:8px;gap:5px;min-height:54px}.world[data-view=battle] .topbar .hud{gap:8px;padding:4px 8px}.world[data-view=battle] .topbar .round{font-size:13px}.world[data-view=battle] .topbar .heart{width:19px;height:19px}.world[data-view=battle] .topbar button{font-size:10px;padding:5px 7px}
 .world[data-view=battle] .main{padding:0 10px 10px}.world[data-view=battle] .section-heading{margin-bottom:12px}.world[data-view=battle] .section-heading button{font-size:11px;padding:5px 9px}
 .world[data-view=battle] .battle-field{grid-template-columns:minmax(0,1fr) 76px minmax(0,1fr);height:calc(100svh - 150px);min-height:650px;padding-top:24px}
 .world[data-view=battle] .combat-unit{width:100%}.world[data-view=battle] .squad h3{font-size:16px}.world[data-view=battle] .versus strong{font-size:23px}.world[data-view=battle] .versus small{font-size:10px}
}
.world[data-view=battle] .topbar .round{background:none;border:0;box-shadow:none;padding:0;min-width:0;color:#fff4d8}
.world[data-view=battle] .topbar .heart{fill:#a4e66e;stroke:#47743b;stroke-width:1}
.world[data-view=battle] .topbar .heart.empty{fill:#4c5c50;stroke:#819776}
.world[data-view=battle] .battle-field{width:min(660px,100%);grid-template-columns:minmax(0,1fr) 110px minmax(0,1fr)}
@media(max-width:600px) and (orientation:portrait){.world[data-view=battle] .battle-field{grid-template-columns:minmax(0,1fr) 76px minmax(0,1fr)}}
/* Two horizontal squads fit the viewport: opponent above, player below. */
.world[data-view=battle]{height:100svh;min-height:0;overflow:hidden}
.world[data-view=battle] .topbar{height:62px;min-height:0;box-sizing:border-box}
.world[data-view=battle] .main{display:flex;flex-direction:column;height:calc(100svh - 62px);min-height:0;box-sizing:border-box;width:100%;max-width:1400px;padding:0 20px 8px}
.world[data-view=battle] .section-heading{flex:none;margin-bottom:8px}
.world[data-view=battle] .battle-field{flex:1;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) 55px minmax(0,1fr);width:100%;height:0;min-height:0;padding:24px 0 0;gap:0}
.world[data-view=battle] .ally-squad{grid-column:1;grid-row:3}
.world[data-view=battle] .enemy-squad{grid-column:1;grid-row:1}
.world[data-view=battle] .versus{grid-column:1;grid-row:2;flex-direction:row;gap:12px}
.world[data-view=battle] .battle-field .slot-row{grid-template-columns:repeat(6,minmax(0,1fr))!important;grid-template-rows:minmax(0,1fr);gap:12px!important;align-items:center}
.world[data-view=battle] .combat-unit{height:100%!important;max-height:195px;width:100%;max-width:170px;align-self:center}
.world[data-view=battle] .squad h3{top:-23px}
.world[data-view=battle] .battle-log{flex:none;width:100%;height:25px;box-sizing:border-box}
.world[data-view=battle] .versus strong{font-size:22px}
@media(max-width:600px) and (orientation:portrait){
 .world[data-view=battle] .topbar{height:54px}
 .world[data-view=battle] .main{height:calc(100svh - 54px);padding:0 7px 7px}
 .world[data-view=battle] .battle-field{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) 65px minmax(0,1fr);min-height:0;width:100%;height:0;padding-top:22px}
 .world[data-view=battle] .battle-field .slot-row{gap:3px!important}
 .world[data-view=battle] .combat-unit{max-height:110px;padding-top:13px}
 .world[data-view=battle] .combat-unit .stats{gap:0;height:23px}
 .world[data-view=battle] .combat-unit .unit-hud{height:23px}
 .world[data-view=battle] .combat-unit .stat.hp,.world[data-view=battle] .combat-unit .stat.atk{width:25px;flex-basis:25px;height:23px;font-size:14px}
 .world[data-view=battle] .combat-unit .pet-level{font-size:9px;line-height:11px}
 .world[data-view=battle] .combat-unit .merge-count{right:0;font-size:8px!important}
}
@media(orientation:landscape) and (max-height:540px){
 .world[data-view=battle] .topbar{height:42px;padding:4px 12px}
 .world[data-view=battle] .topbar .hud{padding:2px 8px}.world[data-view=battle] .topbar .round{font-size:13px}.world[data-view=battle] .topbar .heart{width:19px;height:19px}
 .world[data-view=battle] .main{height:calc(100svh - 42px);padding-bottom:4px}
 .world[data-view=battle] .section-heading{min-height:24px;height:24px;margin-bottom:0}.world[data-view=battle] .section-heading button{font-size:10px;padding:3px 8px}
 .world[data-view=battle] .battle-field{grid-template-rows:minmax(0,1fr) 35px minmax(0,1fr);padding-top:20px}
 .world[data-view=battle] .squad h3{font-size:12px;line-height:17px;top:-18px}.world[data-view=battle] .combat-unit{padding-top:11px}
 .world[data-view=battle] .combat-unit .pet-level{font-size:9px;line-height:11px}
 .world[data-view=battle] .combat-unit .unit-hud,.world[data-view=battle] .combat-unit .stats{height:21px}
 .world[data-view=battle] .combat-unit .stat.hp,.world[data-view=battle] .combat-unit .stat.atk{height:21px;font-size:14px}
 .world[data-view=battle] .battle-log{height:20px;margin-top:2px;padding:2px 8px}
}
.world[data-view=battle] .battle-field .slot-row{direction:ltr}
.world[data-view=battle] .squad h3{text-align:left;left:8px;right:auto}