/* ============ AIFDE M4 闭环补全（2026-09-17） ============
   新增样式全部走既有令牌，不引入新色值。
   注意：状态一律「图标+文字+颜色」三重编码 —— 品牌状态三色
   #3E8E5A/#1276FF/#FA3522 在色盲模拟下可辨性不达标（ΔE 2.1，protan），
   单靠颜色区分不出来，所以每处状态都必须带文字。 */
.af-alert{border:1px solid var(--accent-line);background:var(--accent-soft);border-radius:var(--r);padding:12px 16px;margin-bottom:14px}
.af-alert-h{display:flex;align-items:center;gap:8px;font-size:var(--fs-sm);font-weight:700;color:var(--gold-deep);cursor:pointer;user-select:none}
.af-alert-h .cnt{background:var(--gold-deep);color:#fff;border-radius:20px;padding:0 8px;font-size:var(--fs-cap);line-height:18px;font-weight:700}
.af-alert-h .tog{margin-left:auto;font-size:var(--fs-cap);font-weight:600;color:var(--ink-3)}
.af-alert-b{margin-top:10px;display:none}
.af-alert.open .af-alert-b{display:block}
.af-alert-row{display:flex;align-items:flex-start;gap:9px;padding:7px 0;border-top:1px dashed var(--border-strong);font-size:var(--fs-xs);color:var(--ink-2)}
.af-alert-row:first-child{border-top:none}
.af-alert-row .k{font-weight:700;color:var(--ink-1);flex-shrink:0;width:96px}
.af-alert-row .v{flex:1;min-width:0;line-height:1.75}
.af-alert-row .v b{color:var(--ink-1)}
.af-alert-row .v .it{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:inline-block;max-width:100%;vertical-align:bottom}

/* 停滞标：与 48h 徽章同款三重编码 */
.af-stag{display:inline-flex;align-items:center;gap:4px;font-size:var(--fs-cap);font-weight:600;padding:1px 7px;border-radius:10px;
  background:var(--panel-3);color:var(--ink-2);white-space:nowrap}
.af-stag.warn{background:rgba(18,118,255,.15);color:var(--gold-deep)}

/* 总览条形图：单一色相 + 右端数值，不做多色分类 */
.af-bars{display:flex;flex-direction:column;gap:3px;margin-top:10px}
.af-bar-row{display:grid;grid-template-columns:110px minmax(0,1fr) 38px;align-items:center;gap:10px}
.af-bar-row .n{font-size:var(--fs-cap);color:var(--ink-3);text-align:right;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.af-bar-row .t{height:16px;display:flex;align-items:center}
.af-bar-row .b{height:16px;border-radius:0 4px 4px 0;background:var(--gold);min-width:3px;transition:width .4s}
.af-bar-row .b.navy{background:var(--navy)}
.af-bar-row .b.down{background:var(--down)}
.af-bar-row .v{font-size:var(--fs-cap);font-weight:700;color:var(--ink-1);font-variant-numeric:tabular-nums}
.af-empty{font-size:var(--fs-cap);color:var(--ink-4);padding:14px 0;text-align:center}
.af-kv{display:flex;align-items:baseline;gap:8px;padding:6px 0;border-bottom:1px dashed var(--border-strong);font-size:var(--fs-xs)}
.af-kv:last-child{border-bottom:none}
.af-kv .k{flex:1;min-width:0;color:var(--ink-2);overflow:hidden;text-overflow:ellipsis}
.af-kv .v{font-weight:700;color:var(--ink-1);font-variant-numeric:tabular-nums;flex-shrink:0}

/* ============ AIFDE 三栏工作台框架（M5 提档升级 2026-09-17） ============
   左：子导航 + 迷你KPI   中：5 个 view-af-* 视图   右：实时上下文面板
   纪律（针对演示页的四条毛病刻意反着做）：
     ① 左右栏各自 sticky + 独立滚动，中栏随页面滚 —— 不把整页拖长；
     ② 右栏时间轴跟着"当前选中项目"走，不是永远高亮第 4 步的死面板；
     ③ <1200px 右栏不 display:none，改横排摘要条，48h 规则不消失；
     ④ 选择器一律 af- 前缀，不污染其它板块。 */
.af-frame{display:grid;grid-template-columns:minmax(0,1fr) 292px;gap:18px;align-items:start}

/* 左栏：子导航复用 .nav[data-view]，showView 会自动切 .active，零新增点击 JS。
   注意不能沿用侧栏的 .side nav a.nav 样式（作用域在 .side 内），此处自带一份。 */
.af-rail{position:sticky;top:74px;display:flex;flex-direction:column;gap:2px}
.af-rail-h{font-size:var(--fs-cap);color:var(--ink-4);letter-spacing:2px;padding:0 10px 8px;font-weight:700}
.af-rail .nav{display:flex;align-items:center;gap:9px;padding:9px 12px;border-radius:var(--r-sm);font-size:var(--fs-sm);
  color:var(--ink-2);cursor:pointer;border:1px solid transparent;transition:all .15s}
.af-rail .nav:hover{background:var(--panel-2);color:var(--ink-1)}
.af-rail .nav.active{background:var(--accent-soft);border-color:var(--accent-line);color:var(--gold-deep);font-weight:700}
.af-rail-kpi{margin-top:14px;border-top:1px dashed var(--border-strong);padding-top:12px;display:flex;flex-direction:column;gap:7px}
.af-kpi{display:flex;align-items:baseline;justify-content:space-between;gap:8px;padding:0 10px}
.af-kpi .k{font-size:var(--fs-cap);color:var(--ink-3)}
.af-kpi .v{font-size:var(--fs-md);font-weight:800;color:var(--ink-1);font-variant-numeric:tabular-nums}
.af-kpi .v.warn{color:var(--gold-deep)}
.af-kpi .v.alarm{color:var(--down)}

/* 右栏：sticky + 自身滚动，长内容不把整页顶长 */
.af-context{position:sticky;top:74px;max-height:calc(100dvh - 96px);overflow-y:auto;overscroll-behavior:contain}
.af-context::-webkit-scrollbar{width:4px}
.af-context::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:2px}
.af-context .card{margin-bottom:12px}
.af-context .card:last-child{margin-bottom:0}

/* 48h 军令状 */
.af-promise{background:linear-gradient(135deg,rgba(18,118,255,.10),rgba(18,118,255,.08));border:1px solid var(--accent-line)}
.af-promise .big{font-size:30px;font-weight:800;color:var(--gold-deep);line-height:1.1;letter-spacing:-1px}
.af-promise .big small{font-size:var(--fs-cap);font-weight:600;letter-spacing:0;margin-left:4px}

/* 10 步实时时间轴 */
.af-tl{display:flex;flex-direction:column;margin-top:10px}
.af-tl-i{display:flex;gap:10px;position:relative;padding:6px 0}
.af-tl-i::before{content:"";position:absolute;left:11px;top:26px;bottom:-6px;width:2px;background:var(--border-strong)}
.af-tl-i:last-child::before{display:none}
.af-tl-n{width:23px;height:23px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;
  font-size:var(--fs-cap);font-weight:700;background:var(--panel-2);color:var(--ink-4);border:1px solid var(--border)}
.af-tl-i.done .af-tl-n{background:rgba(62,142,90,.14);color:#3E8E5A;border-color:rgba(62,142,90,.32)}
.af-tl-i.cur .af-tl-n{background:var(--gold);color:#fff;border-color:var(--gold);box-shadow:0 0 0 3px var(--accent-soft)}
.af-tl-t{flex:1;min-width:0;padding-top:1px}
.af-tl-t b{font-size:var(--fs-xs);color:var(--ink-2);display:block;font-weight:600}
.af-tl-i.cur .af-tl-t b{color:var(--gold-deep);font-weight:800}
.af-tl-t span{font-size:var(--fs-cap);color:var(--ink-4)}
/* ============ AIFDE 对标演示稿 1:1 复刻（2026-09-17 深夜定稿）：除配色与左侧导航外，结构与动效同演示稿 ============ */
@keyframes afFadeUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes afPop{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}
@keyframes afGlow{0%,100%{box-shadow:0 0 16px 4px var(--accent-soft)}50%{box-shadow:0 0 26px 8px var(--accent-soft)}}
@keyframes afFadeIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
#view-af-board,#view-af-detail,#view-af-deliv,#view-af-aftersale,#view-af-pay,#view-af-train,#view-af-maintain,#view-af-overview{animation:afFadeIn .3s ease}
/* 页头（demo .header/.page-title：28px/700/-0.5px，副标题 14px） */
#view-af-board .pagehead{margin-bottom:28px}
#view-af-board .pagehead h1{font-size:28px;font-weight:700;letter-spacing:-.5px}
#view-af-board .pagehead p{font-size:var(--fs-base);margin-top:4px}
#view-af-board .pagehead .actions .btn{padding:10px 20px;border-radius:10px;font-size:var(--fs-base)}
#view-af-board .pagehead .actions .btn-sm{padding:6px 12px;font-size:var(--fs-cap)}
/* 统计卡（demo .stats-grid/.stat-card：gap16/mb28，radius16/padding20，顶条3px，值32px） */
.af-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:28px}
.af-stat{position:relative;overflow:hidden;background:var(--bg);border:1px solid var(--border-strong);border-radius:16px;padding:20px;animation:afPop .5s cubic-bezier(.16,1,.3,1) both}
.af-stat::before{content:"";position:absolute;top:0;left:0;width:100%;height:3px;background:linear-gradient(90deg,var(--gold),var(--gold-deep));opacity:.7}
.af-stat:nth-child(2)::before{background:linear-gradient(90deg,#3E8E5A,#7CC49A)}
.af-stat:nth-child(3)::before{background:linear-gradient(90deg,#1276FF,#E8C06A)}
.af-stat:nth-child(4)::before{background:linear-gradient(90deg,#FA3522,#F58A9E)}
.af-stat:nth-child(2){animation-delay:.06s}.af-stat:nth-child(3){animation-delay:.12s}.af-stat:nth-child(4){animation-delay:.18s}
.af-stat .k{font-size:var(--fs-sm);color:var(--ink-3);margin-bottom:8px}
.af-stat .v{font-size:32px;font-weight:700;letter-spacing:-.5px;margin-bottom:4px;line-height:1.1;color:var(--ink-1)}
.af-stat .s{font-size:var(--fs-cap);color:#3E8E5A;margin-top:2px}
/* 区块（demo .section：radius16/padding22/mb20；标题 16px/600） */
.af-section{background:var(--bg);border:1px solid var(--border-strong);border-radius:16px;padding:22px;margin-bottom:20px}
.af-sechead{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px;flex-wrap:wrap;gap:10px}
.af-sectitle{font-size:var(--fs-md);font-weight:600;margin:0}
/* 筛选标签（demo .filter-tab：6/14px、圆角20、hover+active 同底） */
.af-tabs{display:flex;gap:8px;flex-wrap:wrap}
.af-tab{padding:6px 14px;border-radius:20px;font-size:var(--fs-cap);cursor:pointer;transition:all .2s;color:var(--ink-3);background:var(--panel-2);border:1px solid transparent;user-select:none}
.af-tab:hover,.af-tab.on{background:var(--accent-soft);color:var(--gold-deep);border-color:var(--accent-line)}
.af-tab.on{font-weight:700}
/* 项目行（demo .project-item：grid 1fr auto auto auto、gap16/padding16、radius12、行点进详情） */
.af-projlist{display:flex;flex-direction:column;gap:12px}
.af-proj{display:grid;grid-template-columns:minmax(0,1fr) auto auto auto;align-items:center;gap:16px;padding:16px;background:var(--panel-2);border-radius:12px;border:1px solid transparent;cursor:pointer;transition:all .2s;animation:afFadeUp .3s ease both}
.af-proj:hover{background:var(--accent-soft);border-color:var(--accent-line)}
.af-proj .nm{font-size:var(--fs-base);font-weight:600;margin-bottom:4px;color:var(--ink-1);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.af-proj .mt{font-size:var(--fs-cap);color:var(--ink-4)}
/* 徽章（demo .badge：4/10px、圆角20、11px） */
.af-badge{padding:4px 10px;border-radius:20px;font-size:var(--fs-cap);font-weight:600;white-space:nowrap;border:1px solid transparent}
.af-badge.easy{background:rgba(62,142,90,.16);color:#3E8E5A;border-color:rgba(62,142,90,.35)}
.af-badge.std{background:rgba(18,118,255,.16);color:#0B5BD8;border-color:rgba(18,118,255,.35)}
.af-badge.phase{background:rgba(18,118,255,.16);color:#0B5BD8;border-color:rgba(18,118,255,.35)}
/* 倒计时/进度（demo .countdown 18px/.progress-mini 120x6） */
.af-progwrap{display:flex;align-items:center;gap:12px}
.af-prog{width:120px;height:6px;background:var(--panel-3);border-radius:3px;overflow:hidden;flex-shrink:0}
.af-prog i{display:block;height:100%;background:linear-gradient(90deg,var(--gold),var(--gold-deep));border-radius:3px;transition:width .3s}
.af-cd{text-align:right;min-width:100px}
.af-cd .v{font-size:var(--fs-lg);font-weight:700;color:var(--gold-deep);line-height:1.2}
.af-cd .l{font-size:var(--fs-cap);color:var(--ink-4);margin-top:1px}
/* 承诺盒（demo .promise-box：radius16/padding18/mb24，48H 水印 80px） */
.af-promise{position:relative;overflow:hidden;border-radius:16px;padding:18px;margin-bottom:24px}
.af-promise::after{content:"48H";position:absolute;right:-10px;top:-20px;font-size:80px;font-weight:800;letter-spacing:-4px;color:var(--gold-deep);opacity:.1;pointer-events:none}
.af-promise .pt{font-size:var(--fs-base);font-weight:700;margin-bottom:8px;color:var(--gold-deep)}
.af-promise .px{font-size:var(--fs-sm);color:var(--ink-2);line-height:1.6}
.af-promise .pn{font-size:var(--fs-cap);color:var(--ink-4);margin-top:10px;padding-top:10px;border-top:1px dashed var(--border-strong)}
/* 时间轴（demo .timeline：左线渐变、点18px/2px 边、内容盒 radius10/padding12 14、active 辉光、completed 绿） */
.af-tl{position:relative;padding-left:28px;display:block;margin-top:10px}
.af-tl::before{content:"";position:absolute;left:8px;top:6px;bottom:6px;width:2px;background:linear-gradient(180deg,var(--gold),rgba(18,118,255,.18))}
.af-tl-i{position:relative;padding-bottom:14px;cursor:pointer;transition:opacity .2s}
.af-tl-i:hover{opacity:.9}
.af-tl-i::before{display:none}
.af-tl-n{position:absolute;left:-26px;top:2px;width:18px;height:18px;border-radius:50%;background:var(--panel);border:2px solid var(--gold);display:flex;align-items:center;justify-content:center;font-size:var(--fs-cap);font-weight:700;color:var(--gold-deep);box-sizing:border-box}
.af-tl-i.done .af-tl-n{background:#3E8E5A;border-color:#3E8E5A;color:#fff}
.af-tl-i.cur .af-tl-n{background:var(--gold);border-color:var(--gold);color:#fff;box-shadow:0 0 16px rgba(18,118,255,.55)}
.af-ctx-tl .af-tl-i.cur .af-tl-n{animation:afGlow 2.4s ease-in-out infinite}
.af-tl-c{background:var(--panel-2);border-radius:10px;padding:12px 14px;border:1px solid transparent}
.af-tl-i.cur .af-tl-c{background:var(--accent-soft);border-color:var(--accent-line)}
.af-tl-t b{font-size:var(--fs-base);font-weight:600;color:var(--ink-1);display:block}
.af-tl-t span{font-size:var(--fs-cap);color:var(--ink-4);margin-top:4px;display:block}
/* 维保盒（demo .maintenance-box：dashed 边、radius12） */
.af-maint{margin-top:24px;padding:16px;background:var(--panel-2);border-radius:12px;border:1px dashed var(--accent-line)}
.af-maint .t{font-size:var(--fs-base);font-weight:600;display:block;margin-bottom:6px}
.af-maint .tx{font-size:var(--fs-cap);color:var(--ink-3);line-height:1.6}
/* 右栏面板头（demo .panel-title 18px/.panel-subtitle 13px） */
.af-context .panel-title{font-size:var(--fs-lg);font-weight:700;margin-bottom:8px;color:var(--ink-1)}
.af-context .panel-subtitle{font-size:var(--fs-sm);color:var(--ink-4);margin-bottom:24px}
@media(max-width:1200px){.af-stats{grid-template-columns:repeat(2,1fr)}.af-proj{grid-template-columns:minmax(0,1fr) auto auto}.af-proj .af-progwrap .af-prog{display:none}}

/* 右栏提醒汇总（可点跳转） */
.af-ctx-al{display:flex;align-items:center;gap:8px;padding:8px 0;border-bottom:1px dashed var(--border-strong);
  font-size:var(--fs-xs);color:var(--ink-2);cursor:pointer}
.af-ctx-al:last-child{border-bottom:none}
.af-ctx-al:hover{color:var(--gold-deep)}
.af-ctx-al .c{margin-left:auto;font-weight:800;font-variant-numeric:tabular-nums;color:var(--ink-1)}
.af-ctx-al.zero{color:var(--ink-4);cursor:default}

/* ===== 1:1 补齐（2026-09-17 深夜）：右侧详情抽屉 + AIFDE 客户池（对标演示稿 .drawer/.client-card） ===== */
.af-drawer-ov{display:none;position:fixed;inset:0;background:rgba(20,8,16,.5);z-index:900}
.af-drawer-ov.active{display:block}
.af-drawer{position:fixed;right:0;top:0;width:600px;max-width:94vw;height:100%;background:var(--bg);
  border-left:1px solid var(--border-strong);z-index:910;transform:translateX(100%);transition:transform .3s ease;
  overflow-y:auto;padding:26px 28px 40px;box-shadow:-24px 0 80px rgba(16,30,69,.25)}
.af-drawer.open{transform:translateX(0)}
.af-drawer-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:20px;flex-wrap:wrap}
.af-drawer-x{width:36px;height:36px;border-radius:10px;border:1px solid var(--border-strong);background:var(--panel-2);
  color:var(--ink-2);cursor:pointer;font-size:var(--fs-lg);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.af-drawer-x:hover{color:var(--ink-1);border-color:var(--gold)}
.af-client-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}
.af-client{background:var(--panel-2);border-radius:12px;padding:18px;border:1px solid transparent;cursor:pointer;transition:all .2s;animation:afFadeUp .3s ease both}
.af-client:hover{background:var(--accent-soft);border-color:var(--accent-line)}
.af-client .nm{font-size:var(--fs-base);font-weight:600;margin-bottom:4px;color:var(--ink-1)}
.af-client .ct{font-size:var(--fs-cap);color:var(--ink-4);margin-bottom:10px}
.af-client .tg{display:flex;gap:6px;flex-wrap:wrap}
/* 抽屉内容（1:1 对标演示稿 .stage-timeline/.stage-item/.drawer-header） */
.af-drawer .drawer-title{font-size:var(--fs-lg);font-weight:700;color:var(--ink-1);margin:0 0 4px;line-height:1.3}
.af-drawer .drawer-subtitle{font-size:var(--fs-sm);color:var(--ink-4);margin:0}
.af-d-info3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.af-d-info3 .k{font-size:var(--fs-cap);color:var(--ink-4)}
.af-d-info3 .v{font-size:var(--fs-base);font-weight:600;margin-top:4px;color:var(--ink-1)}
.af-stage-tl{margin-top:18px}
.af-stage-i{display:flex;gap:16px;padding:16px 0;border-bottom:1px solid var(--border)}
.af-stage-i:last-child{border-bottom:none}
.af-stage-n{width:32px;height:32px;border-radius:50%;background:var(--accent-soft);border:1px solid var(--border-strong);
  display:flex;align-items:center;justify-content:center;font-weight:700;font-size:var(--fs-sm);flex-shrink:0;color:var(--gold-deep);box-sizing:border-box}
.af-stage-i.done .af-stage-n{background:#3E8E5A;border-color:#3E8E5A;color:#fff}
.af-stage-i.cur .af-stage-n{background:var(--gold);border-color:var(--gold);color:#fff;box-shadow:0 0 16px rgba(18,118,255,.5)}
.af-stage-t{flex:1;min-width:0}
.af-stage-t h4{font-size:var(--fs-base);font-weight:600;margin:0 0 4px;color:var(--ink-1)}
.af-stage-t p{font-size:var(--fs-cap);color:var(--ink-4);margin:0}
.af-stage-s{margin-left:auto;font-size:var(--fs-cap);padding:4px 10px;border-radius:20px;background:var(--panel-2);flex-shrink:0;height:fit-content;color:var(--ink-3);white-space:nowrap}
.af-stage-i.done .af-stage-s{background:rgba(62,142,90,.15);color:#3E8E5A}
.af-stage-i.cur .af-stage-s{background:var(--accent-soft);color:var(--gold-deep);font-weight:600}
/* 2026-09-18 时间轴步间推进：每两步之间一个 ▼，当前步正下方的是可点推进按钮（单步推进，与底部按钮同一接口） */
.af-gap{display:flex;align-items:center;justify-content:center;min-height:20px;margin:4px 0;color:var(--ink-4);font-size:var(--fs-cap);user-select:none}
.af-gap .tri{font-size:var(--fs-cap);line-height:1;opacity:.5}
.af-gap-act{cursor:pointer;gap:6px;background:var(--accent-soft);color:var(--gold-deep);border:1px dashed var(--accent-line);
  border-radius:999px;padding:4px 16px;font-size:var(--fs-cap);font-weight:600;transition:all .15s}
.af-gap-act .tri{opacity:.9;font-size:var(--fs-cap)}
.af-gap-act:hover{background:var(--gold);border-style:solid;color:#fff}
.af-gap-act:hover .tri{opacity:1}
.af-ctx-al.zero:hover{color:var(--ink-4)}
.af-ctx-al.zero .c{color:var(--ink-4);font-weight:600}

/* 规则说明（默认收起，点击标题展开） */
.af-rules{margin-top:8px;display:none;font-size:var(--fs-cap);color:var(--ink-2);line-height:2}
.af-rules.open{display:block}
.af-rules b{color:var(--ink-1)}
.af-rules-t{display:flex;align-items:center;gap:6px;cursor:pointer;user-select:none;font-size:var(--fs-sm);font-weight:700;color:var(--navy)}
.af-rules-t .tog{margin-left:auto;font-size:var(--fs-cap);font-weight:600;color:var(--ink-3)}

/* 响应式：先收窄，再把右栏横排成摘要条（核心业务规则不消失） */
@media(max-width:1500px){.af-frame{grid-template-columns:minmax(0,1fr) 264px;gap:14px}}
@media(max-width:1200px){
  .af-frame{grid-template-columns:minmax(0,1fr)}
  .af-rail{position:static;flex-direction:row;flex-wrap:wrap;align-items:center;gap:6px}
  .af-rail-h{display:none}
  .af-rail-kpi{flex-direction:row;flex-wrap:wrap;gap:14px;margin:0 0 0 auto;border-top:none;padding-top:0}
  .af-rail-kpi .af-kpi{padding:0;gap:6px}
  .af-context{position:static;max-height:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:start}
  .af-context .card{margin-bottom:0}
  .af-ctx-tl,.af-ctx-mt{display:none}
}
@media(max-width:760px){.af-context{grid-template-columns:1fr}}

/* ═════════ 家族化设计语言版增强（2026-09-23）：深空蓝侧栏 + KPI 深色数据卡（模板A移植） ═════════ */
/* 2026-09-24 对标 V8 静态模板还原：亮品牌蓝 #0E5ED0 → 深空蓝 #102E69（原为近黑三段深空蓝） */
.side{background:var(--side-bg,linear-gradient(180deg,#0E5ED0 0%,#102E69 100%))}
/* 2026-09-24 对标 V8 参考稿：KPI 卡改回浅色白卡
   （原为 #050A1E→#101E45→#1A2F6E 深空蓝渐变深卡，与参考稿白底卡片不符）
   深色 KPI 只保留在山岚夜行 / 鎏金庆典两个深色主题里，见下方 body.t-* 段 */
.kpi{background:var(--bg,#FFFFFF);border-color:var(--border,rgba(16,30,69,.08));position:relative;overflow:hidden}
.kpi::after{background:radial-gradient(circle,rgba(18,118,255,.10),transparent 70%);opacity:.55}
.kpi .klabel{color:var(--ink-3,#878D98)}
.kpi .knum{color:var(--ink-1,#1A1A1A)}
.kpi .knum small{color:var(--ink-3,#878D98)}
.kpi .ksub{color:var(--ink-4,#7A828F)}
.kpi .kicon{background:rgba(18,118,255,.10);color:var(--blue,#1276FF)}
.kpi .kicon.blue{background:rgba(18,118,255,.10);color:var(--blue,#1276FF)}
.kpi .kicon.green{background:rgba(62,142,90,.10);color:#2A9D8F}
.kpi .kicon.gold{background:rgba(255,143,31,.12);color:#C66B0D}
.kpi .kicon.red{background:rgba(250,53,34,.08);color:var(--down,#FA3522)}
.kpi .delta{background:rgba(18,118,255,.09);color:var(--blue,#1276FF)}
.kpi .delta.up{background:rgba(62,142,90,.10);color:#2A9D8F}
.kpi .delta.down{background:rgba(250,53,34,.08);color:var(--down,#FA3522)}
/* 蓝底统一白字（家族化主行动） */
.af-tl-i.cur .af-tl-n,.af-stage-i.cur .af-stage-n,.af-gap-act:hover,.login-btn{color:var(--on-accent)}
.af-tl-i.cur .af-tl-n{box-shadow:0 0 16px rgba(18,118,255,.55)}
.af-stage-i.cur .af-stage-n{box-shadow:0 0 16px rgba(18,118,255,.50)}
.login-btn{box-shadow:0 6px 18px rgba(18,118,255,.40)}
/* ═════════ 山岚夜行主题（2026-09-23，body.t-sl）：深夜靛蓝底盘 + 琥珀金高光 + 玫紫 AI，色源=参考图提纯6色系 ═════════
   蓝=功能（--blue/#1276FF 不变，JS 图表无需跟随），切的是氛围：侧栏夜靛渐变、KPI 深夜卡、金系高光、冷暖中性 */
body.t-sl{
  --navy:#071738; --navy-2:#050D26;
  --gold:#3A63C2; --gold-2:#8FB3E8; --gold-deep:#2A4E9E;
  --warn:#E17B44;
  --page:#F1F4F9; --panel-2:#ECF1F8; --panel-3:#E3EAF4;
  --border:rgba(7,23,56,.10); --border-strong:rgba(7,23,56,.20);
  --ink-1:#232B3E; --ink-2:#5A6478; --ink-3:#8792A6; --ink-4:#B4BCCC;
  --rouge:linear-gradient(135deg,#698FC5 0%,#3A63C2 34%,#231B46 72%,#071738 100%);
  --glow:0 10px 30px -8px rgba(58,99,194,.45);
}
body.t-sl .side{background:linear-gradient(170deg,#050D26 0%,#071738 48%,#231B46 100%)}
body.t-sl .side .brand .logo b{color:#F3C470}
body.t-sl .side nav a.nav.on{background:rgba(243,196,112,.15)}
body.t-sl .side nav a.nav.on::before{background:#F3C470}
body.t-sl .kpi{background:linear-gradient(165deg,#0A1E52 0%,#071738 55%,#231B46 100%);border-color:rgba(227,162,73,.30)}
body.t-sl .kpi::after{background:radial-gradient(circle,rgba(227,162,73,.22),transparent 70%)}
body.t-sl .kpi .kicon,body.t-sl .kpi .kicon.blue,body.t-sl .kpi .kicon.green{background:rgba(227,162,73,.16);color:#F3C470}
body.t-sl .kpi .kicon.red{background:rgba(250,53,34,.16);color:#FF5C5C}
body.t-sl .kpi .delta{background:rgba(227,162,73,.14);color:#F3C470}
body.t-sl .af-tl-i.cur .af-tl-n{box-shadow:0 0 16px rgba(58,99,194,.55)}
body.t-sl .af-stage-i.cur .af-stage-n{box-shadow:0 0 16px rgba(58,99,194,.50)}
body.t-sl .login-btn{box-shadow:0 6px 18px rgba(58,99,194,.40)}
/* ═════════ 鎏金庆典主题（2026-09-23，body.t-gala）：绒黑舞台 + 鎏金徽章，色源=回力百年页脚本提取 ═════════
   庆典场景：金=主行动/选中/增长，红 #B70D23 仅印章级点缀；功能蓝 #1276FF 保持不变（JS 图表无需跟随） */
body.t-gala{
  --navy:#1F1713; --navy-2:#0C0A08;
  --gold:#B8934E; --gold-2:#F3C470; --gold-deep:#8A6A35;
  --warn:#CF8831;
  --page:#141210; --bg:#1F1713; --panel-2:#292421; --panel-3:#332C25;
  --border:rgba(247,188,90,.14); --border-strong:rgba(247,188,90,.30);
  --ink-1:#F0E6D6; --ink-2:#C9BBA4; --ink-3:#9C8F79; --ink-4:#6E6353;
  --on-accent:#1F1400;
  --rouge:linear-gradient(135deg,#F7BC5A 0%,#EFB052 40%,#CF8831 78%,#A5762B 100%);
  --glow:0 10px 30px -8px rgba(184,147,78,.50);
}
body.t-gala .side{background:linear-gradient(170deg,#0C0A08 0%,#1F1713 50%,#33261A 100%)}
body.t-gala .side .brand .logo b{color:#F3C470}
body.t-gala .side nav a.nav.on{background:rgba(243,196,112,.14)}
body.t-gala .side nav a.nav.on::before{background:#F3C470}
body.t-gala .kpi{background:linear-gradient(165deg,#2A2118 0%,#14100C 55%,#0C0A08 100%);border-color:rgba(243,196,112,.30)}
body.t-gala .kpi::after{background:radial-gradient(circle,rgba(247,188,90,.20),transparent 70%)}
body.t-gala .kpi .kicon,body.t-gala .kpi .kicon.blue,body.t-gala .kpi .kicon.green{background:rgba(247,188,90,.16);color:#F3C470}
body.t-gala .kpi .kicon.red{background:rgba(183,13,35,.22);color:#E86A78}
body.t-gala .kpi .delta{background:rgba(247,188,90,.14);color:#F3C470}
body.t-gala .kpi .delta.up,body.t-gala .kpi .delta.down{background:rgba(250,53,34,.10);color:#FA3522}
body.t-gala .af-tl-i.cur .af-tl-n{box-shadow:0 0 16px rgba(184,147,78,.55)}
body.t-gala .af-stage-i.cur .af-stage-n{box-shadow:0 0 16px rgba(184,147,78,.50)}
body.t-gala .login-btn{box-shadow:0 6px 18px rgba(184,147,78,.45)}