/* PenFlow · концепт В · ТОКЕНЫ
   Синие чернила на тёплой бумаге. Светлая тема по умолчанию,
   тёмная («ночная лампа») — по системе или по шнурку лампы в шапке.
   Правило: в компонентах только var(--…); сырые цвета — здесь. */

@font-face { font-family: "PF Hand";   src: url("../fonts/Caveat.woff2") format("woff2");  font-weight: 400 700; font-display: swap; }
@font-face { font-family: "PF Script"; src: url("../fonts/MarckScript.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "PF Sans";   src: url("../fonts/Manrope-Variable.woff2") format("woff2"); font-weight: 200 800; font-display: swap; }

:root {
  color-scheme: light;

  /* --- основа (обязательная палитра) --- */
  --paper: #f6f3ec;          /* фон страницы */
  --stage: #efe9dc;          /* фон «полосы»/подложки секции */
  --desk: #e9e1d0;           /* стол на сценах */
  --desk-2: #ded3bd;         /* волокна стола */
  --sheet: #f7f0e2;          /* лист, тетрадь */
  --sheet-edge: #e1d4bf;     /* обрез стопки, край листа */
  --ink: #141a33;            /* основной текст */
  --muted: #6a6f85;          /* второстепенный текст */
  --line: #ddd8cc;           /* линии, рамки */
  --accent: #2a44c8;         /* синие чернила, действие */
  --accent-2: #4f68e8;       /* клякса на кнопке, подсветка */
  --accent-ink: #ffffff;     /* текст на акценте */
  --accent-soft: #e4e8fb;    /* подложка выбранного */

  /* --- бумага всегда светлая (лист не темнеет ночью) --- */
  --on-sheet: #1e2440;       /* текст на листе */
  --on-sheet-muted: #6a6f85;
  --rule: #c9d3ee;           /* линейка тетради */
  --margin-red: #e7a0a0;     /* поле тетради */
  --pen-ink: #1e2f9a;        /* чернила рукописи (меняются выбором, одни на весь сайт) */
  --stamp: #b0303e;          /* штамп «Готово» */

  /* --- стикеры --- */
  --note: #fff1a8; --note-ink: #3a2d0a;
  --note-2: #ffd9e1; --note-2-ink: #3a1020;
  --note-3: #d9f0ff; --note-3-ink: #10263a;
  --tape: rgba(214, 222, 255, .72);

  /* --- обложки тетрадей-тарифов (от тонкой к толстой) --- */
  --cover-1: #7d90ea;
  --cover-2: #2a44c8;
  --cover-3: #1a2350;

  /* --- свет лампы, стекло шапки --- */
  --glow: rgba(255, 236, 196, .55);
  --glow-0: rgba(255, 236, 196, 0);
  --lamp-warm: 255, 220, 164;
  --lamp-dim: rgba(2, 4, 12, .012);
  --lamp-move: 1s;
  --lamp-ease: cubic-bezier(.4, 0, .2, 1);
  --header-bg: rgba(246, 243, 236, .8);
  --ok: #2bb673; --warn: #e2a23b;

  /* --- тени: бумажные, мягкие, с синим отливом --- */
  --shadow-1: 0 1px 2px rgba(20, 26, 51, .06), 0 6px 18px rgba(20, 26, 51, .07);
  --shadow-2: 0 2px 6px rgba(20, 26, 51, .08), 0 22px 50px -12px rgba(20, 26, 51, .22);
  --shadow-3: 0 30px 80px -20px rgba(20, 26, 51, .35);

  /* --- шрифты --- */
  --font: "PF Sans", "Segoe UI", system-ui, -apple-system, Roboto, Arial, sans-serif;
  --hand: "PF Hand", "Segoe Print", cursive;      /* рукописные пометки, шутки, цифры-подписи */
  --script: "PF Script", "PF Hand", cursive;      /* «каллиграф»: имена тарифов, ярлыки тетрадей */

  /* --- шкала --- */
  --fs-h1: clamp(2.4rem, 5.4vw, 4.6rem);
  --fs-h2: clamp(2rem, 4.4vw, 3.5rem);
  --fs-h3: clamp(1.2rem, 2vw, 1.45rem);
  --fs-lead: clamp(1.05rem, 1.5vw, 1.25rem);
  --fs-body: 17px;
  --fs-small: 14px;
  --fs-hand: clamp(1.35rem, 2.2vw, 1.7rem);

  --r-s: 10px; --r: 18px; --r-l: 24px; --r-pill: 999px;
  --gutter: clamp(16px, 4vw, 40px);
  --maxw: 1200px;
  --header-h: 68px;
  --sec-y: clamp(72px, 10vw, 136px);

  /* --- движение --- */
  --ease: cubic-bezier(.2, .8, .2, 1);       /* обычное появление */
  --ease-io: cubic-bezier(.6, .05, .25, 1);  /* тяжёлый предмет: обложка, лист */
  --spring: cubic-bezier(.34, 1.56, .64, 1); /* пружинка: кнопки, стикеры */
  --t-fast: .2s; --t: .45s; --t-slow: .9s;
}

/* ---------- ночная лампа ---------- */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --paper: #0b0f1c; --stage: #141c33; --desk: #121a30; --desk-2: #0e1528;
    --sheet: #ece3cf; --sheet-edge: #cbbd9f;
    --ink: #f2f4fb; --muted: #a7adc6; --line: #273153;
    --accent: #7f97ff; --accent-2: #a3b4ff; --accent-ink: #0b0f1c; --accent-soft: #1e2a5c;
    --rule: #b9c3e3;
    --note: #f2df86; --note-2: #f1c3cf; --note-3: #c1def3; --tape: rgba(190, 200, 240, .55);
    --cover-1: #5d72d6; --cover-2: #2a44c8; --cover-3: #232c52;
    --glow: rgba(255, 196, 120, .30); --glow-0: rgba(255, 196, 120, 0);
    --header-bg: rgba(11, 15, 28, .74);
    --shadow-1: 0 1px 2px rgba(0, 0, 0, .4), 0 6px 18px rgba(0, 0, 0, .35);
    --shadow-2: 0 2px 6px rgba(0, 0, 0, .45), 0 22px 50px -12px rgba(0, 0, 0, .7);
    --shadow-3: 0 30px 80px -20px rgba(0, 0, 0, .85);
  }
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --paper: #0b0f1c; --stage: #141c33; --desk: #121a30; --desk-2: #0e1528;
  --sheet: #ece3cf; --sheet-edge: #cbbd9f;
  --ink: #f2f4fb; --muted: #a7adc6; --line: #273153;
  --accent: #7f97ff; --accent-2: #a3b4ff; --accent-ink: #0b0f1c; --accent-soft: #1e2a5c;
  --rule: #b9c3e3;
  --note: #f2df86; --note-2: #f1c3cf; --note-3: #c1def3; --tape: rgba(190, 200, 240, .55);
  --cover-1: #5d72d6; --cover-2: #2a44c8; --cover-3: #232c52;
  --glow: rgba(255, 196, 120, .30); --glow-0: rgba(255, 196, 120, 0);
  --header-bg: rgba(11, 15, 28, .74);
  --shadow-1: 0 1px 2px rgba(0, 0, 0, .4), 0 6px 18px rgba(0, 0, 0, .35);
  --shadow-2: 0 2px 6px rgba(0, 0, 0, .45), 0 22px 50px -12px rgba(0, 0, 0, .7);
  --shadow-3: 0 30px 80px -20px rgba(0, 0, 0, .85);
}