/* ==========================================================
   V8 设计语言提档层 · 2026-09-24
   对标 ruoguangheng_v8_final_product（三主题 / 238px 侧栏 / 60px 顶栏 /
   #1276FF 主行动色 / 黄金比例 / ⌘K 命令面板 / Hero / Drawer / Stage）
   原则：只增不改——不修改 rg-base.css 一行，全部以覆盖与新增方式生效，
        可整文件摘除回滚。
   ========================================================== */

:root{
  /* ---- 字号 8 档（v8 体系，收敛 26 种散养字号） ---- */
  --fs-cap:12px;    /* 标签/辅助 */
  --fs-xs:12.5px;   /* 次级说明 */
  --fs-sm:13.5px;   /* 表格 */
  --fs-base:14.5px; /* 正文基准 */
  --fs-md:17px;     /* 区块标题 */
  --fs-lg:20px;     /* 小标题 */
  --fs-xl:24px;     /* H1 */
  --fs-num:28px;    /* KPI 数字统一档 */
  --lh-tight:1.25;
  --lh-base:1.6;
  --lh-loose:1.75;

  /* ---- 斐波那契间距阶梯 ---- */
  --sp-1:8px; --sp-2:13px; --sp-3:21px; --sp-4:34px;

  /* ---- v8 语义色软底（沿用线上语义变量派生） ---- */
  --v8-blue-soft:rgba(18,118,255,.09);
  --v8-blue-line:rgba(18,118,255,.18);
  --v8-ok-soft:rgba(62,142,90,.09);
  --v8-warn-soft:rgba(255,143,31,.10);
  --v8-err-soft:rgba(250,53,34,.08);
}

/* ============ 1. 黄金比例栅格（v8 .golden / .triad / .g4） ============ */
.golden{display:grid;grid-template-columns:minmax(0,1.618fr) minmax(310px,1fr);gap:var(--sp-3)}
.triad{display:grid;grid-template-columns:1.618fr 1fr .618fr;gap:var(--sp-2)}
.g4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
/* 存量双栏全站统一升黄金比例（批次三铺开：1fr 1fr / repeat(2,1fr) / repeat(2,minmax) / .grid-2） */
.grid[style*="1fr 1fr"]{grid-template-columns:minmax(0,1.618fr) minmax(0,1fr)!important}
.grid[style*="repeat(2,1fr)"]{grid-template-columns:minmax(0,1.618fr) minmax(0,1fr)!important}
.grid[style*="repeat(2,minmax(0,1fr))"]{grid-template-columns:minmax(0,1.618fr) minmax(0,1fr)!important}
.grid-2{grid-template-columns:minmax(0,1.618fr) minmax(0,1fr)}
/* 修正：上面子串选择器会误匹配三栏 1fr 1fr 1fr，用后置规则还原等三栏 */
.grid[style*="1fr 1fr 1fr"]{grid-template-columns:repeat(3,minmax(0,1fr))!important}
/* 请假页外层 1.2fr 1fr → 黄金比例 */
.grid[style*="1.2fr 1fr"]{grid-template-columns:minmax(0,1.618fr) minmax(0,1fr)!important}
/* 大气：卡片柔和双层投影（半径 --r:16px 已与参考稿一致） */
.card{box-shadow:0 1px 2px rgba(16,30,69,.04),0 10px 28px rgba(16,30,69,.06)}
/* 看板进度条数字标注：色条读不出精确进度，补极简百分比（阶段名有徽章、步数有悬停提示，不重复） */
.af-progwrap .af-pct{font-size:var(--fs-cap);color:var(--ink-4);flex-shrink:0;min-width:34px;text-align:right;font-variant-numeric:tabular-nums;letter-spacing:.2px}
@media(max-width:1100px){
  .golden,.triad{grid-template-columns:1fr}
  .g4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grid[style*="1fr 1fr"],.grid[style*="repeat(2,1fr)"],.grid[style*="repeat(2,minmax(0,1fr))"]{grid-template-columns:1fr!important}
  .grid-2{grid-template-columns:1fr}
}
@media(max-width:820px){
  .g4{grid-template-columns:1fr}
}

/* ============ 2. Hero 卡（v8 同款，首页） ============ */
.v8-hero{
  position:relative;overflow:hidden;
  background:radial-gradient(circle at 92% 12%,rgba(18,118,255,.20),transparent 34%),
             linear-gradient(135deg,var(--bg,#fff),var(--panel-2,#F9FAFC));
  border:1px solid var(--border,rgba(16,30,69,.08));
  border-radius:var(--r-lg,26px);
  padding:var(--sp-4) var(--sp-3);
  min-height:186px;
  display:flex;justify-content:space-between;gap:var(--sp-3);align-items:center;
  margin-bottom:var(--sp-3);
  box-shadow:var(--shadow,0 1px 3px rgba(16,30,69,.06));
}
.v8-hero .v8-eyebrow{font-size:var(--fs-cap);letter-spacing:.08em;color:var(--ink-3,#878D98);text-transform:uppercase;margin-bottom:var(--sp-1)}
.v8-hero h2{font-size:var(--fs-num);line-height:var(--lh-tight);font-weight:700;margin:var(--sp-1) 0;color:var(--ink-1,#1A1A1A)}
.v8-hero p{font-size:var(--fs-sm);color:var(--ink-3,#878D98);max-width:660px;line-height:var(--lh-base);margin:0}
.v8-hero .v8-hero-actions{display:flex;gap:var(--sp-1);flex-wrap:wrap;margin-top:var(--sp-2)}
.v8-orb{
  width:150px;height:150px;border-radius:50%;flex-shrink:0;
  background:conic-gradient(#1276FF,#89B7FF,#E4EEFF,#1276FF);
  box-shadow:0 24px 60px rgba(18,118,255,.18);
}
@media(max-width:820px){.v8-orb{display:none}.v8-hero{flex-direction:column;align-items:flex-start}}

/* ============ 3. 顶栏毛玻璃 + 全局搜索（v8 同款） ============ */
.topbar{
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  background:var(--bg,#fff);
  background:color-mix(in srgb,var(--bg,#fff) 88%,transparent);
}
body.t-sl .topbar{background:color-mix(in srgb,#0C111B 88%,transparent)}
body.t-gala .topbar{background:color-mix(in srgb,#141210 88%,transparent)}
.v8-search{position:relative;width:280px;flex-shrink:0}
.v8-search input{
  width:100%;height:36px;border:1px solid var(--border,rgba(16,30,69,.12));
  border-radius:var(--r-sm,11px);background:var(--panel-2,#EFF1F5);
  padding:0 46px 0 13px;font-size:var(--fs-sm);color:var(--ink-1,#1A1A1A);
}
.v8-search input:focus{outline:none;border-color:var(--blue,#1276FF);box-shadow:0 0 0 3px rgba(18,118,255,.12)}
.v8-search kbd{
  position:absolute;right:8px;top:8px;border:1px solid var(--border,rgba(16,30,69,.12));
  border-radius:6px;background:var(--bg,#fff);padding:1px 6px;color:var(--ink-3,#878D98);font-size:var(--fs-cap);pointer-events:none
}
@media(max-width:1100px){.v8-search{width:170px}}

/* ============ 4. 命令面板 ⌘K（v8 同款） ============ */
#v8cmd{position:fixed;inset:0;z-index:2400;display:none;place-items:start center;padding-top:12vh;
  background:rgba(9,18,34,.32);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
#v8cmd.open{display:grid}
.v8-cmd-box{width:min(700px,92vw);background:var(--bg,#fff);border:1px solid var(--border,rgba(16,30,69,.12));
  border-radius:18px;box-shadow:var(--shadow-lg,0 18px 50px -24px rgba(16,30,69,.28));overflow:hidden}
.v8-cmd-box input{width:100%;height:54px;border:0;border-bottom:1px solid var(--border,rgba(16,30,69,.12));
  padding:0 18px;font-size:var(--fs-base);background:var(--bg,#fff);color:var(--ink-1,#1A1A1A)}
.v8-cmd-box input:focus{outline:none}
.v8-cmd-list{padding:8px;max-height:420px;overflow:auto}
.v8-cmd-item{padding:11px 12px;border-radius:10px;display:flex;justify-content:space-between;gap:12px;
  cursor:pointer;font-size:var(--fs-sm);color:var(--ink-1,#1A1A1A)}
.v8-cmd-item:hover{background:var(--panel-2,#EFF1F5)}
.v8-cmd-item .v8-cmd-kind{font-size:var(--fs-cap);color:var(--ink-3,#878D98);flex-shrink:0}
.v8-cmd-empty{padding:22px;text-align:center;color:var(--ink-3,#878D98);font-size:var(--fs-sm)}
.v8-flash{animation:v8flash 1.2s ease}
@keyframes v8flash{0%,100%{background:transparent}30%{background:rgba(18,118,255,.18)}}

/* ============ 5. v8 组件：Banner / Audit / Stage / Timeline ============ */
.v8-banner{padding:var(--sp-2) var(--sp-2);border-radius:14px;border:1px solid var(--v8-blue-line);
  background:var(--v8-blue-soft);display:flex;justify-content:space-between;gap:12px;align-items:center;
  font-size:var(--fs-sm);margin-bottom:var(--sp-2)}
.v8-audit{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:var(--fs-cap);
  background:var(--panel-2,#EFF1F5);border:1px solid var(--border,rgba(16,30,69,.08));
  border-radius:14px;padding:14px;line-height:var(--lh-base);white-space:pre-wrap}
.v8-stage{display:grid;grid-template-columns:repeat(8,1fr);gap:var(--sp-1)}
.v8-step{padding:10px;border-radius:12px;border:1px solid var(--border,rgba(16,30,69,.08));
  background:var(--panel-2,#EFF1F5);font-size:var(--fs-cap);text-align:center}
.v8-step.done{background:var(--v8-ok-soft);border-color:rgba(62,142,90,.18)}
.v8-step.active{background:var(--v8-blue-soft);border-color:var(--v8-blue-line);font-weight:600}
.v8-timeline{padding-left:20px;position:relative}
.v8-timeline:before{content:"";position:absolute;left:6px;top:4px;bottom:4px;width:1px;background:var(--border,rgba(16,30,69,.12))}
.v8-tl{position:relative;padding:0 0 18px 12px}
.v8-tl:before{content:"";position:absolute;left:-18px;top:4px;width:9px;height:9px;border-radius:50%;
  background:var(--blue,#1276FF);box-shadow:0 0 0 4px var(--bg,#fff)}
.v8-tl b{font-size:var(--fs-sm)}
.v8-tl p{margin:3px 0 0;color:var(--ink-3,#878D98);font-size:var(--fs-cap)}
@media(max-width:1100px){.v8-stage{grid-template-columns:repeat(4,1fr)}}

/* ============ 6. 交互细节（v8 标准：三态齐全 + 防连点 + 降低动效） ============ */
.btn:focus-visible,.btn-primary:focus-visible,.btn-gold:focus-visible,.icon-btn:focus-visible,
a.nav:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{
  outline:2px solid var(--blue,#1276FF);outline-offset:2px}
.btn:active,.btn-gold:active,.btn-outline:active{transform:scale(.98)}
.btn:hover,.btn-gold:hover{transform:translateY(-1px);box-shadow:var(--shadow-md,0 4px 16px -6px rgba(16,30,69,.12))}
.btn[disabled],.btn-primary[disabled]{opacity:.5;cursor:not-allowed;transform:none!important}
/* 表格斑马纹 + 粘头（v8 表格规范） */
.tbl tbody tr:nth-child(even) td{background:color-mix(in srgb,var(--panel-2,#EFF1F5) 55%,var(--bg,#fff))}
.tbl thead th{position:sticky;top:0;z-index:2}
/* ============ 7. AIFDE 步骤条（看板行内 10 格紧凑版） ============ */
.v8-stage.mini{grid-template-columns:repeat(10,minmax(0,1fr));gap:5px;margin-top:10px;grid-column:1/-1}
.v8-stage.mini .v8-step{
  height:7px;padding:0;border-radius:4px;font-size:0;overflow:hidden;
  background:var(--panel-2,#EFF1F5);border:0;cursor:help;transition:height .2s,box-shadow .2s;
}
.v8-stage.mini .v8-step.done{background:#3E8E5A;opacity:.65}
.v8-stage.mini .v8-step.active{background:linear-gradient(90deg,#0B5BD8,#1276FF);height:9px;box-shadow:0 0 12px rgba(18,118,255,.45)}
.v8-stage.mini:hover .v8-step{height:9px}
.v8-stage.mini:hover .v8-step.done{opacity:1}

/* ============ 8. AIFDE 项目详情时间轴 v8 化（只增强，不改结构） ============ */
.af-stage-tl{position:relative;padding-left:4px}
.af-stage-tl:before{
  content:"";position:absolute;left:27px;top:26px;bottom:26px;width:2px;border-radius:2px;
  background:linear-gradient(180deg,var(--v8-blue-line),rgba(18,118,255,.05));
}
.af-stage-i{position:relative;border-radius:14px;padding:14px 16px!important;transition:background .2s,box-shadow .2s}
.af-stage-i:hover{background:var(--panel-2,#EFF1F5)}
.af-stage-i.done{opacity:.78}
.af-stage-i.cur{background:var(--v8-blue-soft);box-shadow:inset 0 0 0 1px var(--v8-blue-line)}
.af-stage-i .af-stage-n{position:relative;z-index:1;flex-shrink:0}
.af-stage-s{border-radius:999px;padding:2px 10px;background:var(--panel-2,#EFF1F5);font-size:var(--fs-cap);align-self:flex-start}

/* ============ 9. 骨架屏（替代「加载中」的闪白） ============ */
.v8-skel-row{display:flex;gap:10px;margin-bottom:10px}
.v8-skel{
  display:block;flex:1;height:14px;border-radius:7px;
  background:linear-gradient(90deg,var(--panel-2,#EFF1F5) 25%,color-mix(in srgb,var(--panel-2,#EFF1F5) 55%,var(--bg,#fff)) 37%,var(--panel-2,#EFF1F5) 63%);
  background-size:400% 100%;animation:v8skel 1.3s ease infinite;
}
.v8-skel-row:first-child .v8-skel{height:22px}
@keyframes v8skel{0%{background-position:100% 50%}100%{background-position:0 50%}}

/* ============ 10. 通用抽屉 v8drawer（全站唯一抽屉实现） ============ */
#v8drawer{position:fixed;inset:0;z-index:2300;display:none}
#v8drawer.open{display:block}
.v8-drawer-ov{position:absolute;inset:0;background:rgba(9,18,34,.42);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);opacity:0;transition:opacity .22s}
#v8drawer.open .v8-drawer-ov{opacity:1}
.v8-drawer-panel{
  position:absolute;right:0;top:0;height:100%;width:min(560px,94vw);
  background:var(--bg,#fff);border-left:1px solid var(--border,rgba(16,30,69,.12));
  box-shadow:-24px 0 60px -30px rgba(16,30,69,.35);
  display:flex;flex-direction:column;
  transform:translateX(100%);transition:transform .26s cubic-bezier(.32,.72,.28,1);
}
#v8drawer.open .v8-drawer-panel{transform:translateX(0)}
.v8-drawer-head{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:18px var(--sp-3);border-bottom:1px solid var(--border,rgba(16,30,69,.10));
  background:color-mix(in srgb,var(--bg,#fff) 92%,transparent);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
}
.v8-drawer-head h3{margin:0;font-size:var(--fs-md);font-weight:700;color:var(--ink-1,#1A1A1A)}
.v8-drawer-x{background:none;border:0;color:var(--ink-3,#878D98);font-size:24px;line-height:1;cursor:pointer;padding:0 4px}
.v8-drawer-x:hover{color:var(--ink-1,#1A1A1A)}
.v8-drawer-body{flex:1;overflow:auto;padding:var(--sp-3)}
.v8-drawer-foot{display:none;gap:10px;justify-content:flex-end;padding:14px var(--sp-3);border-top:1px solid var(--border,rgba(16,30,69,.10))}
.v8-drawer-foot.on{display:flex}
/* 存量 af-drawer 视觉提档（业务逻辑不动） */
.af-drawer{border-left:1px solid var(--border,rgba(16,30,69,.10))!important;box-shadow:-24px 0 60px -30px rgba(16,30,69,.35)!important}
.af-drawer-head{backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}

@media(prefers-reduced-motion:reduce){
  *,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}
}

/* ============ 11. 右侧主体严格对照（V8 Final Product · 批次四 2026-09-24） ============ */
/* 11.1 页头（v8 .head/.eyebrow/.h1/.sub：眉标 12px + 标题 22px + 副题 13px/mt6 + 下距 24px） */
.v8-eyebrow{font-size:12px;color:var(--ink-3,#878D98);letter-spacing:.08em;text-transform:uppercase;margin-bottom:6px;font-weight:600}
.pagehead{margin-bottom:24px;align-items:flex-start}
.pagehead h1{font-size:22px;letter-spacing:0}
.pagehead p{font-size:13px;margin-top:6px}
#view-af-board .pagehead{margin-bottom:24px}
#view-af-board .pagehead h1{font-size:22px;letter-spacing:-.01em}
#view-af-board .pagehead p{font-size:13px;margin-top:6px}

/* 11.2 主内容卡 .big 化（v8 .big：大圆角 + 24px 内边距；仅顶层布局卡，嵌套卡维持 16/20） */
.view > .card,.view > div > .card{border-radius:22px;padding:22px 24px}

/* 11.3 卡头标题（v8 .ct 16px/700，无装饰竖条；.cd 12px 说明走 .hint/.csub） */
.card .ctitle{font-size:16px}
.card .ctitle::before{display:none}
.af-sectitle{font-size:16px;font-weight:700}

/* 11.4 统计/KPI 数字（v8 .klabel 12 / .kpi 26 / .ksub 12·mt8；白卡无顶部彩条） */
.af-stat::before{display:none}
.af-stat .k{font-size:12px;margin-bottom:0}
.af-stat .v{font-size:26px;letter-spacing:0;margin-top:6px;margin-bottom:0}
.af-stat .s{font-size:12px;margin-top:8px;color:var(--ink-3)}
.kpi .knum{font-size:26px;letter-spacing:-.02em}

/* 11.5 列表行条目（v8 .row：padding 12 + 1px 边框 + p2 底 + 圆角 12） */
.af-proj{padding:12px 14px;gap:14px;border-color:var(--border,rgba(16,30,69,.10))}
.af-proj .nm{font-size:14px}
.af-proj .mt{font-size:12px}

/* 11.6 区块纵向节奏 24px（v8 .gap；覆盖视图内联 margin-top:16px） */
.view > div[style*="margin-top:16px"]{margin-top:24px!important}

/* 11.7 表格 hover 蓝 3%（v8 tbody tr:hover） */
.tbl tbody tr:hover td{background:color-mix(in srgb,var(--blue,#1276FF) 3%,var(--bg,#fff))}

@media(max-width:1100px){
  .view > .card,.view > div > .card{border-radius:18px;padding:18px}
}

/* ============ 12. 组件细节严格对照（批次五：按钮/输入/表格/侧栏/弹层） ============ */
/* 12.1 按钮（v8 .btn 高 40；primary 蓝底 hover 深蓝 blue2；outline hover 不变色只浮起） */
.btn{height:40px}
.btn-primary{background:var(--blue,#1276FF)}
.btn-primary:hover{background:var(--blue2,#0B5BD8)}
.btn-outline:hover{border-color:var(--border-strong);color:var(--ink-1)}
/* 12.2 输入聚焦（v8 蓝色功能态，替代金色聚焦） */
.input:focus{border-color:var(--blue,#1276FF);box-shadow:0 0 0 3px rgba(18,118,255,.12)}
/* 12.3 表格单元格（v8 th/td 13 14；末行无底线） */
.tbl th{padding:13px 14px}
.tbl td{padding:13px 14px}
.tbl tbody tr:last-child td{border-bottom:0}
/* 12.4 顶栏图标钮（v8 .icon 38px/r12） */
.topbar .icon-btn{width:38px;height:38px;border-radius:12px}
/* 12.5 侧栏导航项（v8 .nav button：padding 11 12 / r12；选中白条保留） */
.side nav a.nav{padding:11px 12px;border-radius:12px}
/* 12.6 弹层（v8 modal r22 + sh3；toast 挂顶栏下方 78px、min-280） */
#rg-modal > div{border-radius:22px!important;box-shadow:0 28px 80px rgba(22,52,92,.22)!important}
#rg-toast{top:78px!important;min-width:280px!important;border-radius:12px!important}
/* 12.7 客户详情双栏 → V8 golden 1.618:1（L1 CRM 主记录 + 侧信息卡，原 58%/42%） */
.cust-layout{grid-template-columns:minmax(0,1.618fr) minmax(0,1fr);gap:24px}
/* 12.8 首页 triad（驾驶舱组合）：老总卡显隐后 solo 自动退化列数 */
.home-triad.solo1{grid-template-columns:1fr}
.home-triad.solo2{grid-template-columns:minmax(0,1.618fr) minmax(0,1fr)}
/* 12.9 审批中心 CONTROL 表格（v8 .table 逐帧对标：外壳描边 14 圆角 / 表头 12px 灰底 / 13-14 实线 / 悬停蓝 3%） */
.v8-table{overflow:auto;border:1px solid var(--line);border-radius:14px}
.v8-table table{width:100%;border-collapse:separate;border-spacing:0;min-width:780px}
.v8-table th,.v8-table td{padding:13px 14px;border-bottom:1px solid var(--line);text-align:left;white-space:nowrap;vertical-align:middle}
.v8-table th{font-size:12px;background:var(--panel-2);color:var(--ink-3);font-weight:600}
.v8-table tbody tr:hover td{background:rgba(18,118,255,.03)}
.v8-table tbody tr:last-child td{border-bottom:0}
/* 12.10 v8 状态标签（参考稿 .tag：描边药丸 999 / warn 深橙 #C66B0D） */
.v8-tag{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:999px;padding:5px 9px;font-size:12px;font-weight:600;background:var(--panel-2);white-space:nowrap}
.v8-tag.warn{color:#C66B0D;background:rgba(255,143,31,.10)}
/* 12.11 危险按钮（参考稿 .btn.danger：红字描边钮，用于驳回等高风险动作） */
.btn-danger{color:#FA3522}
@media(max-width:1100px){
  .cust-layout{grid-template-columns:1fr}
  .home-triad,.home-triad.solo1,.home-triad.solo2{grid-template-columns:1fr}
}

/* ==========================================================
   15. 侧栏导航选中特效（2026-09-25）
   修复：showView 原只切 .active，侧栏 CSS 认 .on → 选中态从未生效；
   rg-core.js 已改为同时切 .on/.active，此处补齐过渡与辉光质感。
   原则：可中断过渡（非 keyframes）、具体属性（非 all）、克制动效。
   ========================================================== */
.side nav a.nav{transition:background-color .15s ease-out,color .15s ease-out,box-shadow .15s ease-out,transform .12s ease-out}
.side nav a.nav:active{transform:scale(.98)}
.side nav a.nav svg{transition:opacity .15s ease-out}
.side nav a.nav:hover svg{opacity:1}
.side nav a.nav::before{content:"";position:absolute;left:-10px;top:22%;bottom:22%;width:3px;border-radius:2px;background:#fff;opacity:0;transform:scaleY(.3);transition:opacity .18s ease-out,transform .18s ease-out,box-shadow .18s ease-out}
.side nav a.nav.on::before{opacity:1;transform:scaleY(1);box-shadow:0 0 10px rgba(255,255,255,.55)}
.side nav a.nav.on{background:linear-gradient(90deg,rgba(255,255,255,.24),rgba(255,255,255,.13));color:#fff;font-weight:600;box-shadow:inset 0 0 0 1px rgba(255,255,255,.16)}
.side nav a.nav.on svg{opacity:1}
body.t-sl .side nav a.nav.on::before,body.t-gala .side nav a.nav.on::before{background:#F3C470;box-shadow:0 0 10px rgba(243,196,112,.6)}
@media (prefers-reduced-motion:reduce){
  .side nav a.nav,.side nav a.nav svg,.side nav a.nav::before{transition:none}
  .side nav a.nav:active{transform:none}
}