/* Детские правила вне компонентов: лист рисования с его .chip (уйдёт со своей частью); .vh, .ava, .dots —
   их держат компоненты ui.py, переедут в components.css с токенами; .chat — лента чата. Правило уходит
   вместе со своей частью (решение Марии 17, 2026-10-08). */
/* ------------------------------------------------------------------ чат */
.chat{display:flex;flex-direction:column;gap:14px;margin:0 0 24px}
/* Сторона кружка — ступень банка, а не число по месту: то же значение
   уезжает атрибутами width/height в разметку (friendart.АВАТАР), иначе
   место под кадр и сам кадр разной формы, и лента прыгает при загрузке.
   Заодно это чинит тач-зону: было 40 при требуемых 44. */
.ava{flex:0 0 auto;width:var(--размер-аватар);height:var(--размер-аватар);
  border-radius:50%;background:var(--childwash);color:var(--child);display:block}

/* Три точки — не украшение: они и есть ответ на «почему тишина».
   Анимацию выключаем тем, кто просил меньше движения. */
.dots{display:inline-flex;gap:4px;align-items:center}
.dots i{width:5px;height:5px;border-radius:50%;background:var(--child);
  opacity:.35;animation:blink 1.2s infinite}
.dots i:nth-child(2){animation-delay:.2s}
.dots i:nth-child(3){animation-delay:.4s}

/* Быстрый заход. Радиус общий, а не 999: капсула запрещена § 8 прямым
   словом, и у кнопки тот же радиус, что у поверхности. Высота — ступень
   банка: было 37 px при требуемых 44, то есть мимо пальца. */
.chip{font-family:var(--body);font-size:15px;font-weight:400;
  background:var(--childwash);color:var(--child);border:1px solid var(--child);
  border-radius:var(--радиус-общий);min-height:var(--размер-кнопка);
  padding:8px 15px;cursor:pointer;align-self:flex-start}

.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);
  white-space:nowrap}

/* ============================================ лист «Рисование» (DK-218) */
.risovanie{margin-top:var(--шаг-тесно);padding:var(--шаг-поле);background:var(--card);border:var(--линия-тонкая) solid var(--line);border-radius:var(--радиус-общий)}
.ris-shapka{display:flex;justify-content:space-between;align-items:center;gap:var(--шаг-тесно)}
.ris-razdely,.ris-shablony,.ris-vkladki,.ris-klavishi,.ris-upravlenie{display:flex;flex-wrap:wrap;gap:var(--шаг-нить);margin-top:var(--шаг-тесно)}
.ris-shablon{padding:var(--шаг-нить);background:var(--plate);border:var(--линия-тонкая) solid var(--line);border-radius:var(--радиус-общий);cursor:pointer}
.ris-shablon img{display:block;height:var(--размер-кнопка);width:auto}
.ris-list{margin-top:var(--шаг-тесно);min-height:var(--размер-полка);padding:var(--шаг-поле);background:var(--paper);border-radius:var(--радиус-общий);font-size:var(--кегль-подзаголовок);overflow-x:auto;white-space:nowrap}
.ris-ryad{display:inline-flex;align-items:center;min-height:1.2em}
.ris-kletka{min-width:.9em;border:var(--линия-тонкая) dashed var(--поле)}
.ris-kursor{display:inline-block;width:0;height:1.2em;border-left:var(--линия-метка) solid var(--поле)}
.ris-drob{display:inline-flex;flex-direction:column;align-items:center;vertical-align:middle;margin:0 var(--шаг-волос)}
.ris-chisl{padding:0 var(--шаг-волос);border-bottom:var(--линия-тонкая) solid var(--поле)}
.ris-znam{padding:0 var(--шаг-волос)}
.ris-gruppa{display:inline-flex;align-items:center}
.ris-step{align-self:flex-start;font-size:.7em}
.ris-pod{border-top:var(--линия-тонкая) solid var(--поле)}
.ris-oshibka{min-height:1.2em;margin:var(--шаг-нить) 0 0;color:var(--muted)}
.ris-klavisha{min-width:var(--размер-кнопка);min-height:var(--размер-кнопка);background:var(--plate);border:var(--линия-тонкая) solid var(--line);border-radius:var(--радиус-общий);color:var(--ink);font:inherit}
.ris-vkladki .chip[aria-pressed="true"]{background:var(--child);color:var(--кн-текст)}
@keyframes blink{0%,60%,100%{opacity:.25}30%{opacity:1}}
