/* ═══════════════════════════════════════════════════
   Палитры. Три темы: розово-белая, красно-чёрная, серая.
   Переключатель ставит <html data-theme="light|dark|gray">
   ═══════════════════════════════════════════════════ */

:root {
    --r-sm: 14px;
    --r-md: 20px;
    --r-lg: 28px;
    --r-xl: 36px;
    --r-pill: 999px;

    --gap-xs: 6px;
    --gap-sm: 10px;
    --gap-md: 16px;
    --gap-lg: 24px;

    --spring:      cubic-bezier(0.34, 1.56, 0.64, 1);
    --spring-soft: cubic-bezier(0.22, 1.2, 0.36, 1);
    --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
    --t-fast: 140ms;
    --t-med:  260ms;
    --t-slow: 480ms;
}

/* ═══ Светлая: розовое по белому ═══ */
:root, [data-theme="light"] {
    --bg1: #fffdfd;
    --bg2: #fff7f9;
    --ink:  #4d2b36;
    --ink2: #8d6472;
    --ink3: #bc9aa5;

    --ac1: #ff9db7;            /* светлый конец градиента */
    --ac2: #f75f8b;            /* тёмный конец */
    --ac-text: #d94571;        /* акцентный текст */
    --on-ac: #fffdfd;          /* текст на акценте */
    --soft:  #ffecf1;
    --soft2: #ffd8e2;

    --surface:       rgba(255, 255, 255, 0.82);
    --surface-solid: #ffffff;
    --sunk:          rgba(255, 236, 241, 0.55);
    --hair:          rgba(217, 69, 113, 0.12);
    --scrim:         rgba(77, 43, 54, 0.38);

    --lift-sm: 0 2px 8px rgba(217, 69, 113, 0.10);
    --lift-md: 0 8px 22px rgba(217, 69, 113, 0.14);

    /* на светлом фоне тёмные грани стекла смягчены */
    --glass-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.5),
        inset 1.8px 3px 0px -2px rgba(255, 255, 255, 0.9),
        inset -2px -2px 0px -2px rgba(255, 255, 255, 0.7),
        inset -0.3px -1px 4px 0px rgba(217, 69, 113, 0.10),
        inset -1.5px 2.5px 0px -2px rgba(217, 69, 113, 0.14),
        inset 0px 3px 4px -2px rgba(217, 69, 113, 0.12),
        0px 1px 5px 0px rgba(217, 69, 113, 0.10),
        0px 6px 16px 0px rgba(217, 69, 113, 0.10);
    --glass-shadow-indicator:
        inset 0 0 0 1px #ffffff40,
        inset 2px 1px 0 -1px #ffffffb0,
        inset -1px 2px 3px -1px #d9457122,
        0 3px 6px #d9457122;

    --blob1: #ffbdce;
    --blob2: #ffb3c7;
    --blob3: #ffd8e2;
    --bg-st-opacity: 0.16;
    --ok: #3ccf91;
    --err: #d94571;
    color-scheme: light;
}

/* ═══ Красно-чёрная ═══ */
[data-theme="dark"] {
    --bg1: #0b0508;
    --bg2: #120709;
    --ink:  #f8e9ed;
    --ink2: #b99aa3;
    --ink3: #7d5c66;

    --ac1: #ff5a73;
    --ac2: #c1121f;
    --ac-text: #ff7b8f;
    --on-ac: #fff5f6;
    --soft:  rgba(225, 29, 72, 0.16);
    --soft2: rgba(225, 29, 72, 0.30);

    --surface:       rgba(255, 255, 255, 0.07);
    --surface-solid: #1c0e13;
    --sunk:          rgba(255, 255, 255, 0.04);
    --hair:          rgba(255, 255, 255, 0.09);
    --scrim:         rgba(0, 0, 0, 0.62);

    --lift-sm: 0 2px 8px rgba(0, 0, 0, 0.45);
    --lift-md: 0 8px 24px rgba(0, 0, 0, 0.55);

    --blob1: #e11d48;
    --blob2: #7f1020;
    --blob3: #ff5a73;
    --bg-st-opacity: 0.10;
    --ok: #3ccf91;
    --err: #ff7b8f;
    color-scheme: dark;
}

/* ═══ Серая ═══ */
[data-theme="gray"] {
    --bg1: #0f1012;
    --bg2: #15171a;
    --ink:  #eceef2;
    --ink2: #a0a6b2;
    --ink3: #6a707c;

    --ac1: #b7bfcd;
    --ac2: #6b7585;
    --ac-text: #cfd5e0;
    --on-ac: #0f1012;
    --soft:  rgba(180, 190, 206, 0.14);
    --soft2: rgba(180, 190, 206, 0.26);

    --surface:       rgba(255, 255, 255, 0.07);
    --surface-solid: #1b1e22;
    --sunk:          rgba(255, 255, 255, 0.04);
    --hair:          rgba(255, 255, 255, 0.09);
    --scrim:         rgba(0, 0, 0, 0.62);

    --lift-sm: 0 2px 8px rgba(0, 0, 0, 0.45);
    --lift-md: 0 8px 24px rgba(0, 0, 0, 0.55);

    --blob1: #5b6472;
    --blob2: #3a404b;
    --blob3: #8a93a3;
    --bg-st-opacity: 0.09;
    --ok: #3ccf91;
    --err: #ff8a8a;
    color-scheme: dark;
}
