/* Page-scoped overrides. 全部经 tokens.css 变量取值。
   跨页复用的组件 → components.css；只有单页用到的写这里。 */

/* ── 风险带 / 粗估标记（跨页共用的数据语义，挂在语义色锚点上）── */
.band-P1 { color: var(--band-p1); font-weight: 700; }
.band-P2 { color: var(--band-p2); font-weight: 700; }
.band-P3 { color: var(--band-p3); font-weight: 700; }
.band-out { color: var(--text-tertiary); font-style: italic; }
/* ≈ coarse（模型默认粗估）永远不冒充 live 分数 — 浅色 + 斜体 */
.is-coarse { opacity: 0.7; font-style: italic; }

/* ── route_map / heat_map 地图容器 ───────────────────────────── */
.route-map-box {
  margin-top: var(--sp-3);
  min-height: clamp(420px, 56vh, 680px);
  position: relative;
  border: 1px solid var(--line-subtle);
  border-radius: var(--radius-card);
  overflow: hidden;
  background: var(--bg-page);
}

/* ── risk / gps 分数块 ───────────────────────────────────────── */
.score-card .score-row {
  display: flex;
  gap: var(--sp-5);
  align-items: center;
  margin-bottom: var(--sp-3);
}
.score-num {
  font-size: var(--fs-display);
  line-height: var(--lh-display);
  font-weight: 900;
  font-variant-numeric: tabular-nums;
}
.score-band { font-weight: 700; }
.score-meta { color: var(--text-tertiary); font-size: var(--fs-sm); }
.caveat-list {
  margin: var(--sp-2) 0 0;
  padding-left: var(--sp-5);
  color: var(--text-tertiary);
  font-size: var(--fs-sm);
}

/* ── portal / login 门面 ─────────────────────────────────────── */
.portal-hero h1 {
  font-size: var(--fs-display);
  line-height: var(--lh-display);
  font-weight: 900;
  letter-spacing: var(--track-title);
  margin: var(--sp-1) 0 var(--sp-2);
}
.portal-hero h1 .zh {
  display: block;
  font-size: var(--fs-lg);
  line-height: var(--lh-lg);
  color: var(--text-tertiary);
  font-weight: var(--fw-aux);
  letter-spacing: 0;
  margin-top: var(--sp-1);
}
.brandline { display: flex; flex-wrap: wrap; gap: var(--sp-1); margin: var(--sp-2) 0 var(--sp-4); }
body[data-page="portal"] .actions { margin-bottom: var(--sp-5); }

/* ── status 页磁贴（实测磁贴 = 值 + 极小名 + xs 灰来源）──────── */
.status-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: var(--sp-3);
  margin: var(--sp-3) 0;
}
.status-tile { text-align: center; margin: 0; }
.status-val {
  font-size: var(--fs-lg);
  line-height: var(--lh-lg);
  font-weight: var(--fw-title);
  font-variant-numeric: tabular-nums;
}
.status-name {
  display: block;
  font-size: var(--fs-xs);
  line-height: var(--lh-xs);
  letter-spacing: var(--track-aux);
  text-transform: uppercase;
  color: var(--text-tertiary);
  margin-top: var(--sp-1);
}
.status-sub { font-size: var(--fs-xs); color: var(--text-tertiary); margin: 0; }

/* ── 首页 · Industrial Terminal OS（对角线视窗 + 右侧控制台）────
   全屏接管：隐藏站点头/侧栏/页脚/抽屉。禁令：零 border-radius /
   零 box-shadow / 零按钮背景色；辅助小字强制大写 + 0.05em 字距。 */
body.page-home {
  --h-text: #1A1A1A;
  --h-meta: #767676;
  --h-amber: #D97706;
  --h-line: #E2E2DD;
  position: relative;
  height: 100vh;
  overflow: hidden;
}
body.page-home .site-header,
body.page-home .site-footer,
body.page-home .sidebar,
body.page-home .drawer,
body.page-home .drawer-scrim { display: none; }
/* 首页自带品牌（内容里的 h-brand）；壳层重复的那份隐藏。
   ⋮ 磨砂侧栏首页同样常驻（左缘命中层会盖住视窗一角，刻意如此）。 */
body.page-home > .h-brand { display: none; }
body.page-home .shell,
body.page-home .shell.with-sidebar {
  display: block; max-width: none; margin: 0; padding: 0;
}
body.page-home .main,
body.page-home .shell.with-sidebar .main,
body.page-home[data-auth="anon"] .main {
  max-width: none; margin: 0; padding: 0;
}
body.page-home button,
body.page-home input { font-family: inherit; }
/* 首页禁令绝对：此页子树一律零圆角零阴影（含隐藏的壳层元素） */
body.page-home * { border-radius: 0 !important; box-shadow: none !important; }

/* A · 左上角品牌印记（首页与内部页共用 —— 完全一致，故不加页面前缀） */
.h-meta {
  font-size: 12px; font-weight: 400; line-height: 1.6;
  letter-spacing: 0.05em; text-transform: uppercase;
  color: var(--h-meta, #767676);
}
.h-brand {
  --h-text: #1A1A1A;
  --h-meta: #767676;
  /* fixed（首页无滚动，与 absolute 观感一致）；内部页滚动时品牌钉在左上角 */
  position: fixed; top: 48px; left: 48px; z-index: 15;
}
.h-brand-name {
  font-size: 32px; font-weight: 800; letter-spacing: -0.01em;
  line-height: 1.1; color: var(--h-text);
}
.h-brand-sub { margin-top: 8px; }

/* B · 右上角极简登录 / 账号 */
body.page-home .h-login {
  position: absolute; top: 48px; right: 48px;
  font-size: 12px; font-weight: 500;
  letter-spacing: 0.05em; text-transform: uppercase;
  color: var(--h-meta); text-decoration: none;
  padding-bottom: 3px; border-bottom: 1px solid transparent;
  transition: color var(--dur) ease-out, border-color var(--dur) ease-out;
}
body.page-home .h-login:hover,
body.page-home .h-login:focus-visible {
  color: var(--h-text); border-bottom-color: var(--h-text); outline: none;
}

/* C · 左下角动态数据视窗（上 + 右渐变蒙版融入米白） */
body.page-home .h-viz-wrap {
  position: absolute; bottom: 0; left: 0;
  width: 55%; height: 65%;
}
body.page-home .h-viewport {
  position: absolute; inset: 0;
  -webkit-mask-image:
    linear-gradient(to top, #000 60%, transparent 100%),
    linear-gradient(to right, #000 60%, transparent 100%);
  -webkit-mask-composite: source-in;
  mask-image:
    linear-gradient(to top, #000 60%, transparent 100%),
    linear-gradient(to right, #000 60%, transparent 100%);
  mask-composite: intersect;
}
body.page-home .h-viz {
  position: absolute; inset: 0; opacity: 0;
  transition: opacity 0.4s ease-in-out;
}
body.page-home .h-viz.is-active { opacity: 1; }
body.page-home .h-viz svg { width: 100%; height: 100%; display: block; }
body.page-home .h-viz-tag { position: absolute; top: 0; right: 0; z-index: 3; }

/* D · 右侧控制台 */
body.page-home .h-console {
  position: absolute; right: 48px; top: 120px; bottom: 48px; width: 40%;
  display: flex; flex-direction: column;
}
body.page-home .h-search-block { margin-top: auto; margin-bottom: auto; }
body.page-home .h-search-label {
  margin-bottom: 12px; transition: color var(--dur) ease-out;
}
body.page-home .h-search-block:focus-within .h-search-label { color: var(--h-text); }
body.page-home .h-form { margin: 0; }
body.page-home .h-search-wrap { position: relative; }
body.page-home .h-route-input {
  display: block; width: 100%;
  border: none; border-bottom: 1px solid var(--h-text);
  background: transparent;
  font-size: 28px; font-weight: 300; color: var(--h-text);
  padding: 0 0 10px; outline: none; caret-color: var(--h-amber);
}
body.page-home .h-route-input::placeholder { color: var(--h-text); opacity: 0.4; }
body.page-home .h-search-wrap.is-pulse .h-route-input {
  border-bottom-color: var(--h-amber);
  transition: border-color 400ms ease-out;
}
body.page-home .h-search-links {
  margin-top: 16px; display: flex; gap: 12px; align-items: baseline;
}
body.page-home .h-aux {
  font-size: 12px; letter-spacing: 0.05em; text-transform: uppercase;
  color: var(--h-meta); text-decoration: none;
  transition: color var(--dur) ease-out;
}
body.page-home .h-aux:hover,
body.page-home .h-aux:focus-visible { color: var(--h-text); outline: none; }
body.page-home .h-sep { color: var(--h-meta); font-size: 12px; }

/* 联想下拉：悬浮绝对定位，z-index 9999 防截断 */
body.page-home .h-ac {
  position: absolute; left: 0; right: 0; top: calc(100% + 10px);
  z-index: 9999; list-style: none;
  background: var(--bg-page); border: 1px solid var(--h-line);
}
body.page-home .h-ac[hidden] { display: none; }
body.page-home .h-ac-item {
  position: relative; padding: 10px 12px;
  font-size: 14px; color: var(--h-meta); cursor: pointer;
  border-bottom: 1px solid var(--h-line);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  transition: color var(--dur) ease-out;
}
body.page-home .h-ac-item:last-child { border-bottom: none; }
body.page-home .h-ac-id {
  font-size: 12px; letter-spacing: 0.05em; text-transform: uppercase;
  margin-right: 10px;
}
body.page-home .h-ac-item:hover,
body.page-home .h-ac-item.is-cursor { color: var(--h-text); }
body.page-home .h-ac-item:hover::before,
body.page-home .h-ac-item.is-cursor::before {
  content: ""; position: absolute; left: 0; top: 0; bottom: 0;
  width: 2px; background: var(--h-text);
}

/* 模块切换器：贴近底部，与搜索框 ≥80px 空白 */
body.page-home .h-module { margin-top: 80px; }
body.page-home .h-module-title {
  margin-top: 12px;
  font-size: 32px; font-weight: 800; letter-spacing: -0.01em;
  line-height: 1.15; color: var(--h-text);
}
body.page-home .h-module-zh { margin-top: 8px; }
body.page-home .h-module-nav {
  margin-top: 24px; display: flex; align-items: baseline; gap: 12px;
  font-size: 14px; color: var(--h-meta);
}
body.page-home .h-arrow {
  border: none; background: none; padding: 0; line-height: 1;
  font-size: 14px; color: var(--h-meta); cursor: pointer;
  transition: color var(--dur) ease-out, transform var(--dur) ease-out;
}
body.page-home .h-prev:hover,
body.page-home .h-prev:focus-visible {
  color: var(--h-text); transform: translateX(-3px); outline: none;
}
body.page-home .h-next:hover,
body.page-home .h-next:focus-visible {
  color: var(--h-text); transform: translateX(3px); outline: none;
}
body.page-home .h-count {
  font-variant-numeric: tabular-nums; letter-spacing: 0.05em;
}
body.page-home .h-claim {
  margin-top: 24px;
  font-size: 12px; font-weight: 400; line-height: 1.8;
  letter-spacing: 0.02em; color: var(--h-meta);
}

@media (max-width: 1100px) {
  .h-brand { top: 32px; left: 32px; }
  .h-brand-name { font-size: 24px; }
  body.page-home .h-login { top: 32px; right: 32px; }
  body.page-home .h-console { right: 32px; top: 96px; bottom: 32px; width: 42%; }
  body.page-home .h-route-input { font-size: 20px; }
  body.page-home .h-module-title { font-size: 24px; }
}

/* 路线列表空态里的引导链接行（routes 页共用） */
.home-links {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-2) var(--sp-4);
  margin-top: var(--sp-4);
}

/* ── 路线列表页 ─────────────────────────────────────────────── */
.route-link {
  font-size: var(--fs-lg);
  line-height: var(--lh-lg);
  font-weight: 700;
}
body[data-page="routes"] .page-head-side .btn-ghost { margin-top: 0; }

/* ── 加路线向导（命名 → 选点 → 预览 → 提交）───────────────── */
.wiz-steps {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-1) var(--sp-4);
  margin: var(--sp-3) 0 var(--sp-4);
}
.wiz-steps span {
  color: var(--text-tertiary);
  padding-bottom: 2px;
}
.wiz-steps span.is-active {
  color: var(--text-primary);
  border-bottom: 1px solid var(--text-primary);
}
.wizard-panel {
  margin-top: var(--sp-4);
}
body[data-page="route_new"] .actions {
  margin-top: var(--sp-4);
}
body[data-page="route_new"] #wiz-points {
  margin-top: var(--sp-3);
}
body[data-page="route_new"] #wiz-map-section {
  margin-top: var(--sp-3);
}

/* ── 文档页（about / api_docs）：section 纵向节奏 ───────────── */
body[data-page="about"] .card,
body[data-page="docs_api"] .card {
  margin: var(--sp-5) 0;
}

/* ── risk 页：分布块 / 分数条 / 聊天卡 ───────────────────────── */
.band-bg-P1 { background: var(--band-p1); }
.band-bg-P2 { background: var(--band-p2); }
.band-bg-P3 { background: var(--band-p3); }
.risk-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--sp-2);
}
.risk-filter-form {
  display: flex;
  gap: var(--sp-2);
  align-items: center;
}
.risk-filter-form label { margin: 0; }
.risk-summary { margin-top: var(--sp-4); }
.risk-summary:empty { display: none; }
.risk-dist {
  display: flex;
  gap: var(--sp-6);
  justify-content: center;
  flex-wrap: wrap;
  margin: var(--sp-5) 0;
}
.risk-dist-item { text-align: center; }
.risk-dist-num {
  font-size: var(--fs-display);
  line-height: var(--lh-display);
  font-weight: var(--fw-title);
  font-variant-numeric: tabular-nums;
}
.risk-bar-block { margin: var(--sp-4) 0; }
.risk-bar-head {
  display: flex;
  justify-content: space-between;
  margin-bottom: var(--sp-1);
}
.risk-bar {
  display: flex;
  height: var(--sp-2);
  border-radius: var(--radius-card);
  overflow: hidden;
  background: var(--line-subtle);
}
.risk-bar-seg {
  width: 0;
  transition: width var(--dur) var(--ease);
}
.risk-rows { margin-top: var(--sp-2); }
.chat-note { margin: var(--sp-1) 0 var(--sp-3); }
.chat-log {
  max-height: 30rem;
  overflow: auto;
  display: flex;
  flex-direction: column;
  gap: var(--sp-2);
}
.chat-form {
  display: flex;
  gap: var(--sp-2);
  margin-top: var(--sp-3);
}
.chat-input { flex: 1; }

/* ── gps 页 ─────────────────────────────────────────────────── */
body[data-page="gps"] .card .table-wrap {
  margin-top: var(--sp-2);
}
#gps-result {
  margin: var(--sp-4) 0;
}
#gps-result:empty { display: none; }
.doc-note { margin-top: var(--sp-2); }