#encounter { padding:8px 16px; gap:0; height:min(100dvh,600px); overflow:auto; }
#encounter header { padding:0; min-height:20px; font-size:16px; line-height:20px; }
#encounter header span { font-size:16px; color:#b0b3b8; }
#enc-title { margin:0; font-size:24px; line-height:28px; color:#fff; }
#enc-threat { margin:0; min-height:24px; font-size:17px; font-weight:800; line-height:24px; color:#ffda8c; }
#battle-scene { display:block; width:100%; height:auto; min-height:150px; max-height:270px; flex:1 1 250px; object-fit:contain; background:#000; image-rendering:pixelated; }
#enc-stats { flex-shrink:0; font-size:18px; font-weight:800; color:#e7fff8; min-height:26px; line-height:26px; border-bottom:1px solid #42646a; }
.enc-body { padding:4px 0; flex-shrink:0; }
.enc-body p { font-size:16px; line-height:20px; margin:0; }
#enc-detail { color:#fff0ce; }
#enc-choices { flex-shrink:0; margin:0; gap:3px; }
#enc-choices button { min-height:44px; font-size:17px; padding:4px; line-height:20px; background:#12171c; }
#enc-choices .selected { border-color:#fff; outline:3px solid #fff; outline-offset:-3px; color:#fff; background:#173532; }
#enc-choices button:disabled { opacity:1; color:#d9e8eb; cursor:wait; }
#enc-choices:has(button:nth-child(4)) { grid-template-columns:repeat(3,minmax(0,1fr));grid-template-areas:'. strike .' 'guard . skill' '. patch .'; }
#enc-back { margin:3px 0 0; min-height:26px; padding:2px 8px; font-size:16px; line-height:20px; }
#enc-hint { display:block; text-align:right; font-size:16px; line-height:18px; min-height:18px; color:#d9e8eb; }
#encounter[data-kind='battle'] #enc-hint { margin-top:-22px; margin-left:235px; font-size:16px; line-height:18px; min-height:22px; }
#encounter:not([data-kind='battle']) #enc-choices {
display: flex;
flex-direction: column;
margin-top: auto;
overflow-y: auto;
max-height: 220px;
grid-template-columns: none;
grid-template-areas: none;
}
#encounter:not([data-kind='battle']) .enc-body p { font-size:18px; line-height:23px; margin-bottom:5px; }
#encounter:not([data-kind='battle']) #battle-scene { max-height:260px; }
#loading-text { font-size:20px; padding:12px; background:#16191e; color:#fff; border:2px solid #fff; }
#loading .selected { outline:3px solid #90fff1; outline-offset:3px; }
body[data-art-fallback='true'] #battle-scene { max-height:100px; min-height:50px; }
body[data-art-fallback='true'] #enc-threat::after { content:' · ART OFFLINE'; }
#encounter:has(#battle-scene[data-fallback='true']) #enc-threat::after { content:' · MOTION OFF'; }
@media(max-width:450px) {
#encounter { padding:8px; }
#encounter header span { display:none; }
#enc-title { font-size:22px; }
#enc-threat { font-size:16px; line-height:20px; }
#encounter[data-kind='battle'] #enc-hint { margin:3px 0 0; text-align:center; }
#enc-choices button { font-size:16px; }
}
@media(prefers-reduced-motion:reduce) { #battle-scene { scroll-behavior:auto; } }
#encounter[data-kind='mara'] #battle-scene { min-height:88px; max-height:235px; flex:1 1 88px; object-fit:cover; object-position:center 34%; }
#encounter[data-kind='mara'] .enc-body p { font-size:16px; line-height:20px; margin-bottom:3px; }
#encounter[data-kind='mara'] #enc-choices button { min-height:44px; }
.market-icon { display:inline-block; width:36px; height:24px; margin-right:8px; vertical-align:middle; background-size:400% 400%; border-radius:3px; }
#enc-title .market-icon { width:66px; height:44px; }
#enc-choices button:has(.market-icon) { text-align:left; padding-inline:12px; }
@media (max-width:450px) {
#app:has(#encounter:not(.hidden)), #encounter { height:100dvh; }
}

#encounter[data-crew-menu] #enc-choices {
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-areas:none;
}
#encounter[data-crew-menu] #enc-choices button { grid-area:auto; }
#encounter[data-crew-menu] #enc-choices button:first-child { grid-column:1/-1; }
#encounter[data-crew-menu] #enc-hint { margin:5px 0 0; text-align:center; }