/* 主题语义变量由 styles/tokens.css 提供。 */
    * { box-sizing:border-box; }
    body { margin:0; min-height:100vh; background:var(--bg); color:var(--text); font:14px/1.55 Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; }
    button,input,select,textarea { font:inherit; }
    button { cursor:pointer; min-height:44px; }
    :focus-visible { outline:2px solid var(--focus); outline-offset:3px; }
    .hidden { display:none!important; }
    .login { min-height:100vh; display:grid; place-items:center; padding:24px; background:var(--bg); }
    .card,.panel { border:1px solid var(--line); background:var(--panel); border-radius:var(--radius); box-shadow:0 18px 50px var(--shadow); }
    .card { width:min(430px,100%); padding:34px; }
    .brand { display:flex; align-items:center; gap:12px; }
    .brand-logo { width:64px; height:64px; flex:0 0 64px; object-fit:contain; background:#fff; border-radius:12px; }
    .topbar .brand-logo { width:54px; height:54px; flex-basis:54px; }
    h1,h2,p { margin-top:0; } h1 { margin-bottom:3px; font-size:23px; } h2 { margin-bottom:16px; color:var(--text); font-size:15px; }
    .muted { color:var(--muted); } .mono { font-family:ui-monospace,SFMono-Regular,Menlo,monospace; } .positive { color:var(--success); } .negative { color:var(--danger); }
    .field { display:grid; gap:7px; margin-top:16px; } label { color:var(--text); font-size:13px; font-weight:650; }
    input,select,textarea { width:100%; min-height:44px; padding:11px 13px; color:var(--text); background:var(--control); border:1px solid var(--line-strong); border-radius:12px; }
    textarea { min-height:170px; resize:vertical; }
    input:focus,select:focus,textarea:focus { border-color:var(--muted); box-shadow:0 0 0 3px var(--hover); outline:0; }
    .button { border:1px solid var(--line-strong); border-radius:12px; padding:10px 16px; color:var(--text); background:var(--control); font-weight:700; transition:background .18s ease,opacity .18s ease; }
    .button:hover { background:var(--line-strong); } .button.primary { border:0; background:var(--accent); color:var(--bg); } .button.primary:hover { background:var(--text); }
    .button.danger { border-color:var(--danger-line); color:var(--danger); background:var(--danger-bg); } .button.danger:hover { background:var(--danger-bg); }
    .button:disabled { cursor:not-allowed; opacity:.45; }
    .wide { width:100%; margin-top:18px; }
    .topbar { position:sticky; top:0; z-index:10; border-bottom:1px solid var(--line); background:var(--panel); backdrop-filter:blur(16px); }
    .topbar-inner,main { width:min(1440px,100%); margin:auto; padding-inline:28px; }
    .topbar-inner { min-height:56px; display:flex; align-items:center; gap:14px; } .topbar-inner .actions { margin-left:auto; }
    .shell { display:flex; min-height:100vh; align-items:stretch; }
    .sidebar { position:sticky; top:0; align-self:flex-start; display:flex; flex-direction:column; width:216px; flex:0 0 216px; height:100vh; border-right:1px solid var(--line); background:var(--sidebar); }
    .sidebar-brand { display:flex; gap:10px; align-items:center; padding:14px; border-bottom:1px solid var(--line); }
    .sidebar-brand .brand-logo { width:34px; height:34px; flex-basis:34px; }
    .sidebar-brand .brand-copy strong { display:block; font-size:14px; }
    .sidebar-brand .brand-copy small { display:block; font-size:11px; }
    .view-nav { flex:1; overflow-y:auto; padding:12px 10px; display:flex; flex-direction:column; gap:14px; }
    .view-nav .nav-group { display:flex; flex-direction:column; gap:2px; padding:0; border:0; }
    .nav-group-label { padding:0 10px 4px; color:var(--muted); font-size:11px; font-weight:700; letter-spacing:.04em; }
    .view-tab { display:flex; align-items:center; min-height:38px; border:0; border-radius:8px; padding:0 10px; color:var(--muted); background:transparent; font-weight:600; text-align:left; }
    .view-tab:hover { color:var(--text); background:var(--hover); }
    .view-tab.active { color:var(--text); background:var(--hover); box-shadow:inset 2px 0 0 var(--success); }
    .sidebar-foot { padding:10px 14px; border-top:1px solid var(--line); }
    .shell-main { flex:1; min-width:0; display:flex; flex-direction:column; }
    .view-title { font-size:15px; font-weight:800; }
    .alert-chip { border:1px solid var(--danger-line); background:var(--danger-bg); color:var(--danger); border-radius:999px; padding:6px 12px; font-size:12px; font-weight:700; }
    @media(max-width:900px){ .shell{flex-direction:column;} .sidebar{position:static;width:auto;flex:none;height:auto;border-right:0;border-bottom:1px solid var(--line);} .view-nav{flex-direction:row;overflow-x:auto;padding:8px 10px;gap:10px;} .view-nav .nav-group{flex-direction:row;align-items:center;gap:4px;} .nav-group-label{padding:0 4px;} .sidebar-foot{display:none;} }
    main { padding-block:28px 56px; }
    .actions { display:flex; flex-wrap:wrap; gap:10px; }
    .check-chips { display:flex; flex-wrap:wrap; gap:8px; }
    .check-chip { position:relative; display:inline-flex; min-height:44px; align-items:center; cursor:pointer; }
    .check-chip input { position:absolute; width:1px; height:1px; min-height:0; opacity:0; pointer-events:none; }
    .check-chip span { display:flex; min-height:44px; align-items:center; padding:8px 13px; border:1px solid var(--line-strong); border-radius:10px; background:var(--control); color:var(--text); transition:background .18s ease,border-color .18s ease; }
    .check-chip input:checked + span { border-color:var(--muted); background:var(--text); color:var(--bg); }
    .check-chip input:focus-visible + span { outline:2px solid var(--focus); outline-offset:3px; }
    .capability-summary { margin-top:10px; padding:10px 12px; border:1px solid var(--line); border-radius:10px; background:var(--panel-2); color:var(--muted); font-size:12px; line-height:1.7; }
    .section-head { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; }
    .section-head h2 { margin-bottom:4px; }
    .bulk-bar { display:flex; min-height:52px; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; padding:8px 12px; border:1px solid var(--line); border-radius:10px; background:var(--panel-2); }
    .bulk-bar[hidden] { display:none; }
    .row-check { width:18px; min-height:18px; accent-color:var(--text); }
    .editable-list { display:grid; gap:12px; }
    .editable-item { padding:14px; border:1px solid var(--line); border-radius:10px; background:var(--panel-2); }
    .editable-item-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:12px; }
    .surcharge-row { display:grid; grid-template-columns:minmax(0,1fr) 180px 52px; gap:10px; align-items:end; }
    .inline-checks { display:flex; align-items:center; flex-wrap:wrap; gap:14px; }
    .inline-checks label { display:inline-flex; min-height:44px; align-items:center; gap:7px; }
    .inline-checks input { width:auto; min-height:auto; }
    .matrix-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
    .matrix-table input,.matrix-table textarea { min-width:90px; }
    .matrix-table textarea { min-height:72px; }
    .helper { display:block; margin-top:6px; color:var(--muted); font-size:12px; }
    .grid { display:grid; gap:18px; } .stats { grid-template-columns:repeat(4,minmax(0,1fr)); }
    .stat { padding:20px; } button.stat { width:100%; color:inherit; text-align:left; cursor:pointer; } button.stat:hover { border-color:var(--line-strong); background:var(--panel-2); } .stat span { color:var(--muted); font-size:12px; font-weight:700; } .stat strong { display:block; margin-top:7px; font-size:28px; font-variant-numeric:tabular-nums; } .stat small { color:var(--muted); }
    .view-error { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-bottom:16px; padding:12px 14px; border:1px solid var(--danger-line); border-radius:10px; background:var(--danger-bg); }
    .view-error strong { font-size:13px; color:var(--danger); }
    .view-error p { flex:1 1 240px; margin:0; font-size:13px; color:var(--danger); }
    .alerts { display:grid; gap:10px; margin-bottom:18px; } .alert-row { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; padding:13px 15px; border:1px solid var(--danger-line); border-radius:8px; background:var(--danger-bg); color:var(--danger); } .alert-row.warning { border-color:var(--warning-line); background:var(--warning-bg); color:var(--warning); } .alert-row.info { border-color:var(--line-strong); background:var(--panel-2); color:var(--text); } .alert-row strong { display:block; } .alert-row p { margin:2px 0 0; font-size:13px; } .alert-row .button { flex:0 0 auto; }
    #serviceAlertBar:empty { display:none; }
    .tools { grid-template-columns:repeat(2,minmax(0,1fr)); margin-top:18px; align-items:start; } .panel { min-width:0; padding:22px; }
    .sections { display:grid; min-width:0; gap:18px; margin-top:18px; }
    /* 网格子项的 min-width:auto 会被 table 的 min-width:680px 撑开，把整个视图顶出视口造成横向溢出；
       置 0 后表格改由 .table-wrap 内部横向滚动。dialog 需要保留自身最小宽度，故排除。 */
    .sections > *:not(dialog) { min-width:0; }
    .error,.notice { display:none; margin-bottom:16px; padding:12px 14px; border-radius:12px; }
    .error.show { display:block; border:1px solid var(--danger-line); background:var(--danger-bg); color:var(--danger); }
    .notice.show { display:block; border:1px solid var(--success-line); background:var(--success-bg); color:var(--success); }
    .table-wrap { overflow:auto; max-height:600px; border:1px solid var(--line); border-radius:14px; }
    table { width:100%; border-collapse:collapse; min-width:680px; font-size:13px; } th,td { padding:11px 13px; border-bottom:1px solid var(--line); text-align:left; vertical-align:top; overflow-wrap:anywhere; } tr:last-child td { border:0; } td.right,th.right,.pager span { font-variant-numeric:tabular-nums; } tbody td[colspan] { padding:28px 14px; text-align:center; color:var(--muted); } td.empty-cell { padding:34px 16px; } .empty-cell .empty-icon { display:block; width:26px; height:26px; margin:0 auto 8px; opacity:.55; } .empty-cell strong { display:block; color:var(--text); font-size:13px; } .empty-cell small { display:block; margin-top:4px; font-size:12px; }
    th { color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:0; white-space:nowrap; } .right { text-align:right; }
    .t-fixed { table-layout:fixed; }
    .table-wrap thead th { position:sticky; top:0; z-index:1; background:var(--panel-2); color:var(--text); font-size:12px; font-weight:700; letter-spacing:.02em; box-shadow:inset 0 -1px 0 var(--line); }
    .col-actions { position:sticky; right:0; z-index:1; background:var(--panel); box-shadow:-8px 0 8px -8px var(--shadow); }
    thead th.col-actions { z-index:2; background:var(--panel-2); }
    tbody tr:hover .col-actions { background:var(--panel-2); }
    td.col-actions .actions { flex-direction:row; align-items:center; justify-content:flex-end; flex-wrap:nowrap; gap:6px; }
    td.col-actions .actions .button { width:auto; white-space:nowrap; }
    /* B1: 行内“更多”下拉菜单，避免操作列按钮竖排撑高 */
    .row-menu { position:relative; display:inline-block; }
    .row-menu-toggle { min-width:36px; padding:4px 8px; font-size:15px; line-height:1; }
    .row-menu-panel { display:none; position:fixed; z-index:1000; min-width:132px; padding:6px; border:1px solid var(--line); border-radius:10px; background:var(--hover); box-shadow:0 14px 36px var(--shadow); }
    .row-menu.open .row-menu-panel { display:grid; gap:6px; justify-items:stretch; }
    .row-menu-panel .button { width:100%; text-align:left; }
    tbody tr:has(.row-menu.open) td.col-actions { z-index:25; }
    /* B2: AI 渠道视图子标签页 */
    .sub-tabs { display:flex; flex-wrap:wrap; gap:6px; }
    .sub-tab { display:inline-flex; align-items:center; gap:8px; min-height:40px; border:0; border-radius:8px; padding:6px 14px; color:var(--muted); background:transparent; font-weight:700; transition:color .15s ease,background .15s ease; }
    .sub-tab:hover { color:var(--text); background:var(--panel-2); }
    .sub-tab.active { color:var(--bg); background:var(--text); }
    .sub-tab-count { min-width:22px; padding:1px 7px; border-radius:999px; background:var(--control); color:var(--muted); font-size:11px; text-align:center; font-variant-numeric:tabular-nums; }
    .sub-tab.active .sub-tab-count { background:var(--hover); color:inherit; }
    [data-channel-pane] { display:grid; gap:14px; }
    /* B3: 状态筛选 chips 与客户端分页 */
    .filter-chips { display:flex; flex-wrap:wrap; gap:8px; }
    .filter-chip { display:inline-flex; align-items:center; gap:7px; min-height:36px; padding:4px 12px; border:1px solid var(--line-strong); border-radius:999px; background:transparent; color:var(--muted); font-size:13px; font-weight:600; transition:color .15s ease,border-color .15s ease,background .15s ease; }
    .filter-chip:hover { color:var(--text); border-color:var(--line-strong); }
    .filter-chip.active { color:var(--bg); background:var(--text); border-color:var(--text); }
    .filter-chip-count { padding:0 6px; border-radius:999px; background:var(--control); color:var(--muted); font-size:11px; font-variant-numeric:tabular-nums; }
    .filter-chip.active .filter-chip-count { background:var(--hover); color:inherit; }
    .clip { display:block; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; overflow-wrap:anywhere; }
    .clip-2,.clip-3 { display:-webkit-box; -webkit-box-orient:vertical; overflow:hidden; overflow-wrap:anywhere; }
    .clip-2 { -webkit-line-clamp:2; } .clip-3 { -webkit-line-clamp:3; }
    td.mono-id { max-width:180px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
    .backup-grid { display:grid; grid-template-columns:1.1fr 1fr 1fr 1fr; gap:14px; align-items:end; }
    .form-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:14px; align-items:start; }
    .compact-field { display:grid; gap:7px; } .compact-field input,.compact-field select { min-height:44px; } .compact-field.field-actions { align-content:end; }
    .status { display:inline-flex; align-items:center; min-height:24px; padding:2px 8px; border:1px solid var(--line); border-radius:6px; color:var(--muted); font-size:12px; font-weight:700; }
    .status.completed { border-color:var(--success-line); color:var(--success); } .status.failed { border-color:var(--danger-line); color:var(--danger); } .status.running,.running { color:var(--warning); }
    .status.on { border-color:var(--success-line); color:var(--success); } .status.off { border-color:var(--line-strong); color:var(--muted); } .status.arch { border-color:var(--warning-line); color:var(--warning); }
    .code-summary { display:flex; flex-wrap:wrap; gap:10px; padding:12px 0; color:var(--muted); font-size:13px; } .code-summary strong { color:var(--text); font-variant-numeric:tabular-nums; }
    .code-summary button { display:inline-flex; align-items:center; gap:7px; min-height:38px; padding:6px 14px; border:1px solid var(--line); border-radius:10px; background:var(--panel-2); color:inherit; font-size:13px; transition:border-color .15s ease,background .15s ease; }
    .code-summary button:hover { border-color:var(--line-strong); }
    .code-summary button.active { border-color:var(--text); background:var(--text); color:var(--bg); }
    .pager { display:flex; align-items:center; justify-content:flex-end; gap:12px; } details>summary { cursor:pointer; color:var(--text); font-weight:700; }
    dialog { width:min(1080px,calc(100% - 28px)); max-height:calc(100vh - 28px); padding:0; color:var(--text); background:var(--panel); border:1px solid var(--line); border-radius:8px; box-shadow:0 24px 80px var(--shadow); }
    dialog::backdrop { background:var(--shadow); } .dialog-head { position:sticky; top:0; z-index:2; display:flex; align-items:flex-start; justify-content:space-between; gap:16px; padding:20px 22px; border-bottom:1px solid var(--line); background:var(--panel); }
    .dialog-body { display:grid; gap:20px; padding:22px; } .dialog-actions { position:sticky; bottom:0; display:flex; flex-wrap:wrap; gap:10px; padding:16px 22px; border-top:1px solid var(--line); background:var(--panel); } .icon-button { width:44px; min-width:44px; padding:0; font-size:22px; }
    .management-dialog { width:min(1120px,calc(100% - 28px)); } .management-dialog form { margin:0; } .form-feedback { margin:0; }
    .detail-summary { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1px; overflow:hidden; border:1px solid var(--line); border-radius:8px; background:var(--line); } .detail-summary>div { min-width:0; padding:14px; background:var(--panel-2); } .detail-summary small { display:block; color:var(--muted); } .detail-summary strong { display:block; margin-top:4px; overflow-wrap:anywhere; }
    .view-hidden { display:none!important; } .json-detail { max-width:100%; max-height:240px; overflow:auto; margin:8px 0 0; white-space:pre-wrap; overflow-wrap:anywhere; word-break:break-all; color:var(--text); font:12px/1.55 ui-monospace,SFMono-Regular,Menlo,monospace; } .secret-value { min-height:104px; word-break:break-all; } .inline-secret { display:block; max-width:360px; overflow-wrap:anywhere; }
    @media(max-width:1000px) { .stats,.tools,.backup-grid,.form-grid,.detail-summary,.matrix-grid { grid-template-columns:1fr 1fr; } }
    @media(max-width:680px) { .stats,.tools,.backup-grid,.form-grid,.detail-summary,.matrix-grid,.surcharge-row { grid-template-columns:1fr; } .topbar { max-width:100vw; overflow-x:clip; } .topbar-inner,main { padding-inline:16px; } .view-tabs { width:100vw; max-width:100vw; padding-inline:16px; } .topbar-inner,.section-head { align-items:flex-start; padding-block:12px; } .topbar-inner,.section-head { flex-direction:column; } .topbar-inner>.brand { width:100%; min-width:0; } .brand-copy strong { white-space:nowrap; } .brand-copy small { display:none; } .topbar-inner>.actions { width:100%; justify-content:flex-start; } .nav-group-label { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); } .alert-row { flex-direction:column; } .alert-row .button { width:100%; } .bulk-bar { position:sticky; bottom:calc(8px + env(safe-area-inset-bottom)); z-index:8; box-shadow:0 8px 30px var(--shadow); } table:has(#usersBody),table:has(#modelProductsBody),table:has(#channelsBody),table:has(#connectionsBody),table:has(#auditBody),table:has(#attemptsBody) { min-width:520px; } table:has(#usersBody) :is(th,td):nth-child(2),table:has(#usersBody) :is(th,td):nth-child(4),table:has(#usersBody) :is(th,td):nth-child(5),table:has(#usersBody) :is(th,td):nth-child(7) { display:none; } table:has(#modelProductsBody) :is(th,td):nth-child(3),table:has(#modelProductsBody) :is(th,td):nth-child(4),table:has(#modelProductsBody) :is(th,td):nth-child(5) { display:none; } table:has(#channelsBody) :is(th,td):nth-child(4),table:has(#channelsBody) :is(th,td):nth-child(5),table:has(#channelsBody) :is(th,td):nth-child(6) { display:none; } table:has(#connectionsBody) :is(th,td):nth-child(2),table:has(#connectionsBody) :is(th,td):nth-child(3) { display:none; } table:has(#auditBody) :is(th,td):nth-child(4),table:has(#auditBody) :is(th,td):nth-child(5),table:has(#attemptsBody) :is(th,td):nth-child(3),table:has(#attemptsBody) :is(th,td):nth-child(5) { display:none; } }
    @media(prefers-reduced-motion:reduce) { * { transition-duration:.01ms!important; } }
    /* A4: 表格内按钮紧凑化 */
    td .button { min-height:30px; padding:4px 10px; font-size:12px; border-radius:8px; }
    /* A2: 表格行悬停高亮 */
    tbody tr { transition:background .12s ease; } tbody tr:hover { background:var(--hover); }
    /* F1: 顶部加载进度条 */
    #progressBar { position:fixed; top:0; left:0; right:0; z-index:999; height:2px; background:linear-gradient(90deg,var(--focus),var(--warning),var(--focus)); background-size:200% 100%; animation:shimmer 1.2s linear infinite; opacity:0; transition:opacity .2s; pointer-events:none; }
    #progressBar.active { opacity:1; }
    @keyframes shimmer { to { background-position:-200% 0; } }
    /* A6: Toast 通知 */
    #toastContainer { position:fixed; top:72px; right:16px; z-index:1000; display:flex; flex-direction:column; gap:8px; pointer-events:none; }
    .toast { pointer-events:auto; max-width:380px; padding:12px 16px; border-radius:10px; font-size:13px; font-weight:600; box-shadow:0 8px 30px var(--shadow); animation:toastIn .2s ease; transition:opacity .3s,transform .3s; }
    .toast.error { border:1px solid var(--danger-line); background:var(--danger-bg); color:var(--danger); }
    .toast.notice { border:1px solid var(--success-line); background:var(--success-bg); color:var(--success); }
    .toast.error { display:flex; align-items:flex-start; gap:10px; }
    .toast-close { flex:0 0 auto; border:0; width:24px; min-width:24px; min-height:24px; padding:0; color:inherit; background:transparent; font-size:16px; line-height:1; }
    .toast.out { opacity:0; transform:translateX(12px); }
    @keyframes toastIn { from { opacity:0; transform:translateY(-8px); } }
    /* A5: 表单分组 fieldset */
    fieldset { border:1px solid var(--line); border-radius:10px; padding:16px; margin:0; }
    legend { padding:0 8px; color:var(--muted); font-size:12px; font-weight:700; letter-spacing:.02em; }
    /* A1: 统计卡片图标 */
    .stat { position:relative; } .stat-icon { position:absolute; top:16px; right:16px; width:20px; height:20px; color:var(--line-strong); }
    /* A3+A9: Tab过渡动画 */
    .view-tab { transition:color .15s ease,background .15s ease; }
    [data-view] { animation:viewIn .18s ease; }
    @keyframes viewIn { from { opacity:0; transform:translateY(6px); } }
    /* A10: 字体层级增强 */
    .sections h2 { font-size:16px; letter-spacing:-.01em; }
    .stat span { text-transform:uppercase; letter-spacing:.04em; }
    /* 对话框内矩阵表限高 */
    dialog .table-wrap { max-height:360px; }
    .pager select,.pager input { width:auto; min-height:38px; padding:6px 10px; }
    .pager .muted { white-space:nowrap; }
    /* 用户记录筛选与详情排版 */
    .user-record-tools { display:grid; grid-template-columns:repeat(auto-fit,minmax(135px,1fr)); gap:10px; margin:12px 0; }
    .user-record-tools label { display:grid; gap:6px; font-size:13px; }
    .user-record-tools input,.user-record-tools select { min-height:44px; }
    .record-page { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin:10px 0; }
    .record-page p { flex:1 1 240px; margin:0; }
    .record-full { white-space:pre-wrap; overflow-wrap:anywhere; max-height:360px; overflow-y:auto; margin:8px 0; }
    .record-id { display:block; overflow-wrap:anywhere; white-space:normal; }
    .record-detail { margin:8px 0; }