/* Кожа hrisa.ru для экрана #3163 (задача 3176): «Тёплое золото» по макету
   владельца 27.10. Значения цветов и теней — только ссылками на --tz-*
   из /assets/teplo-zoloto/tokeny.css (одна правда дизайна); шапка, меню и
   настройки — классы h/hrisa.css старой главной. Общие hrisa-ekran.css и
   hrisa-stroka.css не правятся: всё ниже — под html[data-kozha="hrisa"]. */
html[data-kozha="hrisa"] {
  --he-fon: var(--tz-fon); --he-tekst: var(--tz-tekst); --he-tiho: var(--tz-seryy);
  --he-kant: var(--tz-ramka); --he-ya: var(--tz-ramka); --he-panel: var(--tz-pole);
  --k-shapka: 64px;
}
html[data-kozha="hrisa"] body.he-telo { font-family: var(--tz-shrift); background: var(--tz-fon); color: var(--tz-tekst); }
html[data-kozha="hrisa"] .he { font-family: var(--tz-shrift); box-sizing: border-box; padding-top: var(--k-shapka); }
html[data-kozha="hrisa"] .he-shapka,
html[data-kozha="hrisa"] .he-menu,
html[data-kozha="hrisa"] .he-fon { display: none !important; }
/* круг 3244: семейство шрифта — свой атрибут кожи (data-shrift — размер экрана) */
html[data-kozha="hrisa"][data-semeystvo="strogiy"] { --tz-shrift: 'PT Serif', Georgia, serif; }
html[data-kozha="hrisa"][data-semeystvo="legkiy"] { --tz-shrift: 'OpenDyslexic', 'Golos Text', system-ui, sans-serif; }
html[data-kozha="hrisa"] #h-menyu .h-shrift-ekrana { display: flex; align-items: center; width: 100%; min-height: 44px;
  margin: 0; padding: 10px 0; border: 0; background: none; color: inherit; font: inherit; text-align: left; cursor: pointer; }

/* ---------- шапка: знак с крыльями, имя, подпись, «Новый чат», меню ---------- */
html[data-kozha="hrisa"] .h-shapka {
  position: fixed; z-index: 15; top: 0; left: 0; right: 0; box-sizing: border-box;
  height: var(--k-shapka); padding: 0 12px 0 16px; margin: 0;
  display: flex; align-items: center; gap: 8px; background: var(--tz-fon);
}
html[data-kozha="hrisa"] .h-shapka .h-logo { flex: 1 1 auto; min-width: 0; }
html[data-kozha="hrisa"] .h-shapka .h-ot { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
html[data-kozha="hrisa"] .h-menyu-knopka { flex: 0 0 auto; width: 48px; height: 48px; }
.k-novyy {
  flex: 0 0 auto; min-height: 44px; padding: 0 14px; border: 1px solid var(--tz-ramka);
  border-radius: var(--tz-r-knopka); background: var(--tz-pole); color: var(--tz-tekst);
  font: inherit; font-size: .9375rem; font-weight: 600; cursor: pointer;
}
.k-novyy[hidden] { display: none; }
.tz-krylo { animation: k-mah 5s ease-in-out infinite; }
html.h-pishet .tz-krylo { animation: k-mahb .5s ease-in-out infinite; }
html.h-slushaet .tz-krylo { animation: none; transform: rotate(-9deg); }
@keyframes k-mah { 0%, 72%, 100% { transform: rotate(0deg); } 78% { transform: rotate(-14deg); } 84% { transform: rotate(3deg); } 90% { transform: rotate(-9deg); } 96% { transform: rotate(0deg); } }
@keyframes k-mahb { 0%, 100% { transform: rotate(3deg); } 50% { transform: rotate(-16deg); } }

/* ---------- приветствие: монета в двух кольцах, h1 «Чем помочь?» ---------- */
html[data-kozha="hrisa"] .he-lenta { padding: 22px 24px 8px; }
html[data-kozha="hrisa"] .k-privet { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 14px; align-items: center; max-width: 100%; }
html[data-kozha="hrisa"] .k-privet .he-tekst { display: contents; }
html[data-kozha="hrisa"] .k-privet .he-tekst > p { grid-column: 2; }
html[data-kozha="hrisa"] .k-privet .h-kolco-1 { grid-row: 1 / span 2; }
html[data-kozha="hrisa"] .k-privet .he-tekst > .dv-h1 { grid-column: 1 / -1; }
html[data-kozha="hrisa"] .k-privet .h-kolco-1 { flex: 0 0 auto; margin: 0; }
html[data-kozha="hrisa"] .k-privet .he-tekst > p { color: var(--tz-seryy); font-size: 1.125rem; line-height: 1.5; }
html[data-kozha="hrisa"] .k-privet .he-tekst p { margin: 0; }
html[data-kozha="hrisa"] .he-tekst .dv-h1 {
  margin: 14px 0 0; font-family: var(--tz-shrift-zag); font-size: 2.625rem; line-height: 1.1;
  font-weight: 600; letter-spacing: -.01em; color: var(--tz-tekst);
}
html[data-kozha="hrisa"] .dv-h1 { font-family: var(--tz-shrift-zag); }

/* ---------- разговор: пузырь гостя справа, Хриса слева с монеткой ---------- */
html[data-kozha="hrisa"] .he-soob--ya .he-tekst { background: var(--tz-ramka); color: var(--tz-tekst); font-size: 1.0625rem; }
html[data-kozha="hrisa"] .he-soob--hrisa:not(.k-privet) { position: relative; padding-left: 38px; font-size: 1.0625rem; }
html[data-kozha="hrisa"] .he-soob--hrisa:not(.k-privet)::before {
  content: ""; position: absolute; left: 0; top: 2px; width: 28px; height: 28px; border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, var(--tz-sfera-1) 0%, var(--tz-sfera-2) 58%, var(--tz-sfera-3) 100%);
  box-shadow: var(--tz-ten-sfery);
}

/* ---------- 3181: золотое свечение фона (h/hrisa.css .h-siyanie, 1-glavnaya-den.png) ---------- */
html[data-kozha="hrisa"] {
  --k-siyanie: radial-gradient(circle 311px at calc(100% - 70px) 50px, var(--tz-siyanie) 0%, transparent 68%);
}
html[data-kozha="hrisa"] body.he-telo,
html[data-kozha="hrisa"] .h-shapka { background: var(--k-siyanie) fixed, var(--tz-fon); }

/* ---------- 3181: первый экран по макету — подсказка, 4 плитки 2×2, блок «Кто такая Хриса» ---------- */
html[data-kozha="hrisa"] .he-podval {
  background: linear-gradient(to bottom, transparent 0%, var(--tz-fon) 22%);
  padding: 8px 16px max(18px, env(safe-area-inset-bottom));
}
html[data-kozha="hrisa"] .he-chip {
  border: 1px solid var(--tz-ramka); background: var(--tz-pole); color: var(--tz-tekst);
  box-shadow: var(--tz-ten-plitki); font-family: inherit;
}
html[data-kozha="hrisa"] .k-start { margin: 0 0 8px; }
html[data-kozha="hrisa"] #hrisa-ekran[data-pusto="0"] .k-start,
html[data-kozha="hrisa"] .he-lenta:has(.he-soglasie) .k-start { display: none; }
html[data-kozha="hrisa"] .k-start .chp-glav { max-width: none; margin: 20px 0 0; padding: 0; }
html[data-kozha="hrisa"] .k-start .chp-glav .hrisa-blok { margin-top: 0; padding: 18px 18px 8px; }

/* ---------- строка ввода: пилюля — скрепка, «Напишите или скажите», золотая сфера 52 px ---------- */
html[data-kozha="hrisa"] .hs-kapsula {
  flex-direction: row; align-items: center; gap: 6px; padding: 6px 6px 6px 8px;
  background: var(--tz-pole); border: 1px solid var(--tz-ramka); border-radius: 34px; box-shadow: var(--tz-ten-polya);
}
html[data-kozha="hrisa"] .hs-niz:not([hidden]) { display: contents; }
html[data-kozha="hrisa"] .hs-plus { order: -1; }
html[data-kozha="hrisa"] .hs-promezh { display: none; }
html[data-kozha="hrisa"] .hs .hs-pole { flex: 1 1 auto; width: auto; min-width: 0; padding: 12px 4px; }
html[data-kozha="hrisa"] .hs-otpravit:disabled:not(.hs-stop-otveta) { display: none; }
html[data-kozha="hrisa"] .hs-kapsula:has(.hs-pole:not(:placeholder-shown)) .hs-mikro { display: none; }
html[data-kozha="hrisa"] .hs-polosa:not([hidden]) { flex: 1 1 auto; min-width: 0; margin-left: 0; }
/* запись голоса (3-golos-noch.png): расшифровка — строкой выше, полоса — во всю пилюлю */
html[data-kozha="hrisa"] .hs[data-sost="zapis"] .hs-kapsula { flex-wrap: wrap; }
html[data-kozha="hrisa"] .hs[data-sost="zapis"] .hs-pole { flex: 1 1 100%; order: -2; }
html[data-kozha="hrisa"] .hs[data-sost="zapis"] .hs-polosa { flex: 1 1 100%; }
html[data-kozha="hrisa"] .hs-pole { font-family: inherit; font-size: 1.125rem; color: var(--tz-tekst); }
html[data-kozha="hrisa"] .hs-pole::placeholder { color: var(--tz-seryy); opacity: 1; }
html[data-kozha="hrisa"] .hs-mikro,
html[data-kozha="hrisa"] .hs-otpravit {
  width: 52px; height: 52px; min-width: 52px; border: 0; border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, var(--tz-sfera-1) 0%, var(--tz-sfera-2) 58%, var(--tz-sfera-3) 100%);
  box-shadow: var(--tz-ten-mikro); color: var(--tz-na-zolote);
}
html[data-kozha="hrisa"] .hs-otpravit.hs-stop-otveta { background: var(--tz-pole); border: 1px solid var(--tz-ramka); color: var(--tz-tekst); box-shadow: none; }
html[data-kozha="hrisa"] .hs-plus { color: var(--tz-seryy); }
html[data-kozha="hrisa"] .hs-volna { color: var(--tz-zoloto); }
html[data-kozha="hrisa"] .hs-otmena { color: var(--tz-seryy); }
/* голос: плитки приглушены, кольца дышат (h/hrisa.css:380–381) */
html.h-slushaet[data-kozha="hrisa"] .he-chipy { opacity: .45; }

/* ---------- меню hrisa.ru: «Новый чат» и «Недавние» экрана ---------- */
html[data-kozha="hrisa"] .k-razgovory { display: flex; flex-direction: column; gap: 2px; margin: 4px 0 12px; }
html[data-kozha="hrisa"] .k-razgovory .he-novyy {
  min-height: 48px; border: 0; border-radius: var(--tz-r-knopka); background: var(--tz-zoloto); color: var(--tz-na-zolote);
  font: inherit; font-weight: 600; box-shadow: var(--tz-ten-knopki); justify-content: center; text-align: center;
}
html[data-kozha="hrisa"] .k-razgovory .he-menu-zag { margin: 14px 0 2px; color: var(--tz-seryy); text-transform: none; letter-spacing: 0; font-size: .9375rem; font-weight: 500; }
html[data-kozha="hrisa"] .k-razgovory .he-novyy { display: flex; align-items: center; gap: 10px; }
html[data-kozha="hrisa"] .k-razgovory .he-novyy svg { width: 22px; height: 22px; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }
/* «Недавние разговоры» — до 10 на устройстве гостя (экран хранит 20, hrisa-ekran.js:26) */
html[data-kozha="hrisa"] .k-razgovory .he-nedavnie > li:nth-child(n+11) { display: none; }
html[data-kozha="hrisa"] .k-razgovory .he-nedavnie a,
html[data-kozha="hrisa"] .k-razgovory .he-nedavnie button { min-height: 44px; color: var(--tz-tekst); }
html[data-kozha="hrisa"] .k-razgovory .he-ochistit { min-height: 44px; color: var(--tz-seryy); background: transparent; border: 0; text-align: left; font: inherit; }

@media (min-width: 1000px) {
  html[data-kozha="hrisa"] .h-shapka { padding: 0 24px; }
}
@media (prefers-reduced-motion: reduce) {
  .tz-krylo, html.h-pishet .tz-krylo, html.h-slushaet .tz-krylo { animation: none; transform: none; }
}
