.ff-select { --ff-height:36px; --ff-font:14px; --ff-check:16px; --ff-chip:24px; position:relative; min-width:0; font-family:"Segoe UI","Microsoft YaHei",sans-serif; font-size:var(--ff-font); font-weight:400; color:#344054; }
.ff-select-native { display:none; }
.ff-select-control { display:flex; align-items:center; gap:6px; min-height:var(--ff-height); width:100%; border:1px solid #E8EDF5; border-radius:var(--rect-radius,8px); background:#fff; box-sizing:border-box; }
.ff-select-control:focus-within { border-color:#00afe9; }
.ff-select-trigger { flex:1; display:flex; align-items:center; justify-content:center; gap:12px; min-width:0; min-height:calc(var(--ff-height) - 2px); padding:0 12px; border:0; border-radius:var(--rect-radius,8px); background:transparent; color:inherit; font:inherit; cursor:pointer; }
.ff-select-value { flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; text-align:center; }
.ff-select-arrow { width:8px; height:8px; flex:0 0 8px; box-sizing:border-box; border-right:1.5px solid currentColor; border-bottom:1.5px solid currentColor; transform:translateY(-2px) rotate(45deg); transition:transform 160ms ease; color:#667085; }
.ff-select-trigger[aria-expanded="true"] .ff-select-arrow { transform:translateY(2px) rotate(225deg); color:#00afe9; }
.ff-select-menu { position:absolute; z-index:80; top:calc(100% + 6px); left:0; min-width:100%; max-width:min(480px,80vw); padding:6px; box-sizing:border-box; background:#fff; border:1px solid #E8EDF5; border-radius:var(--rect-radius,8px); box-shadow:0 8px 20px rgba(17,24,39,.10); animation:ff-select-open 160ms ease; }
.ff-select-menu[hidden],.ff-select [hidden] { display:none; }
.ff-select-options { max-height:240px; overflow-y:auto; scrollbar-width:thin; scrollbar-color:#d0d5dd transparent; }
.ff-select .ff-select-option { width:100%; display:flex; align-items:center; justify-content:flex-start; gap:8px; min-height:var(--ff-height); padding:6px 12px; border:0; border-radius:var(--rect-radius,8px); background:#fff; color:#344054; font:inherit; font-weight:400; text-align:left; cursor:pointer; }
.ff-select .ff-select-option:hover,.ff-select .ff-select-option:focus-visible,.ff-select .ff-select-option[aria-selected="true"] { background:#F0FAFE; color:#00AFE9; }
.ff-select .ff-select-trigger:focus-visible,.ff-select .ff-select-chip:focus-visible,.ff-select .ff-select-option:focus-visible { outline:1px solid #8cdbf5; outline-offset:2px; }
.ff-select .ff-select-search { width:100%; height:var(--ff-height); margin:0 0 6px; padding:0 12px; box-sizing:border-box; border:1px solid #E8EDF5; border-radius:var(--rect-radius,8px); font:inherit; color:#344054; background:#fff; }
.ff-select-status { margin:0; padding:0 8px; font-size:12px; color:#667085; }
.ff-select-status:not(:empty) { padding-block:8px; }
.ff-select-chips { display:flex; flex-wrap:wrap; gap:6px; min-width:0; padding:5px 0 5px 8px; flex:1; }
.ff-select-multiple:has(.ff-select-chip) .ff-select-trigger { flex:0 0 32px; padding:0 10px; align-self:stretch; }
.ff-select-multiple:has(.ff-select-chip) .ff-select-value { display:none; }
.ff-select .ff-select-chip { display:inline-flex; align-items:center; justify-content:center; min-height:var(--ff-chip); max-width:100%; padding:2px 8px; color:#00afe9; background:#F0FAFE; border:1px solid rgba(0,175,233,.14); border-radius:999px; font:400 12px/16px "Segoe UI","Microsoft YaHei",sans-serif; overflow-wrap:anywhere; cursor:pointer; }
.ff-select-check { display:inline-flex; align-items:center; justify-content:center; width:var(--ff-check); height:var(--ff-check); flex:0 0 var(--ff-check); box-sizing:border-box; border:1px solid #d0d5dd; border-radius:4px; font-size:12px; }
.ff-select-option[aria-selected="true"] .ff-select-check { color:#00afe9; background:#F0FAFE; border-color:#8cdbf5; }
.ff-select button:disabled { opacity:.5; cursor:not-allowed; }
.records-view-controls > .ff-select { width:176px; }
@keyframes ff-select-open { from {opacity:0;transform:translateY(-4px);} to {opacity:1;transform:translateY(0);} }
@media(min-width:1920px) { .ff-select {--ff-height:40px;--ff-font:15px;--ff-check:18px;--ff-chip:26px;} }
@media(min-width:2560px) { .ff-select {--ff-height:44px;--ff-font:16px;--ff-check:20px;--ff-chip:28px;} }
@media(prefers-reduced-motion:reduce) { .ff-select-menu {animation:none;} .ff-select-arrow {transition:none;} }