/* Треугольное безумие PRO — сайт расширения
   Структура файла:
   1. Шрифты            2. Токены (цвета, размеры)   3. База
   4. Шапка и подвал    5. Кнопки и ссылки           6. Секции главной
   7. Внутренние страницы (возможности, MPV, Premium, документы)
   8. Окно поддержки    9. Адаптив

   Тема: по умолчанию следует за системой (color-scheme: light dark).
   Кнопка в шапке ставит data-theme="light|dark" на <html> и запоминает выбор.
   Все цвета заданы парами light-dark(светлая, тёмная) — меняй их в блоке «Токены». */

/* ───────── 1. Шрифты (лежат в /fonts, внешних запросов нет) ───────── */
@font-face{font-family:'IBM Plex Sans Variable';font-style:normal;font-display:swap;font-weight:100 700;font-stretch:75% 100%;src:url(fonts/ibm-plex-sans-cyrillic-ext-standard-normal.woff2) format('woff2-variations');unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}
@font-face{font-family:'IBM Plex Sans Variable';font-style:normal;font-display:swap;font-weight:100 700;font-stretch:75% 100%;src:url(fonts/ibm-plex-sans-cyrillic-standard-normal.woff2) format('woff2-variations');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'IBM Plex Sans Variable';font-style:normal;font-display:swap;font-weight:100 700;font-stretch:75% 100%;src:url(fonts/ibm-plex-sans-greek-standard-normal.woff2) format('woff2-variations');unicode-range:U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF}
@font-face{font-family:'IBM Plex Sans Variable';font-style:normal;font-display:swap;font-weight:100 700;font-stretch:75% 100%;src:url(fonts/ibm-plex-sans-vietnamese-standard-normal.woff2) format('woff2-variations');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}
@font-face{font-family:'IBM Plex Sans Variable';font-style:normal;font-display:swap;font-weight:100 700;font-stretch:75% 100%;src:url(fonts/ibm-plex-sans-latin-ext-standard-normal.woff2) format('woff2-variations');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'IBM Plex Sans Variable';font-style:normal;font-display:swap;font-weight:100 700;font-stretch:75% 100%;src:url(fonts/ibm-plex-sans-latin-standard-normal.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:'IBM Plex Mono';font-style:normal;font-display:swap;font-weight:400;src:url(fonts/ibm-plex-mono-cyrillic-400-normal.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-display:swap;font-weight:400;src:url(fonts/ibm-plex-mono-latin-400-normal.woff2) format('woff2');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}

/* ───────── 2. Токены ───────── */
:root{
  color-scheme:light dark;

  /* цвета: light-dark(светлая тема, тёмная тема) */
  --bg:light-dark(#fafafc,#0e0d14);          /* фон страницы */
  --surface:light-dark(#ffffff,#15141d);     /* панели, карточки */
  --sunken:light-dark(#f1f0f7,#0a0910);      /* чередующиеся полосы, подвал */
  --ink:light-dark(#15131f,#ecebf4);         /* основной текст */
  --ink-2:light-dark(#4a4859,#bab8cb);       /* второстепенный текст */
  --ink-3:light-dark(#6a6880,#918fa6);       /* подписи, мелкие примечания */
  --line:light-dark(#dcdae7,#2a2938);        /* тонкие разделители */
  --line-strong:light-dark(#b9b6cc,#413f55); /* рамки панелей и полей */
  --action:light-dark(#5a2ca8,#b39cff);      /* главный цвет действия — из логотипа */
  --action-hover:light-dark(#451f87,#cbb9ff);
  --action-ink:light-dark(#ffffff,#160a33);  /* текст на кнопке действия */
  --action-soft:light-dark(#ece6fa,#25203d);
  --ok:light-dark(#17724a,#62d39b);
  --warn:light-dark(#8a5300,#f0b955);
  --warn-soft:light-dark(#fbf1dc,#2a2111);
  --danger:light-dark(#b3261e,#ff8a80);

  /* шрифты */
  --sans:'IBM Plex Sans Variable','IBM Plex Sans',system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,'Cascadia Mono','SF Mono',Consolas,monospace;

  /* размеры */
  --fs-body:1.0625rem;   /* 17px */
  --fs-small:.9375rem;   /* 15px */
  --fs-meta:.875rem;     /* 14px — меньше на сайте не используем */
  --radius:8px;
  --wrap:70rem;
  --header-h:4rem;
}
:root[data-theme="light"]{color-scheme:light}
:root[data-theme="dark"]{color-scheme:dark}

/* ───────── 3. База ───────── */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-block-start:calc(var(--header-h) + 1rem)}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:var(--fs-body);line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-wrap:break-word}
img,svg{display:block;max-inline-size:100%}
h1,h2,h3,p,ul,ol,dl,dd,figure{margin:0}
h1,h2,h3{text-wrap:balance}
p,li{text-wrap:pretty}
a{color:inherit}
button,input,textarea,select{font:inherit;color:inherit}
code,.mono{font-family:var(--mono);font-size:.92em}
::selection{background:var(--action);color:var(--action-ink)}
:focus-visible{outline:2px solid var(--action);outline-offset:3px;border-radius:2px}
[hidden]{display:none!important}
.visually-hidden{position:absolute!important;inline-size:1px;block-size:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip-link{position:absolute;inset-inline-start:1rem;inset-block-start:-4rem;z-index:100;padding:.6rem 1rem;background:var(--action);color:var(--action-ink);border-radius:var(--radius);font-weight:600;text-decoration:none}
.skip-link:focus{inset-block-start:1rem}

h1,h2{font-weight:650;font-stretch:88%;letter-spacing:-.012em;line-height:1.12}
h1{font-size:clamp(2.3rem,1.3rem + 3vw,3.6rem);font-weight:620;font-stretch:85%;line-height:1.06;letter-spacing:-.02em}
h2{font-size:clamp(1.75rem,1.25rem + 1.8vw,2.6rem)}
h3{font-size:1.1875rem;font-weight:600;line-height:1.3}
.lead{font-size:1.25rem;line-height:1.55;color:var(--ink-2);max-inline-size:38rem}
h2+.lead{margin-block-start:1rem}
.muted{color:var(--ink-3)}
.small{font-size:var(--fs-small)}

.wrap{inline-size:100%;max-inline-size:var(--wrap);margin-inline:auto;padding-inline:clamp(1rem,4vw,2rem)}
.section{padding-block:clamp(3.5rem,7vw,6rem)}
.section--sunken{background:var(--sunken);border-block:1px solid var(--line)}
.section--line{border-block-start:1px solid var(--line)}
.section-head{max-inline-size:44rem;margin-block-end:clamp(1.75rem,4vw,2.75rem)}
.section-head p{margin-block-start:.9rem;font-size:1.125rem;color:var(--ink-2)}
.section-head--row{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:1rem 2rem;max-inline-size:none}

/* ───────── 4. Шапка и подвал ───────── */
.site-header{position:sticky;inset-block-start:0;z-index:30;background:var(--bg);border-block-end:1px solid var(--line)}
.header-inner{display:flex;align-items:center;gap:1rem 1.5rem;min-block-size:var(--header-h)}
.brand{display:inline-flex;align-items:center;gap:.65rem;text-decoration:none;font-weight:600;line-height:1.15;min-inline-size:0}
.brand img{flex:none;inline-size:2rem;block-size:2rem}
.brand b{color:var(--action);font-weight:700}
.primary-nav{display:flex;gap:.125rem;margin-inline-start:auto}
.primary-nav a{position:relative;padding:.5rem .8rem;border-radius:6px;color:var(--ink-2);font-size:var(--fs-small);font-weight:500;text-decoration:none}
.primary-nav a:hover{color:var(--ink);background:var(--sunken)}
.primary-nav a[aria-current="page"]{color:var(--ink)}
.primary-nav a[aria-current="page"]::after{content:"";position:absolute;inset-inline:.8rem;inset-block-end:.1rem;block-size:2px;background:var(--action)}
.header-actions{display:flex;align-items:center;gap:.5rem}
.theme-toggle{display:inline-grid;place-items:center;inline-size:2.5rem;block-size:2.5rem;padding:0;border:1px solid transparent;border-radius:6px;background:transparent;cursor:pointer;color:var(--ink-2)}
.theme-toggle:hover{background:var(--sunken);color:var(--ink)}
.theme-icon{inline-size:1.25rem;block-size:1.25rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.theme-icon-moon{display:none}
:root[data-theme="dark"] .theme-icon-sun{display:none}
:root[data-theme="dark"] .theme-icon-moon{display:block}
.theme-icon-sun{display:block}
@media (prefers-color-scheme:dark){
  :root:not([data-theme]) .theme-icon-sun{display:none}
  :root:not([data-theme]) .theme-icon-moon{display:block}
}
.menu-toggle{display:none;inline-grid;place-items:center;gap:0;inline-size:2.5rem;block-size:2.5rem;padding:0;border:1px solid var(--line-strong);border-radius:6px;background:transparent;cursor:pointer;align-content:center}
.menu-toggle span{display:block;inline-size:1.1rem;block-size:2px;background:currentColor;transition:transform .15s}
.menu-toggle span+span{margin-block-start:5px}
.menu-toggle[aria-expanded="true"] span:first-child{transform:translateY(3.5px) rotate(45deg)}
.menu-toggle[aria-expanded="true"] span:last-child{transform:translateY(-3.5px) rotate(-45deg)}

.site-footer{margin-block-start:0;background:var(--sunken);border-block-start:1px solid var(--line);padding-block:clamp(2.5rem,5vw,3.5rem) 2rem;font-size:var(--fs-small)}
.footer-grid{display:grid;grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr));gap:2rem clamp(1.5rem,4vw,3rem)}
.footer-about p{margin-block-start:.9rem;color:var(--ink-2);max-inline-size:22rem}
.footer-title{margin-block-end:.8rem;font-size:var(--fs-meta);font-weight:600;color:var(--ink-3)}
.footer-list{display:grid;gap:.55rem;margin:0;padding:0;list-style:none}
.footer-list a{color:var(--ink-2);text-decoration:none}
.footer-list a:hover{color:var(--ink);text-decoration:underline;text-underline-offset:.2em}
.footer-bottom{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.75rem 2rem;margin-block-start:2.5rem;padding-block-start:1.25rem;border-block-start:1px solid var(--line);color:var(--ink-3);font-size:var(--fs-meta)}
.footer-bottom p{max-inline-size:42rem}
.site-language-label{display:inline-flex;align-items:center;gap:.5rem;color:var(--ink-2);font-size:var(--fs-meta)}
.site-language-name::after{content:":"}
.site-language-picker{max-inline-size:11rem;min-block-size:2.25rem;padding:.25rem .5rem;border:1px solid var(--line-strong);border-radius:6px;background:var(--surface);color:var(--ink);font-size:var(--fs-meta)}

/* ───────── 5. Кнопки и ссылки ───────── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-block-size:2.875rem;padding:.55rem 1.2rem;border:1px solid transparent;border-radius:6px;background:transparent;font-size:var(--fs-small);font-weight:600;line-height:1.2;text-align:center;text-decoration:none;cursor:pointer;transition:background-color .15s,border-color .15s,color .15s}
.btn-primary{background:var(--action);color:var(--action-ink)}
.btn-primary:hover{background:var(--action-hover)}
.btn-secondary{border-color:var(--line-strong);color:var(--ink)}
.btn-secondary:hover{border-color:var(--ink-3);background:var(--sunken)}
.btn-sm{min-block-size:2.375rem;padding:.35rem .9rem}
.btn[disabled]{opacity:.55;cursor:not-allowed}
.link{color:var(--action);font-weight:600;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.22em}
.link:hover{color:var(--action-hover);text-decoration-thickness:2px}
.actions{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem 1.5rem}

/* ───────── 6. Главная ───────── */
.hero{padding-block:clamp(2.5rem,6vw,5.5rem) clamp(3rem,6vw,5rem)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(2rem,5vw,4.5rem);align-items:center}
.hero .lead{margin-block:1.4rem 2rem}
.hero .fine{margin-block-start:1rem;font-size:var(--fs-meta);color:var(--ink-3);max-inline-size:34rem}
.facts{display:grid;grid-template-columns:repeat(3,auto);justify-content:start;gap:1rem clamp(1.25rem,3vw,2.5rem);margin-block-start:2.25rem;padding-block-start:1.5rem;border-block-start:1px solid var(--line)}
.facts dt{font-size:var(--fs-meta);color:var(--ink-3)}
.facts dd{display:grid;margin:.15rem 0 0;font-size:var(--fs-small);font-weight:600}
.facts dd small{font-size:var(--fs-meta);font-weight:400;color:var(--ink-2)}

/* окно расширения (иллюстрация) */
.popup-figure figcaption{margin-block-start:.9rem;font-size:var(--fs-meta);color:var(--ink-3)}
.popup{background:var(--surface);border:1px solid var(--line-strong);border-radius:10px;box-shadow:0 1px 0 var(--line),0 28px 50px -30px rgb(21 19 31 / .45);overflow:hidden}
.popup-head{display:flex;align-items:center;gap:.65rem;padding:.8rem 1rem;border-block-end:1px solid var(--line)}
.popup-head img{inline-size:1.5rem;block-size:1.5rem}
.popup-title{font-weight:600;font-size:var(--fs-small)}
.popup-count{margin-inline-start:auto;min-inline-size:1.6rem;padding:.05rem .45rem;border-radius:99px;background:var(--action-soft);color:var(--action);font-size:var(--fs-meta);font-weight:600;text-align:center}
.popup-source{padding:.55rem 1rem;border-block-end:1px solid var(--line);background:var(--sunken);color:var(--ink-3);font-family:var(--mono);font-size:.8125rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.media-row{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.75rem 1rem;align-items:center;padding:1rem}
.media-row+.media-row{border-block-start:1px solid var(--line)}
.media-row--main{grid-template-columns:7.25rem minmax(0,1fr)}
.thumb{position:relative;aspect-ratio:16/9;border-radius:6px;overflow:hidden;background:linear-gradient(160deg,#1d2a5c,#5a2ca8 60%,#c4568a)}
.thumb svg{position:absolute;inset:0;margin:auto;inline-size:1.5rem;block-size:1.5rem;fill:#fff}
.thumb .mono{position:absolute;inset-inline-end:.3rem;inset-block-end:.25rem;padding:0 .3rem;border-radius:3px;background:rgb(0 0 0 / .65);color:#fff;font-size:.75rem;line-height:1.5}
.media-info h3{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem .6rem;font-size:var(--fs-body)}
.media-info p{font-size:var(--fs-meta);color:var(--ink-2)}
.pill{padding:.05rem .45rem;border:1px solid var(--line-strong);border-radius:4px;font-family:var(--mono);font-size:.8125rem;font-weight:400;color:var(--ink-2)}
.media-actions{grid-column:1 / -1;display:flex;flex-wrap:wrap;gap:.5rem;margin-block-start:.15rem}
.fake-btn{display:inline-flex;align-items:center;min-block-size:2.25rem;padding:.3rem .9rem;border:1px solid var(--line-strong);border-radius:6px;font-size:var(--fs-meta);font-weight:600}
.fake-btn--primary{background:var(--action);border-color:var(--action);color:var(--action-ink)}
.media-row--compact{grid-template-columns:2.25rem minmax(0,1fr) auto;padding-block:.75rem}
.type-icon{display:grid;place-items:center;inline-size:2.25rem;block-size:2.25rem;border-radius:6px;background:var(--sunken);color:var(--ink-2)}
.type-icon svg{inline-size:1.1rem;block-size:1.1rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.type-icon .mono{font-size:.75rem;font-weight:600}
.media-row--compact h3{font-size:var(--fs-small)}
.tag{padding:.1rem .45rem;border-radius:4px;background:var(--sunken);color:var(--ink-3);font-family:var(--mono);font-size:.75rem;letter-spacing:.04em}
.popup-foot{display:flex;align-items:center;gap:.5rem;padding:.7rem 1rem;border-block-start:1px solid var(--line);background:var(--sunken);font-size:var(--fs-meta);color:var(--ink-3)}
.popup-foot::before{content:"";flex:none;inline-size:.5rem;block-size:.5rem;border-radius:50%;background:var(--ok)}

/* до / после */
.compare-panels{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem}
.panel{background:var(--surface);border:1px solid var(--line-strong);border-radius:var(--radius);padding:1.5rem}
.panel-title{margin-block-end:1rem;font-size:var(--fs-meta);font-weight:600;color:var(--ink-3)}
.raw-list,.result-list{display:grid;margin:0;padding:0;list-style:none}
.raw-list li{padding-block:.7rem;border-block-end:1px dashed var(--line-strong);font-family:var(--mono);font-size:.875rem;color:var(--ink-3);overflow-wrap:anywhere}
.raw-list li:first-child{padding-block-start:0}
.result-list li{display:grid;grid-template-columns:4rem minmax(0,1fr);gap:.75rem;align-items:baseline;padding-block:.7rem;border-block-end:1px solid var(--line)}
.result-list li:first-child{padding-block-start:0}
.result-list b{display:block;font-weight:600}
.result-list small{display:block;font-size:var(--fs-meta);color:var(--ink-2)}
.panel-note{margin-block-start:1rem;font-size:var(--fs-meta);color:var(--ink-3)}

/* MPV: схема из трёх узлов */
.split{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(2rem,5vw,4.5rem);align-items:start}
.split--center{align-items:center}
.split-copy h2{margin-block-end:1.1rem}
.split-copy p{color:var(--ink-2)}
.split-copy p+p{margin-block-start:.9rem}
.split-copy .actions{margin-block-start:1.5rem}
.flow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:0;padding:0;list-style:none}
.flow li{position:relative;display:grid;gap:.3rem;align-content:start;padding:1.25rem;border:1px solid var(--line-strong);background:var(--surface)}
.flow li+li{border-inline-start:0}
.flow li:first-child{border-start-start-radius:var(--radius);border-end-start-radius:var(--radius)}
.flow li:last-child{border-start-end-radius:var(--radius);border-end-end-radius:var(--radius)}
.flow li:not(:last-child)::after{content:"";position:absolute;z-index:1;inset-block-start:50%;inset-inline-end:-.5rem;inline-size:.9rem;block-size:.9rem;background:var(--surface);border-block-start:1px solid var(--line-strong);border-inline-end:1px solid var(--line-strong);transform:translateY(-50%) rotate(45deg)}
:root[dir="rtl"] .flow li:not(:last-child)::after{transform:translateY(-50%) rotate(-135deg)}
.flow-n{font-family:var(--mono);font-size:var(--fs-meta);color:var(--action)}
.flow b{font-weight:600}
.flow small{font-size:var(--fs-meta);color:var(--ink-2)}
.flow-note{margin-block-start:1rem;font-size:var(--fs-meta);color:var(--ink-3)}
.badge{display:inline-block;padding:.1rem .5rem;border:1px solid var(--action);border-radius:4px;color:var(--action);font-size:var(--fs-meta);font-weight:600;line-height:1.5}

/* Ambient: единственная тёмная «сцена» на странице */
.stage{color-scheme:dark;background:#08070d;color:#ecebf4;padding-block:clamp(4rem,9vw,7.5rem);overflow:hidden}
.stage .lead,.stage p{color:#bab8cb}
.stage h2{color:#ecebf4}
.stage-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(2.5rem,6vw,5.5rem);align-items:center}
.stage-points{display:grid;gap:.6rem;margin:1.5rem 0 0;padding:0;list-style:none}
.stage-points li{position:relative;padding-inline-start:1.4rem;color:#ecebf4}
.stage-points li::before{content:"";position:absolute;inset-inline-start:0;inset-block-start:.62em;inline-size:.5rem;block-size:.5rem;background:#b39cff}
.stage .badge{border-color:#b39cff;color:#cbb9ff}
.stage-badge{margin-block-start:1.5rem}
.ambient-wrap{display:grid;gap:1.1rem;justify-items:center}
.ambient{position:relative;inline-size:100%;max-inline-size:40rem;aspect-ratio:16/9;margin-block:1.5rem}
.ambient-glow,.ambient-frame{position:absolute}
.ambient-glow{inset:-8%;filter:blur(48px) saturate(1.7);opacity:.95;transition:opacity .5s}
.ambient-frame{inset:0;overflow:hidden;border-radius:6px;outline:1px solid rgb(255 255 255 / .1);background:#000}
.scene{position:absolute;inset:0;opacity:0;animation:scene 18s linear infinite}
.scene:nth-child(2){animation-delay:6s}
.scene:nth-child(3){animation-delay:12s}
.scene-1{background:radial-gradient(40% 55% at 78% 72%,#ffb36b 0%,transparent 70%),linear-gradient(180deg,#0d1f3d 0%,#27507d 55%,#0b0a12 100%)}
.scene-2{background:radial-gradient(34% 46% at 20% 38%,#ff3d8b 0%,transparent 70%),radial-gradient(40% 52% at 82% 62%,#2fd0ff 0%,transparent 70%),#120a2a}
.scene-3{background:radial-gradient(46% 52% at 50% 88%,#f2c14e 0%,transparent 70%),linear-gradient(180deg,#071b16,#145a43 62%,#06100d)}
@keyframes scene{0%{opacity:0}6%,31%{opacity:1}39%,100%{opacity:0}}
.ambient[data-ambient="off"] .ambient-glow{opacity:0}
.ambient-ui{position:absolute;inset-inline:0;inset-block-end:0;display:flex;align-items:center;gap:.75rem;padding:.7rem .9rem;background:linear-gradient(transparent,rgb(0 0 0 / .65));color:#fff;font-family:var(--mono);font-size:.8125rem}
.ambient-ui svg{flex:none;inline-size:1rem;block-size:1rem;fill:#fff}
.ambient-track{position:relative;flex:1;block-size:3px;background:rgb(255 255 255 / .3)}
.ambient-track::before{content:"";position:absolute;inset-block:0;inset-inline-start:0;inline-size:1.2%;background:#fff}
.switch{display:inline-flex;align-items:center;gap:.7rem;padding:.4rem .2rem;border:0;background:transparent;color:#ecebf4;font-size:var(--fs-small);font-weight:500;cursor:pointer}
.switch-track{position:relative;flex:none;inline-size:2.5rem;block-size:1.4rem;border-radius:99px;background:#413f55;transition:background-color .15s}
.switch-track::after{content:"";position:absolute;inset-block-start:.2rem;inset-inline-start:.2rem;inline-size:1rem;block-size:1rem;border-radius:50%;background:#fff;transition:transform .15s}
.switch[aria-checked="true"] .switch-track{background:#7c5be0}
.switch[aria-checked="true"] .switch-track::after{transform:translateX(1.1rem)}
:root[dir="rtl"] .switch[aria-checked="true"] .switch-track::after{transform:translateX(-1.1rem)}
.stage-note{font-size:var(--fs-meta);color:#918fa6!important}

/* шаги */
.steps{counter-reset:step;display:grid;margin:0;padding:0;list-style:none;border-block-start:1px solid var(--line)}
.steps li{counter-increment:step;display:grid;grid-template-columns:2.75rem minmax(0,1fr);gap:.2rem 1rem;padding-block:1.35rem;border-block-end:1px solid var(--line)}
.steps li::before{content:counter(step);grid-row:1 / span 2;font-family:var(--mono);font-size:1.5rem;line-height:1.2;color:var(--action)}
.steps p{color:var(--ink-2)}

/* установка */
.install-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem;align-items:start}
.install-card{display:grid;gap:1rem}
.install-card h3{font-size:1.25rem}
.install-card p{color:var(--ink-2)}
.install-card .actions{margin-block-start:.25rem}
.install-card .actions:not(:has(> :not([hidden]))){display:none}
.kv{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.5rem 1.25rem;margin:0;padding-block-start:1rem;border-block-start:1px solid var(--line);font-size:var(--fs-small)}
.kv dt{color:var(--ink-3)}
.kv dd{margin:0;min-inline-size:0}
.hash{display:flex;align-items:flex-start;gap:.6rem}
.hash code{flex:1;min-inline-size:0;font-size:.8125rem;line-height:1.45;overflow-wrap:anywhere}
.copy-btn{flex:none;padding:.2rem .6rem;border:1px solid var(--line-strong);border-radius:5px;background:transparent;font-size:var(--fs-meta);font-weight:600;cursor:pointer}
.copy-btn:hover{background:var(--sunken)}
.notice{padding:.9rem 1rem;border:1px solid var(--warn);border-radius:var(--radius);background:var(--warn-soft);font-size:var(--fs-small)}
.notice p{color:var(--ink)!important}
.req{display:grid;gap:.5rem;margin:0;padding-inline-start:1.2rem;color:var(--ink-2)}

/* тарифы */
.plans{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem;align-items:stretch}
.plan{display:flex;flex-direction:column;gap:1rem}
.plan--premium{border-color:var(--action);box-shadow:0 0 0 1px var(--action)}
.plan-name{font-weight:600}
.plan-price{display:flex;align-items:baseline;gap:.5rem;font-size:2.5rem;font-weight:650;font-stretch:90%;line-height:1}
.plan-price small{font-size:var(--fs-small);font-weight:400;color:var(--ink-2)}
.plan p{color:var(--ink-2)}
.plan .plan-name,.plan .plan-price{color:var(--ink)}
.check-list{display:grid;gap:.6rem;margin:0;padding:0;list-style:none}
.check-list li{position:relative;padding-inline-start:1.6rem}
.check-list li::before{content:"";position:absolute;inset-inline-start:.3rem;inset-block-start:.45em;inline-size:.45rem;block-size:.8rem;border-inline-end:2px solid var(--ok);border-block-end:2px solid var(--ok);transform:rotate(40deg)}
.check-list small{display:block;font-size:var(--fs-meta);color:var(--ink-2)}
.plan .actions{margin-block-start:auto;padding-block-start:.5rem}
.table-scroll{overflow-x:auto}
.compare-table{inline-size:100%;border-collapse:collapse;font-size:var(--fs-small)}
.compare-table th,.compare-table td{padding:.85rem 1rem;border-block-end:1px solid var(--line);text-align:start;vertical-align:top}
.compare-table thead th{border-block-end:2px solid var(--ink);font-weight:600}
.compare-table tbody th{font-weight:500}
.compare-table .col-premium{background:var(--action-soft)}
.mark-yes{color:var(--ok);font-weight:700}
.mark-no{color:var(--ink-3)}
.compare-table td .muted{display:block;font-size:var(--fs-meta)}

/* FAQ */
.faq{border-block-start:1px solid var(--line)}
.faq details{border-block-end:1px solid var(--line)}
.faq summary{position:relative;display:block;padding:1.1rem 2.5rem 1.1rem 0;font-weight:600;cursor:pointer;list-style:none}
:root[dir="rtl"] .faq summary{padding:1.1rem 0 1.1rem 2.5rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;inset-inline-end:.3rem;inset-block-start:50%;inline-size:.6rem;block-size:.6rem;border-inline-end:2px solid var(--ink-2);border-block-end:2px solid var(--ink-2);transform:translateY(-70%) rotate(45deg)}
.faq details[open] summary::after{transform:translateY(-25%) rotate(-135deg)}
.faq summary:hover{color:var(--action)}
.faq details p{padding-block-end:1.25rem;max-inline-size:44rem;color:var(--ink-2)}
.faq-layout{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:clamp(2rem,5vw,4.5rem);align-items:start}

/* ───────── 7. Внутренние страницы ───────── */
.page-head{padding-block:clamp(2.5rem,5vw,4.5rem) clamp(2rem,4vw,3.25rem);border-block-end:1px solid var(--line)}
.page-head h1{font-size:clamp(2.1rem,1.2rem + 3.2vw,3.5rem);max-inline-size:22em}
.page-head .lead{margin-block-start:1.25rem}
.page-head .actions{margin-block-start:1.75rem}
.page-note{margin-block-start:1rem;max-inline-size:38rem;font-size:var(--fs-small);color:var(--ink-3)}
.spec{margin:0;border-block-start:1px solid var(--line)}
.spec-row{display:grid;grid-template-columns:minmax(0,15rem) minmax(0,1fr);gap:.4rem 2.5rem;padding-block:1.3rem;border-block-end:1px solid var(--line)}
.spec-row dt{font-weight:600}
.spec-row dd{max-inline-size:40rem;color:var(--ink-2)}
.spec-row dd .link{display:inline-block;margin-block-start:.5rem}
.limits{display:grid;gap:.75rem;padding:1.5rem;border:1px solid var(--line-strong);border-inline-start:4px solid var(--warn);border-radius:var(--radius);background:var(--surface)}
.limits h2,.limits h3{font-size:1.25rem}
.limits p{color:var(--ink-2);max-inline-size:44rem}
.cta-band{padding-block:clamp(2.5rem,5vw,4rem);border-block-start:1px solid var(--line);background:var(--sunken)}
.cta-band .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1.25rem 2.5rem}
.cta-band h2{font-size:clamp(1.5rem,1.1rem + 1.2vw,2rem)}
.cta-band p{margin-block-start:.5rem;color:var(--ink-2);max-inline-size:36rem}

.release{display:grid;grid-template-columns:minmax(0,12rem) minmax(0,1fr);gap:.5rem 2.5rem;padding-block:1.75rem;border-block-end:1px solid var(--line)}
.release:first-child{border-block-start:1px solid var(--line)}
.release-meta{display:grid;gap:.25rem;align-content:start;font-size:var(--fs-small);color:var(--ink-3)}
.release-meta .mono{color:var(--ink)}
.release h2{font-size:1.4rem;font-stretch:100%;letter-spacing:0}
.release p{margin-block-start:.5rem;color:var(--ink-2);max-inline-size:40rem}
.release-list{display:grid;gap:.4rem;margin:.75rem 0 0;padding-inline-start:1.2rem;color:var(--ink-2)}

.doc-layout{display:grid;grid-template-columns:minmax(0,14rem) minmax(0,44rem);gap:clamp(2rem,6vw,5rem);justify-content:start;align-items:start}
.toc{position:sticky;inset-block-start:calc(var(--header-h) + 1.5rem);display:grid;gap:.25rem;font-size:var(--fs-small)}
.toc a{padding:.35rem .75rem;border-inline-start:2px solid var(--line);color:var(--ink-2);text-decoration:none}
.toc a:hover{color:var(--ink);border-color:var(--ink-3)}
.prose h2{margin-block:0 1rem;font-size:1.75rem}
.prose h3{margin-block:1.75rem .5rem}
.prose p,.prose ul{color:var(--ink-2)}
.prose p+p,.prose p+ul,.prose ul+p{margin-block-start:1rem}
.prose ul{padding-inline-start:1.25rem}
.prose li+li{margin-block-start:.4rem}
.prose a{color:var(--action);text-underline-offset:.2em}
.prose section+section{margin-block-start:3.5rem;padding-block-start:3.5rem;border-block-start:1px solid var(--line)}
.prose .page-note{margin-block-start:1.25rem}
.license-table{inline-size:100%;margin-block-start:1.25rem;border-collapse:collapse;font-size:var(--fs-small)}
.license-table th,.license-table td{padding:.75rem .75rem .75rem 0;border-block-end:1px solid var(--line);text-align:start}
.license-table thead th{font-weight:600;color:var(--ink-3);font-size:var(--fs-meta)}
.error-page{padding-block:clamp(4rem,10vw,8rem)}
.error-code{font-family:var(--mono);font-size:var(--fs-small);color:var(--ink-3);margin-block-end:1rem}
.support-docs{display:grid;gap:.6rem;margin:0;padding:0;list-style:none}

/* ───────── 8. Окно поддержки ───────── */
.support-dialog{inline-size:min(32rem,calc(100vw - 2rem));max-block-size:calc(100dvh - 2rem);padding:0;border:1px solid var(--line-strong);border-radius:12px;background:var(--surface);color:var(--ink)}
.support-dialog::backdrop{background:rgb(8 7 13 / .62)}
.support-form{display:grid;gap:1rem;padding:1.5rem}
.support-dialog-heading{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.support-dialog-heading h2{font-size:1.5rem;font-stretch:100%;letter-spacing:0}
.support-close{display:grid;place-items:center;inline-size:2.5rem;block-size:2.5rem;padding:0;border:0;border-radius:6px;background:transparent;font-size:1.5rem;line-height:1;cursor:pointer;color:var(--ink-2)}
.support-close:hover{background:var(--sunken)}
.support-privacy{font-size:var(--fs-small);color:var(--ink-2)}
.support-form label{display:grid;gap:.35rem;font-size:var(--fs-small);font-weight:600}
.support-form input,.support-form textarea{inline-size:100%;padding:.65rem .8rem;border:1px solid var(--line-strong);border-radius:6px;background:var(--bg);font-weight:400}
.support-form input{min-block-size:2.75rem}
.support-form textarea{resize:vertical;min-block-size:7rem}
.support-form input:focus-visible,.support-form textarea:focus-visible{outline-offset:1px}
.support-status{min-block-size:1.4rem;font-size:var(--fs-small)}
.support-status[data-state="error"]{color:var(--danger)}
.support-status[data-state="success"]{color:var(--ok)}
.support-status[data-state="pending"]{color:var(--ink-3)}
.support-actions{display:flex;flex-wrap:wrap;gap:.75rem}

/* ───────── 9. Адаптив ───────── */
@media (max-width:960px){
  .menu-toggle{display:inline-grid}
  .primary-nav{display:none;position:absolute;inset-inline:0;inset-block-start:100%;flex-direction:column;gap:0;margin:0;padding:.5rem clamp(1rem,4vw,2rem) 1rem;background:var(--bg);border-block-end:1px solid var(--line)}
  .primary-nav.is-open{display:flex}
  .primary-nav a{padding:.8rem .25rem;border-radius:0;border-block-end:1px solid var(--line)}
  .primary-nav a[aria-current="page"]::after{inset-inline:.25rem;inset-block-end:-1px}
  .header-actions{margin-inline-start:auto}
  .hero-grid,.split,.stage-grid,.faq-layout{grid-template-columns:1fr}
  .hero-grid{gap:2.5rem}
  .footer-grid{grid-template-columns:1fr 1fr}
  .footer-about{grid-column:1 / -1}
  .doc-layout{grid-template-columns:1fr;gap:2rem}
  .toc{position:static;display:flex;flex-wrap:wrap;gap:.4rem}
  .toc a{padding:.35rem .75rem;border:1px solid var(--line);border-radius:6px}
}
@media (max-width:760px){
  .compare-panels,.install-grid,.plans{grid-template-columns:1fr}
  .flow{grid-template-columns:1fr}
  .flow li+li{border-inline-start:1px solid var(--line-strong);border-block-start:0}
  .flow li:first-child{border-radius:var(--radius) var(--radius) 0 0}
  .flow li:last-child{border-radius:0 0 var(--radius) var(--radius)}
  .flow li:not(:last-child)::after{inset-block-start:auto;inset-block-end:-.5rem;inset-inline-end:auto;inset-inline-start:1.6rem;transform:rotate(135deg)}
  :root[dir="rtl"] .flow li:not(:last-child)::after{transform:rotate(135deg)}
  .spec-row,.release{grid-template-columns:1fr}
  .facts{grid-template-columns:repeat(2,auto)}
}
@media (max-width:640px){
  .header-actions .btn{display:none}
  .footer-grid{grid-template-columns:1fr}
  .media-row--main{grid-template-columns:6rem minmax(0,1fr)}
  .compare-table th,.compare-table td{padding:.7rem .5rem}
  .panel{padding:1.15rem}
}
@media (max-width:420px){
  .brand{font-size:.875rem;gap:.5rem}
  .brand img{inline-size:1.75rem;block-size:1.75rem}
  .facts{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition:none!important}
  .scene{animation:none}
  .scene-1{opacity:1}
}
@media print{
  .site-header,.site-footer,.support-dialog,.stage{display:none}
}