/* === CSS Variables: цвета, размеры, шрифты, стекло === */

:root {
  /* === Шрифты === */
  --font-h: 'Unbounded', system-ui, sans-serif;
  --font-b: 'Unbounded', system-ui, sans-serif;

  /* === Размеры === */
  --player-w: 320px;
  --header-h: 72px;
  --radius-lg: 28px;
  --radius-md: 22px;
  --radius-sm: 14px;
  --radius-pill: 999px;

  /* === Текст === */
  --c-text: #ffffff;
  --c-text-dim: rgba(255, 255, 255, 0.72);
  --c-text-mute: rgba(255, 255, 255, 0.55);

  /* === Стекло (светлое, прозрачное) === */
  --glass-bg: rgba(255, 255, 255, 0.14);
  --glass-bg-strong: rgba(255, 255, 255, 0.22);
  --glass-bg-soft: rgba(255, 255, 255, 0.08);
  --glass-border: rgba(255, 255, 255, 0.32);
  --glass-border-soft: rgba(255, 255, 255, 0.18);
  --glass-blur: 22px;
  --glass-shadow: 0 12px 40px rgba(20, 40, 70, 0.18);

  /* === Акценты === */
  --c-accent: #ffffff;
  --c-live: #ef4444;

  /* === Фон страницы === */
  --bg-image: url('../assets/img/bg/evening/fhdbg1.webp');
  --bg-overlay: linear-gradient(
    180deg,
    rgba(20, 40, 70, 0.15) 0%,
    rgba(20, 40, 70, 0.35) 100%
  );
}

/* === Базовый фон страницы === */
body {
  background-color: #2c4a66; /* fallback пока картинка грузится */
  background-image: var(--bg-overlay), var(--bg-image);
  background-size: cover, cover;
  background-position: center, center;
  background-attachment: fixed, fixed;
  background-repeat: no-repeat, no-repeat;
  color: var(--c-text);
  font-family: var(--font-b);
  min-height: 100vh;
}

/* === Универсальный класс «стекло» === */
.glass {
  background: var(--glass-bg);
  border: 1px solid var(--glass-border);
  border-radius: var(--radius-lg);
  backdrop-filter: blur(var(--glass-blur)) saturate(140%);
  -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(140%);
  box-shadow: var(--glass-shadow);
}

.glass-soft {
  background: var(--glass-bg-soft);
  border: 1px solid var(--glass-border-soft);
  border-radius: var(--radius-md);
  backdrop-filter: blur(14px) saturate(130%);
  -webkit-backdrop-filter: blur(14px) saturate(130%);
}