/* radial — круговая приборная панель: центральный круг-хаб, секции-лучи по окружности,
   дуговые разделители, угловые подписи в градусах.

   Парадигма: страница = круглая шкала. Первый экран — хаб: концентрические кольца и
   насечки, собранные градиентами, контент стоит в центре круга. Ниже — поле секторов
   .rdfield: каждый сектор уходит лучом влево или вправо от центральной оси, в жёлобе
   стоит угловая подпись (градус + вертикальный код сектора + спица с узлом), сам блок
   получает форму сегмента (большой радиус со стороны центра). Между секторами —
   дуговые разделители .rdarc с точкой в апексе.

   namespace .rd*, шрифты подставляются на сайте (display — геометрический тонкий,
   body — гротеск с нормальной прозой).

   Порядок блоков: rdtop → rdhub (+rdkpi) → rdorbit → rdfield[rdsector × N] → rdnote → rdfoot.

   Перекраска: --a1 = accent_hue сайта, --a2 = второй акцент по схеме из набора,
   --sig — сигнальный (18+ и предупреждения), фон замешан на том же hue.

   Деградация: <=900px секторы теряют жёлоб (угловая подпись ложится строкой),
   <=620px всё схлопывается в одну колонку, радиусы сегментов гасятся, кольца хаба
   уменьшаются. Горизонтального скролла нет: хаб с overflow:hidden, таблицы в .rdscroll. */

:root{
  --a1:hsl(355 79% 57%);
  --a1d:hsl(355 72% 46%);
  --a1s:hsl(355 79% 57% / .15);
  --a2:hsl(115 48% 48%);          /* триадный +120° */
  --a2s:hsl(115 48% 48% / .14);
  --sig:hsl(42 92% 60%);
  --bg:hsl(355 16% 6%);
  --bg2:hsl(354 14% 9%);
  --panel:hsl(354 12% 12%);
  --panel2:hsl(354 11% 15%);
  --line:hsl(354 10% 21%);
  --line2:hsl(354 12% 27%);
  --tx:hsl(350 12% 93%);
  --tx2:hsl(350 8% 71%);
  --tx3:hsl(350 7% 54%);
  --col:1160px;
  --gut:126px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--bg);color:var(--tx);
  font:400 17px/1.66 'Golos Text',"Segoe UI",system-ui,sans-serif;
  -webkit-text-size-adjust:100%;overflow-x:hidden;
}
body::before{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.55;
  background:
    radial-gradient(760px 760px at 50% -14%,var(--a1s),transparent 68%),
    radial-gradient(620px 620px at 96% 46%,var(--a2s),transparent 70%);
}
h1,h2,h3,h4{font-family:Play,'Golos Text',sans-serif;font-weight:400;line-height:1.18;margin:0 0 12px;letter-spacing:.01em}
p{margin:0 0 14px}
a{color:var(--a2);text-decoration:none}
a:hover{text-decoration:underline}
.rd-wrap{position:relative;z-index:1;max-width:var(--col);margin:0 auto;padding:0 20px}
.rd-em{color:var(--a1)}
.rd-em2{color:var(--a2)}
.rd-n{font-family:Play,monospace;letter-spacing:.04em;color:var(--tx)}

/* ── верхняя дуга ───────────────────────────────────────────── */
.rdtop{
  position:sticky;top:0;z-index:40;background:hsl(355 16% 6% / .94);
  backdrop-filter:blur(8px);border-bottom:1px solid var(--line);
}
.rdtop__in{display:flex;align-items:center;gap:14px;max-width:var(--col);margin:0 auto;padding:9px 20px}
.rdmark{display:flex;align-items:center;gap:10px;font-family:Play,sans-serif;font-size:21px;letter-spacing:.12em;color:var(--tx)}
.rdmark i{
  width:28px;height:28px;border-radius:50%;flex:none;display:block;
  background:conic-gradient(from -90deg,var(--a1) 0 34%,var(--a2) 34% 58%,var(--line2) 58% 100%);
  box-shadow:inset 0 0 0 6px var(--bg);
}
.rdtop__deg{
  display:flex;align-items:center;gap:9px;font-family:Play,sans-serif;
  font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--tx3);
}
.rdtop__deg s{width:7px;height:7px;border-radius:50%;background:var(--a2);display:block;text-decoration:none}
.rdtop__cta{margin-left:auto}

.rdbtn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  min-height:48px;padding:12px 26px;border-radius:999px;
  font-family:Play,sans-serif;font-size:17px;letter-spacing:.08em;text-transform:uppercase;
  background:var(--a1);color:hsl(355 40% 8%);border:2px solid var(--a1);
  box-shadow:0 8px 26px hsl(355 72% 40% / .34);
}
.rdbtn:hover{text-decoration:none;background:hsl(355 82% 63%);border-color:hsl(355 82% 63%)}
.rdbtn--ring{background:transparent;color:var(--a2);border-color:var(--a2);box-shadow:none}
.rdbtn--ring:hover{background:var(--a2s);color:var(--a2)}
.rdbtn--sm{min-height:42px;padding:9px 18px;font-size:14.5px}

/* ── хаб первого экрана ─────────────────────────────────────── */
.rdhub{position:relative;overflow:hidden;padding:52px 20px 40px;text-align:center}
.rdhub::before{
  content:"";position:absolute;left:50%;top:56%;transform:translate(-50%,-50%);
  width:min(1120px,168vw);aspect-ratio:1;border-radius:50%;pointer-events:none;
  background:
    repeating-conic-gradient(from 0deg,var(--line2) 0 .28deg,transparent .28deg 6deg),
    repeating-radial-gradient(circle,transparent 0 108px,var(--line) 108px 109px);
  -webkit-mask-image:radial-gradient(circle,#000 0 46%,transparent 71%);
  mask-image:radial-gradient(circle,#000 0 46%,transparent 71%);
  opacity:.75;
}
.rdhub::after{
  content:"";position:absolute;left:50%;top:56%;transform:translate(-50%,-50%);
  width:min(560px,86vw);aspect-ratio:1;border-radius:50%;pointer-events:none;
  border:1px solid var(--a1);opacity:.34;
}
.rdhub__in{position:relative;z-index:2;max-width:800px;margin:0 auto}
.rdhub__tag{
  display:inline-flex;align-items:center;gap:9px;margin-bottom:16px;
  padding:5px 15px 5px 8px;border-radius:999px;border:1px solid var(--line2);
  background:var(--panel);font-family:Play,sans-serif;font-size:13.5px;
  letter-spacing:.13em;text-transform:uppercase;color:var(--tx2);
}
.rdhub__tag s{width:11px;height:11px;border-radius:50%;background:var(--a1);display:block;text-decoration:none}
.rdhub h1{font-size:clamp(30px,5vw,58px);margin-bottom:16px}
.rdhub__lede{font-size:clamp(16px,1.5vw,19.5px);color:var(--tx2);max-width:60ch;margin:0 auto 22px}
.rdhub__cta{display:flex;flex-wrap:wrap;gap:13px;justify-content:center;margin-bottom:10px}
.rdhub__fine{font-size:13.5px;color:var(--tx3);margin:0}

.rdkpi{display:flex;flex-wrap:wrap;justify-content:center;gap:14px;margin:30px auto 0;max-width:900px}
.rdkpi div{
  flex:1 1 168px;max-width:220px;aspect-ratio:1;border-radius:50%;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
  padding:16px;background:var(--panel);border:1px solid var(--line);
  box-shadow:inset 0 0 0 6px var(--bg2);
}
.rdkpi div:nth-child(odd){border-color:var(--a1)}
.rdkpi div:nth-child(even){border-color:var(--a2)}
.rdkpi em{font-style:normal;font-family:Play,sans-serif;font-size:27px;letter-spacing:.03em;color:var(--tx)}
.rdkpi span{font-size:13px;color:var(--tx3);line-height:1.4;text-align:center}

/* ── орбита-навигация: чипы по дуге ─────────────────────────── */
.rdorbit{
  display:flex;flex-wrap:wrap;justify-content:center;align-items:flex-end;gap:9px;
  max-width:var(--col);margin:34px auto 6px;padding:0 20px;position:relative;z-index:1;
}
.rdorbit a{
  display:inline-flex;align-items:center;gap:7px;padding:8px 15px;border-radius:999px;
  border:1px solid var(--line2);background:var(--bg2);color:var(--tx2);
  font-family:Play,sans-serif;font-size:14.5px;letter-spacing:.07em;
}
.rdorbit a:hover{text-decoration:none;border-color:var(--a1);color:var(--tx)}
.rdorbit a::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--a2)}
.rdorbit a:nth-child(1),.rdorbit a:nth-child(7){transform:translateY(-22px)}
.rdorbit a:nth-child(2),.rdorbit a:nth-child(6){transform:translateY(-12px)}
.rdorbit a:nth-child(3),.rdorbit a:nth-child(5){transform:translateY(-5px)}

/* ── поле секторов ──────────────────────────────────────────── */
.rdfield{position:relative;z-index:1;max-width:var(--col);margin:0 auto;padding:18px 20px 10px}

.rdarc{position:relative;height:34px;margin:26px 0 2px}
.rdarc::before{
  content:"";position:absolute;left:4%;right:4%;top:0;height:68px;
  border:1px solid var(--line2);border-bottom:0;
  border-radius:50% 50% 0 0 / 100% 100% 0 0;opacity:.85;
}
.rdarc::after{
  content:"";position:absolute;left:50%;top:-5px;width:10px;height:10px;margin-left:-5px;
  border-radius:50%;background:var(--a1);box-shadow:0 0 0 5px var(--bg);
}
.rdarc--a2::after{background:var(--a2)}

.rdsector{display:grid;grid-template-columns:var(--gut) 1fr;gap:0 22px;padding:6px 0 12px}
.rdsector--r{grid-template-columns:1fr var(--gut)}
.rdsector--r .rdang{order:2}

.rdang{position:relative;display:flex;flex-direction:column;align-items:center;padding-top:10px}
.rdang__deg{font-family:Play,sans-serif;font-size:29px;letter-spacing:.06em;color:var(--a1)}
.rdsector--r .rdang__deg{color:var(--a2)}
.rdang__code{
  writing-mode:vertical-rl;margin-top:12px;font-family:Play,sans-serif;font-size:12.5px;
  letter-spacing:.28em;text-transform:uppercase;color:var(--tx3);
}
.rdang__spoke{position:relative;flex:1;width:1px;background:var(--line2);margin-top:12px;min-height:26px}
.rdang__spoke::after{
  content:"";position:absolute;left:50%;bottom:-1px;width:9px;height:9px;margin-left:-4.5px;
  border-radius:50%;border:2px solid var(--a1);background:var(--bg);
}
.rdsector--r .rdang__spoke::after{border-color:var(--a2)}

.rdpanel{
  background:var(--panel);border:1px solid var(--line);
  border-radius:190px 18px 18px 190px;padding:26px 30px 24px 46px;
}
.rdsector--r .rdpanel{border-radius:18px 190px 190px 18px;padding:26px 46px 24px 30px}
.rdpanel + .rdpanel{margin-top:14px;border-radius:18px;padding:22px 26px}
.rdpanel--plain{background:transparent;border:0;border-radius:0;padding:6px 0 0}
.rdsector--r .rdpanel--plain{padding:6px 0 0}
.rdkick{
  display:block;margin-bottom:7px;font-family:Play,sans-serif;font-size:13px;
  letter-spacing:.2em;text-transform:uppercase;color:var(--a2);
}
.rdsector--r .rdkick{color:var(--a1)}
.rdsector h2{font-size:clamp(23px,2.9vw,35px);margin-bottom:14px}
.rdsector p{color:var(--tx2);font-size:16.5px}
.rdsector h3{font-size:18.5px;margin-bottom:6px}

/* пометка-хорда: короткий вывод под блоком */
.rdchord{
  display:flex;flex-wrap:wrap;gap:9px;align-items:baseline;margin:14px 0 0;
  padding:11px 18px;border-radius:999px;background:var(--bg2);border:1px solid var(--line);
  font-size:15px;color:var(--tx2);
}
.rdchord em{font-style:normal;font-family:Play,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--a1);font-size:13px}

/* ── внутренние компоненты ─────────────────────────────────── */
.rdscroll{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:8px 0 4px}
table.rdtable{width:100%;min-width:540px;border-collapse:collapse;font-size:15.5px}
table.rdtable th,table.rdtable td{padding:10px 13px;text-align:left;border-bottom:1px solid var(--line)}
table.rdtable th{
  font-family:Play,sans-serif;font-size:13px;letter-spacing:.11em;text-transform:uppercase;
  color:var(--tx3);font-weight:400;
}
table.rdtable td{color:var(--tx2)}
table.rdtable td:first-child{color:var(--tx)}
table.rdtable tr:last-child td{border-bottom:0}
table.rdtable .v{font-family:Play,sans-serif;font-size:17px;color:var(--a1)}

.rdgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:8px}
.rdgrid--2{grid-template-columns:repeat(2,1fr)}
.rdcell{
  background:var(--bg2);border:1px solid var(--line);border-radius:16px;padding:16px 18px;
  position:relative;
}
.rdcell::before{
  content:"";position:absolute;left:18px;top:-1px;width:34px;height:3px;border-radius:0 0 3px 3px;
  background:var(--a1);
}
.rdcell:nth-child(even)::before{background:var(--a2)}
.rdcell h3{font-size:17px}
.rdcell p{margin:0;font-size:14.8px;color:var(--tx2)}
.rdcell span{display:block;margin-top:8px;font-family:Play,sans-serif;font-size:13px;letter-spacing:.08em;color:var(--tx3)}

.rdlist{margin:4px 0 0;padding:0;list-style:none}
.rdlist li{position:relative;padding:8px 0 8px 30px;border-bottom:1px dashed var(--line);font-size:15.8px;color:var(--tx2)}
.rdlist li:last-child{border-bottom:0}
.rdlist li::before{
  content:"";position:absolute;left:5px;top:17px;width:11px;height:11px;border-radius:50%;
  border:2px solid var(--a2);background:var(--bg);
}

/* лестница уровней = кольца растущего диаметра */
.rdorbs{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;align-items:end;margin-top:10px}
.rdorb{text-align:center}
.rdorb i{
  display:flex;align-items:center;justify-content:center;margin:0 auto 9px;border-radius:50%;
  font-style:normal;font-family:Play,sans-serif;color:var(--tx);
  background:var(--panel2);border:2px solid var(--a1);
}
.rdorb--1 i{width:46px;height:46px;font-size:15px;border-color:hsl(355 60% 46%)}
.rdorb--2 i{width:54px;height:54px;font-size:16px;border-color:hsl(347 62% 49%)}
.rdorb--3 i{width:62px;height:62px;font-size:17px;border-color:hsl(20 62% 50%)}
.rdorb--4 i{width:70px;height:70px;font-size:18px;border-color:hsl(56 55% 48%)}
.rdorb--5 i{width:78px;height:78px;font-size:19px;border-color:hsl(92 50% 47%)}
.rdorb--6 i{width:88px;height:88px;font-size:21px;border-color:var(--a2)}
.rdorb em{display:block;font-style:normal;font-family:Play,sans-serif;font-size:16px;letter-spacing:.06em;color:var(--tx)}
.rdorb span{display:block;font-size:13px;color:var(--tx3);line-height:1.45;margin-top:3px}

/* голоса: круглый аватар-сегмент */
.rdvoice{display:grid;grid-template-columns:repeat(2,1fr);gap:13px;margin-top:8px}
.rdsay{
  background:var(--bg2);border:1px solid var(--line);border-radius:22px;padding:18px 20px;
}
.rdsay p{margin:0 0 11px;font-size:15.5px;color:var(--tx2)}
.rdsay footer{display:flex;align-items:center;gap:10px;font-size:13.5px;color:var(--tx3)}
.rdsay footer s{
  width:30px;height:30px;border-radius:50%;flex:none;text-decoration:none;
  background:conic-gradient(from -70deg,var(--a1) 0 40%,var(--a2) 40% 66%,var(--line2) 66% 100%);
  box-shadow:inset 0 0 0 5px var(--bg2);
}

/* вопросы */
.rdqa{border-bottom:1px solid var(--line);padding:15px 0}
.rdqa:last-child{border-bottom:0}
.rdqa h3{margin-bottom:6px;color:var(--tx)}
.rdqa p{margin:0;font-size:15.6px;color:var(--tx2)}

/* заметка автора */
.rdnote{
  position:relative;z-index:1;max-width:var(--col);margin:30px auto 36px;padding:24px 30px 24px 34px;
  background:var(--bg2);border:1px solid var(--line);border-radius:120px 22px 22px 120px;
}
.rdnote h3{font-size:20px}
.rdnote p{color:var(--tx2);font-size:15.6px}
.rdnote p:last-child{margin-bottom:0}

/* подвал */
.rdfoot{position:relative;z-index:1;border-top:1px solid var(--line);background:var(--bg2);padding:28px 0 36px}
.rdfoot__in{max-width:var(--col);margin:0 auto;padding:0 20px;display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:24px}
.rdfoot h4{font-family:Play,sans-serif;font-size:13.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--tx3);margin-bottom:10px}
.rdfoot p,.rdfoot li{font-size:14px;color:var(--tx3);line-height:1.62}
.rdfoot ul{margin:0;padding:0;list-style:none}
.rdage{
  display:inline-flex;align-items:center;justify-content:center;min-width:46px;height:30px;
  padding:0 11px;border-radius:999px;border:2px solid var(--sig);color:var(--sig);
  font-family:Play,sans-serif;font-size:15px;letter-spacing:.06em;margin-right:9px;
}

/* ── адаптив ────────────────────────────────────────────────── */
@media (max-width:900px){
  :root{--gut:96px}
  .rdgrid{grid-template-columns:repeat(2,1fr)}
  .rdorbs{grid-template-columns:repeat(3,1fr)}
  .rdfoot__in{grid-template-columns:1fr 1fr}
  .rdpanel{border-radius:120px 18px 18px 120px;padding:22px 24px 22px 34px}
  .rdsector--r .rdpanel{border-radius:18px 120px 120px 18px;padding:22px 34px 22px 24px}
}
@media (max-width:620px){
  body{font-size:16px}
  .rd-wrap{padding:0 14px}
  .rdtop__deg{display:none}
  .rdtop__in{padding:8px 14px}
  .rdhub{padding:30px 14px 26px}
  .rdhub::before{width:min(720px,190vw)}
  .rdhub__cta .rdbtn{flex:1 1 100%}
  .rdkpi{gap:10px}
  .rdkpi div{flex:1 1 132px;max-width:none;aspect-ratio:auto;border-radius:20px;padding:13px 12px}
  .rdkpi em{font-size:22px}
  .rdorbit{gap:8px;margin-top:22px}
  .rdorbit a{transform:none!important;font-size:13.5px;padding:7px 12px}
  .rdfield{padding:10px 14px 6px}
  .rdarc{height:22px;margin:18px 0 2px}
  .rdarc::before{height:44px}
  .rdsector,.rdsector--r{grid-template-columns:1fr;gap:0;padding:4px 0 10px}
  .rdsector--r .rdang{order:0}
  .rdang{flex-direction:row;align-items:center;gap:12px;padding:0 0 10px}
  .rdang__deg{font-size:22px}
  .rdang__code{writing-mode:horizontal-tb;margin:0;letter-spacing:.18em}
  .rdang__spoke{flex:1;height:1px;width:auto;min-height:0;margin:0}
  .rdang__spoke::after{left:auto;right:-1px;bottom:auto;top:50%;margin:-4.5px 0 0}
  .rdpanel,.rdsector--r .rdpanel{border-radius:20px;padding:18px 16px}
  .rdpanel--plain,.rdsector--r .rdpanel--plain{padding:4px 0 0}
  .rdgrid,.rdgrid--2,.rdvoice,.rdorbs{grid-template-columns:1fr}
  .rdorb{display:flex;align-items:center;gap:14px;text-align:left}
  .rdorb i{margin:0;width:52px!important;height:52px!important;flex:none;font-size:16px!important}
  .rdnote{border-radius:22px;padding:20px 17px;margin:20px auto 26px}
  .rdfoot__in{grid-template-columns:1fr}
  .rdchord{border-radius:16px;padding:11px 14px}
}