/* ===== 统一下拉选择 DSEL（与 web/js/dsel.js 配套）=====
 * 令牌全部来自 style.css / mobile.css 的 :root；动效取 --mo-fast / --mo-base / --mo-ease-out。规范：docs/spec/COMPONENTS.md「下拉选择」 */
/* 1) 触发器（原生 select 的收起态）：去掉系统外观，统一青色箭头 */
select[data-dsel]{-webkit-appearance:none;appearance:none;cursor:pointer;padding-right:28px;text-overflow:ellipsis;white-space:nowrap;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none' stroke='%238A9BB0' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 4.5L6 8l3.5-3.5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 10px center;background-size:12px;transition:border-color var(--mo-fast,140ms),box-shadow var(--mo-fast,140ms),background-color var(--mo-fast,140ms)}
select[data-dsel]:hover{background-color:rgba(61,220,232,.035)}
select[data-dsel].ds-open,select[data-dsel][aria-expanded=true]{border-color:rgba(61,220,232,.6);box-shadow:0 0 0 3px rgba(61,220,232,.1);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none' stroke='%233DDCE8' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 7.5L6 4l3.5 3.5'/%3E%3C/svg%3E")}
select[data-dsel]:disabled{opacity:.45;cursor:not-allowed;background-color:rgba(255,255,255,.02)}
select[data-dsel]:focus-visible{border-color:rgba(61,220,232,.6);box-shadow:0 0 0 3px rgba(61,220,232,.14)}
/* 列表框（multiple / size>1）：本来就是展开的列表，只统一配色（选中项青色而不是系统蓝） */
select[multiple],select[size]:not([size="1"]){padding:4px;background-image:none}
select[multiple] option,select[size]:not([size="1"]) option{padding:5px 8px;border-radius:4px;color:var(--text1);background:transparent}
select[multiple] option:checked,select[size]:not([size="1"]) option:checked{background:linear-gradient(rgba(61,220,232,.22),rgba(61,220,232,.22)) !important;color:#fff}
select[multiple]:focus option:checked{box-shadow:inset 2px 0 0 var(--primary)}
/* 2) 桌面浮层 */
.ds-pop{position:fixed;z-index:1200;display:flex;flex-direction:column;padding:4px;box-sizing:border-box;border-radius:8px;
  background:var(--panel-hi,#10203A);border:1px solid var(--line-hi,rgba(90,200,235,.32));
  box-shadow:0 14px 34px rgba(0,0,0,.55),0 0 0 1px rgba(61,220,232,.05),0 0 20px rgba(61,220,232,.07);
  opacity:0;transform:translateY(-6px) scale(.98);transform-origin:top left;pointer-events:auto;
  transition:opacity var(--mo-fast,140ms) var(--mo-ease-out,ease-out),transform var(--mo-base,240ms) var(--mo-ease-out,ease-out)}
.ds-pop.up{transform:translateY(6px) scale(.98);transform-origin:bottom left}
.ds-pop.in{opacity:1;transform:none}
.ds-pop.out{opacity:0;transition-duration:var(--mo-fast,140ms);pointer-events:none}
.ds-l{overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:rgba(148,163,184,.25) transparent}
.ds-o{position:relative;display:flex;align-items:center;gap:8px;min-height:30px;padding:0 10px 0 12px;border-radius:5px;color:var(--text1,#CBD6E3);font-size:12.5px;line-height:1.3;cursor:pointer;user-select:none;transition:background-color var(--mo-fast,140ms),color var(--mo-fast,140ms)}
.ds-o[hidden],.ds-g[hidden],.ds-e[hidden]{display:none}
.ds-tx{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ds-nil{font-style:normal;color:var(--text3,#5A6B80)}
.ds-ck{flex:0 0 auto;opacity:0;color:var(--primary,#3DDCE8);transform:scale(.6);transition:opacity var(--mo-fast,140ms),transform var(--mo-fast,140ms) var(--mo-ease-spring,ease-out)}
.ds-o.act{background:rgba(61,220,232,.10);color:var(--text,#F1F6FB)}
.ds-o.sel{color:var(--primary,#3DDCE8);font-weight:500}
.ds-o.sel::before{content:'';position:absolute;left:3px;top:7px;bottom:7px;width:2px;border-radius:2px;background:var(--primary,#3DDCE8);box-shadow:0 0 8px rgba(61,220,232,.6)}
.ds-o.sel .ds-ck{opacity:1;transform:none}
.ds-o.dis{opacity:.4;cursor:not-allowed}
.ds-g{padding:8px 12px 4px;font-family:var(--mono,monospace);font-size:11px;letter-spacing:.04em;color:var(--text3,#5A6B80);user-select:none}
.ds-s{padding:2px 2px 6px}
.ds-s input{width:100%;height:28px;font-size:12.5px}
.ds-e{padding:16px 10px;text-align:center;font-size:12px;color:var(--text3,#5A6B80)}
/* 3) 手机 H5：底部抽屉 */
.ds-mask{position:fixed;inset:0;z-index:1300;background:rgba(3,6,10,.62);opacity:0;touch-action:none;transition:opacity var(--mo-base,240ms) var(--mo-ease-out,ease-out)}
.ds-mask.in{opacity:1}.ds-mask.out{opacity:0;transition-duration:var(--mo-fast,140ms)}
.ds-sheet{position:absolute;left:0;right:0;bottom:0;max-width:520px;margin:0 auto;max-height:72vh;display:flex;flex-direction:column;box-sizing:border-box;
  padding:6px 12px calc(10px + env(safe-area-inset-bottom,0px));background:var(--panel,#0B1626);border-top:1px solid var(--line-hi,rgba(90,200,235,.32));border-radius:14px 14px 0 0;
  box-shadow:0 -12px 40px rgba(0,0,0,.5),0 -1px 0 rgba(61,220,232,.18);transform:translateY(100%);transition:transform var(--mo-base,240ms) var(--mo-ease-out,ease-out);touch-action:pan-y}
.ds-mask.in .ds-sheet{transform:none}
.ds-mask.out .ds-sheet{transform:translateY(100%);transition-duration:var(--mo-fast,140ms)}
.ds-grab{width:36px;height:4px;border-radius:2px;background:rgba(148,163,184,.3);margin:2px auto 8px}
.ds-hd{display:flex;align-items:center;justify-content:space-between;padding:0 4px 8px;color:var(--text,#F1F6FB);font-size:15px}
.ds-hd b{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ds-x{height:30px;padding:0 6px;border:0;background:transparent;color:var(--muted,#8A9BB0);font-size:14px}
.ds-sheet .ds-s{padding:0 0 8px}.ds-sheet .ds-s input{height:40px;font-size:16px}
.ds-sheet .ds-l{flex:1;min-height:0;-webkit-overflow-scrolling:touch}
.ds-sheet .ds-o{min-height:46px;font-size:15px;padding:0 12px 0 14px;border-radius:8px}
.ds-sheet .ds-o.sel::before{top:11px;bottom:11px;left:4px}
.ds-sheet .ds-g{padding:12px 14px 6px;font-size:12px}