/* ==========================================================================
   星环（XINGHUAN）皮肤 · 方向稿 v1
   设计语言来自我们自研的星环作战大屏（:8121），原创，无外部素材。
   形态取舍：情报站是阅读站 —— 皮（配色/字体/线框/发光）整套搬，
   重 HUD（雷达/告警/全屏扫描）不搬。正文保持易读字体。
   激活：给 <html> 加 class="xh"；主题档 theme-a(深空青,默认) / theme-b(琥珀) / theme-c(极简白青)。
   ========================================================================== */

/* ---- 主题变量：三档互斥，只差变量，DOM 一行不改 ---- */
html.xh.theme-a {
  --bg: #04070b; --bg-sunk: #020508; --bg-muted: #0a141c;
  --surface: #070e15; --surface-2: #0a141c; --raised: #0d1822;
  --well: rgba(10, 20, 28, .55); --sidebar: #05090e; --daybar: #070e15;
  /* v2 对比度：theme-a 次要文字提亮（无头浏览器实测 75 处 <4.5，见 reports 注） */
  --ink: #eaf7ff; --ink-2: #cfe6f2; --ink-3: #a8c2d0; --ink-4: #7f9aac;
  --line: rgba(86, 206, 236, .15); --line-strong: rgba(120, 232, 255, .34); --line-soft: rgba(86, 206, 236, .08);
  --accent: #35e2ff; --accent-ink: #6dedff; --accent-soft: rgba(53, 226, 255, .14);
  --accent-softer: rgba(53, 226, 255, .07); --accent-contrast: #02131a;
  --note: #4ef08a; --hot: #ff5ce1; --hot-soft: rgba(255, 92, 225, .12);
  --amber: #ffd45a; --amber-ink: #ffd45a; --amber-soft: rgba(255, 212, 90, .12);
  --ok: #4ef08a; --ok-soft: rgba(78, 240, 138, .12); --ok-ink: #7df3ac;
  --rank-1: #ff5ce1; --rank-2: #35e2ff; --rank-3: #ffd45a; --rank-rest: #5c7686;
  --selection: rgba(53, 226, 255, .22);
  --shadow-card: 0 0 0 1px rgba(86, 206, 236, .10), 0 10px 30px rgba(0, 0, 0, .45);
  --shadow-soft: 0 10px 30px rgba(0, 0, 0, .5);
  --shadow-pop: 0 16px 40px rgba(0, 0, 0, .55), 0 0 24px rgba(53, 226, 255, .10);
  --xh-glow: 0 0 12px rgba(53, 226, 255, .45), 0 0 34px rgba(53, 226, 255, .18);
  --xh-neb-1: 255, 92, 225; --xh-neb-2: 53, 226, 255; --xh-neb-3: 78, 240, 138;
  --prose-ink: #d7ecf6; --code-bg: #020508;
}
html.xh.theme-b {
  --bg: #08080a; --bg-sunk: #050506; --bg-muted: #14120f;
  --surface: #0d0c0b; --surface-2: #14120f; --raised: #1a1713;
  --well: rgba(20, 17, 12, .55); --sidebar: #0a0908; --daybar: #0d0c0b;
  /* v2 对比度：theme-b 次要文字提亮（实测 76 处 <4.5） */
  --ink: #f6efe2; --ink-2: #e4d8c2; --ink-3: #c4b298; --ink-4: #93816a;
  --line: rgba(255, 171, 61, .16); --line-strong: rgba(255, 196, 110, .36); --line-soft: rgba(255, 171, 61, .08);
  --accent: #ffb03a; --accent-ink: #ffc46a; --accent-soft: rgba(255, 176, 58, .13);
  --accent-softer: rgba(255, 176, 58, .06); --accent-contrast: #1a1002;
  --note: #a8b878; --hot: #d97b3c; --hot-soft: rgba(217, 123, 60, .13);
  --amber: #ffd166; --amber-ink: #ffd166; --amber-soft: rgba(255, 209, 102, .12);
  --ok: #a8b878; --ok-soft: rgba(168, 184, 120, .12); --ok-ink: #c2cf9a;
  --rank-1: #ffb03a; --rank-2: #e0a94f; --rank-3: #c9b79a; --rank-rest: #93816a;
  --selection: rgba(255, 176, 58, .20);
  --shadow-card: 0 0 0 1px rgba(255, 171, 61, .10), 0 10px 30px rgba(0, 0, 0, .45);
  --shadow-soft: 0 10px 30px rgba(0, 0, 0, .5);
  --shadow-pop: 0 16px 40px rgba(0, 0, 0, .55), 0 0 24px rgba(255, 176, 58, .10);
  --xh-glow: 0 0 12px rgba(255, 176, 58, .42), 0 0 34px rgba(255, 150, 40, .16);
  --xh-neb-1: 217, 123, 60; --xh-neb-2: 255, 176, 58; --xh-neb-3: 200, 190, 160;
  --prose-ink: #e9ddc6; --code-bg: #050506;
}
html.xh.theme-c {
  --bg: #05080a; --bg-sunk: #030506; --bg-muted: #0c1418;
  --surface: #0a1014; --surface-2: #0c1418; --raised: #10191e;
  --well: rgba(10, 17, 21, .45); --sidebar: #060a0c; --daybar: #0a1014;
  --ink: #f0fbff; --ink-2: #d8edf5; --ink-3: #95afba; --ink-4: #66808b;
  --line: rgba(200, 236, 255, .10); --line-strong: rgba(228, 248, 255, .26); --line-soft: rgba(200, 236, 255, .06);
  --accent: #cfefff; --accent-ink: #e6faff; --accent-soft: rgba(207, 239, 255, .10);
  --accent-softer: rgba(207, 239, 255, .05); --accent-contrast: #04121a;
  --note: #b4d4de; --hot: #8fb6c4; --hot-soft: rgba(143, 182, 196, .12);
  --amber: #e8e2c8; --amber-ink: #e8e2c8; --amber-soft: rgba(232, 226, 200, .10);
  --ok: #b4d4de; --ok-soft: rgba(180, 212, 222, .10); --ok-ink: #d0e6ee;
  --rank-1: #e6faff; --rank-2: #b9d9e6; --rank-3: #9fc7d4; --rank-rest: #66808b;
  --selection: rgba(207, 239, 255, .18);
  --shadow-card: 0 0 0 1px rgba(200, 236, 255, .08), 0 10px 30px rgba(0, 0, 0, .4);
  --shadow-soft: 0 10px 30px rgba(0, 0, 0, .45);
  --shadow-pop: 0 16px 40px rgba(0, 0, 0, .5), 0 0 24px rgba(207, 239, 255, .08);
  --xh-glow: 0 0 10px rgba(207, 239, 255, .32), 0 0 30px rgba(180, 220, 240, .12);
  --xh-neb-1: 150, 190, 205; --xh-neb-2: 207, 239, 255; --xh-neb-3: 120, 160, 175;
  --prose-ink: #dcecf3; --code-bg: #030506;
}

/* ---- 自托管 Rajdhani（与星环同源）：只给标题/导航/数字，正文保持系统字体 ---- */
@font-face { font-family: "XHRajdhani"; font-style: normal; font-weight: 400; font-display: swap; src: url("/brand/xh-fonts/raj-400.woff2") format("woff2"); }
@font-face { font-family: "XHRajdhani"; font-style: normal; font-weight: 600; font-display: swap; src: url("/brand/xh-fonts/raj-600.woff2") format("woff2"); }
@font-face { font-family: "XHRajdhani"; font-style: normal; font-weight: 700; font-display: swap; src: url("/brand/xh-fonts/raj-700.woff2") format("woff2"); }

html.xh {
  /* 星环的 mono 阶：等宽数字读数 */
  --font-mono: "XHRajdhani", ui-monospace, SFMono-Regular, "SF Mono", Menlo, Monaco, Consolas, "Liberation Mono", monospace;
}
html.xh h1, html.xh h2, html.xh h3, html.xh h4, html.xh h5,
html.xh nav, html.xh header, html.xh footer,
html.xh button, html.xh summary {
  font-family: "XHRajdhani", var(--font-sans);
  letter-spacing: .015em;
}

/* ---- 深空底：星云 + 极淡蜂窝（纯 CSS 生成，零外链） ---- */
html.xh body {
  background:
    radial-gradient(60% 42% at 18% 0%, rgba(var(--xh-neb-1), .10), transparent 70%),
    radial-gradient(52% 40% at 88% 8%, rgba(var(--xh-neb-2), .12), transparent 72%),
    radial-gradient(70% 50% at 50% 108%, rgba(var(--xh-neb-3), .07), transparent 75%),
    var(--bg);
  background-attachment: fixed;
}
html.xh .xh-honeycomb,
html.xh body::before {
  content: ""; position: fixed; inset: 0; z-index: 0; pointer-events: none; opacity: .5;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='96' viewBox='0 0 56 96'%3E%3Cpath d='M28 0L56 16v32L28 64 0 48V16zM28 64v32M56 48l28 16M0 48l-28 16' fill='none' stroke='%23ffffff' stroke-opacity='0.035' stroke-width='1'/%3E%3C/svg%3E");
}
html.xh main, html.xh header, html.xh footer, html.xh nav { position: relative; z-index: 1; }

/* ---- 面板：斜切角 + 发丝双线框（星环的 inset 三层做法） ---- */
html.xh .xh-cut,
html.xh article,
html.xh [class*="card"],
html.xh [class*="panel"] {
  border-radius: 2px !important;
}
html.xh article,
html.xh [class*="card"],
html.xh [class*="panel"] {
  background:
    linear-gradient(180deg, var(--surface), var(--bg-sunk));
  box-shadow:
    inset 0 0 0 1px var(--line-strong),
    inset 0 0 0 4px rgba(0, 0, 0, .25),
    inset 0 0 0 5px var(--line),
    var(--shadow-card);
  border: 1px solid transparent !important;
}
/* 顶边发丝高光（代替 drop-shadow，避免糊字） */
html.xh article::before,
html.xh [class*="card"]::before {
  content: ""; position: absolute; inset: 0 0 auto 0; height: 1px; pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(var(--xh-neb-2), .28), transparent);
}
html.xh article, html.xh [class*="card"] { position: relative; }

/* ---- 强调：徽章/选中态带辉光 ---- */
html.xh [class*="badge"], html.xh [class*="tag"], html.xh [class*="chip"] {
  border-radius: 1px !important;
  letter-spacing: .08em;
}
html.xh [aria-current="true"], html.xh [class*="active"] {
  text-shadow: var(--xh-glow);
}

/* ---- 页头：品牌字标拉宽（星环 brand 母题） ---- */
html.xh header a[class*="logo"], html.xh header [class*="brand"] {
  letter-spacing: .18em; text-transform: uppercase;
}

/* ---- 滚动条：细、青色 ---- */
html.xh * { scrollbar-width: thin; scrollbar-color: var(--line-strong) transparent; }

/* ---- 焦点环跟辉光 ---- */
html.xh :focus-visible { outline-color: var(--accent); box-shadow: 0 0 10px rgba(var(--xh-neb-2), .35); }
