/* ============================================================
   核桃云交易系统 · 设计令牌（Design Tokens）
   方向：工业实用 Industrial / 核桃墨绿 + 暖纸面 + 琥珀金强调
   ============================================================ */
:root {
  /* 色彩 */
  --green-950: #07231b;
  --green-900: #0c3b2e;
  --green-700: #116045;
  --green-500: #0f9d58;
  --green-300: #4ecb8d;
  --green-100: #dff3e8;

  --paper: #f6f4ef;          /* 暖纸面（非纯白） */
  --paper-2: #efece4;
  --ink: #16261f;            /* 暖调近黑 */
  --ink-2: #3d4f46;
  --muted: #7d8b83;

  --accent: #f0a020;         /* 琥珀金：仅关键动作 */
  --accent-ink: #6b4a00;
  --danger: #d84a4a;
  --info: #2b6de8;

  --border-d: rgba(246, 244, 239, 0.14);  /* 深色区发丝边 */
  --border-l: rgba(22, 38, 31, 0.12);     /* 浅色区发丝边 */

  /* 字体（全本地系统字体，无外网依赖） */
  --font-num: "Bebas Neue", "Arial Narrow", "Franklin Gothic Medium", "Impact", sans-serif;
  --font-body: "Source Han Sans SC", "Noto Sans SC", "Microsoft YaHei", "PingFang SC", sans-serif;
  --font-mono: "JetBrains Mono", "Consolas", "Courier New", monospace;

  /* 字阶（1.25 模块比例） */
  --fs-xs: 11px; --fs-sm: 12.5px; --fs-md: 14px; --fs-lg: 17px;
  --fs-xl: 21px; --fs-2xl: 27px; --fs-3xl: 34px;

  /* 间距 */
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 24px; --sp-6: 32px; --sp-7: 48px;

  /* 圆角与阴影 */
  --r-sm: 6px; --r-md: 10px; --r-lg: 16px; --r-xl: 22px;
  --shadow-1: 0 2px 8px rgba(7, 35, 27, 0.10);
  --shadow-2: 0 8px 28px rgba(7, 35, 27, 0.14);
  --shadow-3: 0 24px 64px rgba(7, 35, 27, 0.22);

  /* 动效 */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-fast: 160ms; --dur-base: 320ms; --dur-slow: 640ms;
}

/* ---------- 基础 ---------- */
* { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; }
body {
  font-family: var(--font-body);
  background: #101511;
  color: var(--ink);
  font-size: var(--fs-md);
  line-height: 1.65;
}
.num { font-family: var(--font-num); font-variant-numeric: tabular-nums; letter-spacing: 0.01em; }
.mono { font-family: var(--font-mono); font-variant-numeric: tabular-nums; }

/* ---------- 入场编排 ---------- */
.reveal { opacity: 0; transform: translateY(22px); }
.reveal.in {
  opacity: 1; transform: none;
  transition: opacity var(--dur-base) var(--ease-out), transform var(--dur-base) var(--ease-out);
}
.reveal.d1 { transition-delay: 70ms; }
.reveal.d2 { transition-delay: 140ms; }
.reveal.d3 { transition-delay: 210ms; }
.reveal.d4 { transition-delay: 280ms; }
.reveal.d5 { transition-delay: 350ms; }
@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1; transform: none; transition: none; }
  * { animation: none !important; }
}

/* ---------- 工业扫描线纹理（深色区） ---------- */
.scanlines {
  background-image:
    repeating-linear-gradient(0deg, rgba(246,244,239,0.028) 0 1px, transparent 1px 4px);
}
/* 暖纸噪点 */
.paper-grain {
  background-color: var(--paper);
  background-image:
    radial-gradient(rgba(12, 59, 46, 0.035) 1px, transparent 1px),
    radial-gradient(rgba(12, 59, 46, 0.022) 1px, transparent 1px);
  background-size: 22px 22px, 34px 34px;
  background-position: 0 0, 11px 17px;
}

/* ---------- 共享组件 ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  border: none; border-radius: var(--r-md); font-family: var(--font-body);
  font-weight: 700; cursor: pointer; transition: transform var(--dur-fast) ease-out, box-shadow var(--dur-fast) ease-out;
  text-decoration: none;
}
.btn:active { transform: scale(0.97); }
.btn-accent { background: var(--accent); color: #2a1d00; box-shadow: 0 4px 16px rgba(240, 160, 32, 0.4); }
.btn-accent:hover { box-shadow: 0 6px 22px rgba(240, 160, 32, 0.55); transform: translateY(-1px); }
.btn-green { background: var(--green-500); color: #fff; box-shadow: 0 4px 14px rgba(15, 157, 88, 0.35); }
.btn-green:hover { background: var(--green-700); }
.btn-ghost { background: transparent; border: 1px solid var(--border-l); color: var(--ink-2); }
.btn-ghost:hover { border-color: var(--green-500); color: var(--green-700); }
.btn-danger { background: var(--danger); color: #fff; }

.card {
  background: #fff; border: 1px solid var(--border-l);
  border-radius: var(--r-md); box-shadow: var(--shadow-1);
}

/* 稳定呼吸灯 */
.stable-dot { width: 9px; height: 9px; border-radius: 50%; background: #5df09f;
  box-shadow: 0 0 0 0 rgba(93, 240, 159, 0.6); animation: pulse 1.6s var(--ease-out) infinite; }
@keyframes pulse { 70% { box-shadow: 0 0 0 12px rgba(93, 240, 159, 0); } 100% { box-shadow: 0 0 0 0 rgba(93, 240, 159, 0); } }

/* 发丝分隔线 */
.hairline { height: 1px; background: var(--border-l); border: none; }
.hairline-d { height: 1px; background: var(--border-d); border: none; }

/* 页签 */
.pill { display: inline-flex; align-items: center; font-size: var(--fs-xs); font-weight: 700;
  border-radius: 999px; padding: 2px 10px; }
.pill-g { background: var(--green-100); color: var(--green-900); }
.pill-y { background: #fff3d6; color: var(--accent-ink); }
.pill-r { background: #fde8e8; color: var(--danger); }
.pill-b { background: #e3ecfd; color: var(--info); }

/* 表格 */
table.tbl { width: 100%; border-collapse: collapse; font-size: var(--fs-sm); }
.tbl th { text-align: left; color: var(--muted); font-weight: 500; padding: 9px 12px;
  border-bottom: 1px solid var(--border-l); }
.tbl td { padding: 10px 12px; border-bottom: 1px solid rgba(22, 38, 31, 0.06); }
.tbl tbody tr:hover { background: rgba(15, 157, 88, 0.04); }
.tbl .num, .tbl td.money { font-variant-numeric: tabular-nums; }

/* 开关（模式切换） */
.toggle { display: flex; background: #fff; border: 1.5px solid var(--border-l); border-radius: 999px; overflow: hidden; }
.toggle > div { flex: 1; text-align: center; padding: 10px 0; font-size: var(--fs-sm); font-weight: 800;
  color: var(--muted); transition: all var(--dur-fast) ease-out; cursor: pointer; }
.toggle > div.on { background: var(--green-500); color: #fff; box-shadow: inset 0 2px 6px rgba(0,0,0,.2); }

/* 二维码仿真块 */
.qr { background: repeating-conic-gradient(#1c2b23 0 25%, #fff 0 50%) 0 0 / 12px 12px; border-radius: 6px; }

/* 打印脚本：共享入场 */

/* ---------- 全局悬浮元素（秤端） ---------- */
.home-fab {
  position: fixed; right: 18px; bottom: 18px; z-index: 50;
  display: inline-flex; align-items: center; gap: 7px;
  background: var(--green-950); color: var(--paper);
  border: 1px solid rgba(93,240,159,.4); border-radius: 999px;
  padding: 11px 20px; font-size: 14px; font-weight: 800; text-decoration: none;
  box-shadow: var(--shadow-2); transition: transform var(--dur-fast) ease-out, box-shadow var(--dur-fast) ease-out;
}
.home-fab:hover { transform: translateY(-2px); box-shadow: var(--shadow-3); color: #fff; }
.net-badge {
  position: fixed; right: 18px; top: 14px; z-index: 50;
  display: inline-flex; align-items: center; gap: 6px;
  background: rgba(7, 35, 27, 0.75); color: #8ff0bd;
  border: 1px solid rgba(93,240,159,.35); border-radius: 999px;
  padding: 5px 13px; font-size: 11px; font-weight: 700;
  backdrop-filter: blur(4px);
}
.net-badge i { width: 7px; height: 7px; border-radius: 50%; background: #5df09f;
  box-shadow: 0 0 0 0 rgba(93,240,159,.6); animation: pulse 1.6s var(--ease-out) infinite; }
.net-badge.off { color: #ffb3b3; border-color: rgba(216,74,74,.4); }
.net-badge.off i { background: var(--danger); animation: none; }