/* © 2026 VEYRO (ИП Макаров И. В.). appagent — проприетарная программа. Использование — по лицензионному договору https://appagent.ru/legal/offer/. Копирование и распространение без разрешения запрещены. */
/* Окно «Новый ролик» (rn-*): тема с проверкой, пример (из профиля, ссылка, файл), «что взять», оценка разбора до запуска.
   Графитовая тема: поля и плашки без рамок, объём — мягкое свечение (--shadow-ring, --shadow-sm). Значения — только из tokens.css, размеры в rem.
   Окно — .ui-dialog--task (kit.css); на 390px без горизонтальной прокрутки, касания не меньше --size-touch-min. */

.rn { display: grid; gap: var(--space-5); align-content: start; width: 100%; min-width: 0; max-width: 100%; box-sizing: border-box; color: var(--color-ink); }
.rn > * { min-width: 0; max-width: 100%; }
.rn p, .rn ul, .rn h3, .rn fieldset { margin: 0; overflow-wrap: anywhere; }
.rn [hidden] { display: none; }
.rn-intro { color: var(--color-ink2); font: var(--text-ui-weight) var(--text-ui-size)/var(--text-ui-line) var(--font-sans); }

.rn-field { display: grid; gap: var(--space-2); min-width: 0; }
.rn-label { padding: 0; color: var(--color-ink); font: var(--weight-medium) var(--text-caption-size)/var(--text-caption-line) var(--font-sans); }
.rn-hint, .rn-note { color: var(--color-ink2); font: var(--text-caption-weight) var(--text-caption-size)/var(--text-caption-line) var(--font-sans); }
.rn-input {
  width: 100%; min-width: 0; min-height: var(--size-touch-min); padding: var(--space-3) var(--space-4); box-sizing: border-box;
  background: var(--color-panel); color: var(--color-ink); border: 0; border-radius: var(--radius-ctl); box-shadow: var(--shadow-ring);
  font: var(--weight-regular) var(--text-ui-size)/var(--text-ui-line) var(--font-sans);
}
.rn-input::placeholder { color: var(--color-ink3); }
.rn-input:focus-visible { outline: var(--size-focus-width) solid var(--color-focus); outline-offset: var(--size-focus-offset); }
.rn-input:disabled { opacity: .6; cursor: not-allowed; }
.rn-file { padding-block: var(--space-2); }

/* Проверка темы и сообщения */
.rn-check, .rn-msg, .rn-note[data-tone] { padding: var(--space-3) var(--space-4); border-radius: var(--radius-ctl); background: var(--color-panel2); font: var(--text-ui-weight) var(--text-ui-size)/var(--text-ui-line) var(--font-sans); }
.rn-check[data-tone="ok"], .rn-msg[data-tone="ok"], .rn-note[data-tone="ok"] { color: var(--color-ok-text); background: var(--color-ok-soft); }
.rn-check[data-tone="warn"], .rn-msg[data-tone="warn"] { color: var(--color-warn-text); background: var(--color-warn-soft); }
.rn-check[data-tone="muted"], .rn-msg[data-tone="muted"], .rn-note[data-tone="muted"] { color: var(--color-ink2); }
.rn-msg[data-tone="danger"], .rn-note[data-tone="danger"] { color: var(--color-danger-text); background: var(--color-danger-soft); }

/* Что взять из примера */
.rn-take { display: grid; gap: var(--space-2); min-width: 0; padding: 0; border: 0; }
.rn-take__row { display: flex; flex-wrap: wrap; gap: var(--space-2); min-width: 0; }
.rn-take__i {
  display: inline-flex; align-items: center; gap: var(--space-2); min-height: var(--size-touch-min); padding-inline: var(--space-4); box-sizing: border-box;
  border-radius: var(--radius-pill); background: var(--color-panel); box-shadow: var(--shadow-ring); color: var(--color-ink); cursor: pointer;
  font: var(--text-ui-weight) var(--text-ui-size)/var(--text-ui-line) var(--font-sans);
}
.rn-take__i:has(:checked) { background: var(--color-panel2); box-shadow: 0 0 0.5rem var(--color-acc-glow); }
.rn-take__i:has(:focus-visible) { outline: var(--size-focus-width) solid var(--color-focus); outline-offset: var(--size-focus-offset); }
.rn-check__cb { width: 1.125rem; height: 1.125rem; margin: 0; accent-color: var(--color-acc); }

/* Оценка разбора */
.rn-est { display: grid; gap: var(--space-2); padding: var(--space-4); border-radius: var(--radius-card); background: var(--color-panel); box-shadow: var(--shadow-sm); }
.rn-est__h { color: var(--color-ink); font: var(--text-h3-weight) var(--text-h3-size)/var(--text-h3-line) var(--font-head); letter-spacing: var(--text-h3-track); }
.rn-est__list { display: grid; gap: var(--space-1); padding-left: var(--space-5); color: var(--color-ink2); font: var(--text-ui-weight) var(--text-ui-size)/var(--text-ui-line) var(--font-sans); font-variant-numeric: tabular-nums; }
.rn-est__total { color: var(--color-ink); font: var(--weight-medium) var(--text-ui-size)/var(--text-ui-line) var(--font-sans); font-variant-numeric: tabular-nums; }

.ui-dialog--task .ui-dialog__a .btn { min-height: var(--size-touch-min); }
.ui-dialog--task .ui-dialog__a .btn[disabled] { cursor: not-allowed; opacity: .6; }

@media (max-width: 30rem) {
  .rn-take__i { flex: 1 1 100%; }
}

/* Выбор голоса озвучки (rvo-*, modules-reels-voice.js): окно «Новый ролик», настройки проекта, переозвучка. Те же токены, касания не меньше --size-touch-min. */
.rvo { display: grid; gap: var(--space-3); width: 100%; min-width: 0; max-width: 100%; box-sizing: border-box; color: var(--color-ink); }
.rvo > * { min-width: 0; max-width: 100%; }
.rvo p, .rvo ul, .rvo fieldset { margin: 0; overflow-wrap: anywhere; }
.rvo [hidden] { display: none; }
.rvo-set { display: grid; gap: var(--space-2); min-width: 0; padding: 0; border: 0; }
.rvo-legend { padding: 0; margin-bottom: var(--space-2); color: var(--color-ink); font: var(--weight-medium) var(--text-caption-size)/var(--text-caption-line) var(--font-sans); }
.rvo-ul { display: grid; gap: var(--space-2); padding: 0; list-style: none; max-height: 22rem; overflow-y: auto; overscroll-behavior: contain; }
.rvo-item {
  display: flex; align-items: center; gap: var(--space-2); min-width: 0; padding-right: var(--space-2); box-sizing: border-box;
  border-radius: var(--radius-card); background: var(--color-panel); box-shadow: var(--shadow-ring);
}
.rvo-item[data-selected="true"] { background: var(--color-panel2); box-shadow: 0 0 0.5rem var(--color-acc-glow); }
.rvo-item:has(:focus-visible) { outline: var(--size-focus-width) solid var(--color-focus); outline-offset: var(--size-focus-offset); }
.rvo-opt { display: flex; flex: 1 1 auto; align-items: center; gap: var(--space-3); min-width: 0; min-height: var(--size-touch-min); padding: var(--space-2) var(--space-4); box-sizing: border-box; cursor: pointer; }
.rvo-radio { flex: none; width: 1.125rem; height: 1.125rem; margin: 0; accent-color: var(--color-acc); }
.rvo-opt__t { display: grid; gap: var(--space-1); min-width: 0; }
.rvo-name { color: var(--color-ink); font: var(--weight-medium) var(--text-ui-size)/var(--text-ui-line) var(--font-sans); }
.rvo-desc { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); min-width: 0; color: var(--color-ink2); font: var(--text-caption-weight) var(--text-caption-size)/var(--text-caption-line) var(--font-sans); }
.rvo-gender { padding: 0 var(--space-2); border-radius: var(--radius-pill); background: var(--color-panel2); color: var(--color-ink2); }
.rvo-badge { padding: 0 var(--space-2); border-radius: var(--radius-pill); background: var(--color-acc-soft); color: var(--color-acc-soft-text); }
.rvo-listen { flex: none; min-height: var(--size-touch-min); }
.rvo-listen[data-state="playing"] { background: var(--color-acc-soft); color: var(--color-acc-soft-text); }
.rvo-state { padding: var(--space-3) var(--space-4); border-radius: var(--radius-ctl); background: var(--color-panel2); color: var(--color-ink2); font: var(--text-ui-weight) var(--text-ui-size)/var(--text-ui-line) var(--font-sans); }
.rvo-state--danger { color: var(--color-danger-text); background: var(--color-danger-soft); display: grid; gap: var(--space-2); justify-items: start; }
.rvo-note, .rvo-msg { padding: var(--space-3) var(--space-4); border-radius: var(--radius-ctl); background: var(--color-panel2); font: var(--text-ui-weight) var(--text-ui-size)/var(--text-ui-line) var(--font-sans); }
.rvo-note[data-tone="ok"], .rvo-msg[data-tone="ok"], .rvo-key__msg[data-tone="ok"] { color: var(--color-ok-text); background: var(--color-ok-soft); }
.rvo-note[data-tone="warn"], .rvo-msg[data-tone="warn"], .rvo-key__msg[data-tone="warn"] { color: var(--color-warn-text); background: var(--color-warn-soft); }
.rvo-note[data-tone="danger"], .rvo-msg[data-tone="danger"], .rvo-key__msg[data-tone="danger"] { color: var(--color-danger-text); background: var(--color-danger-soft); }
.rvo-msg { margin: 0; }

/* Нет ключа Yandex */
.rvo-nokey { display: grid; gap: var(--space-3); justify-items: start; padding: var(--space-4); border-radius: var(--radius-card); background: var(--color-warn-soft); color: var(--color-warn-text); }
.rvo-nokey__t { font: var(--text-ui-weight) var(--text-ui-size)/var(--text-ui-line) var(--font-sans); }
.rvo-key__add, .rvo-key__save { min-height: var(--size-touch-min); }
.rvo-key__form { display: grid; gap: var(--space-2); width: 100%; min-width: 0; color: var(--color-ink); }
.rvo-label { color: var(--color-ink); font: var(--weight-medium) var(--text-caption-size)/var(--text-caption-line) var(--font-sans); }
.rvo-hint { color: var(--color-ink2); font: var(--text-caption-weight) var(--text-caption-size)/var(--text-caption-line) var(--font-sans); }
.rvo-key__row { display: flex; flex-wrap: wrap; gap: var(--space-2); min-width: 0; }
.rvo-key__input {
  flex: 1 1 12rem; min-width: 0; min-height: var(--size-touch-min); padding: var(--space-3) var(--space-4); box-sizing: border-box;
  background: var(--color-panel); color: var(--color-ink); border: 0; border-radius: var(--radius-ctl); box-shadow: var(--shadow-ring);
  font: var(--weight-regular) var(--text-ui-size)/var(--text-ui-line) var(--font-sans);
}
.rvo-key__input:focus-visible { outline: var(--size-focus-width) solid var(--color-focus); outline-offset: var(--size-focus-offset); }
.rvo-key__msg { margin: 0; padding: var(--space-2) var(--space-3); border-radius: var(--radius-ctl); background: var(--color-panel2); font: var(--text-ui-weight) var(--text-ui-size)/var(--text-ui-line) var(--font-sans); }

/* Окно переозвучки, группа в настройках проекта, строки на карточке и в панели */
.rvo-dlg { display: grid; gap: var(--space-4); min-width: 0; }
.rvo-intro { margin: 0; color: var(--color-ink2); font: var(--text-ui-weight) var(--text-ui-size)/var(--text-ui-line) var(--font-sans); }
.rps-voice__body { margin-top: var(--space-3); }
.rps-voice__intro { margin: var(--space-2) 0 0; }
.rps-voice__acts { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3); margin-top: var(--space-4); }
.rps-voice__save { min-height: var(--size-touch-min); }
.rb-revoice, .rv-revoice { justify-self: start; }
.rv-revoice[disabled] { cursor: not-allowed; opacity: .6; }
.rps-voice .rvo-ul { max-height: none; }

@media (max-width: 30rem) {
  .rvo-opt { padding-inline: var(--space-3); gap: var(--space-2); }
  .rvo-listen { padding-inline: var(--space-3); }
  .rvo-ul { max-height: 24rem; }
}
