/* Accessible select menus, styled like the homepage sort control. */
.panel-select { position: relative; min-width: 0; width: 100%; font-size: .85rem; font-weight: 500; letter-spacing: 0; text-transform: none; }
.panel-select__trigger { display: flex; align-items: center; justify-content: space-between; gap: .75rem; width: 100%; min-height: 44px; padding: .65rem .8rem; border: 1px solid var(--frame-edge); border-radius: var(--control-radius); background: var(--control-gradient); box-shadow: var(--control-shadow); color: var(--muted-bright); font: inherit; line-height: 1.4; text-align: left; cursor: pointer; }
.panel-select__trigger > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.panel-select__trigger svg { flex: 0 0 16px; width: 16px; height: 16px; fill: none; stroke: var(--accent); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.panel-select__trigger:not(:disabled):is(:hover, [aria-expanded="true"]) { background: var(--control-hover-gradient); box-shadow: var(--control-hover-shadow); color: var(--ink); }
.panel-select__trigger:disabled { opacity: .45; cursor: default; }
.panel-select__trigger[aria-invalid="true"] { border-color: #ee9191; }
.panel-select__options { position: fixed; z-index: 110; inset: auto; width: 220px; max-height: 320px; margin: 0; padding: .3rem; overflow: auto; overscroll-behavior: contain; border: 1px solid var(--menu-line); border-radius: var(--panel-radius); background: var(--menu-surface); box-shadow: var(--panel-shadow), 0 .75rem 2rem #0007; color: var(--muted-bright); font-family: inherit; font-size: .85rem; font-weight: 500; line-height: 1.4; letter-spacing: 0; text-transform: none; list-style: none; scrollbar-color: var(--line-strong) var(--surface); }
.panel-select__options::backdrop { background: none; }
.panel-select__option { display: flex; align-items: center; gap: .65rem; min-height: 44px; padding: .6rem .65rem; border: 1px solid transparent; border-radius: var(--control-radius); cursor: pointer; }
.panel-select__option::before { content: ""; flex: 0 0 16px; height: 16px; background: currentColor; clip-path: polygon(10% 49%, 23% 36%, 42% 55%, 77% 20%, 90% 33%, 42% 81%); visibility: hidden; }
.panel-select__option[aria-selected="true"] { color: var(--accent-strong); }
.panel-select__option[aria-selected="true"]::before { visibility: visible; }
.panel-select__option[aria-disabled="true"] { opacity: .45; cursor: default; }
.panel-select__option:not([aria-disabled="true"]):is(:hover, .is-active) { border-color: var(--line-strong); background: var(--panel-selected); color: var(--accent-strong); }
.panel-select__error { display: block; margin-top: .4rem; color: #ffb0b0; font-size: .75rem; font-weight: 400; }
.panel-select__options[hidden], .panel-select__error[hidden], select[hidden] { display: none !important; }