:root {
  color-scheme: dark;
  --canvas: #0a0b0d;
  --canvas-deep: #070809;
  --surface: #121419;
  --surface-raised: #181b21;
  --surface-soft: #0e1013;
  --line: #2a2e35;
  --line-strong: #3a3f47;
  --ink: #f2f0e9;
  --ink-soft: #d4d3cd;
  --muted: #999fa9;
  --muted-2: #676d76;
  --route: #ff7648;
  --route-bright: #ff8c66;
  --route-soft: rgba(255, 118, 72, 0.12);
  --route-line: rgba(255, 118, 72, 0.42);
  --live: #58d6b0;
  --warning: #ffc15b;
  --danger: #ff6868;
  --shadow: 0 24px 70px rgba(0, 0, 0, 0.35);
  --display: "Avenir Next", "Noto Sans KR", "Apple SD Gothic Neo", "Segoe UI", sans-serif;
  --sans: "Avenir Next", "Noto Sans KR", "Apple SD Gothic Neo", "Segoe UI", sans-serif;
  --mono: "SFMono-Regular", "SF Mono", Consolas, "Liberation Mono", monospace;
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
}

@keyframes route-signal {
  0% { offset-distance: 0%; opacity: 0; }
  8%, 84% { opacity: 1; }
  100% { offset-distance: 100%; opacity: 0; }
}

@keyframes live-pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.46; transform: scale(0.72); }
}
