/* sc/downloader — design tokens */

:root {
  --bg-0: #0a0908;
  --bg-1: #111010;
  --bg-2: #1a1817;
  --bg-3: #242120;
  --bg-elev: #2d2927;

  --line: rgba(255, 247, 237, 0.08);
  --line-strong: rgba(255, 247, 237, 0.14);

  --fg: #f6f1e8;
  --fg-dim: #bcb2a3;
  --fg-mute: #7a7268;
  --fg-faint: #4b4540;

  --accent: #ff7a3d;
  --accent-soft: #ff7a3d20;
  --accent-hi: #ffa078;

  --success: #6ec893;
  --warn: #f1b04a;
  --danger: #e5574f;
  --info: #6fa8e8;

  --font-ui: 'Geist', ui-sans-serif, system-ui, -apple-system, sans-serif;
  --font-display: 'Instrument Serif', 'Times New Roman', serif;
  --font-mono: 'Geist Mono', ui-monospace, 'SF Mono', Menlo, monospace;

  --r-xs: 4px;
  --r-sm: 6px;
  --r-md: 10px;
  --r-lg: 14px;
  --r-xl: 20px;

  --ease: cubic-bezier(.22, .8, .3, 1);
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  background: var(--bg-0);
  color: var(--fg);
  font-family: var(--font-ui);
  font-feature-settings: 'ss01', 'cv11';
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

::selection { background: var(--accent); color: #111; }

button { font-family: inherit; }

.cover-bloom {
  position: absolute;
  inset: -40%;
  filter: blur(48px) saturate(1.4);
  opacity: 0.45;
  pointer-events: none;
  z-index: 0;
  transition: opacity .4s var(--ease);
}

.scroll { overflow-y: auto; }
.scroll::-webkit-scrollbar { width: 10px; }
.scroll::-webkit-scrollbar-track { background: transparent; }
.scroll::-webkit-scrollbar-thumb { background: var(--bg-3); border-radius: 10px; border: 2px solid var(--bg-0); }
.scroll::-webkit-scrollbar-thumb:hover { background: var(--bg-elev); }

@keyframes shimmer {
  0% { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}
@keyframes pulse-dot {
  0%, 100% { opacity: 0.3; }
  50% { opacity: 1; }
}
@keyframes progress-stripe {
  0% { background-position: 0 0; }
  100% { background-position: 24px 0; }
}
@keyframes fade-in {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes spin {
  to { transform: rotate(360deg); }
}
