/* ============================================================
   Журнал — design tokens
   v2 «мягкая версия»: свет сверху, объёмные поверхности.
   Legacy-имена (--paper, --accent…) сохранены как алиасы.
   ============================================================ */

:root {
  /* — v2 raw channels (oklch(var(--n0)) …) — */
  --white:          1 0 0;
  --hi:             1 0 0;
  --shadow:         0.4 0.03 60;
  --rim:            0.995 0.004 85;
  --accent-lt:      0.68 0.115 42;
  --accent-mid:     0.565 0.105 42;
  --accent-deep-ch: 0.50 0.105 41;
  --accent-deeper:  0.36 0.10 41;
  --accent-wash-1:  0.945 0.02 50;
  --accent-wash-2:  0.905 0.025 49;
  --warn:           0.56 0.13 30;
  --warn-wash:      0.92 0.028 32;
  --success:        0.58 0.14 148;
  --link:           0.52 0.16 258;
  --info-wash:      0.91 0.02 222;
  --scrim:          0.18 0.02 50;
  --n0:             0.995 0.004 85;
  --n1:             0.96 0.008 84;
  --n2:             0.905 0.009 80;
  --n3:             0.83 0.010 76;
  --n4:             0.565 0.012 65;
  --n5:             0.42 0.012 62;
  --n6:             0.22 0.012 60;
  /* текст на акцентных кнопках (chip.is-on, CTA) — всегда светлый */
  --on-accent:      0.99 0.004 85;

  /* тёмная chrome-полоса (own-bar): фон из темы, текст всегда светлый на тёмном */
  --chrome-bar-bg:     var(--n6);
  --chrome-bar-fg:     0.985 0.005 85;
  --chrome-bar-muted:  0.82 0.02 70;

  /* — Legacy paper & ink (алиасы → v2) — */
  --paper:        oklch(var(--n1));
  --paper-raise:  oklch(var(--n0));
  --paper-sink:   oklch(var(--n1));
  --ink:          oklch(var(--n6));
  --ink-soft:     oklch(var(--n5));
  --ink-faint:    oklch(var(--n4));
  --line:         oklch(var(--n2));
  --line-strong:  oklch(var(--n3));

  /* — Legacy accent — */
  --accent:       oklch(var(--accent-mid));
  --accent-deep:  oklch(var(--accent-deep-ch));
  --accent-wash:  oklch(var(--accent-wash-1));

  /* — Surfaces: градиенты и тени — */
  --grad-raise:   linear-gradient(180deg, oklch(var(--hi)) 0%, oklch(var(--n0)) 100%);
  --grad-accent:  linear-gradient(180deg, oklch(var(--accent-lt)) 0%, oklch(var(--accent-mid)) 100%);
  --grad-wash:    linear-gradient(180deg, oklch(var(--accent-wash-1)), oklch(var(--accent-wash-2)));

  --shadow-inset-top:    inset 0 1px 0 oklch(var(--white) / 0.9);
  --shadow-inset-bottom: inset 0 -2px 3px oklch(var(--shadow) / 0.08);
  --shadow-card:
    inset 0 1px 0 oklch(var(--white) / 0.8),
    0 2px 6px oklch(var(--shadow) / 0.05),
    0 10px 24px oklch(var(--shadow) / 0.07),
    0 0 34px oklch(var(--rim) / 0.09);
  --shadow-raise:
    inset 0 1px 0 oklch(var(--white) / 0.92),
    inset 0 -2px 3px oklch(var(--shadow) / 0.09),
    0 2px 5px oklch(var(--shadow) / 0.06),
    0 8px 18px oklch(var(--shadow) / 0.1);
  --shadow-btn-raise:
    inset 0 1px 0 oklch(var(--white) / 0.95),
    inset 0 -2px 3px oklch(var(--shadow) / 0.1),
    0 2px 6px oklch(var(--shadow) / 0.07),
    0 8px 20px oklch(var(--shadow) / 0.11);
  --shadow-screen:
    0 1px 2px oklch(var(--shadow) / 0.05),
    0 20px 50px oklch(var(--shadow) / 0.09),
    0 0 34px oklch(var(--rim) / 0.09);
  --shadow-btn-accent:
    inset 0 1px 0 oklch(var(--white) / 0.3),
    inset 0 -2px 3px oklch(var(--accent-deeper) / 0.35),
    0 2px 6px oklch(var(--accent-mid) / 0.28),
    0 10px 22px oklch(var(--accent-mid) / 0.18);
  --shadow-btn-accent-sm:
    inset 0 1px 0 oklch(var(--white) / 0.3),
    inset 0 -1px 2px oklch(var(--accent-deeper) / 0.3),
    0 4px 12px oklch(var(--accent-mid) / 0.25);
  --shadow-pill-wash:
    inset 0 1px 0 oklch(var(--accent-wash-1) / 0.5),
    inset 0 -1px 1px oklch(var(--accent-deep-ch) / 0.15);
  --shadow-surface:
    inset 0 1px 0 oklch(var(--white) / 0.78),
    inset 0 -2px 3px oklch(var(--shadow) / 0.06),
    0 2px 5px oklch(var(--shadow) / 0.05),
    0 9px 20px oklch(var(--shadow) / 0.07);
  --shadow-chip:
    inset 0 1px 0 oklch(var(--white) / 0.9),
    inset 0 -1px 2px oklch(var(--shadow) / 0.08),
    0 1px 2px oklch(var(--shadow) / 0.05),
    0 5px 14px oklch(var(--shadow) / 0.08);

  /* — Радиусы (−30% от базовых 2026-06) — */
  --radius-screen: 20px;
  --radius-card:   14px;
  --radius-md:     11px;
  --radius-btn:    10px;
  --radius-btn-sm: 8px;
  --radius-pill:   999px;
  --radius-icon:   50%;

  /* — Type families — */
  --serif:   "Playfair Display", Georgia, "Times New Roman", serif;
  --grotesk: "Golos Text", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --mono:    "JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;

  /* — Fluid type scale — */
  --t-nameplate: clamp(2.4rem, 4vw, 3.7rem);
  --t-hero:      clamp(2.2rem, 3.4vw, 3.3rem);
  --t-h1:        clamp(1.9rem, 3.0vw, 2.9rem);
  --t-h2:        clamp(1.45rem, 2.1vw, 2.0rem);
  --t-h3:        clamp(1.18rem, 1.5vw, 1.4rem);
  --t-body:      1.0rem;
  --t-small:     0.82rem;
  --t-micro:     0.69rem;

  /* аватары-заглушки (инициалы): фон/текст по hue, адаптируются к теме */
  --av-bg-l: 0.88;
  --av-bg-c: 0.05;
  --av-fg-l: 0.32;
  --av-fg-c: 0.06;

  /* — Spacing rhythm — */
  --gap:   clamp(1.2rem, 2.2vw, 2.4rem);
  --col:   clamp(1.6rem, 3.4vw, 3.6rem);
  --bleed: clamp(1.4rem, 5vw, 5.5rem);
  --rule:  1px;

  /* — Motion — */
  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
}

/* — Темы (data-theme на <html>) — paper по умолчанию выше — */
html[data-theme="midnight"] {
  --white: 0.55 0.006 60; --hi: 0.28 0.010 60; --shadow: 0.05 0.01 60;
  --accent-lt: 0.72 0.13 44; --accent-mid: 0.62 0.125 42; --accent-deep-ch: 0.53 0.115 41; --accent-deeper: 0.40 0.10 40;
  --accent-wash-1: 0.28 0.05 42; --accent-wash-2: 0.22 0.06 40;
  --n0: 0.14 0.008 55; --n1: 0.18 0.008 55; --n2: 0.23 0.010 55; --n3: 0.30 0.012 55;
  --n4: 0.62 0.012 60; --n5: 0.78 0.012 62; --n6: 0.94 0.01 65; --rim: 0.14 0.008 55;
}
html[data-theme="sage"] {
  --shadow: 0.38 0.03 130; --rim: 0.99 0.006 130;
  --accent-lt: 0.62 0.11 135; --accent-mid: 0.52 0.105 138; --accent-deep-ch: 0.44 0.10 140; --accent-deeper: 0.34 0.09 140;
  --accent-wash-1: 0.93 0.03 128; --accent-wash-2: 0.885 0.035 128;
  --n0: 0.99 0.006 130; --n1: 0.96 0.010 130; --n2: 0.905 0.012 128; --n3: 0.83 0.014 128;
  --n4: 0.56 0.02 130; --n5: 0.42 0.02 130; --n6: 0.22 0.018 130;
}
html[data-theme="indigo"] {
  --shadow: 0.38 0.03 264; --rim: 0.99 0.005 265;
  --accent-lt: 0.62 0.14 275; --accent-mid: 0.52 0.15 278; --accent-deep-ch: 0.44 0.145 280; --accent-deeper: 0.34 0.13 282;
  --accent-wash-1: 0.93 0.03 270; --accent-wash-2: 0.885 0.035 270;
  --n0: 0.99 0.005 265; --n1: 0.96 0.009 265; --n2: 0.905 0.011 264; --n3: 0.83 0.013 264;
  --n4: 0.56 0.018 264; --n5: 0.42 0.018 264; --n6: 0.22 0.016 264;
}
html[data-theme="terracotta"] {
  --shadow: 0.38 0.035 40; --rim: 0.99 0.006 50;
  --accent-lt: 0.62 0.15 32; --accent-mid: 0.52 0.155 28; --accent-deep-ch: 0.44 0.15 25; --accent-deeper: 0.34 0.13 22;
  --accent-wash-1: 0.93 0.035 40; --accent-wash-2: 0.885 0.04 38;
  --n0: 0.99 0.006 50; --n1: 0.96 0.010 48; --n2: 0.905 0.013 46; --n3: 0.83 0.015 44;
  --n4: 0.56 0.02 42; --n5: 0.42 0.02 40; --n6: 0.22 0.018 38;
}
html[data-theme="graphite"] {
  --white: 0.52 0.005 240; --hi: 0.28 0.008 240; --shadow: 0.03 0.005 240;
  --accent-lt: 0.72 0.10 230; --accent-mid: 0.60 0.11 232; --accent-deep-ch: 0.50 0.10 233; --accent-deeper: 0.38 0.09 234;
  --accent-wash-1: 0.26 0.04 232; --accent-wash-2: 0.20 0.045 232;
  --n0: 0.16 0.004 240; --n1: 0.20 0.005 240; --n2: 0.26 0.006 240; --n3: 0.34 0.007 240;
  --n4: 0.62 0.008 240; --n5: 0.80 0.007 240; --n6: 0.95 0.006 240; --rim: 0.16 0.004 240;
}
html[data-theme="charcoal"] {
  --white: 0.22 0.006 50; --hi: 0.17 0.007 50; --shadow: 0.04 0.01 50;
  --accent-lt: 0.68 0.12 42; --accent-mid: 0.58 0.115 41; --accent-deep-ch: 0.48 0.105 40; --accent-deeper: 0.36 0.09 39;
  --accent-wash-1: 0.26 0.045 42; --accent-wash-2: 0.20 0.05 40;
  --n0: 0.15 0.006 50; --n1: 0.19 0.007 50; --n2: 0.24 0.008 50; --n3: 0.31 0.010 50;
  --n4: 0.60 0.010 55; --n5: 0.76 0.010 58; --n6: 0.90 0.008 60; --rim: 0.15 0.006 50;
}
html[data-theme="whitewhite"] {
  --white: 1 0 0; --hi: 1 0 0; --shadow: 0 0 0;
  --accent-lt: 0.68 0 0; --accent-mid: 0.56 0 0; --accent-deep-ch: 0.46 0 0; --accent-deeper: 0.34 0 0;
  --accent-wash-1: 0.93 0 0; --accent-wash-2: 0.88 0 0;
  --n0: 1 0 0; --n1: 0.97 0 0; --n2: 0.93 0 0; --n3: 0.87 0 0;
  --n4: 0.55 0 0; --n5: 0.35 0 0; --n6: 0.12 0 0; --rim: 1 0 0;
}
html[data-theme="coalcoal"] {
  --white: 0.40 0 0; --hi: 0.26 0 0; --shadow: 0.02 0 0;
  --accent-lt: 0.85 0 0; --accent-mid: 0.75 0 0; --accent-deep-ch: 0.62 0 0; --accent-deeper: 0.48 0 0;
  --accent-wash-1: 0.22 0 0; --accent-wash-2: 0.18 0 0;
  --n0: 0.06 0 0; --n1: 0.11 0 0; --n2: 0.24 0 0; --n3: 0.33 0 0;
  --n4: 0.55 0 0; --n5: 0.72 0 0; --n6: 0.92 0 0; --rim: 0.92 0 0;
}

/* Классика — develop: тёплая бумага Kinfolk, плоско, прямые углы */
html[data-theme="klassika"] {
  --white: 1 0 0; --hi: 1 0 0; --shadow: 0.4 0.03 60; --rim: 0.985 0.005 85;
  --accent-lt: 0.56 0.105 42; --accent-mid: 0.560 0.105 42; --accent-deep-ch: 0.470 0.100 41; --accent-deeper: 0.42 0.10 41;
  --accent-wash-1: 0.930 0.022 50; --accent-wash-2: 0.915 0.024 50;
  --n0: 0.985 0.005 85; --n1: 0.967 0.006 83; --n2: 0.870 0.008 78; --n3: 0.780 0.010 74;
  --n4: 0.605 0.010 68; --n5: 0.430 0.012 62; --n6: 0.235 0.012 60;
  --paper-sink: oklch(0.935 0.009 80);
  --radius-screen: 0; --radius-card: 0; --radius-md: 0; --radius-btn: 0; --radius-btn-sm: 3px;
  --grad-raise: oklch(var(--n0)); --grad-accent: oklch(var(--accent-mid)); --grad-wash: oklch(var(--accent-wash-1));
  --shadow-inset-top: none; --shadow-inset-bottom: none;
  --shadow-card: none; --shadow-raise: none; --shadow-btn-raise: none; --shadow-screen: none;
  --shadow-btn-accent: none; --shadow-btn-accent-sm: none; --shadow-pill-wash: none;
  --shadow-surface: none; --shadow-chip: none;
}

html[data-theme="midnight"],
html[data-theme="graphite"],
html[data-theme="charcoal"],
html[data-theme="coalcoal"] {
  --av-bg-l: 0.28;
  --av-bg-c: 0.045;
  --av-fg-l: 0.84;
  --av-fg-c: 0.04;
  /* чуть светлее фона страницы — не чистый чёрный */
  --chrome-bar-bg: var(--n2);
  --chrome-bar-fg: var(--n6);
  --chrome-bar-muted: var(--n5);
}

/* Пересчёт legacy-алиасов при смене темы */
html[data-theme="midnight"],
html[data-theme="graphite"],
html[data-theme="charcoal"],
html[data-theme="whitewhite"],
html[data-theme="coalcoal"],
html[data-theme="klassika"],
html[data-theme="sage"],
html[data-theme="indigo"],
html[data-theme="terracotta"] {
  --paper:        oklch(var(--n1));
  --paper-raise:  oklch(var(--n0));
  --paper-sink:   oklch(var(--n1));
  --ink:          oklch(var(--n6));
  --ink-soft:     oklch(var(--n5));
  --ink-faint:    oklch(var(--n4));
  --line:         oklch(var(--n2));
  --line-strong:  oklch(var(--n3));
  --accent:       oklch(var(--accent-mid));
  --accent-deep:  oklch(var(--accent-deep-ch));
  --accent-wash:  oklch(var(--accent-wash-1));
}