/* A field-first, compact retro game shell. Clinical tools live in a drawer. */
#sound-dialog{width:min(1380px,calc(100% - 20px));padding:14px;max-height:97dvh;border-radius:3px;background:#202d30;border:2px solid #918a67;color:#eee7cc;box-shadow:0 0 0 3px #121c20,0 20px 70px #101a2080}
#sound-dialog .sound-heading{padding:0 3px 10px;gap:10px}
#sound-dialog .sound-heading h2{font-size:20px;letter-spacing:0;margin:2px 0}
#sound-dialog>.sound-heading .adventure-kicker{font-size:9px;color:#b6bc9c;letter-spacing:2px}
#sound-dialog .sound-heading .btn{background:#2f4243;border:1px solid #667a70;color:#e4dec0;border-radius:2px;font-size:12px;min-height:40px}
#sound-dialog .sound-heading-actions{display:flex;gap:7px}
#sound-dialog .sound-body{display:block;padding:0 3px 0 0;scrollbar-gutter:stable}
#sound-dialog .sound-battle{margin:0;border:1px solid #768372;border-radius:2px;background:#f3f0df}
#sound-dialog .battle-heading{padding:9px 15px;background:#2e4040;border:0;color:#f0e6bc}
#sound-dialog .battle-heading .adventure-kicker{color:#acb59c;font-size:8px;letter-spacing:3px}
#sound-dialog .battle-heading h3{font-size:18px;margin:3px 0 0;letter-spacing:1px}
#sound-dialog #battle-level{border-radius:2px;border-color:#77846a;background:#263636;color:#e8d8a5;font-family:ui-monospace,monospace}
#sound-dialog .battle-stage{width:100%;aspect-ratio:16/9;min-height:260px;max-height:57dvh;background:#425f44;border-top:2px solid #9da078;border-bottom:2px solid #293c35}
#battle-field #battle-hero{width:9%;filter:none}
#battle-field #battle-monster,#battle-field #battle-defeated{width:9%}
.boss-encounter #battle-field #battle-monster{width:11%}
#battle-field #battle-charm{width:2.5%;left:calc(var(--hero-x) + 4%);bottom:calc(100% - var(--hero-y) + 6%);filter:none}
#battle-field .battle-spell{bottom:calc(100% - var(--hero-y) + 7%);text-shadow:none;font-size:22px}
#battle-field .battle-enemy-title{top:12px;right:12px;max-width:48%;border-radius:0;padding:6px 12px;box-shadow:3px 3px #17272b88;background:#253937e8;color:#f0e2b7;border:1px solid #a8ad7c}
#battle-field .battle-enemy-title span{font-size:10px;color:#b5c0a7}
#battle-field .battle-enemy-title b{font-size:13px}
#battle-field .battle-kills{border-radius:0;font-family:ui-monospace,monospace;background:#243934e8;color:#ede3b6}
.pixel-sprite,.pixel-landscape{image-rendering:pixelated}
#battle-hero.walking .hero-leg-left{transform-origin:12px 31px;animation:pixel-step .48s steps(2,end) infinite}
#battle-hero.walking .hero-leg-right{transform-origin:20px 31px;animation:pixel-step .48s steps(2,end) -.24s infinite}
#battle-hero.walking>svg{animation:pixel-walk-bob .48s steps(2,end) infinite}
[data-playback="playing"] #battle-monster>svg{animation:pixel-enemy-bob 1.4s steps(2,end) infinite}
[data-playback="playing"] .pixel-camp-flame{animation:pixel-fire 1s steps(2,end) infinite}
#sound-dialog .battle-walk-hint{padding:6px 13px;font-size:12px;color:#d4d7b9;background:#354b43;border-color:#65775f}
#sound-dialog .battle-health{padding:8px 13px 0}
#sound-dialog .battle-playback{margin:6px 13px 0;font-size:12px}
#sound-dialog .battle-announcement:empty{display:none}
#sound-dialog .battle-tools{padding:5px 11px 8px;justify-content:flex-end}
#sound-dialog .battle-tools button{min-height:34px;border-radius:2px;padding:5px 10px;font-size:12px}
#sound-dialog .battle-collection,#sound-dialog .battle-rules{padding:7px 13px}
#sound-dialog .battle-collection summary,#sound-dialog .battle-rules summary{font-size:13px;min-height:30px}
#sound-dialog .battle-region-list{grid-template-columns:repeat(5,minmax(0,1fr));gap:9px}
#sound-dialog .battle-region-list::before{display:none}
#sound-dialog .waypoint{display:flex;flex-direction:column;align-items:stretch;padding:7px;gap:5px;border-radius:2px}
#sound-dialog .waypoint>.waypoint-view{width:100%;height:78px;border-radius:0}
#sound-dialog .waypoint b{font-size:12px}
#sound-dialog .waypoint small{font-size:10px}
#sound-dialog .relic,#sound-dialog .equipped-slot{border-radius:2px}
#sound-dialog .sound-settings-drawer{margin:10px 0 0;border:1px solid #7a856e;background:#f3f0df;color:#314b3a}
.sound-settings-drawer>summary{cursor:pointer;padding:11px 13px;font-size:14px;font-weight:600;min-height:44px}
.sound-settings-drawer>summary span{float:right;font-size:11px;font-weight:400;color:#61725c}
#sound-dialog #sound-config-panel{padding:4px 16px 16px;max-width:940px;margin:auto}
#sound-dialog #sound-config-panel #sound-options{grid-template-columns:repeat(4,minmax(0,1fr));margin-top:10px}
#sound-dialog #sound-config-panel>p{font-size:13px}
#sound-dialog .sound-console{margin-top:10px;border-radius:2px;background:#2d4240;border-color:#869473;box-shadow:0 2px #111e21;padding:10px 14px}
#sound-dialog .sound-console .btn{border-radius:2px}
#sound-dialog #sound-status{color:#d0d5bb;font-size:12px;margin-top:6px;min-height:18px}
#sound-dialog #sound-save-status{color:#f3d5a6;margin:4px 0;font-size:12px}
#sound-dialog #sound-save-status:empty{display:none}
#sound-dialog #battle-open-settings{display:inline-block}
@keyframes pixel-walk-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-2px)}}
@keyframes pixel-step{0%,100%{transform:translateY(-1px)}50%{transform:translateY(1px)}}
@keyframes pixel-enemy-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@keyframes pixel-fire{0%,100%{opacity:1}50%{opacity:.65}}
@media(max-width:900px){
  #sound-dialog{padding:9px;width:calc(100% - 12px);max-height:97dvh}
  #sound-dialog .battle-stage{aspect-ratio:1;min-height:270px;max-height:49dvh}
  #battle-field #battle-hero,#battle-field #battle-monster,#battle-field #battle-defeated{width:13%}
  .boss-encounter #battle-field #battle-monster{width:15%}
  #battle-field #battle-charm{width:4%}
  #sound-dialog .battle-region-list{grid-template-columns:repeat(2,minmax(0,1fr))}
  #sound-dialog .sound-heading h2{font-size:18px}
  #sound-dialog .sound-heading .btn{padding:7px 9px;font-size:11px}
  #sound-dialog .sound-console{grid-template-columns:70px minmax(0,1fr);gap:5px 10px;padding:8px}
  #sound-dialog .sound-console .btn{min-height:42px}
  #sound-dialog #sound-config-panel #sound-options{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sound-settings-drawer>summary span{display:none}
}
@media(max-width:350px){
  #sound-dialog .sound-heading h2{font-size:16px}
  #sound-dialog .sound-heading .btn{padding:6px;font-size:10px}
  #sound-dialog .battle-heading{padding:8px 10px}
  #sound-dialog .battle-heading h3{font-size:15px}
  #sound-dialog .battle-walk-hint{font-size:11px}
}

@media(max-height:560px){#sound-dialog .battle-stage{aspect-ratio:16/9;min-height:140px;max-height:45dvh}}