@font-face {
  font-family: "Literata";
  font-style: normal;
  font-weight: 200 900;
  font-display: swap;
  src: url("../fonts/literata-cyrillic-variable.woff2") format("woff2-variations");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "Literata";
  font-style: normal;
  font-weight: 200 900;
  font-display: swap;
  src: url("../fonts/literata-latin-variable.woff2") format("woff2-variations");
  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;
}
@font-face {
  font-family: "Literata";
  font-style: italic;
  font-weight: 200 900;
  font-display: swap;
  src: url("../fonts/literata-cyrillic-variable-italic.woff2") format("woff2-variations");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "Literata";
  font-style: italic;
  font-weight: 200 900;
  font-display: swap;
  src: url("../fonts/literata-latin-variable-italic.woff2") format("woff2-variations");
  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;
}
@font-face {
  font-family: "Golos Text";
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
  src: url("../fonts/golos-text-cyrillic-variable.woff2") format("woff2-variations");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "Golos Text";
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
  src: url("../fonts/golos-text-latin-variable.woff2") format("woff2-variations");
  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 {
  --paper-background: #f1ece3;
  --paper-surface: #f8f5ef;
  --header-background: #e7ded2;
  --paper-texture-opacity: .026;
  --paper-texture: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='360' height='360' viewBox='0 0 360 360'%3E%3Cfilter id='paper'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.74' numOctaves='3' seed='18' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='360' height='360' filter='url(%23paper)'/%3E%3Cg fill='none' stroke='%23746f67' stroke-width='.4' stroke-linecap='round'%3E%3Cpath d='M13 42l12-1M92 17l9 2M144 63l14-2M214 39l18 1M289 91l11-2M334 27l8 1M34 128l10 1M111 151l13-1M160 116l7 2M247 164l15-1M312 138l12 2M67 82l9-1M21 243l15 2M88 296l12-1M154 228l17 1M225 279l10-2M303 244l14 1M342 326l9-1M175 343l13 2M47 348l11-2'/%3E%3C/g%3E%3C/svg%3E");
  --paper: var(--paper-background);
  --paper-deep: #e7dfd3;
  --surface: rgba(248, 245, 239, 0.9);
  --surface-solid: #f8f5ef;
  --ink: #292621;
  --muted: #655f57;
  --muted-2: #6a6259;
  --line: rgba(58, 51, 43, 0.17);
  --line-strong: rgba(58, 51, 43, 0.34);
  --accent: #ad5536;
  --accent-dark: #8f432b;
  --accent-soft: rgba(184, 95, 62, 0.11);
  --control-border: #756d63;
  --focus-ring: #8f432b;
  --success: #456e5d;
  --danger: #9f3d34;
  --radius: 18px;
  --sticky-header-offset: 92px;
  --font-serif: "Literata", Georgia, "Times New Roman", serif;
  --font-sans: "Golos Text", Arial, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }
html { background: var(--paper-background); scroll-behavior: smooth; scrollbar-gutter: stable; }
@supports not (scrollbar-gutter: stable) {
  html { overflow-y: scroll; }
}
html.scroll-instantly { scroll-behavior: auto !important; }
body {
  position: relative;
  isolation: isolate;
  min-width: 320px;
  min-height: 100vh;
  margin: 0;
  color: var(--ink);
  overflow-x: clip;
  background: var(--paper-background);
  font-family: var(--font-sans);
  font-optical-sizing: auto;
  font-synthesis: none;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}

body::after {
  content: "";
  position: fixed;
  z-index: 0;
  inset: 0;
  opacity: var(--paper-texture-opacity);
  background-image: var(--paper-texture);
  background-size: 360px 360px;
  mix-blend-mode: multiply;
  pointer-events: none;
}
a { color: inherit; }
button, textarea, input { font: inherit; }
button, a, label { -webkit-tap-highlight-color: transparent; }
button { color: inherit; }
main, footer { overflow-wrap: anywhere; }

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.skip-link {
  position: fixed;
  top: 10px;
  left: 10px;
  z-index: 200;
  padding: 10px 14px;
  border-radius: 9px;
  color: white;
  background: var(--ink);
  transform: translateY(-160%);
}
.skip-link:focus { transform: translateY(0); }

.site-header {
  position: sticky;
  z-index: 50;
  top: 0;
  display: flex;
  width: 100%;
  min-height: 76px;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  padding: 0 max(24px, calc((100vw - 1280px) / 2));
  border-bottom: 1px solid var(--line);
  background: var(--header-background);
  backdrop-filter: none;
}
.site-header--overlay { position: fixed; inset: 0 0 auto; }
.home .site-header--overlay .brand { transform: translateX(-8px); }
.brand { display: inline-flex; min-height: 44px; align-items: center; text-decoration: none; }
.brand__wordmark { font-family: var(--font-serif); font-size: 20px; letter-spacing: -0.02em; }
.main-nav { display: flex; align-items: center; gap: 28px; }
.main-nav a { display: inline-flex; min-height: 44px; align-items: center; color: #4f4942; font-size: 13px; text-decoration: none; text-underline-offset: 6px; }
.main-nav a:hover, .main-nav a:focus-visible, .main-nav a[aria-current="page"] { color: var(--ink); text-decoration: underline; }
.menu-toggle {
  display: none;
  width: 42px;
  height: 42px;
  padding: 0;
  border: 1px solid var(--line-strong);
  border-radius: 50%;
  background: rgba(255,255,255,.52);
}
.menu-toggle span:not(.sr-only) { display: block; width: 17px; height: 1px; margin: 5px auto; background: currentColor; }

/* Главная */
.home { position: relative; display: flex; min-height: 100svh; flex-direction: column; overflow-x: hidden; background: var(--paper); }
.home::before {
  content: "";
  position: fixed;
  z-index: 0;
  inset: 0;
  background:
    radial-gradient(circle at 76% 18%, rgba(184,95,62,.08), transparent 32%),
    radial-gradient(circle at 15% 76%, rgba(79,123,114,.09), transparent 34%),
    linear-gradient(135deg, rgba(255,255,255,.54), transparent 50%);
  pointer-events: none;
}
.line-field { position: fixed; z-index: 1; inset: 0; overflow: hidden; pointer-events: none; }
.line-field__canvas { display: block; width: 100%; height: 100%; opacity: .82; transition: opacity 300ms ease; }
[data-home-state="transitioning"] .line-field__canvas { opacity: .62; }

.home-main {
  position: relative;
  z-index: 2;
  display: flex;
  width: min(1080px, calc(100% - 48px));
  min-height: calc(100svh - 68px);
  flex: 1;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  padding: 126px 0 62px;
  text-align: center;
}
.home-stage { width: 100%; transition: height 300ms cubic-bezier(.22,.61,.36,1); }
.hero-copy { position: relative; margin: 0 auto; isolation: isolate; }
.home-noscript { margin: 16px 0 0; color: var(--muted); font-size: 13px; }

.home.home-tools-active .home-main { justify-content: flex-start; }
.home-tools { width: 100%; text-align: left; }
.tools-overview__head { max-width: 100%; }
.tools-overview__eyebrow {
  margin: 0 0 12px;
  color: var(--accent-dark);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.tools-overview__head h2 {
  margin: 0;
  font-family: var(--font-serif);
  font-size: clamp(39px, 3.55vw, 54px);
  font-weight: 400;
  line-height: 1.08;
  letter-spacing: -.035em;
  text-wrap: balance;
}
.tools-overview__intro {
  max-width: 76ch;
  margin: 19px 0 0;
  color: var(--muted);
  font-size: clamp(15px, 1.2vw, 17px);
  line-height: 1.58;
}
.tools-overview__nav { width: 100%; margin-top: clamp(40px, 5vw, 60px); scroll-margin-top: 100px; }
.tool-list {
  width: 100%;
  margin: 0;
  padding: 0;
  border-top: 1px solid var(--line-strong);
  border-bottom: 1px solid var(--line-strong);
  list-style: none;
}
.tool-list li + li { border-top: 1px solid var(--line); }
.tools-overview__head,
.home-tools .tool-list li,
.home-privacy {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity 420ms ease, transform 420ms cubic-bezier(.22,.61,.36,1);
}
.home-tools.is-visible .tools-overview__head,
.home-tools.is-visible .tool-list li,
.home-tools.is-visible .home-privacy { opacity: 1; transform: translateY(0); }
.home-tools .tools-overview__head { transition-delay: 0ms; }
.home-tools .tool-list li:nth-child(1) { transition-delay: 90ms; }
.home-tools .tool-list li:nth-child(2) { transition-delay: 150ms; }
.home-tools .tool-list li:nth-child(3) { transition-delay: 210ms; }
.home-tools .home-privacy { transition-delay: 290ms; }
[data-home-state="transitioning"] .home-tools { pointer-events: none; }
.tool-row {
  display: grid;
  min-height: 126px;
  grid-template-columns: 54px minmax(230px, .85fr) minmax(300px, 1.15fr) 34px;
  align-items: center;
  gap: 22px;
  padding: 24px 8px;
  text-decoration: none;
  transition: color 200ms ease, background-color 200ms ease, box-shadow 200ms ease;
}
.tool-row__number {
  color: var(--muted-2);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .1em;
  transition: color 200ms ease;
}
.tool-row__title {
  font-family: var(--font-serif);
  font-size: clamp(24px, 2.35vw, 34px);
  font-weight: 400;
  line-height: 1.08;
  letter-spacing: -.025em;
  transition: color 200ms ease, transform 200ms ease;
}
.tool-row__description {
  max-width: 52ch;
  color: var(--muted);
  font-size: 15px;
  line-height: 1.55;
  transition: transform 200ms ease;
}
.tool-row__arrow {
  color: var(--muted-2);
  font-size: 24px;
  line-height: 1;
  text-align: right;
  transition: color 200ms ease, transform 200ms ease;
}
.tool-row:hover { background: rgba(255,253,248,.46); }
.tool-row:hover .tool-row__number,
.tool-row:hover .tool-row__title,
.tool-row:hover .tool-row__arrow { color: var(--accent-dark); }
.tool-row:hover .tool-row__title,
.tool-row:hover .tool-row__description { transform: translateX(5px); }
.tool-row:hover .tool-row__arrow { transform: translateX(6px); }
.tool-row:focus-visible {
  position: relative;
  z-index: 1;
  outline: none;
  background: rgba(255,253,248,.56);
  box-shadow: inset 0 0 0 2px var(--accent);
}
.tool-row:active { background: var(--accent-soft); }
.home-privacy {
  display: flex;
  width: 100%;
  align-items: flex-start;
  gap: 14px;
  margin: clamp(32px, 4vw, 44px) 0 0;
  padding: 18px 20px;
  border: 1px solid rgba(69,110,93,.22);
  border-radius: 15px;
  color: var(--muted);
  background: rgba(255,253,248,.58);
  text-align: left;
}
.home-privacy__mark { width: 9px; height: 9px; flex: 0 0 9px; margin-top: 7px; border: 2px solid var(--success); border-radius: 50%; }
.home-privacy h2 { margin: 0 0 5px; color: var(--ink); font-family: var(--font-serif); font-size: 20px; font-weight: 400; line-height: 1.2; }
.home-privacy p { max-width: 92ch; margin: 0; font-size: 13px; line-height: 1.55; }
.home-footer, .site-footer { position: relative; z-index: 2; display: flex; width: min(1080px, calc(100% - 48px)); min-height: 68px; align-items: center; justify-content: space-between; margin: 0 auto; padding: 20px 0; border-top: 1px solid var(--line); color: var(--muted-2); font-size: 12px; }
.home-footer a, .site-footer a {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  margin-block: -12px;
  padding-block: 12px;
  text-underline-offset: 4px;
}

/* Внутренние страницы */
.interior { background: var(--paper-background); }
.page-shell { width: min(1000px, calc(100% - 40px)); margin: 0 auto; padding: 66px 0 96px; }
.page-head { max-width: 790px; margin-bottom: 38px; }
.eyebrow { margin: 0 0 14px; color: var(--accent-dark); font-size: 12px; letter-spacing: .09em; text-transform: uppercase; }
.page-head h1 { margin: 0; font-family: var(--font-serif); font-size: clamp(42px, 6vw, 72px); font-weight: 400; line-height: 1; letter-spacing: -.045em; text-wrap: balance; }
.page-head > p:not(.eyebrow) { max-width: 720px; margin: 22px 0 0; color: var(--muted); font-size: 17px; }
.panel { padding: clamp(22px, 4vw, 42px); border: 1px solid var(--line); border-radius: 22px; background: var(--surface); box-shadow: 0 28px 78px rgba(65,54,43,.07); }
.panel + .panel { margin-top: 18px; }
.panel h2, .panel h3 { margin: 0 0 10px; font-family: var(--font-serif); font-weight: 400; }
.panel h2 { font-size: 31px; }
.panel h3 { font-size: 23px; }
.panel > p { color: var(--muted); }
.privacy-flag { display: flex; gap: 11px; align-items: flex-start; margin-top: 24px; padding: 15px 17px; border: 1px solid rgba(69,110,93,.26); border-radius: 13px; color: #3e6555; background: rgba(69,110,93,.06); font-size: 14px; line-height: 1.5; }
.privacy-flag--warn { border-color: rgba(184,95,62,.28); color: #844329; background: rgba(184,95,62,.06); }
.content-grid { display: grid; grid-template-columns: 1.2fr .8fr; gap: 18px; }
.prose h2 { margin: 34px 0 10px; }
.prose h2:first-child { margin-top: 0; }
.prose p, .prose li { color: var(--muted); }
.facts { margin: 0; padding: 0; list-style: none; }
.facts li { padding: 14px 0; border-bottom: 1px solid var(--line); }
.facts strong { display: block; font-size: 12px; letter-spacing: .07em; text-transform: uppercase; }
.facts span { display: block; margin-top: 5px; color: var(--muted); }
.empty-state { padding: 28px; border: 1px dashed var(--line-strong); border-radius: 16px; color: var(--muted); }

/* Формы и общие кнопки */
.field { display: block; margin: 0 0 24px; }
.field > span, .field-label { display: block; margin-bottom: 9px; font-weight: 600; }
textarea {
  width: 100%;
  min-height: 126px;
  max-height: 420px;
  padding: 16px;
  resize: none;
  overflow-y: auto;
  border: 1px solid var(--control-border);
  border-radius: 13px;
  outline: none;
  color: var(--ink);
  background: rgba(255,255,255,.68);
  line-height: 1.55;
  transition: border-color 160ms ease, box-shadow 160ms ease;
}
textarea:focus { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.summary-area { min-height: 360px; resize: vertical; }
.actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 30px; }
.actions--between { align-items: center; justify-content: space-between; }
.actions__group { display: flex; flex-wrap: wrap; gap: 10px; }
.button {
  display: inline-flex;
  min-height: 46px;
  align-items: center;
  justify-content: center;
  padding: 10px 18px;
  border: 1px solid var(--control-border);
  border-radius: 999px;
  color: var(--ink);
  background: rgba(255,255,255,.42);
  text-decoration: none;
  cursor: pointer;
}
.button:hover, .button:focus-visible { border-color: var(--accent); outline: none; }
.button:focus-visible { box-shadow: 0 0 0 3px var(--accent-soft); }
.button--primary { border-color: var(--accent); color: #fff; background: var(--accent); }
.button--primary:hover, .button--primary:focus-visible { background: var(--accent-dark); }
.button--quiet { border-color: transparent; color: var(--muted); background: transparent; }
.button--danger { color: var(--danger); }
.button:disabled { cursor: not-allowed; opacity: .42; }
.status { min-height: 22px; margin: 14px 0 0; color: var(--success); font-size: 13px; }
.session-error { margin: -6px 0 20px; color: var(--danger); font-weight: 600; }
.field-note, .soft-count { color: var(--muted-2); font-size: 12px; }
.soft-count { display: block; min-height: 18px; margin-top: 6px; }
.soft-count.is-warning { color: var(--accent-dark); }

/* Выбор режима заметки: две части одного редакционного разворота. */
.mode-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 28px;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.mode-card {
  position: relative;
  display: grid;
  min-height: 164px;
  align-content: center;
  gap: 10px;
  padding: 28px 56px 28px 24px;
  text-align: left;
  border: 0;
  background: transparent;
  cursor: pointer;
  transition: color 180ms ease, background-color 180ms ease;
}
.mode-card + .mode-card { border-left: 1px solid var(--line); }
.mode-card strong {
  font-family: var(--font-serif);
  font-size: clamp(24px, 2.8vw, 31px);
  font-weight: 400;
  line-height: 1.12;
}
.mode-card span { max-width: 34ch; color: var(--muted); font-size: 14px; line-height: 1.5; }
.mode-card::after {
  content: "\2192";
  position: absolute;
  right: 24px;
  top: 50%;
  color: var(--accent-dark);
  font-size: 23px;
  transform: translateY(-50%);
  transition: transform 180ms ease;
}
.mode-card:hover { color: var(--accent-dark); background: rgba(184,95,62,.055); }
.mode-card:hover::after { transform: translate(5px, -50%); }
.mode-card:active { background: var(--accent-soft); }

/* Инструмент «С чего начать говорить»: горизонтальная рабочая композиция */
.builder-shell {
  display: block;
  width: min(1120px, calc(100% - 48px));
  padding-top: clamp(34px, 5vh, 52px);
}
.builder-guide, .builder-stage { min-width: 0; }
.builder-guide { transition: padding 220ms ease; }
.builder-guide__head { display: grid; grid-template-columns: minmax(280px, .8fr) minmax(420px, 1.2fr); align-items: end; column-gap: clamp(28px, 5vw, 72px); row-gap: 10px; }
.builder-guide__head .eyebrow { grid-column: 1; margin-bottom: 10px; }
.builder-guide__head h1 { grid-column: 1; margin: 0; font-family: var(--font-serif); font-size: clamp(39px, 4.2vw, 58px); font-weight: 400; line-height: 1; letter-spacing: -.043em; text-wrap: balance; }
.builder-guide__lead { grid-column: 2; grid-row: 1 / span 2; max-width: 700px; margin: 0; color: var(--muted); font-size: 15px; line-height: 1.62; }
.builder-reminders { display: none; flex-wrap: wrap; gap: 8px 18px; margin-top: 16px; color: var(--muted); font-size: 12px; }
.builder-reminders span { display: inline-flex; align-items: center; gap: 8px; }
.builder-reminders span::before { content: ""; width: 5px; height: 5px; flex: 0 0 5px; border-radius: 50%; background: var(--accent); }
.builder-guide__toggle { display: none; }
.builder-guide__content { margin-top: clamp(24px, 3.5vh, 34px); }
.guide-summary-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--line-strong); border-bottom: 1px solid var(--line); }
.guide-section { min-width: 0; padding: 18px 22px 18px 0; }
.guide-section + .guide-section { padding-left: 22px; border-left: 1px solid var(--line); }
.guide-section h2 { margin: 0 0 7px; font-family: var(--font-serif); font-size: 19px; font-weight: 400; line-height: 1.18; }
.guide-section > p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.55; }
.builder-guide__notice { margin: 12px 0 0; color: var(--muted-2); font-size: 11px; line-height: 1.5; }
.builder-stage { width: 100%; min-height: 0; margin-top: clamp(34px, 5vh, 48px); padding-top: clamp(30px, 4vh, 40px); border-top: 1px solid var(--line-strong); }
.route-chooser { width: 100%; }
.builder-workspace { width: 100%; min-height: 0; }
.builder-workspace [data-screen] { width: min(900px, 100%); }
.builder-workspace__top { margin-bottom: 29px; }
.change-route { min-height: 44px; padding: 8px 0; border: 0; border-bottom: 1px solid transparent; color: var(--muted); background: transparent; cursor: pointer; }
.change-route::before { content: "←"; margin-right: 9px; color: var(--accent-dark); }
.change-route:hover { color: var(--ink); border-bottom-color: var(--line-strong); }
.change-route:focus-visible { outline: 2px solid var(--accent); outline-offset: 5px; }
.builder-progress { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 36px; }
.builder-progress__text { color: var(--accent-dark); font-size: 13px; font-weight: 700; letter-spacing: .04em; }
.builder-progress__track { display: flex; flex: 1; gap: 7px; max-width: 360px; }
.builder-progress__track span { height: 3px; flex: 1; border-radius: 4px; background: var(--line); }
.builder-progress__track span.is-done, .builder-progress__track span.is-current { background: var(--accent); }
.question-kicker { margin: 0 0 9px; color: var(--muted-2); font-size: 12px; text-transform: uppercase; letter-spacing: .08em; }
.question-title { margin: 0; font-family: var(--font-serif); font-size: clamp(31px, 5vw, 48px); font-weight: 400; line-height: 1.08; letter-spacing: -.03em; text-wrap: balance; }
.question-hint { margin: 14px 0 0; color: var(--muted); }
.options { display: grid; gap: 10px; margin: 30px 0 0; }
.option-card { position: relative; display: block; cursor: pointer; }
.option-card input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.option-card span {
  display: flex;
  min-height: 60px;
  align-items: center;
  gap: 13px;
  padding: 15px 18px;
  border: 1px solid var(--control-border);
  border-radius: 15px;
  background: rgba(255,255,255,.42);
  transition: border-color 160ms ease, background 160ms ease, transform 160ms ease;
}
.option-card span::before { content: ""; width: 16px; height: 16px; flex: 0 0 16px; border: 1px solid var(--line-strong); border-radius: 50%; background: var(--surface-solid); box-shadow: inset 0 0 0 4px var(--surface-solid); }
.option-card:hover span { border-color: rgba(184,95,62,.58); }
.option-card input:focus-visible + span { outline: 2px solid var(--accent); outline-offset: 3px; }
.option-card input:checked + span { border-color: var(--accent); background: var(--accent-soft); }
.option-card input:checked + span::before { border-color: var(--accent); background: var(--accent); }
.open-fields { display: grid; gap: 22px; margin-top: 30px; padding-top: 28px; border-top: 1px solid var(--line); }
.open-field { margin: 0; }
.builder-error { min-height: 22px; margin: 14px 0 0; color: var(--danger); font-size: 13px; }
.builder-reminder { margin: 0 0 24px; padding: 16px 18px; border-left: 3px solid var(--accent); color: var(--muted); background: var(--accent-soft); }

.builder-shell[data-tool-active="true"] { padding-top: 28px; }
.builder-shell[data-tool-active="true"] .builder-guide__head { display: block; }
.builder-shell[data-tool-active="true"] .builder-guide__head .eyebrow,
.builder-shell[data-tool-active="true"] .builder-guide__lead { display: none; }
.builder-shell[data-tool-active="true"] .builder-guide__head h1 { font-size: clamp(31px, 3.2vw, 40px); line-height: 1.05; }
.builder-shell[data-tool-active="true"] .builder-reminders { display: flex; }
.builder-shell[data-tool-active="true"] .builder-guide__toggle {
  display: flex;
  width: 100%;
  min-height: 44px;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-top: 17px;
  padding: 10px 0;
  text-align: left;
  border: 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: transparent;
  cursor: pointer;
}
.builder-guide__toggle:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; }
.builder-guide__toggle-mark { color: var(--accent-dark); font-size: 20px; }
.builder-shell[data-tool-active="true"] .builder-guide__content { margin-top: 14px; }
.builder-shell[data-tool-active="true"] .builder-stage { margin-top: 22px; padding-top: 28px; }

.fragment-list { display: grid; margin-top: 25px; border-top: 1px solid var(--line); }
.fragment-card { padding: 24px 0; border-bottom: 1px solid var(--line); }
.fragment-card__meta { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 14px; }
.fragment-card__meta strong { font-family: var(--font-serif); font-size: 21px; font-weight: 400; }
.fragment-card__meta small { display: block; margin-top: 4px; color: var(--muted-2); }
.fragment-card textarea { min-height: 120px; }
.destination-group { display: grid; gap: 8px; margin-top: 18px; }
.destination-group legend { margin-bottom: 8px; font-weight: 600; }
.destination-option { display: flex; align-items: flex-start; gap: 9px; color: var(--muted); font-size: 13px; }
.destination-option input { margin-top: 3px; accent-color: var(--accent); }
.fragment-card__controls { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.icon-button { min-height: 44px; padding: 7px 12px; border: 1px solid var(--control-border); border-radius: 999px; background: transparent; cursor: pointer; }
.icon-button:hover, .icon-button:focus-visible { border-color: var(--accent); outline: none; }
.icon-button--danger { color: var(--danger); }

.results-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 24px; }
.tab-button { min-height: 44px; padding: 9px 15px; border: 1px solid var(--control-border); border-radius: 999px; background: transparent; cursor: pointer; }
.tab-button[aria-selected="true"] { border-color: var(--accent); color: white; background: var(--accent); }
.tab-button--primary { border-width: 2px; font-weight: 700; }
.tab-button--additional[aria-selected="true"] { color: var(--accent-dark); background: var(--accent-soft); }
.result-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; margin-bottom: 16px; }
.result-head h2 { margin: 0; }
.result-changed { color: var(--accent-dark); font-size: 12px; }
.stale-warning { margin: 0 0 18px; padding: 14px 16px; border: 1px solid rgba(184,95,62,.3); border-radius: 13px; color: var(--accent-dark); background: var(--accent-soft); }
.stale-warning p { margin: 0; }
.stale-warning .actions { margin-top: 12px; }
.private-note { margin: 0 0 18px; color: var(--muted); }
.result-back { margin-bottom: 18px; }
.memo-output { min-height: 300px; margin: 0; padding: 20px 0; overflow-wrap: anywhere; white-space: pre-wrap; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); color: var(--ink); background: transparent; font: inherit; line-height: 1.65; }
.mode-list { margin-top: 42px; border-bottom: 1px solid var(--line); }
.mode-row {
  display: grid;
  width: 100%;
  min-height: 138px;
  grid-template-columns: 48px minmax(0, 1fr) auto;
  align-items: center;
  gap: 18px;
  padding: 25px 18px 25px 0;
  text-align: left;
  border: 0;
  border-top: 1px solid var(--line);
  background: transparent;
  cursor: pointer;
  transition: background-color 180ms ease, color 180ms ease;
}
.free-actions .mode-row,
.editor-choice .mode-row { grid-template-columns: minmax(0, 1fr) auto; }
.mode-row__number { color: var(--muted-2); font-size: 12px; font-weight: 700; letter-spacing: .08em; transition: color 180ms ease; }
.mode-row__copy { display: block; transition: transform 180ms ease; }
.mode-row__copy strong { display: block; font-family: var(--font-serif); font-size: clamp(25px, 3vw, 34px); font-weight: 400; line-height: 1.12; }
.mode-row__copy > span { display: block; max-width: 520px; margin-top: 9px; color: var(--muted); font-size: 14px; }
.mode-row__arrow { color: var(--accent-dark); font-size: 24px; transition: transform 180ms ease; }
.mode-row:hover { background: rgba(184,95,62,.055); }
.mode-row:hover .mode-row__number,
.mode-row:focus-visible .mode-row__number,
.mode-row:focus-visible .mode-row__copy strong { color: var(--accent-dark); }
.mode-row:hover .mode-row__copy { transform: translateX(5px); }
.mode-row:hover .mode-row__arrow { transform: translateX(6px); }
.mode-row:focus-visible { position: relative; z-index: 1; outline: none; background: rgba(184,95,62,.055); box-shadow: inset 0 -2px 0 rgba(184,95,62,.45); }
.mode-row:focus-visible .mode-row__copy { transform: translateX(5px); }
.mode-row:focus-visible .mode-row__arrow { transform: translateX(6px); }
.mode-row:active { background: var(--accent-soft); }
.question-field { margin-top: 28px; }
.free-writing { min-height: 260px; resize: vertical; }
.prompt-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 20px 0 0; }
.prompt-chip { min-height: 44px; padding: 8px 13px; border: 1px solid var(--control-border); border-radius: 999px; color: var(--muted); background: rgba(255,255,255,.42); cursor: pointer; }
.prompt-chip:hover, .prompt-chip:focus-visible { border-color: var(--accent); color: var(--ink); outline: none; box-shadow: 0 0 0 3px var(--accent-soft); }
.chip-context { margin: 12px 0 0; color: var(--accent-dark); font-size: 13px; }
.refinement, .sentence-starters { margin: 22px 0 0; padding: 18px 0 0; border-top: 1px solid var(--line); }
.refinement summary, .sentence-starters summary { display: flex; min-height: 44px; align-items: center; color: var(--muted); cursor: pointer; font-weight: 600; }
.refinement .field { margin: 18px 0 0; }
.selection-count { color: var(--accent-dark); font-size: 13px; }
.fragment-card p { white-space: pre-wrap; color: var(--muted); }
.check-row { display: flex; min-height: 44px; align-items: flex-start; gap: 11px; padding-block: 9px; cursor: pointer; }
.check-row input { width: 18px; height: 18px; flex: 0 0 18px; margin: 3px 0 0; accent-color: var(--accent); }
.check-row input:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.important-edit { margin: 18px 0 0; }
.question-checklist { display: grid; margin: 28px 0; padding: 0; border: 0; border-top: 1px solid var(--line); }
.question-checklist .check-row { min-height: 52px; padding: 13px 0; border-bottom: 1px solid var(--line); }
.own-questions { padding-top: 24px; border-top: 1px solid var(--line); }
.own-question-row { display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 10px; margin-bottom: 12px; }
.own-question-row textarea { min-height: 74px; resize: vertical; }
[hidden] { display: none !important; }

@media (max-width: 900px) {
  .tool-row { grid-template-columns: 44px minmax(210px, .8fr) minmax(260px, 1.2fr) 30px; gap: 16px; }
  .content-grid { grid-template-columns: 1fr; }
  .builder-shell { width: min(760px, calc(100% - 40px)); }
  .builder-guide__head { display: block; }
  .builder-guide__head .eyebrow { margin-bottom: 10px; }
  .builder-guide__head h1 { font-size: clamp(40px, 8vw, 56px); }
  .builder-guide__lead { max-width: 680px; margin-top: 18px; }
  .guide-summary-grid { grid-template-columns: 1fr; }
  .guide-section { padding: 16px 0; }
  .guide-section + .guide-section { padding-left: 0; border-top: 1px solid var(--line); border-left: 0; }
}

@media (max-width: 720px) {
  :root { --sticky-header-offset: 86px; }
  .site-header { min-height: 70px; padding: 0 16px; }
  .home .site-header--overlay .brand { max-width: calc(100vw - 76px); transform: none; }
  .brand__wordmark { font-size: 17px; }
  .menu-toggle { display: block; }
  .main-nav { position: absolute; top: 62px; right: 16px; display: none; width: min(280px, calc(100vw - 32px)); padding: 12px; border: 1px solid var(--line); border-radius: 15px; background: rgba(250,247,241,.98); box-shadow: 0 18px 50px rgba(65,54,43,.16); }
  .main-nav.is-open { display: grid; }
  .main-nav a { padding: 11px 10px; }
  .home-main { width: calc(100% - 32px); padding: 116px 0 44px; }
  .tools-overview__head h2 { font-size: clamp(36px, 10vw, 48px); }
  .tools-overview__intro { margin-top: 16px; font-size: 15px; }
  .tools-overview__nav { margin-top: 36px; }
  .tool-row {
    min-height: 118px;
    grid-template-columns: 34px minmax(0, 1fr) 24px;
    align-items: start;
    gap: 8px 12px;
    padding: 22px 4px;
  }
  .tool-row__number { grid-column: 1; grid-row: 1 / span 2; padding-top: 5px; }
  .tool-row__title { grid-column: 2; grid-row: 1; font-size: clamp(24px, 7vw, 30px); }
  .tool-row__description { grid-column: 2 / 4; grid-row: 2; font-size: 14px; }
  .tool-row__arrow { grid-column: 3; grid-row: 1; padding-top: 2px; font-size: 21px; }
  .home-privacy { padding: 16px; }
  .home-footer, .site-footer { width: calc(100% - 32px); }
  .page-shell, .builder-shell { width: calc(100% - 32px); padding-top: 38px; }
  .page-head h1 { font-size: 44px; }
  .panel { border-radius: 18px; }
  .builder-guide__head h1 { font-size: clamp(36px, 10.5vw, 48px); }
  .builder-guide__lead { font-size: 14px; line-height: 1.58; }
  .builder-reminders { align-items: flex-start; flex-direction: column; gap: 7px; }
  .builder-stage { margin-top: 30px; padding-top: 28px; }
  .mode-list { margin-top: 30px; }
  .mode-grid { grid-template-columns: 1fr; }
  .mode-card { min-height: 132px; padding: 22px 48px 22px 4px; }
  .mode-card + .mode-card { border-top: 1px solid var(--line); border-left: 0; }
  .mode-card::after { right: 8px; }
  .mode-row { min-height: 126px; grid-template-columns: 34px minmax(0, 1fr) 24px; gap: 10px; padding: 20px 4px 20px 0; }
  .mode-row__copy strong { font-size: 26px; }
  .mode-row__copy > span { font-size: 13px; }
  .builder-progress { align-items: flex-start; flex-direction: column; gap: 10px; }
  .builder-progress__track { width: 100%; max-width: none; }
  .actions--between { align-items: stretch; flex-direction: column-reverse; }
  .actions__group { display: grid; grid-template-columns: 1fr; }
  .actions .button { width: 100%; }
  .own-question-row { grid-template-columns: 1fr; }
  .fragment-card__meta, .result-head { flex-direction: column; }
  .results-tabs { display: grid; grid-template-columns: 1fr; }
  .tab-button { width: 100%; }
}

@media (max-width: 440px) {
  .home-footer, .site-footer { gap: 9px; align-items: flex-start; flex-direction: column; }
  .question-title { font-size: 34px; }
  .builder-guide__head h1 { font-size: 36px; }
  .option-card span { min-height: 64px; }
  .mode-row { align-items: start; }
  .mode-row__number, .mode-row__arrow { padding-top: 5px; }
}

@media (hover: none) { .tool-row:active, .option-card:active span { transform: scale(.99); } }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .line-field__canvas { opacity: .52; }
  .home-intro > h1, .home-intro > .hero-copy__body, .home-intro > .home-start,
  .tools-overview__head, .home-tools .tool-list li, .home-privacy,
  .tool-row:hover .tool-row__title, .tool-row:hover .tool-row__description, .tool-row:hover .tool-row__arrow { filter: none !important; transform: none !important; }
  .mode-card:hover::after,
  .mode-row:hover .mode-row__copy, .mode-row:hover .mode-row__arrow { transform: none; }
}

/* Единая система листа: материал, крепление и межстраничный переход */
.site-header {
  border-bottom-color: rgba(58, 51, 43, .2);
  background: var(--header-background);
}

.home::before,
.interior::before {
  content: "";
  position: fixed;
  z-index: 0;
  inset: 0;
  background:
    radial-gradient(circle at 76% 18%, rgba(184,95,62,.055), transparent 34%),
    radial-gradient(circle at 15% 76%, rgba(79,123,114,.065), transparent 36%),
    radial-gradient(ellipse at 50% 38%, rgba(255,255,255,.2), transparent 62%);
  pointer-events: none;
}

.home-main,
.page-shell,
.home-footer,
.site-footer { position: relative; z-index: 2; }

.notebook-binding {
  position: fixed;
  z-index: 70;
  top: 65px;
  left: 50%;
  display: flex;
  width: min(900px, calc(100vw - 180px));
  height: 30px;
  align-items: flex-start;
  justify-content: space-between;
  transform: translateX(-50%);
  pointer-events: none;
}

.notebook-binding__ring {
  position: relative;
  display: block;
  width: 17px;
  height: 30px;
  border: 2px solid #4b4945;
  border-bottom-color: #302f2d;
  border-radius: 50% 50% 45% 45%;
  background: rgba(241,236,227,.72);
  box-shadow: 0 5px 6px rgba(48,43,38,.13), inset 2px 0 rgba(255,255,255,.3), inset -1px 0 rgba(48,43,38,.13);
  transform: perspective(60px) rotateX(8deg);
}

.notebook-binding__ring::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 4px;
  left: 50%;
  width: 8px;
  height: 5px;
  border-radius: 50%;
  background: rgba(66,58,49,.22);
  box-shadow: 0 1px 0 rgba(255,255,255,.25);
  transform: translateX(-50%);
}

.notebook-binding__ring::after {
  content: "";
  position: absolute;
  inset: 3px 4px 5px;
  border: 1px solid rgba(74,70,65,.3);
  border-radius: inherit;
}

.hero-copy::before {
  background: radial-gradient(ellipse at center, rgba(241,236,227,.96) 0, rgba(241,236,227,.8) 48%, rgba(241,236,227,0) 78%);
}

.home-tools {
  position: relative;
  isolation: isolate;
}

.home-tools::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: -26px -34px;
  background: radial-gradient(ellipse at center, rgba(241,236,227,.86), rgba(241,236,227,.42) 66%, transparent 88%);
  pointer-events: none;
}

.interior { background: var(--paper-background); }

main :is(h1, h2)[tabindex="-1"]:focus {
  outline: none;
}
main[tabindex="-1"]:focus { outline: none; }
main :is(h1, h2)[tabindex="-1"] { scroll-margin-top: var(--sticky-header-offset); }
.panel {
  border-color: rgba(58,51,43,.14);
  border-radius: 14px;
  background: rgba(248,245,239,.72);
  box-shadow: 0 15px 42px rgba(65,54,43,.035);
}

textarea {
  border-color: var(--control-border);
  border-radius: 10px;
  background:
    linear-gradient(rgba(248,245,239,.93), rgba(248,245,239,.93)),
    var(--surface-solid);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.45);
}

textarea[data-free],
.free-writing {
  background:
    repeating-linear-gradient(to bottom, transparent 0, transparent calc(1.55em - 1px), rgba(93,83,72,.055) calc(1.55em - 1px), rgba(93,83,72,.055) 1.55em),
    rgba(248,245,239,.94);
  background-position: 0 16px;
}

textarea:focus {
  border-color: var(--accent);
  background-color: #fbf8f2;
  box-shadow: 0 0 0 3px rgba(184,95,62,.09), inset 0 1px 0 rgba(255,255,255,.58);
}

.builder-workspace,
[data-session-form],
[data-session-output] { position: relative; isolation: isolate; }

.builder-workspace::before,
[data-session-form]::before,
[data-session-output]::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: -22px -26px;
  border-radius: 24px;
  background: radial-gradient(ellipse at center, rgba(248,245,239,.82), rgba(248,245,239,.42) 66%, transparent 88%);
  pointer-events: none;
}

.home-stage { perspective: 1500px; }

/* Переход между маршрутами — один полноэкранный лист. Его корешок находится
   на внешней границе окна, поэтому первый кадр не разрезает страницу пополам. */
.route-flip {
  position: fixed;
  z-index: 60;
  top: var(--home-header-height);
  right: 0;
  bottom: 0;
  left: 0;
  overflow: hidden;
  isolation: isolate;
  background: var(--paper-background);
  pointer-events: none;
  contain: strict;
  perspective: 2100px;
}
.route-flip--open-cover,
.route-flip--close-cover { z-index: 90; }
.route-flip__underlay,
.route-flip__turn,
.route-flip__visual {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.route-flip__underlay { z-index: 1; }
.route-flip__turn {
  z-index: 2;
  overflow: hidden;
  background: var(--paper-background);
  transform: translateZ(0);
  transform-style: preserve-3d;
  will-change: clip-path;
}
.route-flip__curl {
  position: absolute;
  z-index: 3;
  top: -6%;
  bottom: -6%;
  left: calc(100% - 42px);
  width: 84px;
  opacity: 0;
  border-radius: 50%;
  background: linear-gradient(90deg, transparent 3%, rgba(255,252,246,.68) 37%, rgba(97,72,52,.18) 66%, transparent 97%);
  box-shadow: 0 0 26px rgba(52,39,28,.16);
  transform: translateZ(18px) rotateY(-5deg);
  will-change: left, opacity, transform;
}
.route-flip[data-direction="back"] .route-flip__curl {
  left: -42px;
  background: linear-gradient(270deg, transparent 3%, rgba(255,252,246,.68) 37%, rgba(97,72,52,.18) 66%, transparent 97%);
  transform: translateZ(18px) rotateY(5deg);
}
.route-flip[data-direction="forward"] .route-flip__turn.is-turning {
  animation: route-leaf-forward var(--route-turn-duration, 560ms) cubic-bezier(.42, .03, .18, 1) both;
}
.route-flip[data-direction="back"] .route-flip__turn.is-turning {
  animation: route-leaf-back var(--route-turn-duration, 560ms) cubic-bezier(.42, .03, .18, 1) both;
}
.route-flip[data-direction="forward"] .route-flip__turn.is-turning + .route-flip__curl {
  animation: route-curl-forward var(--route-turn-duration, 560ms) cubic-bezier(.42, .03, .18, 1) both;
}
.route-flip[data-direction="back"] .route-flip__turn.is-turning + .route-flip__curl {
  animation: route-curl-back var(--route-turn-duration, 560ms) cubic-bezier(.42, .03, .18, 1) both;
}
@keyframes route-leaf-forward {
  0% {
    clip-path: polygon(0 0, 100% 0, 100% 16%, 100% 33%, 100% 50%, 100% 67%, 100% 84%, 100% 100%, 0 100%);
  }
  45% {
    clip-path: polygon(0 0, 56% 0, 58% 16%, 62% 33%, 66% 50%, 62% 67%, 58% 84%, 56% 100%, 0 100%);
  }
  78% {
    clip-path: polygon(0 0, 18% 0, 20% 16%, 24% 33%, 28% 50%, 24% 67%, 20% 84%, 18% 100%, 0 100%);
  }
  100% {
    clip-path: polygon(0 0, 0 0, 0 16%, 0 33%, 0 50%, 0 67%, 0 84%, 0 100%, 0 100%);
  }
}
@keyframes route-leaf-back {
  0% {
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%, 0 84%, 0 67%, 0 50%, 0 33%, 0 16%);
  }
  45% {
    clip-path: polygon(44% 0, 100% 0, 100% 100%, 44% 100%, 42% 84%, 38% 67%, 34% 50%, 38% 33%, 42% 16%);
  }
  78% {
    clip-path: polygon(82% 0, 100% 0, 100% 100%, 82% 100%, 80% 84%, 76% 67%, 72% 50%, 76% 33%, 80% 16%);
  }
  100% {
    clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%, 100% 84%, 100% 67%, 100% 50%, 100% 33%, 100% 16%);
  }
}
@keyframes route-curl-forward {
  0%, 100% { opacity: 0; }
  45% { left: calc(66% - 42px); opacity: .94; transform: translateZ(18px) rotateY(-9deg) scaleX(.92); }
  78% { left: calc(28% - 42px); opacity: .74; transform: translateZ(13px) rotateY(-6deg) scaleX(.82); }
  100% { left: -84px; }
}
@keyframes route-curl-back {
  0%, 100% { opacity: 0; }
  45% { left: calc(34% - 42px); opacity: .94; transform: translateZ(18px) rotateY(9deg) scaleX(.92); }
  78% { left: calc(72% - 42px); opacity: .74; transform: translateZ(13px) rotateY(6deg) scaleX(.82); }
  100% { left: 100%; }
}
.route-flip__visual {
  overflow: hidden;
  isolation: isolate;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
.route-flip__visual--cover {
  background-color: var(--cover-base);
  background-image: url("../images/cover-texture.webp");
  background-position: center 48%;
  background-size: cover;
}
.route-flip__paper {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  isolation: isolate;
  opacity: 1;
  background-color: var(--paper-background);
  background-image: linear-gradient(rgba(238,228,211,.82), rgba(238,228,211,.82)), var(--paper-texture);
  background-position: center;
  background-size: cover, cover;
}
.route-flip__paper > main {
  position: relative;
  z-index: 1;
  min-height: calc(100svh - var(--home-header-height));
  margin: 0 auto;
}
.route-flip--preflight { z-index: 59; }
.route-flip__paper--preflight { display: block; }
.route-flip__paper > .home-main.route-home-tools {
  width: min(1080px, calc(100% - 48px));
  padding-top: 60px;
}
.route-flip .route-flip__cover-visual {
  position: absolute;
  z-index: 1;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.is-page-turning { height: 100svh; overflow: hidden; overscroll-behavior: none; }
.is-page-turning > :not(.site-header):not(.notebook-binding):not(.route-flip) { pointer-events: none; }

@media (max-width: 720px) {
  .notebook-binding {
    top: 61px;
    width: min(410px, calc(100vw - 112px));
    height: 25px;
  }
  .notebook-binding__ring { width: 15px; height: 25px; }
  .notebook-binding__ring:nth-child(2n) { display: none; }
  .route-flip { top: var(--home-header-height); }
  .route-flip__paper > .home-main.route-home-tools { width: calc(100% - 32px); }
  .home-tools::before { inset: -20px -14px; }
  .builder-workspace::before,
  [data-session-form]::before,
  [data-session-output]::before { inset: -16px -10px; }
}

/* Эталонный материал альбома: кожаная обложка, кожаный корешок и бумага под ними */
:root {
  --cover-base: #31483e;
  --cover-shadow: #1d2e27;
  --cover-light: #496257;
  --cover-highlight: #667a70;
  --spine-base: #5e3530;
  --spine-shadow: #321d1a;
  --spine-fold: #794840;
  --spine-highlight: #8a584e;
  --skin-heading: #f5ebdd;
  --skin-lead: #e9dbc8;
  --skin-body: #dfd0bd;
  --skin-muted: #c9b8a5;
  --accent-ochre: #c99a56;
  --accent-focus: #ddae66;
  --home-header-height: 72px;
  --home-header-content: 1200px;
  --home-copy-width: 760px;
  --home-lead-width: 560px;
  --home-body-width: 720px;
  --home-title-size: clamp(58px, 5vw, 72px);
  --home-body-size: 16.5px;
  --home-button-width: 148px;
  --home-button-height: 50px;
  --paper-background: #eee4d3;
  --paper-surface: #f7f1e7;
  --paper-deep: #e3d6c4;
  --paper-texture-opacity: .2;
  --paper-texture: url("../images/paper-texture.webp");
}

html { background: var(--paper-background); }
body::after {
  opacity: var(--paper-texture-opacity);
  background-image: var(--paper-texture);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  mix-blend-mode: multiply;
}

.site-header {
  min-height: var(--home-header-height);
  gap: 32px;
  padding-inline: max(28px, calc((100vw - var(--home-header-content)) / 2));
  overflow: visible;
  border: 0;
  color: var(--skin-heading);
  background-color: var(--spine-base);
  background-image:
    linear-gradient(to bottom, rgba(255,255,255,.035), transparent 30%, rgba(40,18,16,.16) 78%, rgba(35,18,16,.36)),
    linear-gradient(90deg, rgba(38,18,16,.28), transparent 8%, transparent 92%, rgba(38,18,16,.3)),
    url("../images/spine-texture.webp");
  background-position: center, center, center 47%;
  background-size: cover, cover, cover;
  box-shadow: 0 6px 13px rgba(24,16,14,.2);
}
.site-header::before {
  content: "";
  position: absolute;
  z-index: 0;
  right: 0;
  bottom: -8px;
  left: 0;
  height: 14px;
  border-radius: 0 0 48% 48% / 0 0 90% 90%;
  background:
    linear-gradient(to bottom, rgba(128,80,72,.38), rgba(50,29,26,.88) 58%, rgba(29,17,15,.95));
  box-shadow: 0 8px 12px rgba(31,22,18,.25), inset 0 1px rgba(255,230,208,.11);
  pointer-events: none;
}
.site-header::after {
  content: "";
  position: absolute;
  z-index: 0;
  right: 0;
  bottom: -10px;
  left: 0;
  height: 2px;
  background: rgba(244,226,200,.22);
  box-shadow: 0 5px 9px rgba(28,20,17,.2);
  pointer-events: none;
}
.site-header > * { position: relative; z-index: 1; }
.home .site-header--overlay .brand { transform: none; }
.brand__wordmark {
  color: #f3e6d3;
  font-family: var(--font-serif);
  font-size: 20px;
  font-style: italic;
  font-weight: 500;
  line-height: 1;
  letter-spacing: -.015em;
  text-shadow: 0 1px 1px rgba(28,15,13,.35);
}
.main-nav { gap: 32px; }
.main-nav a {
  color: #dcc5ad;
  font-family: var(--font-sans);
  font-size: 14.5px;
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: .012em;
  text-underline-offset: 7px;
  text-decoration-thickness: 1px;
  text-decoration-color: transparent;
}
.main-nav a:hover,
.main-nav a:focus-visible,
.main-nav a[aria-current="page"] {
  color: var(--skin-heading);
  text-decoration-color: var(--accent-ochre);
}
.menu-toggle {
  border-color: rgba(245,235,221,.48);
  color: var(--skin-heading);
  background: rgba(31,17,15,.2);
}
.menu-toggle span:not(.sr-only) { background: currentColor; }
.notebook-binding { display: none !important; }

.home {
  min-height: 100svh;
  background: var(--paper-background);
  perspective: 1800px;
  perspective-origin: 50% var(--home-header-height);
}
.home::before { background: none; }
.home[data-home-state="intro"]::after,
.home[data-home-state="preparing"]::after,
.home[data-home-state="opening"]::after { opacity: 0; }
.home-main {
  width: min(1080px, calc(100% - 48px));
  min-height: calc(100svh - var(--home-header-height));
  padding-top: 112px;
  background: transparent;
}
.home-stage { min-height: calc(100svh - 196px); perspective: none; }

.home-cover {
  position: fixed;
  z-index: 4;
  top: var(--home-header-height);
  right: 0;
  bottom: 0;
  left: 0;
  display: flex;
  width: auto;
  align-items: center;
  justify-content: center;
  overflow: hidden auto;
  padding: clamp(46px, 7vh, 82px) 0 clamp(84px, 11vh, 116px);
  color: var(--skin-heading);
  background-color: var(--cover-base);
  background-image:
    radial-gradient(ellipse at 50% 36%, rgba(102,122,112,.16), transparent 52%),
    linear-gradient(90deg, rgba(25,41,35,.3), transparent 9%, transparent 90%, rgba(24,38,33,.34)),
    linear-gradient(to bottom, rgba(255,255,255,.025), transparent 35%, rgba(20,33,28,.22)),
    url("../images/cover-texture.webp");
  background-position: center, center, center, center 48%;
  background-size: cover, cover, cover, cover;
  box-shadow: inset 0 13px 18px rgba(17,28,24,.28), inset 0 -22px 42px rgba(14,24,20,.28);
  transform-origin: 50% 0;
  backface-visibility: hidden;
}
.home-cover::before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 0;
  background:
    radial-gradient(ellipse at center, transparent 47%, rgba(14,24,20,.18) 100%),
    linear-gradient(to bottom, rgba(255,255,255,.025), transparent 16%, transparent 82%, rgba(10,19,16,.12));
  pointer-events: none;
}
.home-cover::after {
  content: "";
  position: absolute;
  z-index: 0;
  top: 0;
  right: 0;
  left: 0;
  height: 20px;
  background: linear-gradient(to bottom, rgba(8,15,13,.36), rgba(8,15,13,.08), transparent);
  pointer-events: none;
}
.home-cover__content {
  position: relative;
  z-index: 2;
  width: min(var(--home-copy-width), calc(100% - 48px));
  margin-inline: auto;
  transform: translateY(-2vh);
}
.line-field {
  position: absolute;
  z-index: 1;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}
.line-field__canvas {
  width: 100%;
  height: 100%;
  opacity: .72;
  mix-blend-mode: screen;
}
.hero-copy::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: -60px -72px;
  background: radial-gradient(ellipse at center, rgba(20,34,28,.42) 0%, rgba(20,34,28,.22) 52%, transparent 78%);
  pointer-events: none;
}
.hero-copy h1 {
  max-width: 800px;
  margin: 0 auto;
  color: var(--skin-heading);
  font-family: var(--font-serif);
  font-size: var(--home-title-size);
  font-style: italic;
  font-weight: 430;
  line-height: .98;
  letter-spacing: -.025em;
  text-align: center;
  text-shadow: 0 2px 2px rgba(15,25,21,.32);
  text-wrap: balance;
  white-space: nowrap;
}
.hero-copy__body {
  width: 100%;
  margin: 28px auto 0;
  text-shadow: 0 1px 1px rgba(14,24,20,.3);
}
.hero-copy__lead {
  max-width: var(--home-lead-width);
  margin: 0 auto;
  color: var(--skin-lead);
  font-family: var(--font-serif);
  font-size: 19px;
  font-style: normal;
  font-weight: 450;
  line-height: 1.4;
  text-align: center;
}
.hero-copy__prose {
  max-width: var(--home-body-width);
  margin: 22px auto 0;
  color: var(--skin-body);
  font-family: var(--font-sans);
  font-size: var(--home-body-size);
  font-weight: 400;
  line-height: 1.62;
  letter-spacing: .005em;
  text-align: center;
}
.hero-copy__prose p { margin: 0; }
.hero-copy__prose p + p { margin-top: 15px; }
.home-start {
  min-width: var(--home-button-width);
  min-height: var(--home-button-height);
  margin-top: 32px;
  padding: 12px 24px;
  font-family: var(--font-sans);
  font-size: 15.5px;
  font-weight: 550;
  letter-spacing: .015em;
  transition: color 180ms ease, background-color 180ms ease, border-color 180ms ease, transform 180ms ease;
}
.home-start.button--primary {
  border-color: rgba(222,202,176,.72);
  color: var(--skin-heading);
  background: rgba(245,235,221,.08);
  box-shadow: none;
}
.home-start.button--primary:hover,
.home-start.button--primary:focus-visible {
  border-color: #eadbc5;
  color: #263b32;
  background: #eadbc5;
}
.home-start.button--primary:focus-visible {
  outline: 3px solid rgba(218,166,86,.72);
  outline-offset: 4px;
  box-shadow: none;
}
.home-start:hover { transform: translateY(-1px); }
.home-start:active { transform: scale(.98); }

.home-footer {
  position: fixed;
  z-index: 6;
  right: max(28px, calc((100vw - var(--home-header-content)) / 2));
  bottom: 0;
  left: max(28px, calc((100vw - var(--home-header-content)) / 2));
  width: auto;
  border-top-color: rgba(225,210,190,.18);
  color: rgba(223,208,189,.9);
  font-family: var(--font-sans);
  font-size: 12.5px;
  transition: opacity 180ms ease;
}
.home-footer a { color: rgba(223,208,189,.9); }
[data-home-state="opening"] .home-footer { opacity: 0; pointer-events: none; }
.home.home-tools-active .home-main {
  justify-content: flex-start;
  padding-top: 132px;
}
.home.home-tools-active .home-stage { min-height: 0; }
.home.home-tools-active .home-footer {
  position: relative;
  right: auto;
  bottom: auto;
  left: auto;
  width: min(1080px, calc(100% - 48px));
  border-top-color: var(--line);
  color: var(--muted-2);
}
.home.home-tools-active .home-footer a { color: inherit; }
.home-tools { color: var(--ink); }
.home-tools::before { display: none; }

body.is-cover-turning {
  height: 100svh;
  overflow: hidden;
  overscroll-behavior: none;
}
body.is-cover-turning > :not(.cover-flip) { pointer-events: none; }
.home-tools.is-prepared .tools-overview__head,
.home-tools.is-prepared .tool-list li,
.home-tools.is-prepared .home-privacy {
  opacity: 1;
  transform: none;
  transition: none;
}

.cover-flip {
  position: fixed;
  z-index: 90;
  overflow: hidden;
  isolation: isolate;
  background: var(--paper-background);
  pointer-events: none;
  contain: strict;
}
.cover-flip__book,
.cover-flip .stf__parent,
.cover-flip .stf__wrapper,
.cover-flip .stf__block {
  width: 100%;
  height: 100%;
}
.cover-flip .stf__parent {
  position: relative;
  display: block;
  box-sizing: border-box;
  transform: translateZ(0);
  touch-action: none;
}
.cover-flip .stf__wrapper {
  position: relative;
  box-sizing: border-box;
}
.cover-flip .stf__block {
  position: absolute;
  inset: 0;
  box-sizing: border-box;
  perspective: 2000px;
}
.cover-flip .stf__item {
  position: absolute;
  display: none;
  transform-style: preserve-3d;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
.cover-flip .stf__item > * {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
.cover-flip :is(.stf__outerShadow, .stf__innerShadow, .stf__hardShadow, .stf__hardInnerShadow) {
  position: absolute;
  top: 0;
  left: 0;
}
.cover-flip__page {
  position: absolute;
  overflow: hidden;
  isolation: isolate;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  transform: translateZ(0);
}
.cover-flip__page--cover {
  background: var(--cover-base);
}
.cover-flip__page.--soft-back-face > :is(.cover-flip__cover-visual, .cover-flip__paper) {
  visibility: hidden;
}
.cover-flip__page--cover.--soft-back-face {
  background-color: var(--paper-background);
  background-image:
    linear-gradient(rgba(238,228,211,.88), rgba(238,228,211,.88)),
    var(--paper-texture);
  background-position: center;
  background-size: cover, 360px 360px;
}
.cover-flip__page--paper,
.cover-flip__paper {
  background-color: var(--paper-background);
  background-image:
    linear-gradient(rgba(238,228,211,.82), rgba(238,228,211,.82)),
    var(--paper-texture);
  background-position: center;
  background-size: cover, 360px 360px;
}
.cover-flip__cover-visual,
.cover-flip__paper {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.cover-flip__cover-visual {
  position: absolute;
  top: 0;
  bottom: auto;
}
.cover-flip__cover-visual .line-field__canvas {
  display: block;
  object-fit: fill;
}
.cover-flip__paper-content {
  width: min(1080px, calc(100% - 48px));
  margin-inline: auto;
  padding-top: 60px;
}
.cover-flip__paper-content .home-tools {
  color: var(--ink);
}

@media (max-width: 720px) {
  :root {
    --home-header-height: 64px;
    --home-title-size: clamp(40px, 13vw, 48px);
    --home-body-size: 15.5px;
  }
  .site-header {
    min-height: var(--home-header-height);
    padding-inline: 16px;
    background-position: center, center, center 46%;
  }
  .site-header::before { bottom: -7px; height: 12px; }
  .site-header::after { bottom: -9px; }
  .brand__wordmark { font-size: 18px; }
  .menu-toggle { width: 44px; height: 44px; }
  .main-nav.is-open {
    color: var(--skin-heading);
    background:
      linear-gradient(rgba(50,29,26,.9), rgba(50,29,26,.94)),
      url("../images/spine-texture.webp") center / cover;
    box-shadow: 0 14px 26px rgba(25,17,14,.28);
  }
  .main-nav a { font-size: 16px; }
  .home { perspective-origin: 50% var(--home-header-height); }
  .home-main {
    min-height: calc(100svh - var(--home-header-height));
    padding-top: 98px;
  }
  .home-cover {
    top: var(--home-header-height);
    align-items: flex-start;
    padding: clamp(40px, 7vh, 62px) 0 88px;
    background-position: center, center, center, 58% center;
  }
  .home-cover__content {
    width: calc(100% - 36px);
    margin: auto;
    transform: translateY(-1vh);
  }
  .hero-copy::before { inset: -44px -28px; }
  .hero-copy h1 { line-height: 1.02; letter-spacing: -.02em; }
  .hero-copy__body { margin-top: 26px; }
  .hero-copy__lead { font-size: 18px; }
  .hero-copy__prose { margin-top: 20px; font-size: var(--home-body-size); line-height: 1.58; text-align: center; }
  .hero-copy__prose p + p { margin-top: 14px; }
  .home-start { min-width: var(--home-button-width); min-height: var(--home-button-height); margin-top: 30px; }
  .line-field__canvas { opacity: .66; }
  .home-footer { right: 16px; left: 16px; min-height: 54px; padding-bottom: 14px; }
  .home.home-tools-active .home-main { padding-top: 116px; }
  .cover-flip__cover-visual {
    align-items: flex-start;
    padding: clamp(40px, 7vh, 62px) 0 88px;
    background-position: center, center, center, 58% center;
  }
  .cover-flip__paper-content {
    width: calc(100% - 48px);
    padding-top: 52px;
  }
}

@media (max-width: 440px) {
  .hero-copy h1 { white-space: normal; }
}

@media (max-height: 690px) and (max-width: 720px) {
  .home-cover { padding-top: 30px; padding-bottom: 64px; }
}

@media (prefers-reduced-motion: reduce) {
  .route-flip,
  .cover-flip { display: none !important; }
  .line-field__canvas { opacity: .58; }
}

/* Финальная privacy-first версия конструктора */
.builder-guide__notices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 24px; }
.builder-guide__notice strong { color: var(--ink); }
.choice-hint { max-width: 720px; margin: 14px 0 0; color: var(--muted); font-size: 14px; }
.radio-list { display: grid; margin: 28px 0 0; padding: 0; border: 0; border-top: 1px solid var(--line); }
.radio-row { position: relative; display: flex; min-height: 52px; align-items: flex-start; gap: 12px; padding: 13px 4px; border-bottom: 1px solid var(--line); color: var(--muted); cursor: pointer; }
.radio-row input { width: 18px; height: 18px; flex: 0 0 18px; margin: 2px 0 0; accent-color: var(--accent); }
.radio-row:has(input:checked) { color: var(--ink); background: rgba(184,95,62,.045); }
.radio-row:has(input:focus-visible) { outline: 2px solid var(--accent); outline-offset: 3px; }
.followup, .boundary-choice { margin-top: 28px; padding: 22px; border: 1px solid var(--line); border-radius: 14px; background: rgba(248,245,239,.68); }
.followup .radio-list { margin-top: 14px; }
.boundary-choice { padding-top: 18px; }
.boundary-choice legend, .destination-list legend { padding: 0 8px; font-weight: 650; }
.skip-state { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--line); }
.text-choice { min-height: 44px; padding: 8px 13px; border: 1px solid var(--control-border); border-radius: 999px; color: var(--muted); background: transparent; cursor: pointer; }
.text-choice:hover, .text-choice:focus-visible, .text-choice.is-selected { border-color: var(--accent); color: var(--ink); outline: none; background: var(--accent-soft); }
.free-field { margin-top: 30px; }
.free-field textarea { min-height: 330px; resize: vertical; }
.site-starter { margin: 24px 0 0; padding: 16px 18px; border-left: 3px solid var(--accent); background: var(--accent-soft); }
.site-starter > span, .draft-segment--site > span, .draft-segment--user > span, .original-fragment > span { display: block; margin-bottom: 6px; color: var(--accent-dark); font-size: 11px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.site-starter p { margin: 0 0 10px; font-family: var(--font-serif); font-size: 19px; }
.selection-limit { margin: 12px 0; padding: 12px 14px; border-left: 3px solid var(--accent); color: var(--accent-dark); background: var(--accent-soft); }
.important-mark { padding: 5px 9px; border-radius: 999px; color: var(--accent-dark); background: var(--accent-soft); font-size: 11px; }
.original-fragment { margin: 0 0 16px; padding: 14px 16px; border-left: 2px solid var(--line-strong); background: rgba(255,255,255,.28); }
.destination-list { display: grid; margin: 20px 0 0; padding: 0; border: 0; }
.destination-list .radio-row { min-height: 46px; padding: 10px 4px; font-size: 13px; }
.draft-segments { display: grid; gap: 10px; margin: 20px 0 24px; }
.draft-segment { margin: 0; padding: 14px 16px; border-radius: 10px; }
.draft-segment--site { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px 12px; border: 1px dashed rgba(184,95,62,.42); background: var(--accent-soft); }
.draft-segment--site > span { grid-column: 1 / -1; margin: 0; }
.draft-segment--site input { min-height: 44px; padding: 9px 11px; border: 1px solid var(--control-border); border-radius: 8px; color: var(--ink); background: var(--surface-solid); }
.draft-segment--site input:focus-visible { border-color: var(--accent); outline: 3px solid var(--accent-soft); }
.draft-segment--user { border-left: 3px solid var(--line-strong); background: rgba(255,255,255,.32); white-space: pre-wrap; }
.draft-segment--user > span { color: var(--muted-2); }
.result-kind { width: fit-content; margin: 0 0 8px; padding: 5px 9px; border-radius: 999px; color: var(--accent-dark); background: var(--accent-soft); font-size: 12px; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; }
.result-panel--additional > h2 { font-size: 28px; }
.result-editor.is-collapsed { margin-bottom: 0; }
.message-greeting { margin-top: 28px; border-top: 1px solid var(--line); }
.message-greeting span { display: grid; gap: 4px; }
.message-greeting small { color: var(--muted); font-size: 13px; font-weight: 400; }
.message-export { margin-top: 48px; padding-top: 32px; border-top: 1px solid var(--line-strong); }
.message-export h2 { margin: 0; font-family: var(--font-serif); font-size: 30px; font-weight: 400; }
.message-export > p { color: var(--muted); }
.message-origin { margin: 18px 0; padding: 14px 16px; border: 1px dashed rgba(184,95,62,.42); border-radius: 10px; background: var(--accent-soft); }
.message-origin strong { display: block; margin-bottom: 5px; color: var(--accent-dark); font-size: 11px; letter-spacing: .05em; text-transform: uppercase; }
.length-warning { padding: 12px 14px; color: var(--accent-dark) !important; background: var(--accent-soft); }
.length-warning--strong { border-left: 3px solid var(--accent); font-weight: 650; }
.detail-toggle { margin-top: 16px; }
.prior-answer,
.gentle-hint,
.similar-notice {
  margin: 22px 0 0;
  padding: 16px 18px;
  border-left: 3px solid var(--accent);
  background: rgba(184,95,62,.065);
}
.prior-answer > span { color: var(--accent-dark); font-size: 11px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.prior-answer p,
.gentle-hint { white-space: pre-wrap; }
.prior-answer p { margin: 7px 0 0; }
.free-actions,
.editor-choice { margin-top: 28px; }
.split-list,
.message-blocks,
.fragment-groups { display: grid; gap: 18px; margin-top: 24px; }
.split-part { padding: 18px; border: 1px solid var(--line); border-radius: 12px; background: rgba(255,255,255,.22); }
.split-part textarea { min-height: 150px; }
.split-part .button { margin-top: 10px; }
.message-block { min-width: 0; margin: 0; padding: 18px; border: 1px solid var(--line); border-radius: 14px; }
.message-block legend { padding: 0 8px; font-family: var(--font-serif); font-size: 20px; }
.message-option span { min-width: 0; overflow-wrap: anywhere; white-space: pre-wrap; }
.fragment-group { min-width: 0; border: 1px solid var(--line); border-radius: 14px; background: rgba(255,255,255,.18); }
.fragment-group > summary { padding: 17px 18px; color: var(--ink); font-family: var(--font-serif); font-size: 21px; cursor: pointer; }
.fragment-group > summary span { margin-left: 6px; color: var(--muted); font-family: var(--font-sans); font-size: 13px; }
.fragment-group > .group-memo { margin: 0 18px 6px; }
.fragment-group > .fragment-list { padding: 0 18px 18px; }
.similar-notice strong { display: block; color: var(--ink); }
.similar-notice p { margin: 10px 0 0; overflow-wrap: anywhere; }
.similar-notice .actions { margin-top: 12px; }
.reset-actions { padding-top: 18px; border-top: 1px solid var(--line); }
[data-screen] { transition: opacity 180ms ease, transform 180ms ease; }
[data-screen].is-entering { animation: builder-screen-in 220ms ease both; }
@keyframes builder-screen-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
.print-result { display: none; }

@media (max-width: 720px) {
  .builder-guide__notices { grid-template-columns: 1fr; gap: 0; }
  .followup, .boundary-choice { padding: 16px; }
  .skip-state { display: grid; grid-template-columns: 1fr; }
  .text-choice { width: 100%; }
  .draft-segment--site { grid-template-columns: 1fr; }
  .draft-segment--site > span { grid-column: 1; }
  .message-block,
  .split-part { padding: 14px; }
  .fragment-group > .fragment-list { padding-inline: 12px; }
  .fragment-group > .group-memo { margin-inline: 12px; }
  textarea { resize: vertical; }
}

@media (prefers-reduced-motion: reduce) {
  [data-screen].is-entering { animation: none; }
  [data-screen] { transition: none; }
}

@media print {
  body > :not(.print-result) { display: none !important; }
  .print-result { display: block; padding: 18mm; color: #111; background: #fff; }
  .print-result h1 { font: 400 28pt/1.1 var(--font-serif); }
  .print-result pre { white-space: pre-wrap; overflow-wrap: anywhere; font: 12pt/1.55 var(--font-sans); }
}

/* Browser Back/Forward: native and non-blocking when cross-document View
   Transitions are available; plain navigation remains the fallback. */
@view-transition { navigation: auto; }
html[data-history-direction="back"]::view-transition-old(root) { animation: history-back-out 180ms ease-out both; }
html[data-history-direction="forward"]::view-transition-old(root) { animation: history-forward-out 180ms ease-out both; }
@keyframes history-back-out { to { opacity: .82; transform: translateX(12%); } }
@keyframes history-forward-out { to { opacity: .82; transform: translateX(-12%); } }

@media (prefers-reduced-motion: reduce) {
  html::view-transition-old(root), html::view-transition-new(root) { animation: none !important; }
}

/* Страница «О создателе»: один спокойный лист вместо сетки карточек. */
.about-page { --about-copy: #48423b; }
.about-shell {
  position: relative;
  z-index: 2;
  width: calc(100% - 2 * clamp(24px, 4vw, 64px));
  max-width: 1180px;
  margin: 0 auto;
  padding: clamp(48px, 6vw, 76px) 0 clamp(76px, 9vw, 116px);
}
.about-intro {
  display: grid;
  grid-template-columns: minmax(320px, 360px) minmax(0, 1fr);
  align-items: start;
  gap: clamp(48px, 5vw, 64px);
}
.about-portrait {
  width: 100%;
  aspect-ratio: 4 / 5;
  margin: 0;
  padding: 5px;
  border: 1px solid rgba(58, 51, 43, .2);
  border-radius: 10px;
  background: rgba(248, 245, 239, .58);
  box-shadow: 0 18px 46px rgba(65, 54, 43, .09);
}
.about-portrait img {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 6px;
  object-fit: cover;
}
.about-intro__copy { padding-top: 1px; }
.about-intro__copy .eyebrow { margin-bottom: 18px; }
.about-intro h1 {
  max-width: 680px;
  margin: 0;
  font-family: var(--font-serif);
  font-size: clamp(40px, 4.25vw, 48px);
  font-weight: 400;
  line-height: 1.06;
  letter-spacing: -.04em;
  text-wrap: balance;
}
.about-subtitle {
  max-width: 620px;
  margin: 20px 0 0;
  color: #655d54;
  font-family: var(--font-serif);
  font-size: clamp(21px, 2.1vw, 27px);
  line-height: 1.35;
  text-wrap: balance;
}
.about-lead {
  max-width: 650px;
  margin: 30px 0 0;
  color: var(--about-copy);
  font-size: 18px;
  line-height: 1.68;
}
.about-lead p { margin: 0; }
.about-lead p + p { margin-top: 15px; }
.about-divider {
  width: min(100%, 880px);
  height: 1px;
  margin: clamp(54px, 7vw, 78px) 0 0;
  background: linear-gradient(90deg, var(--line-strong), rgba(58, 51, 43, .08) 82%, transparent);
}
.about-content {
  width: min(100%, 880px);
  color: var(--about-copy);
  font-size: 18px;
  line-height: 1.66;
}
.about-section { padding-top: clamp(48px, 5.4vw, 64px); }
.about-section + .about-section {
  margin-top: clamp(48px, 5.4vw, 64px);
  padding-top: clamp(48px, 5.4vw, 64px);
  border-top: 1px solid var(--line);
}
.about-section h2 {
  margin: 0 0 24px;
  color: var(--ink);
  font-family: var(--font-serif);
  font-size: clamp(24px, 2.3vw, 28px);
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: -.02em;
}
.about-section--method h2 { font-size: clamp(27px, 2.6vw, 31px); }
.about-section p { margin: 0; }
.about-section p + p { margin-top: 18px; }
.about-requests {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 44px;
  margin: 22px 0 0;
  padding-left: 22px;
}
.about-requests li { min-width: 0; padding-left: 4px; break-inside: avoid; }
.about-requests li::marker { color: var(--accent-dark); }
.about-format {
  padding-bottom: 4px;
  border-top-color: var(--line-strong) !important;
}
.about-format__details { display: grid; gap: 8px; margin: 0; }
.about-format__details div { display: flex; flex-wrap: wrap; gap: 0 7px; }
.about-format__details dt { color: var(--ink); font-weight: 650; }
.about-format__details dd { margin: 0; }
.about-contact {
  padding: clamp(34px, 4.6vw, 52px);
  border: 1px solid rgba(109, 43, 40, .2) !important;
  border-radius: 16px;
  background:
    linear-gradient(135deg, rgba(109, 43, 40, .07), rgba(173, 85, 54, .025) 62%),
    rgba(248, 245, 239, .76);
  box-shadow: 0 18px 50px rgba(65, 54, 43, .055);
}
.about-contact__intro { max-width: 690px; }
.about-contact__intro .eyebrow { margin-bottom: 13px; }
.about-contact__intro h2 { margin-bottom: 18px; font-size: clamp(27px, 2.7vw, 33px); }
.contact-form { margin-top: 34px; }
.contact-form__fields { display: grid; grid-template-columns: 1fr; }
.contact-form input {
  width: 100%;
  min-height: 48px;
  padding: 11px 14px;
  border: 1px solid var(--control-border);
  border-radius: 10px;
  color: var(--ink);
  background: rgba(248,245,239,.93);
}
.contact-form textarea { min-height: 132px; resize: vertical; }
.field-hint { margin: -11px 0 24px; color: var(--muted-2); font-size: 14px; line-height: 1.5; }
.contact-form__note { max-width: 680px; margin: 16px 0 0; color: var(--muted-2); font-size: 14px; line-height: 1.5; }
.contact-form__status { max-width: 680px; margin: 14px 0 0; color: var(--success); font-size: 14px; font-weight: 600; }
.about-contact__direct { margin-top: 26px !important; color: var(--muted); font-size: 15px; }
.about-contact__direct a { color: var(--accent-dark); overflow-wrap: anywhere; }

.direct-contact-result {
  margin: 34px 0 10px;
  padding: clamp(24px, 3vw, 34px);
  border: 1px solid rgba(109, 43, 40, .22);
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(109, 43, 40, .07), rgba(248, 245, 239, .78));
}
.direct-contact-result h2 { margin: 0 0 10px; font-size: clamp(25px, 3vw, 32px); }
.direct-contact-result > p:not(.result-kind) { max-width: 720px; margin: 0 0 20px; color: var(--muted); }

html.has-submission-dialog { overflow: hidden; }
.submission-dialog {
  width: min(720px, calc(100% - 32px));
  max-width: 720px;
  max-height: min(88vh, 900px);
  margin: auto;
  padding: 0;
  overflow: auto;
  border: 1px solid rgba(109, 43, 40, .28);
  border-radius: 18px;
  color: var(--ink);
  background: #f5efe4;
  box-shadow: 0 30px 90px rgba(35, 24, 19, .32);
}
.submission-dialog::backdrop { background: rgba(28, 21, 18, .62); backdrop-filter: blur(3px); }
.submission-dialog__card { position: relative; padding: clamp(28px, 5vw, 48px); }
.submission-dialog__card h2 { margin: 0 44px 12px 0; font-size: clamp(29px, 5vw, 42px); }
.submission-dialog__intro { max-width: 620px; margin: 0 0 26px; color: var(--muted); line-height: 1.6; }
.submission-dialog__close {
  position: absolute;
  top: 19px;
  right: 20px;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 50%;
  color: var(--muted);
  background: transparent;
  font: 30px/1 var(--font-sans);
  cursor: pointer;
}
.submission-dialog__close:hover { color: var(--ink); border-color: var(--line-strong); }
.submission-dialog .field { margin-bottom: 18px; }
.submission-dialog .field small { color: var(--muted-2); font-size: 12px; font-weight: 400; }
.submission-dialog input[type="text"],
.submission-dialog input[type="email"],
.submission-dialog textarea {
  width: 100%;
  border: 1px solid var(--control-border);
  border-radius: 10px;
  color: var(--ink);
  background: rgba(255,255,255,.58);
}
.submission-dialog input[type="text"],
.submission-dialog input[type="email"] { min-height: 48px; padding: 11px 14px; }
.submission-dialog textarea { min-height: 180px; resize: vertical; }
.submission-dialog__counter { margin: -11px 0 20px; color: var(--muted-2); font-size: 12px; text-align: right; }
.submission-dialog__publication { margin: 0 0 20px; padding: 15px; border: 1px solid var(--line); border-radius: 10px; }
.submission-dialog__consent { margin: 20px 0; color: var(--ink); font-size: 14px; }
.submission-dialog__verification { min-height: 65px; margin: 18px 0; color: var(--muted-2); font-size: 13px; }
.submission-dialog__privacy { margin: 18px 0 0; color: var(--muted-2); font-size: 12px; line-height: 1.55; }
.submission-dialog__privacy a { color: var(--accent-dark); }
.submission-dialog__actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; }
.submission-dialog__status { margin: 18px 0 0; color: var(--muted); font-size: 14px; font-weight: 600; line-height: 1.5; }
.submission-dialog__status[data-kind="success"] { color: var(--success); }
.submission-dialog__status[data-kind="error"] { color: var(--danger); }
.submission-honeypot { position: fixed; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

@media (max-width: 560px) {
  .submission-dialog { width: calc(100% - 18px); max-height: calc(100vh - 18px); border-radius: 13px; }
  .submission-dialog__card { padding: 28px 20px; }
  .submission-dialog__close { top: 13px; right: 13px; }
  .submission-dialog__actions { display: grid; }
  .submission-dialog__actions .button { width: 100%; }
}

/* Политика конфиденциальности: сначала границы обработки, затем подробности. */
.privacy-shell {
  width: min(1080px, calc(100% - 48px));
  padding-top: clamp(42px, 5.5vw, 68px);
}
.privacy-head { max-width: 820px; margin-bottom: clamp(30px, 4vw, 44px); }
.privacy-head > p:last-child { max-width: 760px; }
.privacy-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0 0 clamp(38px, 5vw, 56px);
  padding: 0;
  border-top: 1px solid var(--line-strong);
  border-bottom: 1px solid var(--line);
  list-style: none;
}
.privacy-summary li {
  display: grid;
  align-content: start;
  gap: 8px;
  min-width: 0;
  padding: 24px 26px 26px;
}
.privacy-summary li + li { border-left: 1px solid var(--line); }
.privacy-summary strong {
  color: var(--ink);
  font-family: var(--font-serif);
  font-size: clamp(18px, 1.55vw, 21px);
  font-weight: 500;
  line-height: 1.28;
}
.privacy-summary span { color: var(--muted); font-size: 14px; line-height: 1.55; }
.privacy-article {
  width: min(100%, 880px);
  padding: clamp(32px, 4.5vw, 52px);
}
.privacy-article section + section {
  margin-top: clamp(36px, 4.5vw, 50px);
  padding-top: clamp(34px, 4vw, 46px);
  border-top: 1px solid var(--line);
}
.privacy-article h2 { margin-bottom: 18px; }
.privacy-article h3 {
  margin: 26px 0 10px;
  color: var(--ink);
  font-family: var(--font-serif);
  font-size: 20px;
  font-weight: 500;
  line-height: 1.3;
}
.privacy-article p { max-width: 760px; }

@media (max-width: 900px) and (min-width: 768px) {
  .about-intro { grid-template-columns: minmax(260px, 300px) minmax(0, 1fr); gap: 36px; }
  .about-lead { margin-top: 22px; }
}

@media (max-width: 767px) {
  .about-shell {
    width: calc(100% - 40px);
    padding-top: 36px;
    padding-bottom: 76px;
  }
  .about-intro { display: flex; flex-direction: column; gap: 32px; }
  .about-portrait { width: min(100%, 440px); }
  .about-intro__copy { order: -1; width: 100%; padding: 0; }
  .about-intro__copy .eyebrow { margin-bottom: 14px; }
  .about-intro h1 { font-size: clamp(32px, 10vw, 38px); }
  .about-subtitle { margin-top: 16px; font-size: clamp(21px, 6.4vw, 24px); }
  .about-lead { margin-top: 22px; font-size: 17px; line-height: 1.65; }
  .about-lead p + p { margin-top: 14px; }
  .about-divider { margin-top: 44px; }
  .about-content { font-size: 17px; line-height: 1.64; }
  .about-section { padding-top: 38px; }
  .about-section + .about-section { margin-top: 38px; padding-top: 38px; }
  .about-section h2 { margin-bottom: 20px; font-size: clamp(21px, 6.5vw, 24px); }
  .about-section--method h2 { font-size: clamp(24px, 7vw, 27px); }
  .about-section p + p { margin-top: 16px; }
  .about-requests { grid-template-columns: 1fr; gap: 8px; margin-top: 20px; }
  .about-contact { width: 100%; padding: 28px 22px; }
  .contact-form__fields { grid-template-columns: 1fr; gap: 0; }
  .contact-form__fields .field:first-child { grid-column: auto; }
  .contact-form .button { width: 100%; }
  .privacy-shell { width: calc(100% - 32px); padding-top: 34px; }
  .privacy-summary { grid-template-columns: 1fr; margin-bottom: 32px; }
  .privacy-summary li { padding: 20px 18px 22px; }
  .privacy-summary li + li { border-top: 1px solid var(--line); border-left: 0; }
  .privacy-article { padding: 28px 22px; }
  .privacy-article section + section { margin-top: 32px; padding-top: 30px; }
  .privacy-article h3 { font-size: 19px; }
}

@media (max-width: 359px) {
  .about-shell { width: calc(100% - 32px); }
}

@media (prefers-reduced-motion: reduce) {
  .about-page .about-portrait,
  .about-page .about-intro__copy,
  .about-page .about-section { animation: none !important; transform: none !important; }
}

/* Пакет доступности: единый различимый фокус и устойчивые границы controls. */
:where(
  .brand,
  .skip-link,
  .main-nav a,
  .home-footer a,
  .site-footer a,
  .tool-row,
  .menu-toggle,
  .button,
  .change-route,
  .icon-button,
  .tab-button,
  .prompt-chip,
  .text-choice,
  .mode-card,
  .mode-row,
  summary
):focus-visible {
  outline: 3px solid var(--focus-ring) !important;
  outline-offset: 3px;
  box-shadow: none;
}
:where(textarea, input:not([type="radio"]):not([type="checkbox"]), select, [contenteditable]):focus-visible {
  outline: 3px solid var(--focus-ring) !important;
  outline-offset: 2px;
}
.site-header :where(.brand, .main-nav a, .menu-toggle):focus-visible {
  outline-color: var(--accent-focus) !important;
}
.home:not(.home-tools-active) :where(.home-start, .home-footer a):focus-visible,
.skip-link:focus-visible {
  outline-color: var(--accent-focus) !important;
}
.tab-button[aria-selected="true"]:focus-visible,
.button--primary:focus-visible {
  outline-color: var(--ink) !important;
}

@media (forced-colors: active) {
  :where(a, button, input, textarea, select, summary):focus-visible { outline: 3px solid Highlight !important; }
  .option-card input:checked + span,
  .tab-button[aria-selected="true"] { border: 2px solid Highlight; }
}

/* Пакет 2: маршруты к первой встрече, спокойная инструкция и расширенная шапка. */
:root { --home-header-content: 1360px; }
.site-header { padding-inline: max(24px, calc((100vw - var(--home-header-content)) / 2)); }

.home-actions {
  display: grid;
  justify-items: center;
  gap: 18px;
  margin-top: 32px;
}
.home-actions .home-start { margin-top: 0; }
.home-about-link {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  gap: 9px;
  color: var(--skin-muted);
  font-size: 13.5px;
  text-decoration-color: rgba(223, 208, 189, .42);
  text-underline-offset: 6px;
  transition: color 180ms ease, text-decoration-color 180ms ease;
}
.home-about-link span { color: var(--accent-ochre); transition: transform 180ms ease; }
.home-about-link:hover,
.home-about-link:focus-visible { color: var(--skin-heading); text-decoration-color: currentColor; }
.home-about-link:hover span { transform: translateX(3px); }
.home-about-link:focus-visible { outline-color: var(--accent-focus) !important; }

.about-intro__action {
  display: flex;
  max-width: 650px;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-top: 34px;
  padding-top: 24px;
  border-top: 1px solid var(--line);
}
.about-intro__action p { display: grid; gap: 2px; min-width: max-content; margin: 0; }
.about-intro__action p span { color: var(--muted-2); font-size: 12px; letter-spacing: .06em; text-transform: uppercase; }
.about-intro__action p strong { color: var(--ink); font-family: var(--font-serif); font-size: 18px; font-weight: 500; }
.about-intro__action .button { flex: 0 1 auto; text-align: center; }
.about-contact { scroll-margin-top: calc(var(--sticky-header-offset) + 20px); }

.builder-guide__overview {
  display: block;
}
.builder-guide__head { display: block; }
.builder-guide__head .eyebrow { margin-bottom: 12px; }
.builder-guide__head h1 { margin: 0; }
.builder-guide__lead { max-width: 760px; margin: 20px 0 0; font-size: 17px; line-height: 1.62; }
.builder-path {
  --builder-path-gap: 64px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--builder-path-gap);
  margin: 34px 0 0;
  padding: 18px 0;
  border-top: 1px solid var(--line-strong);
  border-bottom: 1px solid var(--line);
  list-style: none;
}
.builder-path li {
  position: relative;
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 11px;
  align-items: start;
  padding: 0;
}
.builder-path li:not(:last-child)::after {
  content: "\2192";
  position: absolute;
  top: 50%;
  right: -41px;
  color: var(--accent-dark);
  font-family: var(--font-serif);
  font-size: 22px;
  line-height: 1;
  transform: translateY(-50%);
}
.builder-path__number { padding-top: 3px; color: var(--accent-dark); font-family: var(--font-serif); font-size: 14px; }
.builder-path li > span:last-child { display: grid; gap: 3px; }
.builder-path strong { color: var(--ink); font-family: var(--font-serif); font-size: clamp(19px, 1.45vw, 22px); font-weight: 450; line-height: 1.22; }
.builder-path small { color: var(--muted); font-size: 13px; line-height: 1.5; }
.builder-privacy-line {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 6px;
  margin: 24px 0 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.55;
}
.builder-privacy-line > span {
  width: 8px;
  height: 8px;
  flex: 0 0 8px;
  border: 2px solid var(--success);
  border-radius: 50%;
}
.builder-privacy-line strong { color: var(--ink); font-weight: 650; }
.builder-guide__toggle,
.builder-shell[data-tool-active="true"] .builder-guide__toggle {
  display: flex;
  width: 100%;
  min-height: 44px;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-top: 14px;
  padding: 10px 0;
  border: 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  color: var(--muted);
  text-align: left;
  background: transparent;
  cursor: pointer;
}
.builder-guide__toggle:hover { color: var(--ink); }
.builder-guide__content,
.builder-shell[data-tool-active="true"] .builder-guide__content { margin-top: 18px; }
.builder-guide__notices { margin-top: 12px; }

.builder-shell[data-tool-active="true"] .builder-guide__overview { display: block; }
.builder-shell[data-tool-active="true"] .builder-path { display: none; }
.builder-shell[data-tool-active="true"] .builder-privacy-line { margin-top: 13px; }
.builder-shell[data-tool-active="true"] .builder-stage { margin-top: 24px; }

@media (max-width: 900px) {
  .builder-guide__lead { max-width: 680px; }
  .builder-path { --builder-path-gap: 42px; }
  .builder-path li { grid-template-columns: 30px minmax(0, 1fr); gap: 9px; }
  .builder-path li:not(:last-child)::after { right: -29px; }
  .builder-path strong { font-size: 19px; }
}

@media (max-width: 767px) {
  .about-intro__action { align-items: stretch; flex-direction: column; gap: 18px; margin-top: 28px; }
  .about-intro__action p { min-width: 0; }
  .about-intro__action .button { width: 100%; }
}

@media (max-width: 720px) {
  .site-header { padding-inline: 16px; }
  .home-actions { gap: 12px; margin-top: 28px; }
  .home-about-link { font-size: 13px; }
  .builder-path { display: grid; grid-template-columns: 1fr; gap: 44px; margin-top: 28px; padding: 18px 0; }
  .builder-path li { grid-template-columns: 34px minmax(0, 1fr); gap: 11px; }
  .builder-path li:not(:last-child)::after { content: "\2193"; top: auto; right: auto; bottom: -33px; left: 14px; transform: none; }
  .builder-path strong { font-size: 19px; }
  .builder-guide__toggle { align-items: flex-start; font-size: 13px; }
  .guide-summary-grid { grid-template-columns: 1fr; }
  .guide-section + .guide-section { padding-left: 0; border-top: 1px solid var(--line); border-left: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .home-about-link span { transition: none; }
  .home-about-link:hover span { transform: none; }
}

/* Пакет 3: вопросы как редакционный раздел, а не карточная витрина. */
.questions-shell { width: min(1120px, calc(100% - 48px)); padding-top: clamp(38px, 5vh, 56px); }
.questions-head { max-width: 820px; margin-bottom: clamp(34px, 5vw, 52px); }
.questions-head h1 { max-width: 760px; }
.questions-tabs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 1px solid var(--line-strong);
  border-bottom: 1px solid var(--line-strong);
}
.questions-tabs button {
  position: relative;
  min-height: 58px;
  padding: 11px 18px;
  border: 0;
  color: var(--muted);
  background: transparent;
  cursor: pointer;
  font-size: 13px;
  text-align: left;
}
.questions-tabs button + button { border-left: 1px solid var(--line); }
.questions-tabs button::after {
  content: "";
  position: absolute;
  right: 18px;
  bottom: -1px;
  left: 18px;
  height: 2px;
  background: transparent;
}
.questions-tabs button[aria-selected="true"] { color: var(--ink); }
.questions-tabs button[aria-selected="true"]::after { background: var(--accent-dark); }
.questions-tabs button:hover { color: var(--ink); background: rgba(255, 253, 248, .32); }
.questions-tabs button:focus-visible { z-index: 1; outline: 3px solid var(--focus-ring); outline-offset: -3px; }

.questions-panel { min-height: 420px; padding-top: clamp(36px, 5vw, 54px); }
.questions-panel[hidden] { display: none; }
.questions-section-head { max-width: 720px; margin-bottom: 30px; }
.questions-section-head .question-kicker { margin-bottom: 9px; }
.questions-section-head h2 {
  margin: 0;
  font-family: var(--font-serif);
  font-size: clamp(34px, 4.4vw, 50px);
  font-weight: 400;
  line-height: 1.05;
  letter-spacing: -.035em;
}
.questions-section-head > p:last-child { max-width: 650px; margin: 16px 0 0; color: var(--muted); font-size: 15px; line-height: 1.62; }

.faq-list { border-top: 1px solid var(--line-strong); }
.faq-list details { border-bottom: 1px solid var(--line); }
.faq-list summary {
  display: grid;
  min-height: 64px;
  grid-template-columns: 42px minmax(0, 1fr) 28px;
  align-items: center;
  gap: 14px;
  padding: 14px 4px;
  cursor: pointer;
  list-style: none;
}
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary > span:nth-child(2) { font-family: var(--font-serif); font-size: 19px; line-height: 1.3; }
.faq-list summary:hover > span:nth-child(2) { color: var(--accent-dark); }
.faq-list summary:focus-visible { outline: 3px solid var(--focus-ring); outline-offset: -3px; }
.faq-number { align-self: start; padding-top: 5px; color: var(--accent-dark); font-family: var(--font-serif); font-size: 12px; }
.faq-mark { color: var(--accent-dark); font-size: 22px; line-height: 1; text-align: center; transition: transform 160ms ease; }
.faq-list details[open] .faq-mark { transform: rotate(45deg); }
.faq-answer { max-width: 780px; padding: 0 50px 20px 60px; }
.faq-answer p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.65; }
.questions-next-step { margin: 28px 0 0; color: var(--muted); font-size: 14px; }
.questions-next-step a,
.question-processing > a { color: var(--ink); text-underline-offset: 4px; }

.questions-empty {
  padding: 28px 0;
  border-top: 1px solid var(--line-strong);
  border-bottom: 1px solid var(--line);
}
.questions-empty p { max-width: 680px; margin: 0; color: var(--muted); }
.questions-empty .questions-empty__title { margin-bottom: 7px; color: var(--ink); font-family: var(--font-serif); font-size: 24px; }

.question-form-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(300px, .85fr);
  border-top: 1px solid var(--line-strong);
  border-bottom: 1px solid var(--line);
}
.question-form-preview { min-width: 0; padding: 28px 36px 28px 0; }
.question-form-preview fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
.question-form-preview .field { margin-bottom: 14px; }
.question-form-preview textarea { min-height: 180px; }
.question-form-preview textarea:disabled {
  color: var(--muted);
  background: rgba(255, 255, 255, .46);
  opacity: 1;
}
.question-form-preview fieldset:disabled .button { opacity: .55; }
.question-safety-note { margin: 0 0 22px; color: var(--accent-dark); font-size: 12px; line-height: 1.55; }
.consent-row {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr);
  align-items: start;
  gap: 10px;
  margin: 0 0 15px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.5;
}
.consent-row input { width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--accent-dark); }
.question-availability { margin: 18px 0 0; color: var(--muted-2); font-size: 12px; line-height: 1.55; }
.question-processing { min-width: 0; padding: 28px 0 28px 36px; border-left: 1px solid var(--line); }
.question-processing h3 { margin: 0 0 20px; font-family: var(--font-serif); font-size: 23px; font-weight: 400; line-height: 1.2; }
.question-processing ol { display: grid; gap: 16px; margin: 0 0 22px; padding: 0; list-style: none; }
.question-processing li { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 10px; }
.question-processing li > span { padding-top: 2px; color: var(--accent-dark); font-family: var(--font-serif); font-size: 12px; }
.question-processing li p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.55; }
.question-processing > a { font-size: 13px; }

@media (max-width: 820px) {
  .question-form-layout { grid-template-columns: 1fr; }
  .question-form-preview { padding-right: 0; }
  .question-processing { padding: 26px 0; border-top: 1px solid var(--line); border-left: 0; }
}

@media (max-width: 720px) {
  .questions-shell { width: min(100% - 32px, 1120px); padding-top: 32px; }
  .questions-head { margin-bottom: 30px; }
  .questions-tabs { grid-template-columns: 1fr; }
  .questions-tabs button { min-height: 48px; padding-inline: 12px; }
  .questions-tabs button + button { border-top: 1px solid var(--line); border-left: 0; }
  .questions-tabs button::after { right: auto; left: 12px; width: 52px; }
  .questions-panel { padding-top: 32px; }
  .faq-list summary { grid-template-columns: 34px minmax(0, 1fr) 26px; gap: 9px; }
  .faq-list summary > span:nth-child(2) { font-size: 17px; }
  .faq-answer { padding: 0 35px 18px 43px; }
}

@media (prefers-reduced-motion: reduce) {
  .faq-mark { transition: none; }
}

/* «До и после сессии»: локальный переносимый рабочий лист. */
.session-workbook { width: min(1080px, calc(100% - 40px)); }
.session-workbook .page-head { max-width: 880px; }
.session-workbook .privacy-flag { max-width: 830px; }
.session-workbook code {
  padding: 1px 5px;
  border-radius: 4px;
  color: var(--ink);
  background: rgba(58, 51, 43, .06);
  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
  font-size: .9em;
}
.session-intro__heading,
.session-step-head,
.session-section-heading {
  display: grid;
  grid-template-columns: minmax(260px, .9fr) minmax(320px, 1.1fr);
  align-items: end;
  gap: 28px;
}
.session-intro__heading .eyebrow,
.session-step-head .eyebrow,
.session-section-heading .eyebrow { margin-bottom: 8px; }
.session-intro__heading h2,
.session-step-head h2,
.session-section-heading h3 { margin-bottom: 0; }
.session-intro__heading > p,
.session-section-heading > p {
  margin: 0;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.6;
}
.session-step-head { align-items: start; margin-bottom: 30px; }
.session-step-head > .text-button { justify-self: end; }
.text-button {
  min-height: 44px;
  padding: 11px 2px;
  border: 0;
  border-bottom: 1px solid transparent;
  color: var(--muted);
  background: transparent;
  font: inherit;
  font-size: 13px;
  line-height: 1.3;
  cursor: pointer;
}
.text-button:hover,
.text-button:focus-visible { border-bottom-color: currentColor; color: var(--accent-dark); outline: none; }
.text-button:disabled { cursor: default; opacity: .35; }

.session-import {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px 24px;
  margin-top: 34px;
  padding: 20px 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.session-import strong { display: block; margin-bottom: 4px; font-family: var(--font-serif); font-size: 19px; font-weight: 500; }
.session-import p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.5; }
.session-import__button { grid-column: 2; grid-row: 1; margin: 0; }
.session-import__status { min-height: 0; color: var(--success); }
.session-import > .text-button { justify-self: start; }
.session-mode-grid { margin-top: 34px; }
.session-mode-grid .mode-card { grid-template-columns: 34px minmax(0, 1fr); }
.session-mode-grid .mode-card strong,
.session-mode-grid .mode-card > span:last-child { grid-column: 2; }
.session-mode-grid .mode-card .mode-card__number {
  grid-column: 1;
  grid-row: 1 / span 2;
  align-self: start;
  padding-top: 6px;
  color: var(--accent-dark);
  font-family: var(--font-serif);
  font-size: 12px;
}

.session-work [data-session-capture] > [data-prompt-set] { max-width: 820px; }
.session-work .field { margin-bottom: 22px; }
.session-work textarea { min-height: 112px; resize: vertical; }
.session-work .field__note {
  display: block;
  margin: -4px 0 9px;
  color: var(--muted-2);
  font-size: 12px;
  font-weight: 400;
}
.session-prompts {
  max-width: 820px;
  margin: 6px 0 26px;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.session-prompts summary {
  position: relative;
  padding: 16px 30px 16px 0;
  color: var(--muted);
  cursor: pointer;
  list-style: none;
}
.session-prompts summary::-webkit-details-marker { display: none; }
.session-prompts summary::after {
  content: "+";
  position: absolute;
  right: 2px;
  color: var(--accent-dark);
  font-size: 20px;
  line-height: 1;
}
.session-prompts[open] summary::after { content: "−"; }
.session-prompts[open] summary { margin-bottom: 20px; }

.session-previous {
  margin: 0 0 34px;
  padding: 24px 0;
  border-top: 1px solid var(--line-strong);
  border-bottom: 1px solid var(--line);
}
.session-previous__list { display: grid; gap: 0; margin-top: 20px; }
.session-previous-item {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr);
  align-items: start;
  gap: 13px;
  padding: 15px 0;
  border-top: 1px solid var(--line);
  cursor: pointer;
}
.session-previous-item input { width: 18px; height: 18px; margin: 3px 0 0; accent-color: var(--accent-dark); }
.session-previous-item__body { display: grid; gap: 5px; }
.session-previous-item__text { color: var(--ink); line-height: 1.55; white-space: pre-wrap; }
.session-fragment-tag {
  color: var(--accent-dark);
  font-size: 10px;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.session-review-intro {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, .72fr);
  gap: 30px;
  margin-bottom: 26px;
  padding-bottom: 22px;
  border-bottom: 1px solid var(--line-strong);
}
.session-review-intro p { margin: 0; color: var(--ink); line-height: 1.6; }
.session-review-intro .session-review-note { color: var(--muted-2); font-size: 12px; }
.session-fragments { border-bottom: 1px solid var(--line); }
.session-fragment {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 240px;
  gap: 16px 26px;
  padding: 22px 0;
  border-top: 1px solid var(--line);
}
.session-fragment:first-child { border-top-color: var(--line-strong); }
.session-fragment__top {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
}
.session-fragment__order { display: flex; gap: 14px; }
.session-fragment__field { margin: 0; }
.session-fragment__field textarea { min-height: 104px; }
.session-fragment__role { align-self: start; }
.session-fragment__role > span { display: block; margin: 0 0 9px; font-size: 12px; font-weight: 600; }
.session-fragment__role select {
  width: 100%;
  min-height: 44px;
  padding: 9px 34px 9px 12px;
  border: 1px solid var(--control-border);
  border-radius: 8px;
  outline: none;
  color: var(--ink);
  background: rgba(255, 255, 255, .56);
  font: inherit;
  font-size: 13px;
}
.session-fragment__role select:focus { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }

.session-sheet { margin: 26px 0 0; border-top: 1px solid var(--line-strong); }
.session-sheet__section { padding: 25px 0 24px; border-bottom: 1px solid var(--line); }
.session-sheet__section h3 { margin-bottom: 14px; color: var(--accent-dark); font-size: 13px; letter-spacing: .07em; text-transform: uppercase; }
.session-sheet__section ol { display: grid; gap: 12px; margin: 0; padding: 0; list-style: none; }
.session-sheet__section li {
  position: relative;
  max-width: 820px;
  padding-left: 21px;
  font-family: var(--font-serif);
  font-size: 18px;
  line-height: 1.5;
  white-space: pre-wrap;
}
.session-sheet__section li::before { content: "—"; position: absolute; left: 0; color: var(--accent-dark); }
.session-sheet__section--hold { opacity: .72; }
.session-file-note {
  display: grid;
  grid-template-columns: 210px minmax(0, 1fr);
  gap: 24px;
  margin-top: 28px;
  padding: 18px 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  color: var(--muted);
  font-size: 13px;
  line-height: 1.55;
}
.session-file-note strong { color: var(--ink); font-family: var(--font-serif); font-size: 17px; font-weight: 500; }

@media (max-width: 720px) {
  .session-workbook { width: min(100% - 28px, 1080px); padding-top: 38px; }
  .session-intro__heading,
  .session-step-head,
  .session-section-heading,
  .session-review-intro,
  .session-file-note { grid-template-columns: 1fr; gap: 10px; }
  .session-step-head > .text-button { justify-self: start; }
  .session-import { grid-template-columns: 1fr; }
  .session-import__button { grid-column: 1; grid-row: auto; justify-self: start; }
  .session-mode-grid .mode-card { grid-template-columns: 28px minmax(0, 1fr); padding-left: 4px; }
  .session-fragment { grid-template-columns: 1fr; gap: 14px; }
  .session-fragment__top { align-items: flex-start; }
  .session-fragment__order { gap: 10px; }
  .session-fragment__role { width: 100%; }
  .session-sheet__section li { font-size: 16px; }
}