@supports (appearance: base-select) {
  select:not([multiple]):not([size]),
  select:not([multiple]):not([size])::picker(select){appearance:base-select}

  select:not([multiple]):not([size]){
    align-items:center;gap:8px;cursor:pointer;text-align:left;
    background-image:none !important;padding-right:12px !important;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.35;
    transition:border-color .15s,box-shadow .15s,background-color .15s}
  select:not([multiple]):not([size]):disabled{cursor:not-allowed}
  select:not([multiple]):not([size]) selectedcontent{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  select:not([multiple]):not([size])::picker-icon{
    content:"";flex:0 0 auto;margin-left:auto;width:16px;height:16px;background:currentColor;opacity:.62;
    -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center/contain no-repeat;
            mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center/contain no-repeat;
    transition:rotate .2s ease,opacity .15s}
  select:not([multiple]):not([size]):hover::picker-icon{opacity:.9}
  select:not([multiple]):not([size]):open::picker-icon{rotate:180deg;opacity:1}

  select:not([multiple]):not([size])::picker(select){
    margin:6px 0;padding:6px;min-width:anchor-size(width);max-width:min(560px,calc(100vw - 24px));max-height:min(380px,62vh);overflow:auto;
    background:#fff;color:#1d1230;border:1px solid #e4dcef;border-radius:14px;
    box-shadow:0 18px 46px rgba(30,12,70,.22),0 2px 6px rgba(30,12,70,.08);
    font-family:inherit;font-size:13.5px;
    scrollbar-width:thin;scrollbar-color:#d4c7ea transparent;
    opacity:0;translate:0 -4px;transition:opacity .14s ease,translate .14s ease,display .14s allow-discrete,overlay .14s allow-discrete}
  select:not([multiple]):not([size]):open::picker(select){opacity:1;translate:0 0}
  @starting-style{ select:not([multiple]):not([size]):open::picker(select){opacity:0;translate:0 -4px} }

  select:not([multiple]):not([size]) option:not([hidden]){display:flex}
  select:not([multiple]):not([size]) option{
    align-items:center;gap:10px;padding:9px 12px;margin:1px 0;border-radius:9px;
    background:transparent !important;color:#1d1230 !important;font-size:13.5px;font-weight:500;line-height:1.35;
    white-space:normal;cursor:pointer;outline:none;transition:background-color .1s,color .1s}
  select:not([multiple]):not([size]) option::checkmark{
    content:"";order:1;margin-left:auto;width:16px;height:16px;flex:0 0 auto;background:var(--sel-acc,#7d3cb5);
    -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/contain no-repeat;
            mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/contain no-repeat}
  select:not([multiple]):not([size]) option:hover,
  select:not([multiple]):not([size]) option:focus-visible{background:var(--sel-hover,#f4eefc) !important;color:var(--sel-txt,#4a1f73) !important}
  select:not([multiple]):not([size]) option:checked{background:var(--sel-on,#efe6fb) !important;color:var(--sel-txt,#4a1f73) !important;font-weight:700}
  select:not([multiple]):not([size]) option:disabled{color:#b0a8c2 !important;cursor:not-allowed;background:transparent !important}
  select:not([multiple]):not([size]) option[value=""]{color:#8a8199 !important;font-style:italic}
  select:not([multiple]):not([size]) option[value=""]:checked{background:transparent !important;font-weight:500}
  select:not([multiple]):not([size]) option[value=""]::checkmark{display:none}
  select:not([multiple]):not([size]) optgroup{padding:0;margin:4px 0 2px}
  select:not([multiple]):not([size]) legend,
  select:not([multiple]):not([size]) optgroup > legend{display:block;padding:8px 12px 4px;font-size:11px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;color:#8a7fa3}
  select:not([multiple]):not([size]) hr{border:0;border-top:1px solid #efe9f7;margin:5px 4px}
}
