:root {
  --page: #f8f9fd;
  --panel: #ffffff;
  --line: #e0e3eb;
  --hover: #f0f3fa;
  --ink: #131722;
  --muted: #6a6d78;
  --up: #f23645;
  --down: #2962ff;
}

.dark {
  --page: #131722;
  --panel: #1e222d;
  --line: #2a2e39;
  --hover: #2a2e39;
  --ink: #d1d4dc;
  --muted: #868993;
  --up: #f7525f;
  --down: #4f7dff;
  color-scheme: dark;
}

body {
  font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
}

.num {
  font-variant-numeric: tabular-nums;
}

.mosaic {
  filter: blur(5px);
  user-select: none;
}

.flash-up {
  animation: flash-up 0.9s ease-out;
}

.flash-down {
  animation: flash-down 0.9s ease-out;
}

@keyframes flash-up {
  from { background: color-mix(in srgb, var(--up) 22%, transparent); }
  to { background: transparent; }
}

@keyframes flash-down {
  from { background: color-mix(in srgb, var(--down) 22%, transparent); }
  to { background: transparent; }
}

.live-dot {
  width: 8px;
  height: 8px;
  border-radius: 9999px;
  background: var(--up);
  box-shadow: 0 0 0 0 color-mix(in srgb, var(--up) 60%, transparent);
  animation: pulse 1.6s infinite;
}

@keyframes pulse {
  to { box-shadow: 0 0 0 8px transparent; }
}

.marquee {
  animation: marquee 60s linear infinite;
}

.marquee:hover {
  animation-play-state: paused;
}

@keyframes marquee {
  to { transform: translateX(-50%); }
}

.no-scrollbar::-webkit-scrollbar {
  display: none;
}

.no-scrollbar {
  scrollbar-width: none;
}