.ship-picker { margin: 1rem 0; border: 1px solid #385168; border-radius: 12px; background: #142a3c; }
.ship-picker > summary { padding: 1rem; cursor: pointer; font-weight: 700; }
.ship-picker-body { padding: 0 1rem 1rem; }
.ship-picker-controls { display: flex; flex-wrap: wrap; align-items: flex-end; gap: .7rem; margin-top: .8rem; }
.ship-picker-filter { display: flex; flex: 1 1 130px; min-width: 0; flex-direction: column; gap: .3rem; font-size: .85rem; }
.ship-picker-filter select { width: 100%; min-width: 0; }
.ship-picker-controls button { min-height: 38px; }
.ship-picker .ship-grid { margin-top: .5rem; }
.ship-picker button.scard { width: 100%; height: 100%; font: inherit; color: inherit; text-align: left; cursor: pointer; }
.ship-picker button.scard:focus-visible { outline: 3px solid #8ed8ff; outline-offset: 3px; }
.ship-picker button.scard.ship-selected { outline: 3px solid #69d6c3; outline-offset: -3px; background: #183e47; }
.ship-picker button.scard.ship-selected .sc-name::before { content: '✓ '; color: #8aecd9; }
.ship-picker button.scard:disabled { opacity: .45; cursor: default; }
.ship-picker .more { display: block; margin: 1rem auto 0; }
.ship-picker [hidden] { display: none; }
.cap-sk-heading { display: flex; align-items: center; gap: .7rem; }
.cap-skill-icon { width: 64px; height: 64px; flex: 0 0 64px; object-fit: contain; }
.cap-sk-plus .cap-skill-icon { width: 40px; height: 40px; vertical-align: middle; margin-right: .4rem; }
@media (max-width: 480px) {
  .ship-picker-body { padding: 0 .65rem .8rem; }
  .ship-picker-filter { flex-basis: calc(50% - .7rem); }
}