/* Explicit fallback colours also keep unenhanced native controls readable. */
.field select, .sort-label select { background-color: #292c2a; color: #f6f8f6; color-scheme: dark; }
select option { background: #292c2a; color: #f6f8f6; }
.choice-native { display: none !important; }
.field.choice-field { background: #292c2a; border-color: #515953; }
.choice-trigger { display: flex; width: 100%; align-items: center; justify-content: space-between; gap: 10px; text-align: left; min-height: 44px; padding: 5px 0; color: #f6f8f6; font-size: 1rem; line-height: 1.45; border-radius: 5px; }
.choice-trigger .choice-value { min-width: 0; overflow-wrap: anywhere; }
.choice-trigger > svg { width: 18px; height: 18px; flex: 0 0 18px; fill: none; stroke: #bec7c1; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.choice-trigger[aria-expanded="true"] > svg { color: #39e779; transform: rotate(180deg); }
.sort-label .choice-trigger { background: #292c2a; border: 1px solid #515953; padding: 8px 12px; font-size: .875rem; border-radius: 9px; width: auto; }
.choice-picker { width: min(440px, calc(100vw - var(--relay-safe-left) - var(--relay-safe-right) - 24px)); padding: 20px; background: #242725; border: 1px solid #59645d; border-radius: 22px; color: #f6f8f6; overflow: hidden; }
.choice-picker[open] { display: flex; flex-direction: column; }
.choice-heading { display: flex; align-items: center; justify-content: space-between; gap: 18px; flex: 0 0 auto; }
.choice-picker h2 { font-size: 1.25rem; line-height: 1.35; margin: 0; }
.choice-close { min-width: 44px; min-height: 44px; border-radius: 50%; font-size: 1.6rem; background: #343a36; color: #f6f8f6; flex: 0 0 auto; }
.choice-picker .choice-hint { color: #b6c0ba; font-size: .8125rem; margin: 6px 0 18px; flex: 0 0 auto; }
.choice-list { display: flex; flex-direction: column; gap: 8px; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 3px; scrollbar-width: thin; }
.choice-option { display: flex; justify-content: space-between; align-items: center; gap: 18px; width: 100%; text-align: left; padding: 15px; min-height: 54px; border: 1px solid #515953; border-radius: 12px; background: #303632; color: #f6f8f6; line-height: 1.45; flex: 0 0 auto; }
.choice-option:hover { background: #3b433e; }
.choice-option[aria-selected="true"] { background: #35423a; border-color: #39e779; }
.choice-check { width: 23px; height: 23px; flex: 0 0 23px; border: 1px solid #89958d; border-radius: 50%; color: #101b14; display: grid; place-items: center; font-size: .8125rem; }
.choice-option[aria-selected="true"] .choice-check { background: #39e779; border-color: #39e779; }
.choice-option:focus-visible { outline-offset: 0; }
@media (max-width: 700px) {
  .choice-picker { inset: auto var(--relay-safe-right) calc(var(--relay-safe-bottom) + 12px) var(--relay-safe-left); margin: auto; padding: 18px; }
  .choice-picker h2 { font-size: 1.125rem; }
}
