/* A handheld battle cartridge inside the existing warm neighborhood shell. */
.shiba-card{display:flex;align-items:center;gap:12px;padding:10px 12px;border:1px solid #d5dcc7;background:#ebefdf;border-radius:4px}
.shiba-card canvas{width:68px;height:62px;image-rendering:pixelated;flex-shrink:0}
.shiba-card strong{font:700 14px var(--mono)}.shiba-card p{font-size:10px;line-height:1.5;margin:5px 0;color:#646e58}.shiba-card small{font-size:9px;color:#687451}
.adventure-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:-6px 0 12px;font:10px var(--mono);color:#586348}
.adventure-bar>span{display:flex;align-items:center;gap:10px}.adventure-bar b{font-size:10px;color:#a65634}
.encounter-controls{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.touch-controls [data-key="shift"]{grid-column:1/-1;width:100%;font:700 10px var(--mono);height:28px}
#peaceful-button[aria-pressed="true"]{background:#e2ead8;color:#345243;border-color:#849779}
.toast{pointer-events:none}
@media(max-width:600px){.adventure-bar{flex-wrap:wrap}.encounter-controls{width:100%;justify-content:space-between}.toast{top:68px;bottom:auto}}
.encounter-button{display:flex;align-items:center;gap:12px;border:1px solid #a75637;background:#ca5b3e;color:#fff8e6;padding:9px 13px;border-radius:4px;box-shadow:0 2px 0 #9b4c33;font:700 10px var(--mono)}
.encounter-button:hover{background:#ae4d34}.encounter-button kbd{color:#fff7e4;background:#ac4e35;border-color:#df9276;font-size:8px}
#battle-dialog{padding:0;border:4px solid #344c3b;border-radius:3px;width:min(960px,calc(100% - 28px));max-height:calc(100dvh - 24px);overflow:auto;background:#f5efd4;color:#293b33;box-shadow:0 0 0 3px #ece6cb,0 16px 70px #182c3055;font-family:var(--mono);animation:battle-arrive .48s steps(10,end)}
#battle-dialog::backdrop{background:#23342aaf;backdrop-filter:blur(2px)}
.battle-topline,.battle-bottomline{display:flex;justify-content:space-between;gap:12px;align-items:center;background:#344c3b;color:#eee9ce;padding:12px 18px;font-size:10px;letter-spacing:1px}
.battle-bottomline{font-size:8px;letter-spacing:.6px;padding:10px 18px}.battle-topline>span:last-child{font-size:9px;letter-spacing:0;color:#c7d7b0}
.battle-arena{position:relative;isolation:isolate;height:min(42vw,400px);min-height:300px;overflow:hidden;background:#cfddbc}
#battle-backdrop{position:absolute;inset:0;width:100%;height:100%;image-rendering:pixelated}
.fighter-info{position:absolute;z-index:3;background:#faf5dc;border:3px solid #465942;box-shadow:5px 5px 0 #7c956a;padding:12px 16px 10px;border-radius:2px}
.enemy-info{left:5%;top:8%;width:43%}.player-info{right:4%;bottom:7%;width:43%}
.fighter-name{display:flex;align-items:baseline;justify-content:space-between;gap:8px;font-size:clamp(13px,1.4vw,19px);line-height:1.4}.fighter-name strong{font-size:inherit}.fighter-name>span{font-size:.8em;white-space:nowrap}
.health-row{display:flex;align-items:center;gap:8px;margin-top:8px}.health-row>b{color:#bc8742;font-size:12px;letter-spacing:-1px;text-shadow:1px 1px #fff}
.health-track{height:14px;border:3px solid #425340;border-radius:7px;background:#6c7662;flex:1;overflow:hidden}
.health-track>span{display:block;height:100%;background:#62b983;box-shadow:inset 0 3px #a0df9a;transition:width .45s steps(12,end)}
.health-track>span[data-health=medium]{background:#dfb64c;box-shadow:inset 0 3px #efd777}.health-track>span[data-health=low]{background:#d87053;box-shadow:inset 0 3px #f2a878}
.health-numbers{text-align:right;font-size:16px;letter-spacing:1px;margin-top:5px}.xp-row{display:flex;align-items:center;gap:7px;margin-top:8px;font-size:8px;color:#8b744c}.xp-row>div{flex:1;background:#cbd1bb;height:5px}.xp-row i{display:block;height:100%;background:#5b9caf;transition:width .4s steps(10,end)}
.battle-creature{position:absolute;z-index:2;aspect-ratio:1;transform-origin:50% 90%;image-rendering:pixelated}
.battle-creature canvas{display:block;width:100%;height:100%;image-rendering:pixelated}
.player-creature{width:26%;left:10%;bottom:7%}.enemy-creature{width:25%;left:64%;bottom:40%}
.player-creature.attacking{animation:player-lunge .22s steps(5,end)}.enemy-creature.attacking{animation:enemy-lunge .22s steps(5,end)}
.battle-creature.hurt{animation:battle-hit .32s steps(4,end)}.battle-creature.heal{filter:drop-shadow(0 0 8px #fff8b0)}.battle-creature.guard{filter:drop-shadow(3px 0 #e4cc89) drop-shadow(-3px 0 #e4cc89)}
.battle-creature.victory,.battle-creature.defeat{opacity:.22;transform:translateY(18px);transition:opacity .35s,transform .35s}.battle-creature.run{animation:shiba-run .7s steps(8,end) forwards}
.battle-effect{position:absolute;left:30%;top:41%;z-index:4;font-weight:700;font-size:clamp(16px,3vw,34px);color:#fff3b9;text-shadow:2px 2px #735539,-2px -2px #735539;opacity:0;transform:translateY(8px)}.battle-effect.visible{opacity:1;transform:translateY(0);transition:transform .25s steps(4,end)}
.battle-console{display:grid;grid-template-columns:1.05fr 1fr;border-top:4px solid #344c3b;background:#eee6c7;min-height:174px;padding:10px;gap:10px}
.battle-dialogue{position:relative;background:#326267;border:3px solid #eee8c9;outline:3px solid #4b5946;box-shadow:inset 0 0 0 2px #173f49;margin:3px;padding:20px 22px;min-width:0}
#battle-message{font:700 clamp(13px,1.35vw,18px)/1.75 var(--mono);color:#fff8df;margin:0;letter-spacing:.1px}
.dialogue-cursor{position:absolute;bottom:9px;right:12px;font-size:11px;color:#f8e6ae}
.battle-command-panel{min-width:0;display:flex;flex-direction:column;justify-content:center;padding:2px 4px}
.battle-commands{display:grid;grid-template-columns:1fr 1fr;gap:5px}
.battle-commands button{position:relative;min-width:0;min-height:52px;border:2px solid transparent;background:#faf4d9;text-align:left;padding:7px 10px 7px 23px;border-radius:0;font-family:var(--mono);line-height:1.4}
.battle-commands button:hover:not(:disabled),.battle-commands button:focus-visible{background:#fff9e4;border-color:#526446;outline:0}
.battle-commands button:focus-visible:before,.battle-commands button:hover:not(:disabled):before{content:'▶';position:absolute;left:7px;top:10px;font-size:10px;color:#ad5f3e}
.battle-commands strong{display:block;font-size:16px;letter-spacing:-.5px}.battle-commands small{display:block;font-size:8px;color:#687152;margin-top:3px}
.battle-commands button:disabled{cursor:default;opacity:.48}.battle-commands [data-command=root]{min-height:30px;background:none;grid-column:1/-1;padding-top:3px;padding-bottom:3px}.battle-commands [data-command=root] strong{font-size:11px}
.move-description{font:10px/1.5 var(--mono);color:#676f52;margin:7px 0 0;min-height:15px}.battle-ended .battle-commands{grid-template-columns:1fr}.battle-ended .battle-commands button{min-height:64px}
@keyframes battle-arrive{from{clip-path:inset(49% 0)}to{clip-path:inset(0)}}
@keyframes player-lunge{50%{transform:translate(20px,-8px)}}@keyframes enemy-lunge{50%{transform:translate(-20px,8px)}}
@keyframes battle-hit{25%,75%{transform:translateX(-5px)}50%,100%{transform:translateX(5px)}}
@keyframes shiba-run{to{transform:translateX(-160%);opacity:0}}
@media(max-width:640px){
  .adventure-bar{font-size:8px;margin:0 0 12px}.adventure-bar>span{gap:6px}.encounter-button{font-size:9px;padding:8px 10px}.encounter-button kbd{display:none}
  .game-shell{height:calc(100svh - 326px)}
  #battle-dialog{width:calc(100% - 18px);border-width:3px}.battle-topline{font-size:8px;padding:10px;letter-spacing:.5px}.battle-topline>span:last-child{font-size:7px}
  .battle-arena{height:280px;min-height:0}.fighter-info{padding:8px 9px;border-width:2px;box-shadow:3px 3px 0 #7c956a}.enemy-info{left:4%;top:8%;width:48%}.player-info{right:4%;bottom:8%;width:48%}
  .fighter-name{font-size:12px;gap:4px}.health-row{gap:5px;margin-top:5px}.health-row>b{font-size:10px}.health-track{height:11px;border-width:2px}.health-numbers{font-size:12px;margin-top:3px}.xp-row{margin-top:5px;font-size:6px}
  .player-creature{width:37%;left:4%;bottom:6%}.enemy-creature{width:34%;left:59%;bottom:42%}
  .battle-console{grid-template-columns:1fr;gap:9px;padding:8px;min-height:0;border-top-width:3px}.battle-dialogue{padding:13px 15px;min-height:90px}#battle-message{font-size:12px;line-height:1.65}
  .battle-command-panel{padding:0 1px}.battle-commands button{min-height:46px;padding-top:6px;padding-bottom:6px}.battle-commands strong{font-size:14px}.battle-commands small{font-size:9px;color:#526040}.move-description{font-size:10px;color:#526040;margin:4px 0 0;min-height:0}.move-description:empty{display:none}
  .battle-bottomline{font-size:6px;padding:9px 10px;letter-spacing:.2px}#battle-key-hint{display:none}.battle-ended .battle-commands button{min-height:54px}
}
@media(max-height:650px) and (max-width:640px){.battle-arena{height:260px}.player-info{bottom:3%}.enemy-creature{bottom:44%}.battle-dialogue{min-height:76px}.battle-topline{padding:8px}.battle-bottomline{padding:7px}}
@media(prefers-reduced-motion:reduce){#battle-dialog,.battle-creature,.battle-effect,.health-track>span{animation:none!important;transition:none!important}}
