.crew-display-controls { position: sticky; top: 0; z-index: 12; display: flex; flex-wrap: wrap; gap: 8px 20px; padding: 12px; margin-bottom: 12px; background: #fff; color: #183d35; border: 1px solid #bdcec7; border-radius: 12px; }
.crew-display-controls fieldset { display: flex; gap: 6px; margin: 0; padding: 0; border: 0; min-width: 0; }
.crew-display-controls legend { font-size: .8rem; font-weight: 750; margin-bottom: 5px; }
.crew-display-controls button { min-height: 48px; min-width: 84px; border: 1px solid #aabfb5; border-radius: 8px; background: #fff; color: #183d35; padding: 10px 14px; font: inherit; font-weight: 700; cursor: pointer; }
.crew-display-controls button[aria-pressed="true"] { background: #14563f; color: #fff; border-color: #14563f; box-shadow: inset 0 0 0 2px currentColor; }
.crew-display-controls button:focus-visible { outline: 3px solid #007ea8; outline-offset: 3px; }
.crew-display-controls [role="status"] { flex-basis: 100%; margin: 0; }
.crew-display-controls [role="status"]:empty { display: none; }
html[data-app-theme="dark"] body .crew-display-controls { background: #192a32; color: #edf5f3; border-color: #49616a; }
html[data-app-theme="dark"] body .crew-display-controls button { background: #101b21; color: #edf5f3; border-color: #718b93; }
html[data-app-theme="dark"] body .crew-display-controls button[aria-pressed="true"] { background: #9ee8d0; color: #102b22; border-color: #9ee8d0; }
html[data-app-theme="dark"] body .crew-display-controls button[aria-pressed] span { color: inherit; }
@media (max-width: 640px) {
  .crew-display-controls { gap: 8px; padding: 10px; }
  .crew-display-controls fieldset { flex: 1 1 145px; }
  .crew-display-controls button { flex: 1; min-width: 0; padding: 10px 8px; font-size: .9rem; }
  .christmas-crew-body:has(.crew-display-controls) { padding: 10px; }
}
