/* ============================================================
   6366 · 深色皮肤（内容页）
   在 theme.css 之后加载，只作用于 <body class="noir-skin">。
   与首页 body.noir 同一套玩法：黑底、白字、灰阶分层、彩色只做点缀。
   内容页的样式全部走 CSS 变量，所以这里以「重映射变量 + 少量硬编码补丁」
   的方式整体换肤，不改页面本身。
   ============================================================ */
html:has(body.noir-skin){background:#050505}
body.noir-skin{
  color-scheme:dark;
  /* 注意：页面底色用下面的 background 固定 #050505；
     --bg 留给「卡片里的内嵌小块」（列表行、上传区、图例块、表格选中行等），
     浅色版里它比卡片深一档，深色版必须比卡片亮一档，否则内嵌块会糊成黑块。 */
  --bg:#151515;
  --card:#0E0E0E;
  --ink:#FFFFFF;
  --ink-2:#C9C9C9;
  --ink-3:#8F8F8F;
  --line:rgba(255,255,255,.12);
  --primary:#6B93FF;
  --primary-600:#8CACFF;
  --primary-50:rgba(107,147,255,.14);
  --primary-100:rgba(107,147,255,.24);
  --violet:#A78BFF;
  --violet-50:rgba(167,139,255,.14);
  --green:#4ADE80;  --green-50:rgba(74,222,128,.14);
  --orange:#FBBF24; --orange-50:rgba(251,191,36,.14);
  --red:#FF7A7A;    --red-50:rgba(255,122,122,.14);
  --text-muted:#8F8F8F;
  --text-body:#C9C9C9;
  --shadow:none;
  --shadow-lg:0 20px 60px rgba(0,0,0,.55);
  background:#050505;
  color:var(--ink-2);
}

/* ---- 页面底色：纯黑收敛，与首页一致（不加光晕，避免和彩色 hero 卡打架） ---- */
body.noir-skin .page{position:relative}

/* ---- 导航：深色磨砂（二级导航同步） ---- */
body.noir-skin .subnav{background:rgba(8,8,10,.88);border-bottom:1px solid rgba(255,255,255,.08);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px)}
body.noir-skin .subnav-name{color:#fff}
body.noir-skin .subnav nav a{color:rgba(255,255,255,.62)}
body.noir-skin .subnav nav a:hover{color:#fff}
body.noir-skin .subnav nav a.active{color:#fff;font-weight:600}
body.noir-skin .vorla-link{border-color:rgba(255,255,255,.32);color:#fff}
body.noir-skin .vorla-link:hover{background:rgba(255,255,255,.10);color:#fff}

/* ---- 卡片：黑底上靠 1px 亮边分层，不用阴影 ---- */
body.noir-skin .card{background:var(--card);border:1px solid rgba(255,255,255,.08);box-shadow:none}
body.noir-skin .hero{background:transparent}
body.noir-skin .hero::before{display:none}

/* ---- 按钮：主按钮改白底黑字（与首页 n-btn.solid 一致） ---- */
body.noir-skin .btn{color:#fff;border-color:rgba(255,255,255,.20);background:transparent}
body.noir-skin .btn:hover{color:#fff;border-color:rgba(255,255,255,.45);text-decoration:none}
body.noir-skin .btn-primary,
body.noir-skin .btn-ai{background:#fff;color:#000;border-color:#fff;box-shadow:none;filter:none}
body.noir-skin .btn-primary:hover,
body.noir-skin .btn-ai:hover{background:#DCDCDC;color:#000;border-color:#DCDCDC}
/* hero-tile 内的按钮在原设计里用 !important 固定成「白底蓝字」，
   深色皮肤下改成「白底黑字」，否则蓝字压在白底上对比度不够 */
body.noir-skin .hero-tile .btn-primary,
body.noir-skin .hero-tile .btn-ai{background:#fff!important;color:#000!important;border-color:#fff!important}
body.noir-skin .hero-tile .btn-primary:hover,
body.noir-skin .hero-tile .btn-ai:hover{background:#DCDCDC!important;color:#000!important;border-color:#DCDCDC!important}
body.noir-skin .hero-tile .btn{color:#fff}

/* ---- 表格 ---- */
body.noir-skin .tbl th{background:rgba(255,255,255,.04);color:var(--ink-3);border-bottom-color:var(--line)}
body.noir-skin .tbl td{border-bottom-color:var(--line);color:var(--ink)}
body.noir-skin .tbl tr:hover td{background:rgba(255,255,255,.03)}

/* ---- AI 面板 / 消息气泡 ---- */
body.noir-skin .ai-panel{background:#0E0E0E;border-color:rgba(255,255,255,.10);box-shadow:none}
body.noir-skin .ai-panel .ai-head{background:rgba(255,255,255,.045);border-bottom:1px solid var(--line);color:#fff}
body.noir-skin .ai-avatar{background:#fff;color:#000}
body.noir-skin .msg.bot{background:rgba(255,255,255,.07);color:#EDEDED}
body.noir-skin .msg.user{background:var(--primary);color:#fff}

/* ---- 飞书卡片模拟：改成深色版（保留彩色标题条做点缀） ---- */
body.noir-skin .feishu{background:#111114;border:1px solid rgba(255,255,255,.08)}
body.noir-skin .feishu .fs-bar{color:#8F8F8F}
body.noir-skin .fs-card{background:#191A1E;border:1px solid rgba(255,255,255,.10)}
body.noir-skin .fs-card .fs-h{background:#3370FF;color:#fff;border-bottom:0}
body.noir-skin .fs-card .fs-h.violet{background:#7B61FF;color:#fff}
body.noir-skin .fs-card .fs-h.green{background:#2BA81C;color:#fff}
body.noir-skin .fs-card .fs-h.orange{background:#E07800;color:#fff}
body.noir-skin .fs-card .fs-b{color:#D8D8DA}
body.noir-skin .fs-btn{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.16);color:#E8E8EA}
body.noir-skin .fs-btn:hover{background:rgba(255,255,255,.12)}
body.noir-skin .fs-btn.primary{background:#3370FF;border-color:#3370FF;color:#fff}
body.noir-skin .fs-btn.primary:hover{background:#2A5FD9}

/* ---- 轨道 / 进度 / 模拟标记 ---- */
body.noir-skin .progress{background:rgba(255,255,255,.10)}
body.noir-skin .progress > i{background:var(--primary)}
body.noir-skin .bar-row .track{background:rgba(255,255,255,.08)}
body.noir-skin .sim-tag{background:rgba(8,8,10,.82);border-color:var(--line);color:var(--ink-3)}

/* ---- 架构图节点：选中态文字保持白色（--card 已变深，会吃掉白字） ---- */
body.noir-skin .arch .node.on text.t,
body.noir-skin .arch .node.on text.s,
body.noir-skin .arch .node.on .own-l{fill:#fff}
body.noir-skin .arch .node rect.box{fill:#0E0E0E;stroke:rgba(255,255,255,.16)}
body.noir-skin .arch .edge{stroke:rgba(255,255,255,.16)}
body.noir-skin .arch .arr{fill:rgba(255,255,255,.45)}

/* ---- 分段控件 / 选择器 ---- */
body.noir-skin .seg{background:rgba(255,255,255,.06)}
body.noir-skin .seg button.on{background:#fff;color:#000}
body.noir-skin .fs-sel{background:#191A1E;border-color:rgba(255,255,255,.16);color:#EDEDED}
body.noir-skin .fs-input{background:#191A1E;border-color:rgba(255,255,255,.14)}
body.noir-skin .fs-input input{color:#EDEDED}

/* ---- 页脚 ---- */
body.noir-skin .foot{color:var(--ink-3)}
body.noir-skin .foot a{color:var(--ink-2)}
body.noir-skin .foot a:hover{color:#fff}

/* ---- 细节 ---- */
body.noir-skin .empty,
body.noir-skin .muted{color:var(--ink-3)}
body.noir-skin .basis-note{color:var(--ink-3)}
body.noir-skin .basis-note b{color:var(--ink-2)}
body.noir-skin ::selection{background:rgba(107,147,255,.35);color:#fff}
body.noir-skin .scroll-x::-webkit-scrollbar,
body.noir-skin .stream::-webkit-scrollbar,
body.noir-skin .chat::-webkit-scrollbar{width:8px;height:8px}
body.noir-skin .scroll-x::-webkit-scrollbar-thumb,
body.noir-skin .stream::-webkit-scrollbar-thumb,
body.noir-skin .chat::-webkit-scrollbar-thumb{background:rgba(255,255,255,.16);border-radius:99px}
