/* Nusantara Brand OS · 共享设计令牌（web_design_system_skill.md 选择性采用）
   数据控制台密度规范：保留紧凑间距，统一曲线/焦点/状态/容器 */
:root {
  /* 色彩（对齐全站现有调色板） */
  --surface-base: #0a0e14;
  --surface-card: #12171f;
  --surface-overlay: rgba(13, 17, 23, .92);
  --border-subtle: #232b36;
  --border-strong: #2d333b;
  --text-primary: #e8eef5;
  --text-secondary: #8b98a8;
  --text-disabled: #586273;
  --accent: #e4022b;
  --accent-soft: rgba(228, 2, 43, .2);
  --gold: #ffd700;
  --status-success: #3fb950;
  --status-warning: #d29922;
  --status-error: #f85149;
  --status-info: #58a6ff;

  /* 间距（base-8） */
  --space-1: 4px;  --space-2: 8px;  --space-3: 12px; --space-4: 16px;
  --space-6: 24px; --space-8: 32px; --space-12: 48px; --space-16: 64px; --space-24: 96px;

  /* 圆角 */
  --radius-sm: 4px; --radius-md: 8px; --radius-lg: 14px; --radius-xl: 20px; --radius-full: 9999px;

  /* 动效 */
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --ease-in: cubic-bezier(.7, 0, .84, 0);
  --dur-micro: 160ms;
  --dur-modal: 340ms;

  /* 容器 */
  --container: 1180px;
  --container-wide: 1440px;

  /* 阴影 */
  --elevation-low: 0 2px 8px -2px rgba(0, 0, 0, .35);
  --elevation-med: 0 8px 24px -4px rgba(0, 0, 0, .45);
}

/* ── 可访问性：焦点环（全站交互元素生效） ── */
:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
  border-radius: var(--radius-sm);
}

/* ── 全局微动效：交互元素统一曲线 ── */
a, button, select, .chip, .tier, .gap, [role="button"] {
  transition: border-color var(--dur-micro) var(--ease-out),
              background-color var(--dur-micro) var(--ease-out),
              color var(--dur-micro) var(--ease-out),
              transform var(--dur-micro) var(--ease-out),
              box-shadow var(--dur-micro) var(--ease-out);
}
button:active, .btn:active {
  transform: translateY(0) scale(.98);
}

/* ── 悬浮上浮（营销页卡片） ── */
.lift:hover {
  transform: translateY(-2px);
  box-shadow: var(--elevation-med);
}

/* ── 聚光灯卡（配合 --mouse-x/--mouse-y，JS 约 10 行） ── */
.spot { position: relative; }
.spot::after {
  content: "";
  position: absolute; inset: 0;
  border-radius: inherit;
  background: radial-gradient(600px circle at var(--mouse-x, 50%) var(--mouse-y, 50%),
              rgba(255, 255, 255, .05), transparent 40%);
  opacity: 0;
  transition: opacity var(--dur-micro) var(--ease-out);
  pointer-events: none;
}
.spot:hover::after { opacity: 1; }

/* ── 选择高亮 / 滚动条 ── */
::selection { background: rgba(228, 2, 43, .35); }
* { scrollbar-width: thin; scrollbar-color: var(--border-strong) transparent; }

/* ── 导航条（六页统一，替代各页内联样式） ── */
.nbo-nav {
  position: fixed; top: 0; left: 0; right: 0; height: 38px; z-index: 10000;
  display: flex; align-items: center; padding: 0 var(--space-4);
  background: var(--surface-overlay); backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--border-subtle);
  font: 12.5px -apple-system, "Segoe UI", "Microsoft YaHei", sans-serif;
}
.nbo-nav .brand {
  color: var(--accent); font-weight: 700; letter-spacing: .18em; font-size: 11px;
  text-decoration: none; margin-right: var(--space-4);
}
.nbo-nav a.nl {
  color: var(--text-secondary); text-decoration: none;
  padding: 6px var(--space-3); border-radius: var(--radius-md);
  min-height: 30px; display: inline-flex; align-items: center;
}
.nbo-nav a.nl:hover { color: var(--text-primary); }
.nbo-nav a.nl.on { color: #fff; background: var(--accent-soft); }

@media (max-width: 640px) {
  .nbo-nav { overflow-x: auto; }
  .nbo-nav a.nl { padding: 6px var(--space-2); }
}