/* The native select remains the form control; the desktop button is its accessible view. */
.modern-select { position: relative; display: block; min-width: 0; width: 100%; }
select.modern-select-native { position: absolute !important; width: 1px !important; height: 1px !important; min-width: 0 !important; min-height: 0 !important; padding: 0 !important; margin: 0 !important; opacity: 0; pointer-events: none; clip-path: inset(50%); overflow: hidden; }
.modern-select-trigger { display: flex; align-items: center; justify-content: space-between; gap: 14px; width: 100%; min-height: var(--control-height, 48px); margin: 0; padding: 11px 16px; color: var(--text, #f4f3f7); border: 1px solid var(--control-border, #62748f); border-radius: var(--radius-sm, 12px); background: var(--control-bg, #0e1828); font: inherit; font-size: 14px; font-weight: 550; line-height: 1.5; text-align: left; cursor: pointer; transition: border-color 160ms ease, box-shadow 160ms ease; }
.modern-select-trigger::after { content: ""; flex: none; width: 7px; height: 7px; margin: -4px 2px 0 0; border: solid var(--muted, #aba7b5); border-width: 0 1.7px 1.7px 0; transform: rotate(45deg); transition: transform 160ms ease; }
.modern-select-trigger:hover:not(:disabled) { border-color: var(--interactive-edge, #70a6d0); background: var(--surface-hover, #20314c); }
.modern-select-trigger[aria-expanded="true"] { border-color: var(--focus, #69c7ff); background: var(--selection-surface, #1e3550); }
.modern-select-trigger:focus-visible { outline: 2px solid var(--focus, #69c7ff); outline-offset: 3px; border-color: var(--focus, #69c7ff); }
.modern-select-trigger[aria-expanded="true"]::after { transform: translateY(3px) rotate(225deg); }
.modern-select-trigger:disabled { opacity: .5; cursor: not-allowed; }
.modern-select-trigger[aria-invalid="true"] { border-color: var(--danger, #ff92a7); }
.modern-select-value { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.modern-select-popup { position: fixed; inset: auto; z-index: 1200; margin: 0; padding: 8px; box-sizing: border-box; color: var(--text, #f4f3f7); border: 1px solid var(--line-strong, #3a3644); border-radius: var(--radius-md, 16px); background: var(--surface-raised, #19263c); box-shadow: var(--shadow-md, 0 12px 32px #0004); max-height: 320px; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: var(--line-strong, #3a3644) transparent; }
.modern-select-popup:popover-open { animation: modern-select-enter 130ms ease-out; }
.modern-select-option { position: relative; display: flex; align-items: center; min-height: 44px; padding: 9px 36px 9px 12px; border-radius: var(--radius-xs, 8px); font: inherit; font-size: 14px; font-weight: 550; line-height: 1.45; overflow-wrap: anywhere; cursor: pointer; }
.modern-select-option:hover:not([aria-disabled="true"]),.modern-select-option.is-active { background: var(--surface-hover, #20314c); }
.modern-select-option[aria-selected="true"] { color: var(--cyan, #69c7ff); background: var(--selection-surface, #1e3550); font-weight: 650; }
.modern-select-option[aria-selected="true"]::after { content: ""; position: absolute; right: 15px; width: 5px; height: 10px; border: solid currentColor; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.modern-select-option[aria-disabled="true"] { opacity: .4; cursor: not-allowed; }
.modern-select-group { padding: 10px 12px 5px; color: var(--muted, #aba7b5); font-size: 12px; font-weight: 650; letter-spacing: .06em; text-transform: uppercase; }
.modern-select-empty { padding: 14px; color: var(--muted, #aba7b5); font-size: 14px; }
.modern-select-error { display: block; margin-top: 7px; color: var(--danger, #ff92a7); font-size: 13px; line-height: 1.45; }
.modern-select-error[hidden] { display: none; }
@keyframes modern-select-enter { from { opacity: 0; transform: translateY(-3px); } to { opacity: 1; transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) { .modern-select-trigger,.modern-select-trigger::after { transition: none; } .modern-select-popup:popover-open { animation: none; } }

@media (forced-colors: active) { .modern-select-trigger,.modern-select-popup { border-color: ButtonText; } .modern-select-option[aria-selected="true"] { outline: 1px solid Highlight; } }