/* Reference palette: deep forest, charcoal steel, lime highlights and warm gold. */
#screen :is(#battle,#campaign-scene) {
  --battle-ink:#edf2dd; --battle-gold:#edce72; --battle-panel:#26363d;
  --battle-rim:#aebbb0; --battle-green:#80c83f;
  color:var(--battle-ink); text-shadow:1px 1px #101e22;
}
#screen #battle.emerald-battle { grid-template-rows:minmax(0,72%) minmax(0,28%); background:#162d29; }
#screen :is(#battle,#campaign-scene) .verdant-field { border:0; border-radius:0; }
#screen .verdant-field:is([data-scene=forest],[data-scene=meadow]) .battle-backdrop {
  background:#568b3e var(--asset-route-battle, url('/assets/remake/route-battle.png')) center 56% / cover no-repeat!important;
  image-rendering:pixelated;
}
#screen #battle.emerald-battle .health-box,
#screen .verdant-hud {
  box-sizing:border-box; background:linear-gradient(#3d4a4e 0 12%,#29383f 13% 83%,#202e34 84%);
  color:var(--battle-ink); border:3px double var(--battle-rim); border-radius:9px 3px 9px 3px;
  box-shadow:0 0 0 2px #142627,2px 4px 0 #102a2880,inset 0 1px #dbe8c750;
  padding:6px 9px; line-height:1.25;
}
#screen #battle.emerald-battle .health-box { width:38%; font-size:clamp(10px,2cqw,17px); }
#screen #battle.emerald-battle .enemy-health { left:auto;right:3%;top:4%; }
#screen #battle.emerald-battle .ally-health { left:3%;right:auto;bottom:7%; }
#screen .health-box strong,#screen .verdant-hud strong { text-transform:uppercase; letter-spacing:.035em; }
#screen .health-box>span:not(.hp-numbers),#screen .verdant-level { color:var(--battle-gold); }
#screen :is(#battle,#campaign-scene) progress {
  appearance:none; display:block; box-sizing:border-box; width:100%; max-width:100%; height:10px;
  overflow:hidden; border:2px solid #152629; border-radius:4px; background:#101f25;
  box-shadow:0 1px #b9c5aa70; accent-color:#80cd45;
}
#screen :is(#battle,#campaign-scene) progress::-webkit-progress-bar { background:#101f25; }
#screen :is(#battle,#campaign-scene) progress::-webkit-progress-value { background:linear-gradient(#d7f28c 0 25%,#81d349 26% 60%,#3c9c52 61%); transition:width .25s ease-out; }
#screen :is(#battle,#campaign-scene) progress[data-health=medium]::-webkit-progress-value { background:linear-gradient(#fff0a1,#efb940 50%,#ba782a); }
#screen :is(#battle,#campaign-scene) progress[data-health=low]::-webkit-progress-value { background:linear-gradient(#ffb994,#e86551 50%,#a83840); }
#screen :is(#battle,#campaign-scene) progress::-moz-progress-bar { background:#81d349; }
#screen :is(#battle,#campaign-scene) progress[data-health=medium]::-moz-progress-bar { background:#efb940; }
#screen :is(#battle,#campaign-scene) progress[data-health=low]::-moz-progress-bar { background:#e86551; }
#screen .hp-line small { color:var(--battle-gold); font-weight:bold; }
#screen #battle.emerald-battle .battle-bottom { border-top:2px solid #b6c68b; gap:5px; padding:5px; background:#16392e; grid-template-columns:minmax(0,46fr) minmax(0,54fr); }
#screen #battle.emerald-battle .battle-log,
#screen #battle:not(.emerald-battle)>p,
#screen #campaign-scene:has(.verdant-field)>p {
  background:linear-gradient(130deg,#34464b,#233239); color:#f4f2db;
  border:3px double #aab8ac; border-radius:5px; box-shadow:inset 0 0 0 1px #14252a;
  padding:8px; margin:0; overflow:auto; font-size:clamp(11px,1.8cqw,16px); line-height:1.4;
}
#screen #battle.emerald-battle .battle-actions { background:#1b302e; border:0; gap:5px; padding:0 5px 0 0; }
#screen :is(#battle,#campaign-scene:has(.verdant-field)) button {
  background:linear-gradient(#65785b,#3c5248); color:#fff7d8; border:3px double #b5c2a3;
  border-radius:5px; box-shadow:inset 0 2px #e7edc62b,0 2px #0d2228;
  font:inherit; padding:6px 8px; text-shadow:1px 1px #14252a; cursor:pointer;
}
#screen #battle.emerald-battle .battle-actions button { background:linear-gradient(#667b59,#354d43); border:3px double #adbd96; font-size:clamp(10px,1.7cqw,16px); min-height:28px; }
#screen :is(#battle,#campaign-scene:has(.verdant-field)) button:hover:not(:disabled),
#screen :is(#battle,#campaign-scene:has(.verdant-field)) button:focus-visible { outline:2px solid #f2d47c; outline-offset:-2px; background:linear-gradient(#8da949,#4d702f); }
#screen :is(#battle,#campaign-scene) button:disabled { opacity:.48; cursor:default; }
#screen #battle.emerald-battle .combatant { width:29%; height:63%; }
#screen #battle.emerald-battle .enemy { right:14%;top:17%; }
#screen #battle.emerald-battle .ally { left:8%;bottom:25%;height:52%; }
#screen #battle.emerald-battle .combatant canvas,
#screen .verdant-field canvas.battle-pokemon {
  image-rendering:pixelated; filter:drop-shadow(1px 0 #18352bd0) drop-shadow(-1px 0 #18352bd0) drop-shadow(0 3px #18352b60);
  transform-origin:50% 90%; animation:battle-breathe .48s steps(4,end) 1;
}
#screen .verdant-field .combatant::before { content:'';position:absolute;left:20%;right:20%;bottom:8%;height:8%;background:#183b3866;border-radius:50%; }
#screen :is(#battle,#campaign-scene) .pvp-field.verdant-field { min-height:190px; padding:12px; gap:16px; }
#screen .verdant-field .verdant-mon { position:relative;min-width:0;background:transparent;border:0;display:flex;flex-direction:column;justify-content:end;gap:4px; }
#screen .verdant-field .pvp-side { min-width:0;flex-wrap:nowrap; }
#screen .verdant-field .verdant-mon canvas.battle-pokemon { width:clamp(64px,16cqw,150px)!important;height:auto!important;aspect-ratio:1;margin:auto; }
#screen .verdant-hud { font-size:clamp(10px,1.8cqw,15px);text-align:left;z-index:4; }
#screen .verdant-hud .verdant-level { display:inline;float:right;font-size:inherit; }
#screen .verdant-hud progress { margin:4px 0; }
#screen .verdant-hud small { display:block;text-align:right;font-size:.85em; }
#screen .verdant-hud .verdant-owner { text-align:left;color:#c7d99e; }
#screen #campaign-scene:has(.verdant-field) { inset:0;max-height:none;padding:8px;background:#16392e;border:3px double #9aaa91;border-radius:0; }
#screen #campaign-scene:has(.verdant-field)>h3,#screen #battle:has(.verdant-field)>h3 { color:#edce72;font-size:clamp(11px,2cqw,17px); }
#screen #battle:not(.emerald-battle):has(.verdant-field) { background:#16392e;overflow:auto; }
#screen .capture-notice { color:#f5e8a9;background:#213832de;border:1px solid #a9ba81;border-radius:4px;z-index:6;font-size:clamp(9px,1.5cqw,13px); }
@keyframes battle-breathe { 0%,100% {translate:0 0} 50% {translate:0 -2px} }
@media(prefers-reduced-motion:reduce) { #screen .verdant-field canvas.battle-pokemon,#screen #battle.emerald-battle .combatant canvas { animation:none; } }
@media(max-width:520px) {
  #screen #battle.emerald-battle { grid-template-rows:65% 35%; }
  #screen #battle.emerald-battle .health-box { width:43%;padding:3px 5px; }
  #screen :is(#battle,#campaign-scene) .pvp-field.verdant-field { min-height:140px;gap:6px;padding:6px; }
  #screen .verdant-hud { padding:4px;border-width:2px; }
}
