/*! 共享样式合并包（性能审计 S7，构建期生成，请勿手改）
 * 文件名哈希 = 下列来源按序拼接内容的 sha256 前 8 位 = 1d7e2d6a（不含本注释；本注释仅说明来源）。
 * 来源顺序（与合并前 BaseLayout 链接顺序一致）：
 *   /styles/global.css
 *   /shared/v1/tokens.css
 *   /shared/v1/ui.css
 *   /styles/night3.css
 *   /styles/night4.css
 *   /styles/electronic-blackcat.css
 *   /shared/v1/cursor.css
 *   /shared/v1/cursor-motion.css
 */
*{box-sizing:border-box}html{background:var(--background);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei","Noto Sans CJK SC",sans-serif;line-height:1.7}body{margin:0}a{color:var(--brand)}a:focus-visible{outline:3px solid var(--focus);outline-offset:3px}.skip-link{position:absolute;left:-9999px}.skip-link:focus{left:var(--space-md);top:var(--space-md);z-index:10;background:var(--surface);padding:var(--space-sm) var(--space-md)}.site-header{border-bottom:1px solid var(--border);background:rgba(17,19,27,.95)}.nav{max-width:var(--max-width);margin:auto;padding:var(--space-md);display:flex;align-items:center;justify-content:space-between;gap:var(--space-lg)}.brand{font-size:1.15rem;font-weight:800;text-decoration:none}.nav-links{display:flex;align-items:center;gap:var(--space-md);flex-wrap:wrap}.nav-links a{text-decoration:none}.nav-links [aria-current=page]{color:var(--text);font-weight:700}.planned{color:var(--muted);display:inline-flex;align-items:center;gap:6px}.planned small,.badge{border:1px solid var(--border);border-radius:999px;padding:1px 7px;font-size:.72rem}.wrap{max-width:var(--max-width);margin:auto;padding:var(--space-section) var(--space-md)}.hero{display:grid;grid-template-columns:1.3fr .7fr;gap:var(--space-xl);align-items:center}.eyebrow{color:var(--brand);font-weight:700}.hero h1{font-size:clamp(2.2rem,6vw,4.8rem);line-height:1.05;margin:.2em 0}.lead{font-size:1.15rem;color:var(--muted);max-width:44rem}.actions{display:flex;gap:var(--space-md);flex-wrap:wrap;margin-top:var(--space-lg)}.button{display:inline-flex;min-height:44px;align-items:center;padding:8px 18px;border-radius:var(--radius-control);background:var(--brand);color:var(--background);text-decoration:none;font-weight:800}.button.secondary{background:transparent;color:var(--text);border:1px solid var(--border)}.cat-card,.card{border:1px solid var(--border);border-radius:var(--radius-card);background:var(--surface);padding:var(--space-lg)}.cat-card{font-size:clamp(4rem,12vw,8rem);text-align:center}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:var(--space-md)}section+section{margin-top:var(--space-section)}h2{line-height:1.2}.muted,.empty{color:var(--muted)}.empty{border:1px dashed var(--border);border-radius:var(--radius-card);padding:var(--space-lg)}footer{max-width:var(--max-width);margin:auto;border-top:1px solid var(--border);padding:var(--space-lg) var(--space-md);color:var(--muted);display:flex;justify-content:space-between;gap:var(--space-md);flex-wrap:wrap}@media(max-width:760px){.nav{align-items:flex-start;flex-direction:column}.nav-links{gap:12px}.planned small{display:none}.hero{grid-template-columns:1fr}.cat-card{order:-1;padding:var(--space-md)}.wrap{padding-top:var(--space-xl)}}@media(prefers-reduced-motion:no-preference){a{transition:color var(--motion-fast),background var(--motion-fast)}}.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
/* blackcat-web 共享设计变量 · 发布版本 v1（阶段一第2晚冻结） */
/* 唯一来源: packages/design-system/design-tokens.json；本文件由 build-shared.mjs 确定性生成，请勿手改。 */
:root {
  /* colors */
  --background: #11131B;
  --surface: #1B1F2B;
  --text: #F5F2EB;
  --muted: #B7BDCA;
  --border: #636D89;
  --brand: #F5C76B;
  --on-brand: #11131B;
  --brand-hover: #E1AC45;
  --brand-active: #BE8428;
  --surface-hover: #262C3E;
  --success: #74D8AD;
  --warning: #F5C76B;
  --danger: #FF8F9B;
  --focus: #8CC8FF;
  --electric: #7DE4D0;
  --danger-bg: #3F313D;
  --warning-bg: #3E3A35;
  --success-bg: #293D40;
  --control-disabled-bg: #2A2F3E;
  --control-disabled-text: #8F98AC;
  /* spacing */
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;
  --space-section: 64px;
  /* radius */
  --radius-control: 8px;
  --radius-card: 16px;
  /* layout */
  --max-width: 1200px;
  --article-width: 720px;
  /* fonts */
  --font-sans: -apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans CJK SC","Source Han Sans SC",sans-serif;
  --font-mono: ui-monospace,"SF Mono","Cascadia Mono",Consolas,"Liberation Mono",monospace;
  /* motion */
  --motion-fast: 120ms;
  --motion-normal: 180ms;
  /* 站点强调色别名：默认 = 官网琥珀金；页面按 data-site 切换 */
  --site-accent: var(--brand);
}
html[data-site="home"] {
  --site-accent: #F5C76B;
}
html[data-site="status"] {
  --site-accent: #74D8AD;
}
html[data-site="kb"] {
  --site-accent: #91BCFF;
}
html[data-site="gallery"] {
  --site-accent: #E6A2CD;
}
html[data-site="tools"] {
  --site-accent: #B7D98A;
}
/* blackcat-web 共享组件样式 · 发布版本 v1（阶段一第2晚冻结） */
/* 与 tokens.css 配套发布；所有取色均经 var() 引用 tokens.css，无独立色值来源。 */

/* ---------- 基础 ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { background: var(--background); color: var(--text); }
body {
  margin: 0;
  font-family: var(--font-sans);
  font-size: 16px;
  line-height: 1.7;
  background: var(--background);
  color: var(--text);
  -webkit-text-size-adjust: 100%;
}
h1, h2, h3, h4, h5, h6 { line-height: 1.25; margin: 0 0 0.5em; }
a { color: var(--site-accent); }
a:hover { text-decoration: underline; }
:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
img { max-width: 100%; height: auto; }
code, kbd, samp, pre { font-family: var(--font-mono); }
pre {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-control);
  padding: var(--space-md);
  overflow-x: auto;
}
[hidden] { display: none !important; }

/* ---------- 无障碍跳转 ---------- */
.skip-link {
  position: absolute; left: -9999px; top: auto; width: 1px; height: 1px; overflow: hidden;
}
.skip-link:focus {
  position: fixed; left: var(--space-md); top: var(--space-md);
  width: auto; height: auto; overflow: visible; z-index: 100;
  background: var(--surface); color: var(--text);
  border: 1px solid var(--focus); border-radius: var(--radius-control);
  padding: var(--space-sm) var(--space-md); text-decoration: none;
}

/* ---------- 布局容器 ---------- */
.container, .wrap {
  width: 100%; max-width: var(--max-width);
  margin-inline: auto; padding-inline: var(--space-md);
}
.wrap { padding-block: var(--space-xl) var(--space-section); }
.grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(230px, 100%), 1fr));
  gap: var(--space-md);
}

/* ---------- 按钮（主/次/禁用/焦点） ---------- */
.button {
  display: inline-flex; align-items: center; justify-content: center;
  gap: var(--space-sm);
  min-height: 44px;                       /* 触控目标 ≥44px */
  padding: 0 var(--space-lg);
  border: 1px solid transparent;
  border-radius: var(--radius-control);
  background: var(--brand);               /* 官网强调色：琥珀金 */
  color: var(--on-brand);
  font: inherit; font-weight: 700; text-decoration: none; cursor: pointer;
  transition: background-color var(--motion-fast), border-color var(--motion-fast),
              color var(--motion-fast), transform var(--motion-fast);
}
.button:hover { background: var(--brand-hover); }
.button:active { background: var(--brand-active); transform: translateY(1px); }
.button.secondary {
  background: transparent; border-color: var(--border); color: var(--text);
}
.button.secondary:hover { background: var(--surface-hover); border-color: var(--muted); }
.button.secondary:active { background: var(--surface); }
/* 禁用态（放最后，优先于悬停规则；WCAG 对禁用控件不要求对比度，仍保持可辨识） */
.button:disabled, .button[aria-disabled="true"] {
  background: var(--control-disabled-bg);
  color: var(--control-disabled-text);
  border-color: transparent;
  cursor: not-allowed;
  transform: none;
  pointer-events: none;
}

/* ---------- 卡片 ---------- */
.card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-card);
  padding: var(--space-lg);
  color: var(--text);
}
a.card--link, .card--link {
  display: block; text-decoration: none; color: var(--text);
}
.card--link:hover { background: var(--surface-hover); border-color: var(--muted); text-decoration: none; }

/* ---------- 状态提示：错误 / 过期(警告) / 成功 / 空 / 加载 ---------- */
.notice {
  display: flex; align-items: flex-start; gap: var(--space-sm);
  padding: var(--space-md) var(--space-lg);
  border: 1px solid; border-radius: var(--radius-control);
  background: var(--surface); color: var(--text);
  margin: 0 0 var(--space-md);
}
.notice__icon { flex: none; line-height: 1.4; }
.notice--error   { background: var(--danger-bg);  border-color: var(--danger);  }
.notice--warning { background: var(--warning-bg); border-color: var(--warning); }
.notice--success { background: var(--success-bg); border-color: var(--success); }
.notice--error .notice__icon   { color: var(--danger);  }
.notice--warning .notice__icon { color: var(--warning); }
.notice--success .notice__icon { color: var(--success); }
.empty {
  color: var(--muted);
  border: 1px dashed var(--border);
  border-radius: var(--radius-card);
  padding: var(--space-lg);
  margin: 0;
}
.loading {
  display: inline-flex; align-items: center; gap: var(--space-sm);
  color: var(--muted); margin: 0;
}
.loading::before {
  content: ""; width: 16px; height: 16px; flex: none;
  border-radius: 50%;
  border: 2px solid var(--border);
  border-top-color: var(--site-accent);
  animation: bc-spin 700ms linear infinite;
}
@keyframes bc-spin { to { transform: rotate(360deg); } }

/* ---------- 导航 ---------- */
.site-header { background: var(--background); border-bottom: 1px solid var(--border); }
.nav {
  width: 100%; max-width: var(--max-width);
  margin-inline: auto; padding: var(--space-sm) var(--space-md);
  display: flex; align-items: center; justify-content: space-between;
  gap: var(--space-lg); flex-wrap: wrap;
}
.brand {
  display: inline-flex; align-items: center; gap: var(--space-xs);
  min-height: 44px; padding: 0 var(--space-xs);
  font-size: 1.15rem; font-weight: 800; text-decoration: none; color: var(--text);
}
.brand:hover { text-decoration: none; color: var(--site-accent); }
.nav-links { display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-xs); }
.nav-links a {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 44px;                     /* 触控目标 ≥44px */
  padding: 0 var(--space-sm);
  border-radius: var(--radius-control);
  color: var(--muted); font-weight: 600; text-decoration: none;
  transition: color var(--motion-fast), background-color var(--motion-fast);
}
.nav-links a:hover { color: var(--text); background: var(--surface-hover); text-decoration: none; }
.nav-links [aria-current="page"] {
  color: var(--text); background: var(--surface-hover);
  box-shadow: inset 0 -2px 0 var(--site-accent);
}
.planned {
  display: inline-flex; align-items: center; gap: var(--space-xs);
  min-height: 44px; padding: 0 var(--space-sm); color: var(--muted);
}
.planned small, .badge {
  border: 1px solid var(--border); border-radius: 999px;
  padding: 1px 7px; font-size: 0.72rem; color: var(--muted); white-space: nowrap;
}

/* ---------- 页脚 ---------- */
footer, .site-footer {
  margin-top: var(--space-section);
  border-top: 1px solid var(--border);
  color: var(--muted);
  padding: var(--space-lg) var(--space-md);
  display: flex; justify-content: space-between; align-items: center;
  gap: var(--space-md); flex-wrap: wrap;
}
footer a, .site-footer a { color: var(--muted); }
footer a:hover, .site-footer a:hover { color: var(--text); }

/* ---------- 响应式 ---------- */
@media (max-width: 760px) {
  .nav { flex-direction: column; align-items: flex-start; gap: var(--space-sm); }
  .nav-links { flex-direction: column; align-items: stretch; width: 100%; }
  .nav-links a { justify-content: flex-start; width: 100%; }
  .planned { padding-inline: var(--space-sm); }
  footer, .site-footer { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 480px) {
  .card { padding: var(--space-md); }
  .notice { padding: var(--space-sm) var(--space-md); }
}

/* ---------- 减少动态效果 ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  .loading::before { animation: none; border-top-color: var(--border); }
}
.home-section{margin-top:clamp(3rem,8vw,6rem)}
.hero-visual{padding:0;overflow:hidden;background:linear-gradient(145deg,rgba(242,188,102,.16),rgba(154,205,255,.08))}
.hero-visual img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}
.hero-visual figcaption{padding:.75rem 1rem;color:var(--muted);font-size:.9rem}
.project-card{display:flex;flex-direction:column;gap:.75rem}
.project-card img,.project-cover{display:block;width:100%;height:auto;border-radius:calc(var(--radius-card) - 6px);background:var(--background)}
.tag-list{display:flex;flex-wrap:wrap;gap:.5rem;margin:.75rem 0;padding:0;list-style:none}
.tag-list li{border:1px solid var(--border);border-radius:999px;padding:.15rem .65rem;color:var(--muted);font-size:.85rem}
.status-line{display:flex;align-items:flex-start;gap:.65rem}
.status-dot{width:.8rem;height:.8rem;margin-top:.45rem;border-radius:50%;background:var(--muted);flex:none}
.status-dot[data-state="operational"]{background:#7bdcb5}
.status-dot[data-state="degraded"]{background:#f2bc66}
.status-dot[data-state="outage"]{background:#ff7d8c}
.quote-card blockquote{margin:0;font-size:clamp(1.2rem,3vw,1.65rem);line-height:1.55}
.quote-card cite{display:block;margin-top:.75rem;color:var(--muted);font-style:normal}
.meta-list{display:grid;grid-template-columns:max-content 1fr;gap:.4rem 1rem;margin:1.25rem 0}
.meta-list dt{font-weight:700}.meta-list dd{margin:0;color:var(--muted)}
@media(max-width:760px){.hero-visual{order:-1}.home-section{margin-top:3rem}.meta-list{grid-template-columns:1fr;gap:.15rem}.meta-list dd{margin-bottom:.65rem}}
/* 第4晚资源水位区：套餐余额与 Token 消耗卡片 */

.usage-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-lg);
  margin-top: var(--space-lg);
}
.usage-card { display: flex; flex-direction: column; gap: .7rem; min-width: 0; }
.usage-head h3 { margin: 0; }
.usage-sub { margin: .15rem 0 0; color: var(--muted); font-size: .88rem; }
.usage-status { margin: 0; color: var(--muted); }

.usage-providers { display: flex; flex-direction: column; gap: 1.05rem; }
.usage-provider h4 { margin: 0 0 .55rem; font-size: .98rem; }
.usage-windows { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .7rem; }
.usage-window { display: grid; gap: .3rem; }
.usage-window-head {
  display: flex; justify-content: space-between; align-items: baseline;
  gap: var(--space-sm); font-size: .92rem;
}
.usage-remaining { font-weight: 700; }
.usage-bar {
  height: .55rem; border-radius: 999px;
  background: var(--control-disabled-bg); overflow: hidden;
}
.usage-bar-fill {
  display: block; height: 100%; border-radius: inherit;
  background: var(--success);
  transition: width var(--motion-normal);
}
.usage-bar.is-low .usage-bar-fill { background: var(--danger); }
.usage-window-meta { color: var(--muted); font-size: .8rem; }
.usage-provider-error { margin: 0; color: var(--muted); }
.usage-meta { margin: 0; color: var(--muted); font-size: .85rem; }

.tokens-card { gap: .85rem; }
.token-seg { display: flex; flex-direction: column; gap: .55rem; min-width: 0; }
.token-seg-title { margin: 0; font-size: 1rem; }
.token-seg .usage-sub { margin: 0; }
.token-seg-divider { border: 0; border-top: 1px solid var(--border); opacity: .55; margin: .15rem 0 .35rem; }
.tokens-card .usage-meta { margin: 0; }
.tu-sep { margin: 0 .35rem; color: var(--muted); }
.token-total {
  display: flex; align-items: baseline; gap: .45rem;
  margin-top: .05rem; color: var(--muted); font-size: .82rem;
  letter-spacing: .02em;
}
.token-total[hidden] { display: none; }
.token-total strong {
  color: var(--text); font-size: clamp(1.35rem, 3vw, 1.8rem);
  line-height: 1.1; font-weight: 750; font-variant-numeric: tabular-nums;
}

.token-chart { position: relative; min-width: 0; overflow: visible; }
.token-chart svg { display: block; width: 100%; height: auto; min-height: 9rem; }
.token-chart .token-segment { shape-rendering: crispEdges; }
.token-chart .series-cache-read { fill: #A8D4FF; }
.token-chart .series-input { fill: #4096FF; }
.token-chart .series-output { fill: #1668DC; }
/* 任务 D：智谱（ZCode）系列——紫色系与既有蓝系区分 */
.token-chart .series-zhipu { fill: #9254DE; }
/* 任务 D：夜间免费窗（23:00–09:00 Asia/Shanghai）底纹——低饱和琥珀，只作区间标注不作数据 */
.token-chart .token-night-band { fill: #FFD666; opacity: .10; }
.token-chart .token-axis { stroke: var(--border); stroke-width: 1; }
.token-chart .token-grid { stroke: var(--border); stroke-width: 1; opacity: .4; }
.token-chart .token-hover-line {
  stroke: var(--muted); stroke-width: 1; stroke-dasharray: 2 3; opacity: .72;
  pointer-events: none;
}
.token-chart .token-hover-line[hidden] { display: none; }
.token-chart text { fill: var(--muted); font-size: 10px; }
.token-chart .token-axis-label { font-size: 9px; }
.token-chart .token-tick { font-variant-numeric: tabular-nums; }

.usage-controls { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .4rem .95rem; }
.usage-controls[hidden] { display: none; }
.usage-toggle {
  display: inline-flex; align-items: center; gap: .35rem;
  min-height: 44px;
  font-size: .82rem; color: var(--muted); cursor: pointer; user-select: none;
}
.usage-toggle input { width: .92rem; height: .92rem; accent-color: #4096FF; cursor: pointer; }
.usage-swatch {
  display: inline-block; flex: 0 0 auto; width: .65rem; height: .65rem;
  border-radius: 1px; background: var(--muted);
}
.usage-swatch.series-cache-read { background: #A8D4FF; }
.usage-swatch.series-input { background: #4096FF; }
.usage-swatch.series-output { background: #1668DC; }
.usage-swatch.series-zhipu { background: #9254DE; }

.token-tip {
  position: absolute; z-index: 5; pointer-events: none;
  min-width: 11rem; max-width: 15rem;
  margin: 0; padding: .5rem .65rem .55rem;
  border: 1px solid var(--border); border-radius: 8px;
  background: var(--surface-hover); color: var(--text);
  box-shadow: 0 8px 22px rgba(0, 0, 0, .28);
  font-size: .78rem; line-height: 1.45;
}
.token-tip[hidden] { display: none; }
.token-tip-head {
  display: flex; align-items: baseline; justify-content: space-between; gap: .8rem;
  margin: 0 0 .35rem; font-weight: 700; white-space: nowrap;
}
.token-tip-total { font-variant-numeric: tabular-nums; }
.token-tip-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .16rem; }
.token-tip-item { display: flex; align-items: center; gap: .35rem; white-space: nowrap; }
.token-tip-name { color: var(--muted); }
.token-tip-val { margin-left: auto; font-weight: 600; font-variant-numeric: tabular-nums; }
.token-tip-cost, .token-tip-previous {
  margin: .35rem 0 0; padding-top: .3rem; border-top: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
  white-space: nowrap; font-variant-numeric: tabular-nums;
}
.token-tip-previous[hidden] { display: none; }

@media (max-width: 760px) {
  .usage-grid { grid-template-columns: 1fr; }
  .usage-controls { justify-content: flex-start; gap: .45rem .7rem; }
  .token-chart svg { min-width: 0; }
  .token-tip { max-width: min(15rem, calc(100% - .5rem)); }
}
@media (prefers-reduced-motion: reduce) {
  .usage-bar-fill { transition: none; }
}
/* 电子黑猫共享视觉层 · 2026-09-16
 * 数值来自 /shared/v1/tokens.css；猫瞳青为 --electric。
 */
html { scroll-behavior: smooth; }
body {
  min-width: 0;
  overflow-x: clip;
  background:
    radial-gradient(circle at 88% -8%, color-mix(in srgb, var(--electric) 9%, transparent) 0, transparent 30rem),
    radial-gradient(circle at 8% 18%, color-mix(in srgb, var(--brand) 5%, transparent) 0, transparent 26rem),
    var(--background);
}
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  opacity: .15;
  background-image:
    linear-gradient(color-mix(in srgb, var(--electric) 16%, transparent) 1px, transparent 1px),
    linear-gradient(90deg, color-mix(in srgb, var(--electric) 16%, transparent) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: linear-gradient(to bottom, black, transparent 56rem);
}

.bc-header {
  position: relative;
  z-index: 20;
  border-color: color-mix(in srgb, var(--electric) 22%, var(--border));
  background: color-mix(in srgb, var(--background) 92%, transparent);
  backdrop-filter: blur(14px);
}
.bc-header-inner { min-height: 68px; }
.bc-brand { gap: var(--space-sm); letter-spacing: -.02em; }
.bc-brand-mark {
  display: inline-grid;
  width: 34px;
  height: 34px;
  place-items: center;
  flex: none;
  color: var(--electric);
  border: 1px solid color-mix(in srgb, var(--electric) 70%, var(--border));
  border-radius: 12px 12px 12px 5px;
  background: color-mix(in srgb, var(--electric) 7%, var(--surface));
  box-shadow: 0 0 20px color-mix(in srgb, var(--electric) 16%, transparent);
}
.bc-brand-mark svg { width: 25px; height: 25px; }
.bc-brand-copy { display: grid; line-height: 1.05; }
.bc-brand-copy small {
  margin-top: 4px;
  color: var(--muted);
  font: 650 .58rem/1 var(--font-mono);
  letter-spacing: .14em;
}
.bc-nav-link { position: relative; }
.bc-nav-link::after {
  content: "";
  position: absolute;
  right: 8px;
  bottom: 6px;
  left: 8px;
  height: 1px;
  transform: scaleX(0);
  background: var(--electric);
  transition: transform var(--motion-fast);
}
.bc-nav-link:hover::after,
.bc-nav-link[aria-current="page"]::after { transform: scaleX(1); }

.bc-footer {
  border-color: color-mix(in srgb, var(--electric) 18%, var(--border));
  background: color-mix(in srgb, var(--surface) 86%, var(--background)) !important;
}
.bc-footer-note { display: inline-flex; align-items: center; gap: var(--space-sm); color: var(--text); }
.bc-footer-pulse {
  width: 7px;
  height: 7px;
  flex: none;
  border-radius: 50%;
  background: var(--electric);
  box-shadow: 0 0 12px var(--electric);
}

.home-relayout {
  width: min(100% - 2rem, var(--max-width));
  margin-inline: auto;
  padding-block: clamp(var(--space-xl), 6vw, var(--space-section)) var(--space-section);
}
.home-relayout > section { position: relative; min-width: 0; }
.home-relayout > section + section { margin-top: clamp(4.5rem, 9vw, 7.5rem); }
.home-kicker {
  margin: 0 0 var(--space-sm);
  color: var(--electric);
  font: 750 .76rem/1.3 var(--font-mono);
  letter-spacing: .13em;
  text-transform: uppercase;
}
.home-section-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: var(--space-lg);
  margin-bottom: var(--space-lg);
}
.home-section-head h2 {
  margin: 0;
  max-width: 18ch;
  font-size: clamp(1.85rem, 4vw, 2.75rem);
  line-height: 1.1;
  letter-spacing: -.035em;
}
.home-section-head > p {
  max-width: 35rem;
  margin: 0;
  color: var(--muted);
}

.home-hero {
  display: grid;
  min-height: min(660px, calc(100vh - 76px));
  grid-template-columns: minmax(0, 1.05fr) minmax(320px, .95fr);
  align-items: center;
  gap: clamp(var(--space-xl), 6vw, 5rem);
}
.home-hero-copy { position: relative; z-index: 1; }
.home-sigil {
  display: inline-grid;
  width: 64px;
  height: 64px;
  margin-bottom: var(--space-lg);
  place-items: center;
  color: var(--electric);
  border: 1px solid color-mix(in srgb, var(--electric) 72%, var(--border));
  border-radius: 22px 22px 22px 8px;
  background: color-mix(in srgb, var(--electric) 8%, var(--surface));
  box-shadow: 0 0 36px color-mix(in srgb, var(--electric) 18%, transparent);
}
.home-sigil svg { width: 48px; height: 48px; }
.home-hero h1 {
  max-width: 10ch;
  margin: 0 0 var(--space-lg);
  font-size: clamp(3rem, 7.3vw, 6rem);
  line-height: .98;
  letter-spacing: -.065em;
}
.home-hero h1 span { color: var(--brand); }
.home-hero .lead { margin: 0; max-width: 37rem; }
.home-actions { display: flex; flex-wrap: wrap; gap: var(--space-sm); margin-top: var(--space-xl); }
.home-actions .button { min-height: 48px; }
.home-hero-art {
  position: relative;
  margin: 0;
  padding: 12px;
  overflow: visible;
  border: 1px solid color-mix(in srgb, var(--electric) 25%, var(--border));
  border-radius: calc(var(--radius-card) + 10px);
  background: linear-gradient(145deg, color-mix(in srgb, var(--electric) 10%, var(--surface)), color-mix(in srgb, var(--brand) 6%, var(--surface)));
  box-shadow: 0 28px 70px color-mix(in srgb, var(--background) 68%, transparent);
}
.home-hero-art::before {
  content: "";
  position: absolute;
  top: -13px;
  right: 28px;
  width: 66px;
  height: 24px;
  border: 1px solid var(--electric);
  border-radius: 50%;
  box-shadow: 0 0 16px color-mix(in srgb, var(--electric) 34%, transparent);
}
.home-hero-art::after {
  content: "";
  position: absolute;
  right: 34px;
  bottom: 38px;
  width: 55px;
  height: 32px;
  border-right: 2px solid color-mix(in srgb, var(--electric) 68%, transparent);
  border-bottom: 2px solid color-mix(in srgb, var(--electric) 68%, transparent);
  border-radius: 0 0 34px;
  transform: rotate(-12deg);
}
.home-hero-art img {
  display: block;
  width: 100%;
  aspect-ratio: 3 / 2;
  object-fit: cover;
  border-radius: var(--radius-card);
}
.home-hero-art figcaption { padding: var(--space-sm) 4px 0; color: var(--muted); font-size: .82rem; }

.home-work-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-md);
}
.home-work-card {
  position: relative;
  display: flex;
  min-width: 0;
  flex-direction: column;
  padding: 0;
  overflow: hidden;
  border-color: color-mix(in srgb, var(--border) 80%, var(--electric));
  transition: transform var(--motion-normal), border-color var(--motion-normal), background-color var(--motion-normal);
}
.home-work-card:hover { transform: translateY(-3px); border-color: color-mix(in srgb, var(--electric) 60%, var(--border)); }
.home-work-card img { display: block; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; background: var(--background); }
.home-work-body { display: flex; min-height: 14rem; flex: 1; flex-direction: column; padding: var(--space-lg); }
.home-work-index { color: var(--brand); font: 700 .72rem/1 var(--font-mono); letter-spacing: .12em; }
.home-work-card h3 { margin: var(--space-sm) 0; font-size: 1.35rem; }
.home-work-card .muted { margin: 0; }
.home-work-card .home-card-link { margin-top: auto; padding-top: var(--space-lg); }

.home-library {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(280px, .9fr);
  gap: var(--space-md);
}
.home-library-panel {
  min-width: 0;
  padding: clamp(var(--space-lg), 4vw, var(--space-xl));
  border: 1px solid color-mix(in srgb, var(--border) 82%, var(--electric));
  border-radius: var(--radius-card);
  background: linear-gradient(145deg, color-mix(in srgb, var(--electric) 4%, var(--surface)), var(--surface));
}
.home-library-panel h3 { margin-bottom: var(--space-md); }
.home-topic-list { display: flex; flex-wrap: wrap; gap: var(--space-sm); margin: 0 0 var(--space-lg); padding: 0; list-style: none; }
.home-topic-list a {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  gap: var(--space-sm);
  padding: 0 var(--space-md);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 999px;
  text-decoration: none;
}
.home-topic-list a:hover { border-color: var(--electric); background: color-mix(in srgb, var(--electric) 7%, transparent); }
.home-topic-count { color: var(--muted); font-size: .78rem; }
.home-post-list { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.home-post-list li + li { border-top: 1px solid color-mix(in srgb, var(--border) 72%, transparent); }
.home-post-list a { display: block; min-height: 44px; padding: var(--space-md) 0; color: var(--text); text-decoration: none; }
.home-post-list a:hover strong { color: var(--electric); }
.home-post-list strong { display: block; }
.home-post-list small { display: block; margin-top: 3px; color: var(--muted); }
.home-search { display: grid; gap: var(--space-sm); margin-top: var(--space-lg); }
.home-search input { width: 100%; min-width: 0; min-height: 48px; padding: 0 var(--space-md); color: var(--text); border: 1px solid var(--border); border-radius: var(--radius-control); background: var(--background); font: inherit; }
.home-search-actions { display: flex; flex-wrap: wrap; gap: var(--space-sm); }

.home-rooms {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: var(--space-sm);
}
.home-room {
  position: relative;
  display: flex;
  min-width: 0;
  min-height: 148px;
  flex-direction: column;
  justify-content: space-between;
  padding: var(--space-md);
  color: var(--text);
  border: 1px solid color-mix(in srgb, var(--border) 84%, var(--electric));
  border-radius: var(--radius-card);
  background: linear-gradient(180deg, color-mix(in srgb, var(--electric) 5%, var(--surface)), var(--surface));
  text-decoration: none;
}
a.home-room:hover { color: var(--text); border-color: var(--electric); text-decoration: none; }
.home-room-name { display: flex; align-items: center; gap: var(--space-sm); font-weight: 760; line-height: 1.3; }
.home-room-state { color: var(--muted); font-size: .82rem; }
.home-room-purpose { color: var(--muted); font-size: .84rem; }
.home-room-dot { width: 7px; height: 7px; flex: none; border-radius: 50%; background: var(--electric); box-shadow: 0 0 12px var(--electric); }
.home-room--planned .home-room-dot { background: var(--muted); box-shadow: none; }

.home-operations-shell {
  padding: clamp(var(--space-md), 3vw, var(--space-xl));
  border: 1px solid color-mix(in srgb, var(--electric) 22%, var(--border));
  border-radius: calc(var(--radius-card) + 8px);
  background: linear-gradient(160deg, color-mix(in srgb, var(--electric) 5%, var(--surface)), color-mix(in srgb, var(--background) 24%, var(--surface)));
}
.home-status-strip {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--space-lg);
  margin-bottom: var(--space-lg);
  padding: var(--space-md) 0 var(--space-lg);
  border-bottom: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
}
.home-status-main { display: flex; align-items: flex-start; gap: var(--space-sm); }
.home-status-main .status-dot { margin-top: .5rem; }
.home-status-main p { margin: 3px 0 0; }
.home-status-link { min-height: 44px; display: inline-flex; align-items: center; }
.home-operations-shell .usage-grid { margin-top: 0; }
.home-operations-shell .usage-card { background: color-mix(in srgb, var(--surface) 82%, transparent); }
.home-quote {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: var(--space-md);
  align-items: start;
  margin: var(--space-xl) 0 0;
  padding-top: var(--space-lg);
  border-top: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
}
.home-quote-mark { color: var(--electric); font-size: 1.6rem; line-height: 1; }
.home-quote blockquote { margin: 0; color: var(--text); font-size: clamp(1.05rem, 2vw, 1.3rem); }
.home-quote cite { display: block; margin-top: var(--space-xs); color: var(--muted); font-size: .84rem; font-style: normal; }

@media (max-width: 900px) {
  .home-hero { min-height: 0; grid-template-columns: 1fr 1fr; gap: var(--space-xl); }
  .home-hero h1 { font-size: clamp(3rem, 9vw, 4.8rem); }
  .home-work-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-work-card:last-child { grid-column: 1 / -1; }
  .home-rooms { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  html { scroll-behavior: auto; }
  body::before { opacity: .1; background-size: 36px 36px; }
  .bc-header-inner { align-items: stretch; }
  .bc-brand { align-self: flex-start; }
  .bc-nav-links { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bc-nav-links li { border: 0 !important; }
  .bc-nav-link, .bc-nav-planned { justify-content: center !important; min-width: 0; border: 1px solid var(--border); border-radius: var(--radius-control); }
  .home-relayout { width: min(100% - 1.5rem, var(--max-width)); padding-top: var(--space-lg); }
  .home-relayout > section + section { margin-top: 4.5rem; }
  .home-section-head { display: block; }
  .home-section-head > p { margin-top: var(--space-sm); }
  .home-hero { grid-template-columns: 1fr; gap: var(--space-xl); }
  .home-hero-art { order: -1; }
  .home-sigil { width: 54px; height: 54px; margin-bottom: var(--space-md); }
  .home-sigil svg { width: 40px; height: 40px; }
  .home-hero h1 { font-size: clamp(2.9rem, 15vw, 4.3rem); }
  .home-work-grid, .home-library { grid-template-columns: 1fr; }
  .home-work-card:last-child { grid-column: auto; }
  .home-work-body { min-height: 0; }
  .home-rooms { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-room:last-child { grid-column: 1 / -1; }
  .home-status-strip { grid-template-columns: 1fr; gap: var(--space-sm); }
  .home-status-link { justify-self: start; }
}
@media (max-width: 420px) {
  .home-rooms { grid-template-columns: 1fr; }
  .home-room:last-child { grid-column: auto; }
  .home-actions, .home-search-actions { display: grid; grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .home-work-card, .bc-nav-link::after { transition: none; }
  .home-work-card:hover { transform: none; }
  .home-room-dot, .bc-footer-pulse { box-shadow: none; }
}
/* blackcat-web 共享设计包 · 逗猫棒光标（需求 A，2026-09-11 阶段一收尾新增；需求 G 水平镜像） */
/* 五站通用：页面在 <head> 引入本文件即可（建议放在其它样式之后）。 */
/* 设计要点：
   - 默认光标 = 逗猫棒（cat-toy-default.svg），链接/按钮等可点击元素 = 摆动状态（cat-toy-active.svg）；
   - 需求 G（2026-09-11）：两份 SVG 已水平镜像（x→32−x），尖端指向左上角；
     点击热点定在镜像后棒尖（SVG 中羽毛端点，坐标 2 3）；
   - 媒体查询限定「精确指针 + 支持悬停」的设备：触摸设备不命中规则、不会加载光标图；
   - 浏览器不支持 url() 光标时自动回退系统默认（auto / pointer）。 */
@media (hover: hover) and (pointer: fine) {
  html {
    cursor: url('/shared/v1/cat-toy-default.svg') 2 3, auto;
  }
  a,
  button,
  summary,
  label,
  select,
  input[type='submit'],
  input[type='button'],
  [role='button'],
  .button {
    cursor: url('/shared/v1/cat-toy-active.svg') 2 3, pointer;
  }
}
/* blackcat-web 共享设计包 · 逗猫棒光标动效（需求 F，2026-09-11 追加；需求 G 镜像适配） */
/* 说明：静态降级路径（无 JS / 触摸设备 / prefers-reduced-motion）由 cursor.css 承担；
   本文件的动态部分仅在 cursor-motion.js 判定「支持悬停的精确指针设备且未减弱动效」并给
   <html> 加上 cat-cursor-on 后生效：隐藏原生光标 + 显示跟随元素 + 状态动画。
   需求 G（2026-09-11）：光标已水平镜像，棒尖移到左上 (2,3)——旋转原点改为 2px 3px；
   三组关键帧旋转角取反，使摆动方向为镜像前的自然效果（水平镜像时旋转方向随之反转）。 */

.cat-cursor {
  position: fixed;
  left: 0;
  top: 0;
  width: 32px;
  height: 32px;
  pointer-events: none;
  z-index: 2147483646;
  opacity: 0;
  transition: opacity 120ms linear;
  will-change: transform;
}
.cat-cursor.is-live { opacity: 1; }
.cat-cursor.is-over-text { opacity: 0; }
.cat-cursor__swing {
  width: 100%;
  height: 100%;
  transform-origin: 2px 3px;
  animation: cat-cursor-idle 2.8s ease-in-out infinite;
}
.cat-cursor img { display: block; width: 100%; height: 100%; }
.cat-cursor.is-target .cat-cursor__swing { animation: cat-cursor-active 0.9s ease-in-out infinite; }
.cat-cursor.is-click .cat-cursor__swing { animation: cat-cursor-pounce 0.38s ease-out; }

/* 待机：轻微浮动/摆动 */
@keyframes cat-cursor-idle {
  0%, 100% { transform: rotate(5deg) translateY(0); }
  50% { transform: rotate(-7deg) translateY(-3px); }
}
/* 悬停可点击元素：摆动更明显 */
@keyframes cat-cursor-active {
  0%, 100% { transform: rotate(13deg) translateY(0) scale(1.02); }
  50% { transform: rotate(-17deg) translateY(-4px) scale(1.06); }
}
/* 点击：扑击反馈 */
@keyframes cat-cursor-pounce {
  0% { transform: scale(0.72) rotate(18deg); }
  60% { transform: scale(1.12) rotate(-9deg); }
  100% { transform: scale(1) rotate(0deg); }
}

@media (prefers-reduced-motion: reduce) {
  .cat-cursor { display: none; }
  .cat-cursor__swing { animation: none !important; }
}
@media (hover: none), (pointer: coarse) {
  .cat-cursor { display: none; }
}

/* 动效激活（html.cat-cursor-on）时隐藏原生光标；文本输入区域保留原生光标 */
html.cat-cursor-on,
html.cat-cursor-on body,
html.cat-cursor-on a,
html.cat-cursor-on button,
html.cat-cursor-on summary,
html.cat-cursor-on label,
html.cat-cursor-on select,
html.cat-cursor-on input[type='submit'],
html.cat-cursor-on input[type='button'],
html.cat-cursor-on [role='button'],
html.cat-cursor-on .button {
  cursor: none;
}
html.cat-cursor-on input:not([type='submit']):not([type='button']):not([type='checkbox']):not([type='radio']),
html.cat-cursor-on textarea,
html.cat-cursor-on [contenteditable=''],
html.cat-cursor-on [contenteditable='true'] {
  cursor: auto;
}
