/* ==========================================================================
   Дизайн-токены Ledgeum Wallet
   Палитра, шрифты, сетка и радиусы повторяют дизайн-модель ton.org
   (тёмная тема, синий акцент, «стеклянные» плашки с внутренней тенью).
   Меняйте значения только здесь — остальные файлы ссылаются на переменные.
   ========================================================================== */

:root {
    color-scheme: dark;

    /* Шрифты */
    --font-sans: "Google Sans", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --font-mono: "Google Sans Code", ui-monospace, SFMono-Regular, Menlo, monospace;

    /* Сетка */
    --grid-max: 1320px;
    --pad-inline: 32px;
    --header-h: 76px;

    /* Цвета */
    --color-accent: #1eaefb;
    --color-accent-hover: #0f9fe9;
    --color-accent-soft: rgb(30 174 251 / 12%);
    --color-background: #10161f;
    --color-background-rgb: 16 22 31;
    --color-surface: #101b2a;
    --color-surface-tint: #1d2633;
    --color-surface-tint-a: rgb(29 38 51 / 80%);
    --color-surface-active: #222c3d;
    --color-surface-hover: #1e2838;
    --color-surface-shadow: #2d3945;
    --color-surface-shadow-hover: #3a4a5a;
    --color-border: rgb(147 165 184 / 18%);
    --color-border-strong: #364459;
    --color-divider: #10161f;
    --color-focus: rgb(30 174 251 / 56%);
    --color-text: #d9e6f2;
    --color-muted: #93a5b8;
    --color-white: #ffffff;

    /* Семантика AML (те же оттенки, что в приложении) */
    --color-safe: #2bd47d;
    --color-warn: #f5a524;
    --color-risk: #f2425f;

    /* Радиусы */
    --r-sm: 8px;
    --r-md: 12px;
    --r-lg: 16px;
    --r-xl: 24px;
    --r-pill: 100px;

    /* Тени: тонкая внутренняя «грань» плашек, как на ton.org */
    --edge: inset 1px 1px 1px 0 var(--color-surface-shadow);
    --edge-hover: inset 1px 1px 1px 0 var(--color-surface-shadow-hover);

    /* Типографика */
    --fs-hero: 48px;
    --lh-hero: 1.24;
    --fs-h2: 40px;
    --lh-h2: 1.23;
    --fs-h3: 24px;
    --fs-body: 16px;
    --fs-lead: 18px;

    --ease: cubic-bezier(.2, .7, .2, 1);
}

@media (max-width: 1023px) {
    :root {
        --pad-inline: 24px;
        --fs-hero: 40px;
        --fs-h2: 32px;
        --fs-h3: 22px;
    }
}

@media (max-width: 639px) {
    :root {
        --pad-inline: 16px;
        --header-h: 64px;
        --fs-hero: 32px;
        --fs-h2: 28px;
        --fs-h3: 20px;
        --fs-lead: 16px;
    }
}