/* ═══════════════════════════════════════════════════════════
   全域安 · 安行SOS — 全局主题变量
   基于 4-5/v6 组件 + 4-7/ARCHITECTURE.md 四层架构设计
   ═══════════════════════════════════════════════════════════ */

:root {
  /* ── 背景与容器 ── */
  --bg:           #0a0e1a;   /* 深邃夜空蓝黑 */
  --bg-2:         #060c14;   /* 更深层背景 */
  --card:         rgba(13, 27, 42, 0.95);
  --card-glass:   rgba(13, 27, 42, 0.80);

  /* ── 边框与分割 ── */
  --border:       rgba(0, 180, 216, 0.20);
  --border-hi:    rgba(0, 180, 216, 0.40);  /* hover / active */
  --border-red:   rgba(229, 57, 53, 0.40);
  --border-org:   rgba(255, 111, 0, 0.38);

  /* ── 主色调 ── */
  --blue:         #00b4d8;   /* 成长蓝 · 帮我 · 导航 */
  --blue-dark:    #0077a8;
  --blue-glow:    rgba(0, 180, 216, 0.25);
  --blue-subtle:  rgba(0, 180, 216, 0.08);

  /* ── 警告 / SOS ── */
  --red:          #e53935;   /* 救我 · 紧急 */
  --red-dark:     #c0392b;
  --red-glow:     rgba(229, 57, 53, 0.20);
  --red-subtle:   rgba(229, 57, 53, 0.10);

  /* ── 暖色 · 救它 ── */
  --orange:       #ff6f00;
  --orange-glow:  rgba(255, 111, 0, 0.15);
  --orange-subtle:rgba(255, 111, 0, 0.08);

  /* ── 成功 / GPS在线 ── */
  --green:        #00e676;
  --green-glow:   rgba(0, 230, 118, 0.20);

  /* ── 文字 ── */
  --text:         #e0e6f0;   /* 主文字 */
  --text-sub:     #6a8a9e;   /* 次要文字 */
  --text-dim:     #3a5a6e;   /* 极暗辅助 */

  /* ── 尺寸 ── */
  --radius-sm:    8px;
  --radius:       14px;
  --radius-lg:    20px;
  --radius-xl:    28px;

  /* ── 阴影 ── */
  --shadow-card:  0 8px 32px rgba(0, 0, 0, 0.45);
  --shadow-blue:  0 0 24px rgba(0, 180, 216, 0.12);
  --shadow-red:   0 0 28px rgba(229, 57, 53, 0.25);

  /* ── Z-Index 层级 ── */
  --z-map:        1;    /* V3 地图层 */
  --z-info:       10;   /* V2 信息层 */
  --z-sos:        20;   /* V1 SOS层 */
  --z-panel:      50;   /* 主面板 */
  --z-ctrl:       60;   /* 控制按钮 */
  --z-dot:        80;   /* 红点悬浮 */
  --z-overlay:    100;  /* 覆盖层 */
  --z-sos-full:   200;  /* SOS全屏覆盖 */
}

/* ── 重置 ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html, body {
  width: 100%; height: 100%;
  font-family: 'Microsoft YaHei', 'PingFang SC', -apple-system, sans-serif;
  background: var(--bg); color: var(--text);
  -webkit-tap-highlight-color: transparent;
  user-select: none; overflow: hidden;
}

/* ── 滚动条 ── */
::-webkit-scrollbar { width: 3px; height: 3px; }
::-webkit-scrollbar-thumb { background: var(--blue-subtle); border-radius: 3px; }
::-webkit-scrollbar-track { background: transparent; }

/* ── 通用动画 ── */
@keyframes blink {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0.25; }
}
@keyframes pulse-blue {
  0%, 100% { box-shadow: 0 0 0 0 var(--blue-glow), 0 0 16px var(--blue-glow); }
  50%       { box-shadow: 0 0 0 12px transparent, 0 0 28px var(--blue-glow); }
}
@keyframes pulse-red {
  0%, 100% { box-shadow: 0 0 0 0 var(--red-glow), 0 0 20px var(--red-glow); }
  50%       { box-shadow: 0 0 0 16px transparent, 0 0 36px var(--red-glow); }
}
@keyframes slide-up {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes fd { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: translateY(0); } }