/* Роадмап $LAVE$: токены стилей, общие компоненты карты, этапов и веток. Раскладка в roadmap.css и poster.css.
   Версии живут рядом, ни одна не затирает другую:
     park    Парк 1        первый светлый парк (12.10), цельная плоская компоновка
     glass2  Стекло 2      стеклянные карточки (13.10), светлый
     glass2d Стекло 2 тёмный
     park3   Парк 3        компоновка Парка 1 + стекло только на карте и подсветки
     park3d  Парк 3 тёмный
   Черты стиля (класс на html): rm-flat или rm-cards (компоновка), rm-bezel (стеклянная рамка карты), rm-dark. */
@font-face{font-family:Onest;src:url('../assets/fonts/Onest-520.ttf') format('truetype');font-weight:500;font-display:swap}
@font-face{font-family:Onest;src:url('../assets/fonts/Onest-700.ttf') format('truetype');font-weight:700;font-display:swap}
@font-face{font-family:Onest;src:url('../assets/fonts/Onest-840.ttf') format('truetype');font-weight:840;font-display:swap}

/* ---------- Парк 1: базовые токены ---------- */
.rm{
  --font:Onest,Arial,sans-serif;
  --bg:#fbf8f1;
  --ambient:none;
  --ink:#1d1a17;
  --ink-2:#4a443d;
  --muted:#8b8278;
  --line:rgba(29,26,23,.11);
  --soft:#f3ede1;
  --accent:#e2263f;
  --box:#fffdf9;
  --box-edge:rgba(29,26,23,.11);
  --box-shadow:none;
  --box-blur:none;
  --glass:rgba(255,255,255,.64);
  --glass-edge:rgba(255,255,255,.92);
  --glass-shadow:0 18px 44px -26px rgba(60,45,25,.42),inset 0 1px 0 rgba(255,255,255,.95);
  --glass-blur:blur(18px) saturate(1.35);
  --chip:#fffdf9;
  --chip-ink:#1d1a17;
  --chip-muted:#8b8278;
  --chip-shadow:0 6px 18px rgba(52,38,20,.16),0 1px 2px rgba(52,38,20,.12);
  --chip-blur:blur(10px);
  --bezel:transparent;
  --bezel-edge:transparent;
  --bezel-shadow:0 30px 70px -30px rgba(70,50,20,.35);
  --band:#1d1a17;
  --band-ink:#fbf8f1;
  --band-accent:#e2263f;
  --step:#f3ede1;
  --step-edge:transparent;
  --step-shadow:none;
  --route:#e2263f;
  --route-halo:rgba(255,253,249,.95);
  --flow-arrow:#1d1a17;
  --radius:18px;
  --n-radius:12px;
}

/* ---------- Парк 3: компоновка Парка 1, стекло на карте, мягкие подсветки ---------- */
.style-park3{
  --bg:#f9f6ef;
  --ambient:
    radial-gradient(760px 520px at 10% 14%,rgba(63,111,176,.1),transparent 70%),
    radial-gradient(820px 520px at 50% 4%,rgba(194,90,44,.09),transparent 70%),
    radial-gradient(760px 520px at 92% 16%,rgba(63,122,74,.09),transparent 70%),
    radial-gradient(980px 640px at 52% 62%,rgba(109,69,179,.06),transparent 72%),
    radial-gradient(760px 520px at 90% 72%,rgba(31,127,138,.07),transparent 70%);
  --box:rgba(255,255,255,.62);
  --box-edge:rgba(255,255,255,.92);
  --box-shadow:0 18px 44px -28px rgba(60,45,25,.38),inset 0 1px 0 rgba(255,255,255,.95);
  --box-blur:blur(18px) saturate(1.35);
  --chip:rgba(255,255,255,.86);
  --chip-muted:#7c736a;
  --chip-shadow:0 8px 22px rgba(52,38,20,.2),inset 0 0 0 1px rgba(255,255,255,.95);
  --chip-blur:blur(12px) saturate(1.4);
  --bezel:rgba(255,255,255,.6);
  --bezel-edge:rgba(255,255,255,.95);
  --bezel-shadow:0 44px 100px -44px rgba(70,50,20,.5);
  --step:rgba(255,255,255,.7);
  --step-edge:rgba(255,255,255,.95);
  --step-shadow:0 6px 16px -8px rgba(60,45,25,.35);
}

/* ---------- Парк 3 тёмный: та же цельная компоновка на тёмном, карта светлая и яркая ---------- */
.style-park3d{
  --bg:#0c0b0e;
  --ambient:
    radial-gradient(900px 560px at 84% -4%,rgba(150,12,40,.42),transparent 70%),
    radial-gradient(760px 520px at 8% 16%,rgba(63,111,176,.16),transparent 70%),
    radial-gradient(820px 520px at 50% 8%,rgba(194,90,44,.12),transparent 70%),
    radial-gradient(980px 640px at 50% 64%,rgba(109,69,179,.14),transparent 72%),
    radial-gradient(760px 520px at 92% 72%,rgba(31,127,138,.12),transparent 70%);
  --ink:#f6f2ec;
  --ink-2:#cfc8c1;
  --muted:#978f8d;
  --line:rgba(255,255,255,.1);
  --soft:rgba(255,255,255,.08);
  --accent:#ff3553;
  --box:rgba(255,255,255,.045);
  --box-edge:rgba(255,255,255,.1);
  --box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
  --box-blur:blur(18px) saturate(1.3);
  --chip:rgba(255,255,255,.88);
  --chip-ink:#1d1a17;
  --chip-muted:#6f675f;
  --chip-shadow:0 8px 22px rgba(0,0,0,.35),inset 0 0 0 1px rgba(255,255,255,.95);
  --chip-blur:blur(12px) saturate(1.4);
  --bezel:rgba(255,255,255,.07);
  --bezel-edge:rgba(255,255,255,.16);
  --bezel-shadow:0 60px 140px -60px rgba(255,53,83,.4);
  --band:linear-gradient(90deg,rgba(255,53,83,.24),rgba(255,53,83,.06));
  --band-ink:#f6f2ec;
  --band-accent:#ff6b80;
  --step:rgba(255,255,255,.07);
  --step-edge:rgba(255,255,255,.12);
  --route:#ff3553;
}

/* ---------- Стекло 2: стеклянные карточки ---------- */
.style-glass2,.style-glass2d{
  --bg:#f8f5ee;
  --ambient:
    radial-gradient(760px 520px at 10% 16%,rgba(63,111,176,.11),transparent 70%),
    radial-gradient(820px 520px at 50% 4%,rgba(194,90,44,.1),transparent 70%),
    radial-gradient(760px 520px at 92% 18%,rgba(63,122,74,.1),transparent 70%),
    radial-gradient(980px 640px at 52% 62%,rgba(109,69,179,.07),transparent 72%),
    radial-gradient(760px 520px at 90% 70%,rgba(31,127,138,.08),transparent 70%);
  --ink:#1b1916;
  --ink-2:#45403a;
  --muted:#857c72;
  --line:rgba(27,25,22,.1);
  --soft:rgba(27,25,22,.055);
  --chip:rgba(255,255,255,.86);
  --chip-ink:#1b1916;
  --chip-muted:#7c736a;
  --chip-shadow:0 8px 22px rgba(52,38,20,.2),inset 0 0 0 1px rgba(255,255,255,.95);
  --chip-blur:blur(12px) saturate(1.4);
  --bezel:rgba(255,255,255,.6);
  --bezel-edge:rgba(255,255,255,.95);
  --bezel-shadow:0 44px 100px -44px rgba(70,50,20,.5);
  --band:rgba(27,25,22,.92);
  --band-ink:#fbf8f1;
  --step:var(--glass);
  --step-edge:var(--glass-edge);
  --step-shadow:var(--glass-shadow);
  --route:#e2263f;
  --flow-arrow:#1b1916;
  --radius:22px;
  --n-radius:13px;
}
.style-glass2d{
  --bg:#0c0b0e;
  --ambient:
    radial-gradient(900px 560px at 84% -4%,rgba(150,12,40,.42),transparent 70%),
    radial-gradient(760px 520px at 8% 18%,rgba(63,111,176,.16),transparent 70%),
    radial-gradient(820px 520px at 50% 10%,rgba(194,90,44,.12),transparent 70%),
    radial-gradient(980px 640px at 50% 64%,rgba(109,69,179,.14),transparent 72%),
    radial-gradient(760px 520px at 92% 72%,rgba(31,127,138,.12),transparent 70%);
  --ink:#f6f2ec;
  --ink-2:#cfc8c1;
  --muted:#978f8d;
  --line:rgba(255,255,255,.1);
  --soft:rgba(255,255,255,.08);
  --accent:#ff3553;
  --glass:rgba(255,255,255,.055);
  --glass-edge:rgba(255,255,255,.11);
  --glass-shadow:0 26px 60px -32px rgba(0,0,0,.8),inset 0 1px 0 rgba(255,255,255,.08);
  --bezel:rgba(255,255,255,.07);
  --bezel-edge:rgba(255,255,255,.16);
  --bezel-shadow:0 60px 140px -60px rgba(255,53,83,.4);
  --band:linear-gradient(90deg,rgba(255,53,83,.2),rgba(255,255,255,.05) 60%);
  --band-ink:#f6f2ec;
  --route:#ff3553;
}

/* Цвет района: в тёмных стилях подписи светлее, плашки номера те же. */
.rm [class*="rm-z-"]{--z-ink:var(--z)}
.rm-dark [class*="rm-z-"]{--z-ink:color-mix(in oklab,var(--z) 58%,#fff)}

/* ---------- Типографика ---------- */
.rm-h1{margin:0;font-weight:840;letter-spacing:-.045em;line-height:.95}
.rm-h1 em{color:var(--accent);font-style:normal}
.rm-nw{white-space:nowrap}
.rm-lede{margin:0;color:var(--ink-2);font-size:20px;line-height:1.4}
.rm-lede b{color:var(--ink);font-weight:700}

/* ---------- Карта ---------- */
.rm-map{position:relative;aspect-ratio:1672/941;border-radius:28px;overflow:hidden;background:#f3ead6;box-shadow:0 0 0 9px var(--bezel),0 0 0 10px var(--bezel-edge),var(--bezel-shadow);container-type:inline-size}
.rm-map-art{display:block;width:100%;height:100%;user-select:none;-webkit-user-drag:none;transition:filter .35s ease}
.rm-map-lines{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.rm-layer{transition:opacity .35s ease}
.rm-map[data-layer="route"] .rm-layer--flows,
.rm-map[data-layer="flows"] .rm-layer--route,
.rm-map[data-layer="clean"] .rm-layer{opacity:0}
.rm-route-path{fill:none;stroke:var(--route);stroke-width:7;stroke-linecap:round;stroke-dasharray:1 17;filter:drop-shadow(0 0 2.5px var(--route-halo)) drop-shadow(0 0 1px var(--route-halo))}
#rmArrowRoute path{fill:var(--route)}
.rm-flow-path{fill:none;stroke:var(--z);stroke-width:6;stroke-linecap:round;filter:drop-shadow(0 0 2px var(--route-halo))}
#rmArrowFlow path{fill:var(--flow-arrow)}
.rm-map[data-layer="flows"] .rm-map-art{filter:saturate(.45) brightness(1.06) contrast(.92)}
.rm-map[data-layer="flows"] .rm-pin-text small{display:none}

.rm-flowlabels{position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .35s ease}
.rm-map[data-layer="flows"] .rm-flowlabels{opacity:1}
.rm-flowlabel{position:absolute;transform:translate(-50%,-50%);padding:.35em .75em .35em .6em;border-left:.3em solid var(--z);border-radius:.5em;background:var(--chip);color:var(--chip-ink);box-shadow:var(--chip-shadow);font-size:clamp(10px,.9cqi,14px);font-weight:700;white-space:nowrap;-webkit-backdrop-filter:var(--chip-blur);backdrop-filter:var(--chip-blur)}
.rm-flowlabel--left{transform:translate(0,-50%)}

/* Метки районов лежат на светлой карте, поэтому светлые во всех стилях */
.rm-pin{position:absolute;z-index:2;display:flex;align-items:center;gap:.55em;padding:.38em .9em .38em .38em;border:0;border-radius:999px;background:var(--chip);color:var(--chip-ink);box-shadow:var(--chip-shadow);font:inherit;font-size:clamp(11px,1.28cqi,18px);text-align:left;transform:translate(-50%,0);-webkit-backdrop-filter:var(--chip-blur);backdrop-filter:var(--chip-blur)}
.rm-pin::before{content:"";position:absolute;left:50%;top:-.42em;width:.84em;height:.84em;background:inherit;transform:translateX(-50%) rotate(45deg);border-radius:2px;z-index:-1}
.rm-code{display:grid;place-items:center;min-width:2.15em;height:2.15em;padding:0 .55em;border-radius:999px;background:var(--z);color:#fff;font-size:.86em;font-weight:840;letter-spacing:-.01em;white-space:nowrap}
.rm-bezel .rm-code{box-shadow:inset 0 1px 0 rgba(255,255,255,.3)}
.rm-pin-text{display:grid;line-height:1.15}
.rm-pin-text strong{font-weight:840;font-size:1em;letter-spacing:-.01em;white-space:nowrap}
.rm-pin-text small{color:var(--chip-muted);font-size:.72em;font-weight:700;white-space:nowrap}
/* Идея (парламент): та же плашка, что у районов, отличается пунктирным номером */
.rm-pin--idea .rm-code{background:transparent;color:var(--z);border:2px dashed var(--z)}
/* Метка-кнопка без подсказок текстом: стрелка, короткая пульсация номера при загрузке, подъём при наведении */
button.rm-pin{cursor:pointer;padding-right:.75em;transition:transform .2s ease,box-shadow .2s ease}
button.rm-pin:hover{transform:translate(-50%,-3px);box-shadow:var(--chip-shadow),0 14px 30px -10px rgba(0,0,0,.35)}
button.rm-pin .rm-code{position:relative}
button.rm-pin .rm-code::after{content:"";position:absolute;inset:-1px;border:2px solid var(--z);border-radius:inherit;opacity:0;pointer-events:none;animation:rmPing 1.6s ease-out var(--d,0s) 3}
@keyframes rmPing{0%{opacity:.85;transform:scale(1)}100%{opacity:0;transform:scale(1.9)}}
.rm-pin-go{flex:none;width:.42em;height:.42em;margin:0 .15em 0 .1em;border-right:.13em solid currentColor;border-bottom:.13em solid currentColor;opacity:.45;transform:rotate(-45deg);transition:transform .2s ease,opacity .2s ease}
button.rm-pin:hover .rm-pin-go{opacity:.9;transform:translateX(.15em) rotate(-45deg)}
button.rm-pin:focus-visible{outline:3px solid var(--accent);outline-offset:3px}

.rm-map-center{position:absolute;left:50%;top:44.5%;z-index:1;display:grid;gap:.3em;max-width:20%;padding:.75em 1em;border-radius:1em;background:var(--chip);box-shadow:var(--chip-shadow);color:var(--chip-ink);font-size:clamp(10px,1cqi,15px);text-align:center;transform:translate(-50%,-50%);-webkit-backdrop-filter:var(--chip-blur);backdrop-filter:var(--chip-blur)}
.rm-map-center strong{color:#e2263f;font-weight:840;font-size:1.08em;letter-spacing:-.01em}
.rm-map-center span{color:#4a443d;font-size:.82em;line-height:1.3}

/* Легенда под картой */
.rm-legend{display:flex;flex-wrap:wrap;align-items:center;gap:10px 26px;color:var(--ink-2);font-size:14px}
.rm-legend p{margin:0}
.rm-legend b{color:var(--ink);font-weight:840;margin-right:6px}
.rm-legend-route{display:flex;align-items:center;gap:10px}
.rm-legend-route i{flex:none;width:34px;height:6px;background:radial-gradient(circle,var(--route) 2.6px,transparent 3px) 0 50%/9px 6px repeat-x}

/* Связи экономики: откуда → куда и что именно идёт */
.rm-eco-title{margin:0 0 12px;color:var(--muted);font-size:12px;font-weight:840;letter-spacing:.14em;text-transform:uppercase}
.rm-eco ul{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px 22px;margin:0;padding:0;list-style:none}
.rm-eco li{display:grid;grid-template-columns:auto 1fr;column-gap:10px;align-items:baseline}
.rm-eco i{grid-row:span 2;align-self:center;width:4px;height:100%;min-height:34px;border-radius:4px;background:var(--z)}
.rm-eco b{font-size:14.5px;font-weight:840;letter-spacing:-.01em;line-height:1.25}
.rm-eco span{color:var(--ink-2);font-size:13.5px;line-height:1.35}

/* Плашка-блок (полоса связей на постере): в Парке обычная, в Парке 3 стеклянная */
.rm-box{border:1px solid var(--box-edge);border-radius:var(--radius);background:var(--box);box-shadow:var(--box-shadow);-webkit-backdrop-filter:var(--box-blur);backdrop-filter:var(--box-blur)}

/* ---------- Этапы: цельная компоновка, сверху цветная линия района ---------- */
.rm-ms-list{margin:0;padding:0;list-style:none}
.rm-ms{position:relative;display:grid;grid-template-columns:auto 1fr;gap:14px;align-content:start;padding:18px 0 0}
.rm-ms::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--z)}
.rm-ms-n{display:grid;place-items:center;width:42px;height:42px;border-radius:var(--n-radius);background:var(--z);color:#fff;font-size:17px;font-weight:840;letter-spacing:-.02em}
.rm-bezel .rm-ms-n{box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 8px 18px -8px var(--z)}
.rm-ms-text{min-width:0}
.rm-ms h3{margin:0;font-size:19px;font-weight:840;letter-spacing:-.02em;line-height:1.15}
.rm-ms-tag{margin:5px 0 0;color:var(--z-ink);font-size:11.5px;font-weight:840;letter-spacing:.12em;text-transform:uppercase}
.rm-ms-body{margin:10px 0 0;color:var(--ink-2);font-size:15.5px;line-height:1.45}

/* ---------- Ветки ---------- */
.rm-br-list{margin:0;padding:0;list-style:none}
.rm-br{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:start}
.rm-br h3{margin:0;font-size:16.5px;font-weight:840;letter-spacing:-.015em;line-height:1.2}
.rm-br p{margin:5px 0 0;color:var(--ink-2);font-size:14.5px;line-height:1.42}
.rm-br-code{display:grid;place-items:center;min-width:34px;height:26px;padding:0 7px;border-radius:8px;background:var(--soft);color:var(--ink-2);font-size:12px;font-weight:840;letter-spacing:.02em}

.rm-idea{padding:16px 18px;border:1.5px dashed color-mix(in oklab,var(--z) 70%,transparent);border-radius:16px;background:color-mix(in oklab,var(--z) 7%,transparent)}
.rm-idea-tag{margin:0;color:var(--z-ink);font-size:11px;font-weight:840;letter-spacing:.12em;text-transform:uppercase}
.rm-idea h3{margin:6px 0 0;font-size:16.5px;font-weight:840;letter-spacing:-.015em}
.rm-idea p:last-child{margin:5px 0 0;color:var(--ink-2);font-size:14.5px;line-height:1.42}

/* ---------- Основа долей и цикл модуля ---------- */
.rm-foundation{background:var(--band);color:var(--band-ink)}
.rm-foundation-in{display:flex;flex-wrap:wrap;align-items:center;gap:8px 20px;padding:16px 0}
.rm-foundation b{color:var(--band-accent);font-weight:840;letter-spacing:-.01em}
.rm-foundation ul{display:flex;flex-wrap:wrap;gap:6px 0;margin:0;padding:0;list-style:none;font-weight:700}
.rm-foundation li+li::before{content:"·";margin:0 12px;opacity:.6}
.style-park3d .rm-foundation{border-block:1px solid rgba(255,53,83,.3)}

.rm-cycle-list{margin:0;padding:0;list-style:none}
/* Шаги по верхнему краю: кружки в одну линию, текст разной длины не двигает их по вертикали */
.rm-cycle-list li{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:start}
.rm-cycle-list li>div{padding-top:6px}
.rm-cycle-list span{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;border:1px solid var(--step-edge);background:var(--step);color:var(--ink);font-size:14px;font-weight:840;box-shadow:var(--step-shadow)}
.rm-cycle-list li:nth-child(5) span{border-color:transparent;background:var(--accent);color:#fff}
.rm-cycle-list h3{margin:0;font-size:15.5px;font-weight:840;letter-spacing:-.01em}
.rm-cycle-list p{margin:2px 0 0;color:var(--muted);font-size:13.5px}

/* ---------- Стекло 2: те же блоки отдельными стеклянными карточками ---------- */
.rm-cards .rm-ms,.rm-cards .rm-br,.rm-cards .rm-idea,.rm-cards .rm-eco{border:1px solid var(--glass-edge);background:var(--glass);box-shadow:var(--glass-shadow);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur)}
.rm-cards .rm-ms{padding:22px 20px 20px;border-radius:var(--radius);overflow:hidden}
.rm-cards .rm-ms::before{height:4px}
.rm-cards .rm-ms::after{content:"";position:absolute;inset:0;background:radial-gradient(260px 140px at 0 0,color-mix(in oklab,var(--z) 14%,transparent),transparent 70%);pointer-events:none}
.rm-cards.rm-dark .rm-ms::after{background:radial-gradient(260px 140px at 0 0,color-mix(in oklab,var(--z) 26%,transparent),transparent 70%)}
.rm-cards .rm-ms>*{position:relative;z-index:1}
.rm-cards .rm-br{padding:16px;border-radius:18px}
.rm-cards .rm-idea{border-style:dashed;border-color:color-mix(in oklab,var(--z) 60%,transparent);border-radius:18px}
.rm-cards .rm-eco{border-radius:var(--radius);padding:20px 24px}
.rm-cards .rm-foundation{background:none;border:0}
.rm-cards .rm-foundation-in{padding:17px 24px;border-radius:var(--radius);background:var(--band);color:var(--band-ink);box-shadow:var(--glass-shadow);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur)}
.rm-cards.rm-dark .rm-foundation-in{border:1px solid rgba(255,53,83,.28)}
.rm-cards .rm-foundation b{color:var(--accent)}
