/* ============================================================
   os.css — общий слой сайта Открытого Сознания.
   Подключается каждой страницей: <link rel="stylesheet" href="/assets/os.css">
   Содержит: ПУЛЬТ (переменные вкуса), вход в кабинет, виджет
   Хранителя (кнопка + окно справа + искра), подвал и соцсети.
   Стили, специфичные странице, живут в самой странице.
   ============================================================ */

:root{
  --korich:#625B54; --zoloto:#F2CB8E; --chern:#3D3836;
  --sinij1:#23859e; --sinij2:#135671; --sinij3:#0e415c; --sinij4:#113045;
  --persik3:#f78747; --persik4:#fa5c2d;
  --kosmos:#0F1D30; --kosmos-glub:#0B1524;
  --dym:#9A8F85; --dym-sinij:#8FA3BC;
  --pesok:#DCC9A6; --pesok-glub:#D0BB92; --zoloto-temn:#7A5E33;
  --hranitel:#0e415c;
  --shrift:'Montserrat',system-ui,-apple-system,sans-serif; --vozduh:.22em;
  --vdoh:10s;
}

/* ---------- шапка сайта: знак + три пункта, одна на все страницы ---------- */
.os-shapka{position:fixed;top:0;left:0;right:0;z-index:60;
  display:flex;align-items:center;padding:.85rem 1.6rem;min-height:3.4rem;
  background:linear-gradient(180deg,rgba(11,21,36,.72),rgba(11,21,36,.28) 78%,transparent);
  -webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);
  font-family:var(--shrift)}
.os-shapka .znak{display:flex;align-items:center;line-height:0}
.os-shapka .znak img{height:30px;width:auto;
  filter:drop-shadow(0 0 7px rgba(242,203,142,.35))}
/* меню — по центру экрана, крупнее; знак живёт слева сам по себе */
.os-shapka .punkty{position:absolute;left:50%;transform:translateX(-50%);
  display:flex;gap:2.8rem;align-items:center}
.os-shapka .punkty a{font-size:1rem;letter-spacing:.22em;text-transform:lowercase;
  text-decoration:none;color:#EFE6D6;opacity:.85;transition:color .3s,opacity .3s}
.os-shapka .punkty a:hover{color:var(--zoloto);opacity:1}
@media (max-width:680px){
  .os-shapka{padding:.7rem 1rem}
  .os-shapka .znak img{height:24px}
  .os-shapka .punkty{position:static;transform:none;margin-left:auto;gap:1.2rem}
  .os-shapka .punkty a{font-size:.78rem;letter-spacing:.13em}
}

/* ---------- кнопка Хранителя (нижний правый угол) ---------- */
#hranitel-knopka{position:fixed;right:1.2rem;bottom:1.2rem;z-index:70;width:62px;height:62px;
  border-radius:50%;border:none;cursor:pointer;
  background:radial-gradient(circle at 40% 35%,var(--sinij1),var(--sinij3));
  box-shadow:0 0 0 1px rgba(242,203,142,.35),0 6px 24px rgba(0,0,0,.45);
  display:flex;align-items:center;justify-content:center}
#hranitel-knopka svg{height:26px;width:auto;stroke:var(--zoloto);stroke-width:3.4;fill:none;
  stroke-linecap:round;stroke-linejoin:round}
#hranitel-knopka .podskazka{position:absolute;right:74px;top:50%;transform:translateY(-50%);
  white-space:nowrap;font-size:.7rem;letter-spacing:.14em;color:var(--dym-sinij);opacity:0;
  transition:opacity .4s;pointer-events:none;font-family:var(--shrift)}
#hranitel-knopka:hover .podskazka{opacity:1}

/* ---------- окно Хранителя: выезжает СПРАВА ---------- */
#hchat{position:fixed;right:0;top:0;bottom:0;left:auto;z-index:80;width:min(380px,94vw);
  display:flex;flex-direction:column;background:rgba(9,23,34,.97);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  border-left:1px solid rgba(242,203,142,.25);transform:translateX(102%);
  transition:transform .45s cubic-bezier(.22,.8,.3,1);font-family:var(--shrift)}
#hchat.otkryt{transform:none}
.hchat-shapka{display:flex;align-items:center;gap:.6rem;padding:.85rem 1rem;
  border-bottom:1px solid rgba(242,203,142,.15);font-size:.72rem;
  letter-spacing:.18em;text-transform:uppercase;color:var(--zoloto)}
.hchat-shapka svg{height:18px;width:auto;stroke:var(--zoloto);stroke-width:3.4;fill:none;
  stroke-linecap:round;stroke-linejoin:round}
.hchat-shapka .rost{flex:1}
.hchat-shapka button{background:none;border:none;color:var(--zoloto);font-size:1.3rem;
  cursor:pointer;opacity:.7;line-height:1}
.hchat-lenta{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:.8rem;
  padding:1rem .95rem 1.2rem;scrollbar-width:thin}
.hchat-v{align-self:flex-end;max-width:85%;font-size:.85rem;line-height:1.5;
  color:#0B1622;background:rgba(242,203,142,.9);padding:.45rem .8rem;
  border-radius:12px 12px 3px 12px}
.hchat-o{align-self:flex-start;max-width:94%;display:flex;gap:.55rem;align-items:flex-start}
.hchat-o p{margin:0;font-size:.88rem;line-height:1.6;white-space:pre-line;color:#F1E7D4}
.hchat-o.zhdet p{opacity:.55;font-style:italic}
.hchat-vvod{display:flex;align-items:flex-end;gap:.6rem;padding:.6rem .8rem .8rem;
  border-top:1px solid rgba(242,203,142,.15)}
.hchat-vvod textarea{flex:1;background:none;border:none;outline:none;resize:none;
  max-height:6.5em;line-height:1.5;font-family:var(--shrift);font-size:.95rem;color:#F1E7D4}
.hchat-vvod textarea::placeholder{color:#F1E7D4;opacity:.4}
.hchat-vvod button{background:none;border:none;cursor:pointer;color:var(--zoloto);
  font-size:1.3rem;opacity:.75}

/* искра Хранителя: дышит и светится; думает — крутится (из монолита) */
.hchat-o .iskra{width:34px;height:34px;flex-shrink:0;margin-top:-0.15em;
  padding:7px 8px 9px;box-sizing:border-box;border-radius:50%;
  background:radial-gradient(circle at 50% 54%,
    rgba(242,203,142,0.22), rgba(242,203,142,0.07) 56%, rgba(242,203,142,0) 74%);
  animation:os-dyhanie var(--vdoh) ease-in-out infinite}
.hchat-o .iskra line{stroke:var(--zoloto);stroke-width:2.8;stroke-linecap:round}
.hchat-o .iskra.dumaet{animation:os-dumaet 2.2s linear infinite;
  transform-origin:50% 54.2%;transform-box:view-box}
/* искру показывает только последний ответ — как в монолите */
.hchat-o:has(~ .hchat-o) .iskra{visibility:hidden}
@keyframes os-dyhanie{
  0%,100%{filter:drop-shadow(0 0 6px rgba(242,203,142,0.25))}
  50%{filter:drop-shadow(0 0 16px rgba(242,203,142,0.6))}}
@keyframes os-dumaet{from{transform:rotate(0)}to{transform:rotate(360deg)}}

/* мобильный: окно поднимается снизу */
@media (max-width:560px){
  #hranitel-knopka{width:54px;height:54px;right:.9rem;bottom:.9rem}
  #hchat{left:0;right:0;top:auto;bottom:0;width:auto;height:74vh;
    border-left:none;border-top:1px solid rgba(242,203,142,.3);
    border-radius:16px 16px 0 0;transform:translateY(104%)}
  #hchat.otkryt{transform:none}
}

/* ---------- чипы-вопросы ---------- */
.chipy{display:flex;flex-wrap:wrap;gap:.65rem;margin-bottom:1.4rem}
.chip{border:1px solid rgba(242,203,142,.4);border-radius:999px;background:transparent;
  color:#EFE6D6;padding:.62rem 1.15rem;font-family:var(--shrift);font-size:.8rem;
  text-decoration:none;display:inline-block;cursor:pointer;
  transition:border-color .3s,background .3s}
.chip:hover{border-color:var(--zoloto);background:rgba(242,203,142,.1)}

/* ---------- подвал сайта: тёмный, один на все страницы (инжект os.js) ---------- */
/* футер — родной брат шапки: та же геометрия (знак у левого края экрана,
   пункты по центру), тот же шрифтовой голос */
.os-podval{background:var(--kosmos-glub);
  padding:1.9rem 1.6rem;min-height:3.4rem;
  font-family:var(--shrift)}
/* знак привязан к строке ссылок и центрируется без transform —
   класс .znak (как в шапке), НЕ .logotip: у витрины .logotip — сияющий
   логотип входа с анимацией transform, и она ломала центровку (v8) */
.os-podval .nutro{position:relative;display:flex;gap:1.9rem;flex-wrap:wrap;
  align-items:center;justify-content:center}
.os-podval .znak{position:absolute;left:0;top:0;bottom:0;
  display:flex;align-items:center;line-height:0}
.os-podval .znak img{height:30px;width:auto;display:block;opacity:.9;
  filter:drop-shadow(0 0 7px rgba(242,203,142,.35))}
.os-podval a{font-size:.88rem;letter-spacing:.2em;text-transform:lowercase;
  text-decoration:none;color:#EFE6D6;opacity:.75;transition:color .3s,opacity .3s}
.os-podval a:hover{color:var(--zoloto);opacity:1}
/* две группы: юрдоки — тише и мельче, слева за тонкой чертой; соцсети — голос */
.os-podval .pravo,.os-podval .socseti{display:flex;gap:1.9rem;align-items:center}
.os-podval .pravo{gap:1.2rem;padding-right:1.9rem;
  border-right:1px solid rgba(242,203,142,.22)}
.os-podval .pravo a{font-size:.72rem;letter-spacing:.16em;opacity:.45}
.os-podval .pravo a:hover{opacity:.9}
@media (max-width:680px){
  .os-podval{padding:1.4rem 1rem}
  .os-podval .nutro{gap:.8rem 1rem;padding-left:40px;justify-content:flex-start}
  .os-podval .pravo,.os-podval .socseti{flex-wrap:wrap;gap:.6rem 1rem}
  .os-podval .pravo{padding-right:0;border-right:none;width:100%;order:2}
  .os-podval a{font-size:.74rem;letter-spacing:.13em}
  .os-podval .pravo a{font-size:.64rem}
}

/* ---------- двери (витрина и хаб /doors) ---------- */
.dveri{display:grid;gap:.9rem;grid-template-columns:repeat(auto-fit,minmax(168px,1fr));margin-top:2.2rem}
.dver{border:1px solid rgba(242,203,142,.28);border-radius:14px;padding:1.3rem 1.15rem;
  text-decoration:none;background:rgba(11,21,36,.4);transition:background .35s,transform .35s;
  display:block}
.dver:hover{background:rgba(242,203,142,.08);transform:translateY(-3px)}
.dver svg{height:30px;width:auto;stroke:var(--zoloto);stroke-width:3;fill:none;
  stroke-linecap:round;stroke-linejoin:round;margin-bottom:.7rem;display:block}
.dver b{display:block;font-weight:500;font-size:.9rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--zoloto);margin-bottom:.3rem}
.dver span{font-size:.78rem;color:var(--dym-sinij)}

/* ---------- горячее событие: тонкая полоса внизу (как в монолите) ---------- */
.sobytie-svet{position:fixed;bottom:0;left:0;right:0;z-index:44;
  display:none;justify-content:center;background:var(--chern);
  border-top:1px solid rgba(242,203,142,0.10);padding:.75rem 0 .9rem;
  font-family:var(--shrift)}
body.est-sobytie .sobytie-svet{display:flex}
.sobytie-svet a{display:flex;gap:1rem;align-items:baseline;text-decoration:none;
  color:var(--persik3);font-weight:500;font-size:16px;letter-spacing:.1em;
  white-space:nowrap;opacity:0;transition:opacity 1.25s ease}
.sobytie-svet a.viden{opacity:.85}
.sobytie-svet a:hover{color:var(--persik4)}
.sobytie-svet .tochka{color:var(--persik3);opacity:.7}
/* кнопка Хранителя и подвал уступают полосе место */
body.est-sobytie #hranitel-knopka{bottom:4.1rem}
body.est-sobytie .os-podval{padding-bottom:5.2rem}
@media (max-width:560px){
  .sobytie-svet{padding:.5rem .4rem .65rem}
  .sobytie-svet a{font-size:12px;line-height:1.45;gap:.45rem;flex-wrap:wrap;
    justify-content:center;text-align:center;padding:0 .5rem}
  body.est-sobytie #hranitel-knopka{bottom:3.6rem}
}

@media (prefers-reduced-motion:reduce){
  #hchat,.hchat-o .iskra{animation:none!important;transition:none!important}}
