/* PwPay / Forward — токены оформления. Решения записаны в design/FORWARD.md.
   Движок (src/ggame/web/style.css) читает только эти переменные: другой бренд
   меняет этот файл и, если нужно, brand.css, а style.css не трогает. */

/* Manrope, self-hosted (SIL OFL 1.1, see fonts/OFL.txt). Two subsets, 38 KB total:
   no third-party request, no extra CSP origin, full Cyrillic. */
@font-face {
  font-family: Manrope;
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url("/assets/brand/fonts/manrope-cyrillic.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: Manrope;
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url("/assets/brand/fonts/manrope-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
    U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215,
    U+FEFF, U+FFFD;
}

/* Не зависят от темы. */
:root {
  --font-sans: Manrope, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, monospace;
  --font-display: var(--font-sans);

  --radius-control: 10px;
  --radius-panel: 20px;
  --radius-hero: 28px;
  --radius-cover: 12px;
  /* Рейка PwPay не использует (chrome = top), значение — общее для движка. */
  --rail-width: 240px;

  --ease-out: cubic-bezier(.22, .68, .36, 1);

  /* Первый экран одинаков в обеих темах: кобальтовое поле, белый текст.
     Светлый угол достаточно тёмный, чтобы белый текст держал 4.5:1. */
  --hero-bg: radial-gradient(120% 140% at 12% 0%, #3059f0 0%, #2652e8 45%, #1a3ab8 100%);
  --hero-text: #ffffff;
  --hero-action-bg: #ffffff;
  --hero-action-text: #173ab1;
  --hero-divider: rgb(255 255 255 / 0.28);
  --hero-shadow: 0 22px 48px -34px rgb(12 17 32 / 0.55);
  --hero-grain: 0.35;

  /* Многие логотипы поставщиков — тёмный рисунок на прозрачном фоне: подложка
     обложки остаётся светлой в обеих темах. */
  --cover-plate: #e9eef9;
  --cover-plate-text: #46587a;
  --qr-plate: #ffffff;

  --ok: #12b76a;
  --warn: #f79009;
  --bad: #f04438;

  --backdrop: rgb(12 17 32 / 0.78);
  --shadow-dialog: 0 24px 48px -28px rgb(12 17 32 / 0.5);
}

:root {
  color-scheme: light;
  --bg: #f3f5fa;
  --panel: #ffffff;
  --raised: #e9eef9;
  --text: #15203b;
  --muted: #53617b;
  --line: #c2cce0;
  --accent: #244cdb;
  --on-accent: #ffffff;
  --error: #a02c36;
  --shadow-hover: 0 18px 40px -26px rgb(36 76 219 / 0.55);
}
@media (prefers-color-scheme: dark) {
  :root {
    color-scheme: dark;
    --cover-glow: 0.78;
    --bg: #0c1120;
    --panel: #151d30;
    --raised: #1e2940;
    --text: #f5f7ff;
    --muted: #b2bfd8;
    --line: #42516e;
    --accent: #9ab4ff;
    --on-accent: #0c1838;
    --error: #ffabb2;
    --shadow-hover: 0 18px 40px -24px rgb(0 0 0 / 0.65);
  }
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --cover-glow: 0.78;
  --bg: #0c1120;
  --panel: #151d30;
  --raised: #1e2940;
  --text: #f5f7ff;
  --muted: #b2bfd8;
  --line: #42516e;
  --accent: #9ab4ff;
  --on-accent: #0c1838;
  --error: #ffabb2;
  --shadow-hover: 0 18px 40px -24px rgb(0 0 0 / 0.65);
}
:root[data-theme="light"] {
  color-scheme: light;
  --bg: #f3f5fa;
  --panel: #ffffff;
  --raised: #e9eef9;
  --text: #15203b;
  --muted: #53617b;
  --line: #c2cce0;
  --accent: #244cdb;
  --on-accent: #ffffff;
  --error: #a02c36;
  --shadow-hover: 0 18px 40px -26px rgb(36 76 219 / 0.55);
}