/* Website form pickers share the existing palette and native select behavior.
   Older engines keep their usable native menu; no replacement auth/form logic. */
body select:not([multiple]):not([size]):not([hidden]) {
  min-height:40px;max-width:100%;min-width:0;border:1px solid var(--line,#e3e5ea);
  border-radius:6px;background-color:var(--input-bg,var(--surface,#fff));
  color:var(--ink,#24262c);font:inherit;line-height:1.6;padding:9px 12px;
  cursor:pointer;
}
body select:not([multiple]):not([size]):not([hidden]):disabled {opacity:.55;cursor:not-allowed}
body select:focus-visible {outline:2px solid var(--accent,var(--red,#c92535));outline-offset:3px}
@supports (appearance:base-select) {
  body select:not([multiple]):not([size]):not([hidden]),
  body select:not([multiple]):not([size]):not([hidden])::picker(select) {appearance:base-select}
  body select:not([multiple]):not([size]):not([hidden]) {display:flex;align-items:center;gap:12px;text-align:start}
  body select:not([multiple]):not([size]):not([hidden]):hover:not(:disabled) {border-color:var(--muted,#686c78)}
  body select:not([multiple]):not([size]):not([hidden]):open {border-color:var(--accent,var(--red,#c92535))}
  body select:not([multiple]):not([size]):not([hidden])::picker-icon {
    content:'';width:7px;height:7px;flex:none;margin-inline-start:auto;margin-block-start:-3px;
    border:solid var(--muted,#686c78);border-width:0 1.5px 1.5px 0;rotate:45deg;
  }
  body select:not([multiple]):not([size]):not([hidden]):open::picker-icon {rotate:225deg;margin-block-start:3px}
  body select:not([multiple]):not([size]):not([hidden])::picker(select) {
    box-sizing:border-box;position-area:block-end span-inline-end;position-try-order:normal;position-try-fallbacks:flip-block;
    inline-size:anchor-size(width);max-inline-size:calc(100vw - 24px);max-block-size:min(320px,50dvh);
    margin-block:6px;padding:6px;border:1px solid var(--line,#e3e5ea);border-radius:8px;
    background:var(--surface,#fff);color:var(--ink,#24262c);font:inherit;line-height:1.6;
    overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--muted,#686c78) var(--surface,#fff);
  }
  body select:not([multiple]):not([size]):not([hidden]) option {
    display:block;position:relative;gap:12px;min-height:40px;padding:9px 12px;border:0;border-radius:6px;
    background:transparent;color:var(--ink,#24262c);font-weight:400;white-space:nowrap;overflow-wrap:normal;word-break:normal;overflow:hidden;text-overflow:ellipsis;padding-inline-end:38px;cursor:pointer;
  }
  body select:not([multiple]):not([size]):not([hidden]) option+option {margin-block-start:3px}
  body select:not([multiple]):not([size]):not([hidden]) option:is(:checked,:focus-visible) {
    background:var(--accent-soft,var(--soft,#fff0f2));color:var(--accent,var(--red,#c92535));font-weight:600;
  }
  body select:not([multiple]):not([size]):not([hidden]) option:hover:not(:disabled):not(:checked) {background:var(--canvas,var(--soft,#f5f6f8))}
  body select:not([multiple]):not([size]):not([hidden]) option:focus-visible {outline:2px solid var(--accent,var(--red,#c92535));outline-offset:-2px}
  body select:not([multiple]):not([size]):not([hidden]) option::checkmark {
    content:'';position:absolute;inset-inline-end:12px;top:50%;display:block;order:1;flex:none;margin-inline-start:auto;width:5px;height:9px;
    border:solid currentColor;border-width:0 2px 2px 0;transform:translateY(-50%) rotate(45deg);
  }
  body select:not([multiple]):not([size]):not([hidden]) option:not(:checked)::checkmark {visibility:hidden}
  body select:not([multiple]):not([size]):not([hidden]) option:disabled {opacity:.55;cursor:not-allowed}
}
@media(forced-colors:active) {
  body select:focus-visible {outline-color:Highlight}
  body select::picker(select) {border-color:CanvasText}
  body select option:is(:checked,:focus-visible) {background:Highlight;color:HighlightText;outline-color:Highlight}
}
/* Dropdown labels always stay on one line; full option text remains accessible. */
body select,body select selectedcontent,body select option{white-space:nowrap;overflow-wrap:normal;word-break:normal}
body select{overflow:hidden;text-overflow:ellipsis}
body select selectedcontent{min-width:0;overflow:hidden;text-overflow:ellipsis}
