/* =========================================================
   哦维交付中心 · 设计 Tokens
   电光蓝 + 3D 等距 + 科技网格
========================================================= */
:root {
  /* —— 字体 —— */
  --font-display: "Sora", "Noto Sans SC", system-ui, -apple-system, sans-serif;
  --font-body: "Plus Jakarta Sans", "Noto Sans SC", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", "SF Mono", Consolas, monospace;

  /* —— Brand · Electric Blue —— */
  --brand-50:  #eef2ff;
  --brand-100: #e0e7ff;
  --brand-200: #c7d2fe;
  --brand-300: #a5b4fc;
  --brand-400: #818cf8;
  --brand-500: #3d5afe;   /* 主色 */
  --brand-600: #304ffe;
  --brand-700: #2540e0;

  /* —— 中性 —— */
  --bg-app: #f6f8fc;
  --bg-card: #ffffff;
  --bg-elev: #fafbfe;
  --bg-soft: #f0f3f9;
  --border-soft: #e4e8f0;
  --border-strong: #cbd5e1;

  --text-strong: #0b1230;
  --text-body: #1f2945;
  --text-muted: #5b6478;
  --text-faint: #8a93a6;
  --text-on-brand: #ffffff;

  /* —— 语义色 —— */
  --success: #16a34a;
  --success-bg: #d6f5e1;
  --warning: #f59e0b;
  --warning-bg: #fff1d6;
  --danger: #ef4444;
  --danger-bg: #ffe1e1;
  --info: #06b6d4;
  --info-bg: #d6f4fb;

  /* —— 渐变 —— */
  --grad-electric: linear-gradient(135deg, #3d5afe, #06b6d4);
  --grad-iso: linear-gradient(135deg, #e8eeff, #d8e6ff);
  --grad-aero: radial-gradient(1200px 480px at 0% 0%, rgba(61,90,254,.06), transparent 55%),
               radial-gradient(900px 400px at 100% 100%, rgba(6,182,212,.06), transparent 55%);

  /* —— 阴影 —— */
  --shadow-soft: 0 6px 22px -10px rgba(11,18,48,.10), 0 2px 8px -4px rgba(11,18,48,.06);
  --shadow-brand: 0 14px 38px -16px rgba(61,90,254,.32), 0 4px 12px -6px rgba(61,90,254,.18);
  --shadow-glow: 0 0 0 1px rgba(61,90,254,.18), 0 24px 48px -20px rgba(61,90,254,.45);

  /* —— 圆角 —— */
  --r-sm: 8px;
  --r-md: 12px;
  --r-lg: 18px;
  --r-xl: 22px;

  /* —— 缓动 —— */
  --ease: cubic-bezier(.22,.61,.36,1);
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  font-family: var(--font-body);
  font-size: 14px;
  line-height: 1.55;
  color: var(--text-body);
  background: var(--bg-app);
  -webkit-font-smoothing: antialiased;
  font-feature-settings: "ss01";
  position: relative;
  min-height: 100vh;
}

/* 科技网格背景 */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background:
    linear-gradient(rgba(61,90,254,.045) 1px, transparent 1px) 0 0/56px 56px,
    linear-gradient(90deg, rgba(61,90,254,.045) 1px, transparent 1px) 0 0/56px 56px,
    var(--grad-aero);
  -webkit-mask-image: radial-gradient(1100px 700px at 30% 20%, #000 38%, transparent 78%);
  mask-image: radial-gradient(1100px 700px at 30% 20%, #000 38%, transparent 78%);
}

a { color: var(--brand-600); text-decoration: none; }
a:hover { color: var(--brand-700); }

button { font-family: inherit; cursor: pointer; }

input, select, textarea {
  font-family: inherit;
  font-size: 14px;
}

::selection { background: rgba(61,90,254,.18); color: var(--text-strong); }

/* 数字 */
.num { font-feature-settings: "tnum"; font-variant-numeric: tabular-nums; }

/* 渐变文字 */
.grad-electric {
  background: var(--grad-electric);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* Focus 环 */
:focus-visible {
  outline: 2px solid var(--brand-500);
  outline-offset: 2px;
  border-radius: 6px;
}