/* ═══════════════════════════════════════════════════════════════════
   Ядро на токенах vorpus.github.io/performativeUI
   Значения сняты 27.08.2026 с боевого assets/index-Cm10b7gA.css, не на глаз.
   Шрифты у них Inter / JetBrains Mono / Instrument Serif подключены с CDN -
   нам внешние домены запрещены, поэтому здесь системные стеки с теми же
   ролями: гротеск - содержание, моно - служебное, засечный - одна шутка.
   ═══════════════════════════════════════════════════════════════════ */
:root{
  /* 28.08: rgb-двойники нужны, чтобы rgba(...) в свечениях и стекле следовали за темой */
  --pui-accent-rgb:124,58,237; --pui-accent2-rgb:236,72,153; --pui-accent3-rgb:34,211,238;
  --pui-bg-rgb:8,8,11; --pui-bg-soft-rgb:20,20,28; --pui-glass-rgb:15,15,22;
  --pui-bg:#08080b; --pui-bg-elev:#0e0e13; --pui-bg-soft:#14141c;
  --pui-border:#1f1f2b; --pui-border-bright:#2a2a3a;
  --pui-fg:#f4f4f6; --pui-on-accent:#0b0b10; --pui-fg-mute:#88889a; --pui-fg-dim:#6b6b7a;
  --pui-accent:#7C3AED; --pui-accent2:#EC4899; --pui-accent3:#22D3EE;
  --pui-glass:rgba(var(--pui-glass-rgb),.85); --pui-glass-deep:rgba(var(--pui-glass-rgb),.78); --pui-glass-soft:rgba(var(--pui-glass-rgb),.55);
  --pui-glow:0 0 24px rgba(var(--pui-accent-rgb),.45);
  --pui-glow-strong:0 0 48px rgba(var(--pui-accent-rgb),.55), 0 0 96px rgba(var(--pui-accent2-rgb),.25);
  --pui-shadow-card:0 10px 40px rgba(0,0,0,.55);
  --pui-shadow-deep:0 30px 80px rgba(0,0,0,.55);
  --pui-radius-sm:8px; --pui-radius:12px; --pui-radius-lg:18px; --pui-radius-xl:22px;
  --pui-ease:cubic-bezier(.22,1,.36,1);
  --d-fast:.12s; --d:.16s; --d-mid:.2s; --d-slow:.24s; --d-lazy:.45s;
  --pui-font-sans:"Inter",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --pui-font-mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --pui-font-serif:"Instrument Serif",ui-serif,Georgia,"Times New Roman",serif;
}
*{box-sizing:border-box}
body{margin:0;background:var(--pui-bg);color:var(--pui-fg);overflow-x:hidden;
  font:400 17px/1.6 var(--pui-font-sans);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
.w{max-width:1180px;margin:0 auto;padding:0 30px}

/* ⚠️ 27.08: кнопка висела слева СВЕРХУ и ложилась поверх логотипа - и на узком
   экране, и на широком (при 1440 контент начинается на 130px, а кнопка занимает
   до ~168px). Семь агентов из восьми независимо чинили это отступом шапки, то есть
   лечили симптом в своих файлах. Корень был здесь. Кнопка уехала вниз - там она
   не пересекается ни с шапкой, ни с содержимым ни на одной ширине. */
.back{position:fixed;left:18px;bottom:18px;z-index:99;padding:9px 15px;border-radius:var(--pui-radius);
  background:var(--pui-glass);border:1px solid var(--pui-border);color:var(--pui-fg-mute);
  font:500 12.5px var(--pui-font-sans);backdrop-filter:blur(12px);
  transition:border-color var(--d) var(--pui-ease),color var(--d) var(--pui-ease),box-shadow var(--d) var(--pui-ease)}
.back:hover{border-color:var(--pui-accent);color:var(--pui-fg);box-shadow:var(--pui-glow)}

/* шапка */
.top{position:relative;z-index:8;padding:26px 0}
.top .w{display:flex;align-items:center;gap:15px}
.top img{height:30px;filter:drop-shadow(0 0 16px rgba(var(--pui-accent-rgb),.5))}
.wm{font:500 16px/1 var(--pui-font-sans)}.wm em{font-style:normal;color:var(--pui-accent2)}
.tag{margin-left:auto;display:inline-flex;align-items:center;gap:9px;padding:8px 15px;
  border-radius:999px;border:1px solid var(--pui-border-bright);background:var(--pui-glass-soft);
  color:var(--pui-fg-mute);font:600 9.5px var(--pui-font-mono);letter-spacing:.22em;text-transform:uppercase}
.tag i{width:6px;height:6px;border-radius:50%;background:var(--pui-accent3);
  box-shadow:0 0 12px var(--pui-accent3);animation:pui-pulse-dot 3s var(--pui-ease) infinite}
@keyframes pui-pulse-dot{0%,100%{opacity:1}50%{opacity:.25}}

/* герой */
.hero{position:relative;z-index:6;padding:44px 0 76px}
.kick{display:inline-flex;align-items:center;gap:11px;margin-bottom:22px;color:var(--pui-accent3);
  font:600 10.5px/1 var(--pui-font-mono);letter-spacing:.24em;text-transform:uppercase}
.kick s{width:38px;height:1px;background:linear-gradient(90deg,var(--pui-accent3),transparent);text-decoration:none}
h1{margin:0 0 20px;font:300 clamp(31px,3.7vw,50px)/1.1;letter-spacing:-.03em;max-width:18ch}
h1 b{font-weight:600;background:linear-gradient(96deg,var(--pui-accent2),var(--pui-accent3));
  -webkit-background-clip:text;background-clip:text;color:transparent}
/* одна засечная курсивная строка на страницу - правило performativeUI */
.serif{font:italic 400 19px/1.5 var(--pui-font-serif);color:var(--pui-accent2);margin:0 0 24px;max-width:46ch}
.lede{color:#b0b4c8;font-size:17px;line-height:1.62;max-width:47ch;margin:0 0 30px}
.act{display:flex;gap:15px;align-items:center;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;gap:10px;padding:16px 26px;border-radius:var(--pui-radius-lg);
  font:600 15px var(--pui-font-sans);color:var(--pui-on-accent,#0b0b10);border:0;cursor:pointer;
  background:linear-gradient(96deg,var(--pui-accent2),var(--pui-accent3));
  box-shadow:var(--pui-glow),0 1px 0 rgba(255,255,255,.35) inset;
  transition:transform var(--d) var(--pui-ease),box-shadow var(--d) var(--pui-ease)}
.btn:hover{transform:translateY(-2px);box-shadow:var(--pui-glow-strong)}
.btn.g{background:transparent;color:var(--pui-fg-mute);border:1px solid var(--pui-border);box-shadow:none}
.btn.g:hover{border-color:var(--pui-accent);color:var(--pui-fg);box-shadow:var(--pui-glow);transform:none}
.under{color:var(--pui-fg-dim);font-size:14px;margin:16px 0 0}

/* карточка-панель */
.panel{background:linear-gradient(180deg,rgba(var(--pui-bg-soft-rgb),.6),rgba(var(--pui-bg-rgb),.6));
  border:1px solid var(--pui-border);border-radius:var(--pui-radius-xl);
  box-shadow:var(--pui-shadow-card);backdrop-filter:blur(14px)}
.mono{font:600 9.5px var(--pui-font-mono);letter-spacing:.2em;text-transform:uppercase;color:var(--pui-fg-dim)}

/* подпись об источнике */
.src{position:relative;z-index:6;margin:46px 0 70px;padding:18px 22px;border-radius:var(--pui-radius-lg);
  border:1px solid var(--pui-border);background:var(--pui-glass-soft);color:var(--pui-fg-dim);
  font:500 12.5px/1.65 var(--pui-font-mono)}
.src b{color:var(--pui-accent2);font-weight:700}

/* ⚠️ У самого performativeUI это сделано плохо: 3 блока reduced-motion на 24 keyframes,
   при reduce у них продолжают мигать flash1-3 раз в 0.45 с. Здесь глушим всё. */
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ═══ ТЕМЫ (28.08). Переключаются атрибутом data-theme на <html>. Гаммы взяты из прежних
   направлений: heat - тепловая шкала (01), pigment - ультрамарин с сигнальным жёлтым (A),
   gold - золото на градациях почти-чёрного (C, web3.esqrd.co). ═══ */
html[data-theme="heat"]{
  --pui-accent:#D2622F; --pui-accent2:#F7B25C; --pui-accent3:#C0568E;
  --pui-accent-rgb:210,98,47; --pui-accent2-rgb:247,178,92; --pui-accent3-rgb:192,86,142;
  --pui-bg:#05060C; --pui-bg-elev:#0A0C18; --pui-bg-soft:#0E1120;
  --pui-bg-rgb:5,6,12; --pui-bg-soft-rgb:14,17,32; --pui-glass-rgb:10,12,24;
  --pui-border:#1B1F3B; --pui-border-bright:#2A2F55;
  --pui-fg:#F3F1EC; --pui-fg-mute:#8B92A6; --pui-fg-dim:#666D80; --pui-on-accent:#14100C}
html[data-theme="pigment"]{
  --pui-accent:#F5C518; --pui-accent2:#FFE067; --pui-accent3:#F2F0EA;
  --pui-accent-rgb:245,197,24; --pui-accent2-rgb:255,224,103; --pui-accent3-rgb:242,240,234;
  --pui-bg:#1B2AA8; --pui-bg-elev:#16228A; --pui-bg-soft:#2231B8;
  --pui-bg-rgb:27,42,168; --pui-bg-soft-rgb:34,49,184; --pui-glass-rgb:22,34,138;
  --pui-border:#3A48C0; --pui-border-bright:#5866D0;
  --pui-fg:#F2F0EA; --pui-fg-mute:#C9CCE8; --pui-fg-dim:#A3A8DC; --pui-on-accent:#101010}
html[data-theme="gold"]{
  --pui-accent:#998963; --pui-accent2:#C9B689; --pui-accent3:#E8DCC0;
  --pui-accent-rgb:153,137,99; --pui-accent2-rgb:201,182,137; --pui-accent3-rgb:232,220,192;
  --pui-bg:#101010; --pui-bg-elev:#141414; --pui-bg-soft:#191919;
  --pui-bg-rgb:16,16,16; --pui-bg-soft-rgb:25,25,25; --pui-glass-rgb:20,20,20;
  --pui-border:#232323; --pui-border-bright:#2C2C2C;
  --pui-fg:#EFEDE7; --pui-fg-mute:#8B8880; --pui-fg-dim:#5E5C56; --pui-on-accent:#141414}