/* {AI}-шница UI — общее для всех страниц: плавающий переключатель тем, шрифт заголовков, кнопка генерации, шар.
   Цвета каждой страницы переопределяются в её собственном блоке «Темы {AI}-шница UI».
   Темы: white / black — новые; light / violet — нынешние светлая и тёмная, их цвета здесь не трогаем. */

:root[data-style="white"] {
  --ys-ground: #ECECF3; --ys-surface: #FFFFFF; --ys-raised: #FFFFFF; --ys-sunken: #F2F2F6; --ys-hover: #E9E9F0;
  --ys-line: rgba(18,20,32,.10); --ys-line-strong: rgba(18,20,32,.20);
  --ys-ink: #0F1016; --ys-ink-2: #4B4D59; --ys-ink-3: #646673;
  --ys-sel: #0F1016; --ys-on-sel: #FFFFFF;
  --ys-cta-hi: #FFC24A; --ys-cta: #FF8A2B; --ys-cta-lo: #F2668B; --ys-on-cta: #FFFFFF; --ys-glow: rgba(255,138,43,.35);
  --ys-shadow-sm: 0 1px 2px rgba(18,20,32,.06), 0 2px 8px -2px rgba(18,20,32,.08);
  --ys-shadow-md: 0 1px 2px rgba(18,20,32,.06), 0 12px 32px -14px rgba(18,20,32,.18);
  --ys-shadow-lg: 0 2px 6px rgba(18,20,32,.05), 0 28px 64px -24px rgba(18,20,32,.28);
  --ys-shadow-glow: 0 10px 28px -10px rgba(255,138,43,.55);
}
:root[data-style="black"] {
  --ys-ground: #131415; --ys-surface: #18191C; --ys-raised: #202125; --ys-sunken: #0F1012; --ys-hover: #27282D;
  --ys-line: rgba(255,255,255,.08); --ys-line-strong: rgba(255,255,255,.18);
  --ys-ink: #F3F4F6; --ys-ink-2: #A8ABB2; --ys-ink-3: #8E9199;
  --ys-sel: #F3F4F6; --ys-on-sel: #0F1016;
  --ys-cta-hi: #EEF784; --ys-cta: #DCEB4A; --ys-cta-lo: #FF9F45; --ys-on-cta: #11130A; --ys-glow: rgba(220,235,74,.30);
  --ys-shadow-sm: inset 0 1px 0 rgba(255,255,255,.05), 0 2px 8px -2px rgba(0,0,0,.6);
  --ys-shadow-md: inset 0 1px 0 rgba(255,255,255,.06), 0 18px 40px -18px rgba(0,0,0,.9);
  --ys-shadow-lg: inset 0 1px 0 rgba(255,255,255,.08), 0 0 0 1px rgba(255,255,255,.04), 0 32px 80px -24px #000;
  --ys-shadow-glow: 0 0 0 1px rgba(220,235,74,.2), 0 12px 32px -10px rgba(246,168,64,.42);
}
/* ── Кружки тем ────────────────────────────────────────────────── */
.aish-style__dot { width: 20px; height: 20px; border-radius: 50%; flex: none; box-shadow: inset 0 0 0 1px rgba(127,127,140,.35); }
.aish-style__dot--white { background: radial-gradient(circle at 35% 30%, #fff 0 28%, #f0f1f6 55%, #d8dbe8 100%); box-shadow: inset 0 0 0 1.5px rgba(18,20,32,.28), 0 0 0 1px rgba(18,20,32,.06), 0 1px 3px rgba(18,20,32,.18); }
.aish-style__dot--black { background: radial-gradient(circle at 35% 30%, #3a3d36 0 15%, #131415 65%); box-shadow: inset 0 0 0 1px rgba(255,255,255,.22), inset -3px -3px 6px rgba(220,235,74,.3), inset 3px 3px 6px rgba(255,159,69,.22); }
.aish-style__dot--violet { background: radial-gradient(circle at 35% 30%, #7a55ff 0 20%, #2e264e 70%, #15122a 100%); }
.aish-style__dot--light { background: radial-gradient(circle at 35% 30%, #ffffff 0 22%, #e4dcfa 55%, #c9bdf0 100%); box-shadow: inset 0 0 0 1.5px rgba(75,43,184,.28), 0 0 0 1px rgba(75,43,184,.08), 0 1px 3px rgba(75,43,184,.18); }

/* ── Плавающий переключатель: один кружок, перетаскивается ─────── */
.aish-fab { all: unset; box-sizing: border-box; position: fixed; z-index: 2147483000; left: calc(100vw - 56px); top: 50vh; width: 48px; height: 48px; border-radius: 50%; display: flex; align-items: center; justify-content: center; cursor: grab; touch-action: none; user-select: none; -webkit-user-select: none; -webkit-tap-highlight-color: transparent;
  background: #FFFFFF; box-shadow: inset 0 0 0 1.5px rgba(18,20,32,.16), 0 2px 8px rgba(18,20,32,.12), 0 16px 36px -10px rgba(18,20,32,.45); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); transition: transform .15s ease, box-shadow .15s ease; }
:root:is([data-style="black"], [data-style="violet"]) .aish-fab { background: rgba(32,33,37,.94); box-shadow: inset 0 1px 0 rgba(255,255,255,.12), inset 0 0 0 1.5px rgba(255,255,255,.22), 0 4px 14px rgba(0,0,0,.45), 0 18px 40px -12px #000; }
:root[data-style="violet"] .aish-fab { background: rgba(46,38,78,.96); }
:root[data-style="light"] .aish-fab { background: #FFFFFF; box-shadow: inset 0 0 0 1.5px rgba(75,43,184,.22), 0 2px 10px rgba(75,43,184,.14), 0 16px 36px -10px rgba(75,43,184,.4); }
.aish-fab:hover { transform: scale(1.06); }
.aish-fab.is-drag { cursor: grabbing; transform: scale(1.12); transition: none; }
.aish-fab:focus-visible { outline: 2px solid var(--ys-ink, #fff); outline-offset: 3px; }
.aish-fab__dot { width: 28px; height: 28px; border-radius: 50%; pointer-events: none; box-sizing: border-box; }
.aish-fab__dot.aish-style__dot--white { box-shadow: inset 0 0 0 1.5px rgba(18,20,32,.32), 0 0 0 1px rgba(18,20,32,.08), 0 2px 5px rgba(18,20,32,.2); }
.aish-fab__dot.aish-style__dot--light { box-shadow: inset 0 0 0 1.5px rgba(75,43,184,.32), 0 0 0 1px rgba(75,43,184,.1), 0 2px 5px rgba(75,43,184,.2); }
/* в шапке панели — на месте старой луны/солнца, без перетаскивания */
.aish-fab.is-docked { position: relative; left: auto !important; top: auto !important; z-index: 5; flex: 0 0 auto; width: 44px; height: 44px; border-radius: 14px; cursor: pointer; touch-action: manipulation;
  background: var(--soft, rgba(255,255,255,.6)); box-shadow: inset 0 0 0 1px var(--glass-brd, rgba(80,60,160,.12)); backdrop-filter: none; -webkit-backdrop-filter: none; }
.aish-fab.is-docked:hover { transform: none; background: var(--soft-hover, rgba(255,255,255,.95)); }
:root[data-style="white"] .aish-fab.is-docked { background: #F2F2F6; box-shadow: inset 0 0 0 1px rgba(18,20,32,.12); }
:root[data-style="light"] .aish-fab.is-docked { background: rgba(255,255,255,.85); box-shadow: inset 0 0 0 1px rgba(80,60,160,.14); }
:root:is([data-style="black"], [data-style="violet"]) .aish-fab.is-docked { background: rgba(255,255,255,.08); box-shadow: inset 0 0 0 1px rgba(255,255,255,.14); }
.aish-fab.is-docked.is-compact { width: 40px; height: 40px; border-radius: 12px; }
.aish-fab.is-docked .aish-fab__dot { width: 22px; height: 22px; }
.aish-fab.is-docked.is-compact .aish-fab__dot { width: 20px; height: 20px; }
/* на главной у «Войти»: квадрат как кнопка «Войти», кружок внутри — цвет темы */
.aish-fab.is-header { position: relative; left: auto !important; top: auto !important; z-index: 6; flex: 0 0 auto; width: 40px; height: 40px; margin-left: 2px; border-radius: 14px; cursor: pointer; touch-action: manipulation; backdrop-filter: none; -webkit-backdrop-filter: none; }
.aish-fab.is-header:hover { transform: none; }
.aish-fab.is-header > .aish-fab__dot { width: 22px; height: 22px; border-radius: 50%; box-shadow: none; }
:root[data-style="white"] .aish-fab.is-header { background: #0F1016; box-shadow: 0 2px 8px rgba(18,20,32,.18); }
:root[data-style="white"] .aish-fab.is-header > .aish-fab__dot { background: #FFFFFF; }
:root[data-style="black"] .aish-fab.is-header { background: #F3F4F6; box-shadow: 0 2px 8px rgba(0,0,0,.35); }
:root[data-style="black"] .aish-fab.is-header > .aish-fab__dot { background: #131415; }
:root[data-style="light"] .aish-fab.is-header { background: #1B0D3A; box-shadow: 0 2px 8px rgba(27,13,58,.28); }
:root[data-style="light"] .aish-fab.is-header > .aish-fab__dot { background: #E6DEF8; }
:root[data-style="violet"] .aish-fab.is-header { background: #F3EFFF; box-shadow: 0 2px 8px rgba(0,0,0,.35); }
:root[data-style="violet"] .aish-fab.is-header > .aish-fab__dot { background: #15122A; }
.aish-fab__menu { position: fixed; z-index: 2147483001; min-width: 220px; padding: 6px; border-radius: 18px; display: flex; flex-direction: column; gap: 2px; font: 500 14px/1 'Onest', system-ui, sans-serif;
  color: var(--ys-ink, #F6F3FF); background: var(--ys-raised, rgba(46,38,78,.96)); box-shadow: inset 0 0 0 1px var(--ys-line, rgba(255,255,255,.14)), var(--ys-shadow-lg, 0 30px 70px -24px rgba(0,0,0,.75)); }
.aish-fab__menu[hidden] { display: none; }
:root[data-style="light"] .aish-fab__menu { color: #1E1238; background: rgba(255,255,255,.97); box-shadow: inset 0 0 0 1px rgba(80,60,160,.10), 0 30px 70px -24px rgba(75,43,184,.4); }
:root[data-style="light"] .aish-fab__opt:hover { background: rgba(80,60,160,.07); }
:root[data-style="violet"] .aish-fab__menu { color: #F6F3FF; background: rgba(46,38,78,.97); box-shadow: inset 0 1px 0 rgba(255,255,255,.12), inset 0 0 0 1px rgba(255,255,255,.14), 0 30px 70px -24px rgba(0,0,0,.8); }
.aish-fab__opt { all: unset; box-sizing: border-box; cursor: pointer; display: flex; align-items: center; gap: 12px; height: 42px; padding: 0 12px 0 8px; border-radius: 12px; color: inherit; }
.aish-fab__opt:hover { background: var(--ys-hover, rgba(255,255,255,.1)); }
:root[data-style="violet"] .aish-fab__opt:hover { background: rgba(255,255,255,.1); }
.aish-fab__opt:focus-visible { outline: 2px solid currentColor; outline-offset: -2px; }
.aish-fab__opt.is-on { font-weight: 700; }
.aish-fab__check { margin-left: auto; opacity: 0; font-weight: 700; }
.aish-fab__opt.is-on .aish-fab__check { opacity: 1; }
@media (prefers-reduced-motion: reduce) { .aish-fab { transition: none; } }

/* Под ответом текстовой модели: скопировать, нравится, не нравится */
.reply-tools { display: flex; align-items: center; gap: 2px; margin-top: 2px; }
.reply-tools button { all: unset; box-sizing: border-box; width: 32px; height: 32px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; color: var(--muted, #8d879c); cursor: pointer; }
.reply-tools button:hover { background: var(--field, rgba(255,255,255,.06)); color: var(--ink, #fff); }
.reply-tools button:disabled { opacity: .45; cursor: default; }
.reply-tools button.is-on { background: rgba(255,255,255,.18); color: #fff; }
.t-light .reply-tools button.is-on { background: rgba(15,16,22,.12); color: #111318; }
.reply-tools button:focus-visible { outline: 2px solid currentColor; outline-offset: 1px; }
.reply-tools svg { display: block; }
.reply-tools .is-check { display: none; }
.reply-tools button.is-copied .is-copy { display: none; }
.reply-tools button.is-copied .is-check { display: block; }
.reply-tools .reply-ico--down { display: inline-flex; transform: rotate(180deg); }
.msg-bot__body { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; flex: 1; min-width: 0; width: 100%; }
.reply-make { display: flex; flex-wrap: wrap; gap: 8px; }
.reply-make button { all: unset; box-sizing: border-box; cursor: pointer; font: 500 14px/1 Onest, system-ui, sans-serif; padding: 9px 16px; border-radius: 999px; border: 1.5px solid var(--field-brd, rgba(80,60,160,.15)); background: var(--glass, #fff); color: var(--ink, #1E1238); }
.reply-make button:hover { border-color: var(--accent-ink, #4B2BB8); }
.reply-make button.is-primary { border: none; font-weight: 700; color: var(--ys-on-cta, #fff); background: var(--aich-grad, linear-gradient(90deg, #FF9A3D, #F0602A)); box-shadow: var(--ys-shadow-glow, 0 4px 14px rgba(240,96,42,.35)); }
.prompt-window { display: block; width: 100%; box-sizing: border-box; min-height: 140px; max-height: 180px; border: 1px solid var(--field-brd, rgba(255,255,255,.14)); border-radius: 14px; background: var(--field, rgba(255,255,255,.04)); color: var(--ink, #fff); font: 15px/1.5 Onest, system-ui, sans-serif; padding: 10px 12px; resize: vertical; overflow: auto; }
.prompt-window.is-open { max-height: none; overflow: hidden; }
.prompt-box { position: relative; }
.prompt-box > .prompt-window { padding-bottom: 46px; resize: none; }
.prompt-box > .prompt-expand { position: absolute; right: 8px; bottom: 8px; z-index: 1; }
.prompt-expand { align-self: flex-start; display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; padding: 0; border: 0; border-radius: 12px; background: var(--seg-bg, rgba(80,60,160,.08)); color: inherit; cursor: pointer; }
.prompt-extend { display: flex; gap: 6px; align-items: center; }
.prompt-extend[hidden] { display: none; }
.prompt-extend input { flex: 1; min-width: 0; height: 34px; box-sizing: border-box; border-radius: 12px; border: 1px solid var(--field-brd, rgba(255,255,255,.14)); background: var(--field, rgba(255,255,255,.04)); color: var(--ink, #fff); font: 14px/1 Onest, system-ui, sans-serif; padding: 0 10px; }
.prompt-extend button { all: unset; box-sizing: border-box; cursor: pointer; height: 34px; padding: 0 12px; border-radius: 999px; border: 1px solid var(--field-brd, rgba(255,255,255,.14)); background: var(--field, rgba(255,255,255,.04)); color: var(--ink, #fff); font: 700 12px/1 Onest, system-ui, sans-serif; }
.prompt-card { border: 1px solid var(--field-brd, rgba(255,255,255,.14)); border-radius: 14px; padding: 10px 12px; background: var(--field, rgba(255,255,255,.04)); display: flex; flex-direction: column; gap: 8px; }
.prompt-card__text { margin: 0; white-space: pre-wrap; font: 14px/1.45 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; color: var(--ink, #fff); }
.prompt-card__row { display: flex; flex-wrap: wrap; gap: 6px; }
.prompt-card__row button { all: unset; box-sizing: border-box; cursor: pointer; height: 30px; padding: 0 10px; border-radius: 999px; background: var(--seg-bg, rgba(255,255,255,.08)); color: var(--ink, #fff); font: 700 12px/1 Onest, system-ui, sans-serif; }

/* ── Шрифт: Days One — заголовки и подписи-«лица» ─────────────── */
:root[data-style] :is(h1, h2, .aich-model__title, .sb-frame__title, .reel-char__name) { font-family: 'Days One', 'Onest', system-ui, sans-serif; font-weight: 400; letter-spacing: .005em; }

/* ── Помощник (assistant-ui.css): градиенты кита ───────────────── */
:root:is([data-style="white"], [data-style="black"]) {
  --aich-grad: linear-gradient(100deg, var(--ys-cta-hi), var(--ys-cta) 55%, var(--ys-cta-lo));
}
:root:is([data-style="white"], [data-style="black"]) :is(.aich-chip--primary, .reel-choice__go) { background: var(--aich-grad); color: var(--ys-on-cta); border-color: transparent; box-shadow: var(--ys-shadow-glow); }
:root:is([data-style="white"], [data-style="black"]) :is(.aich-variant__n, .reel-opt.is-on .reel-opt__n, .sb-num) { background: var(--ys-sel); color: var(--ys-on-sel); }
:root:is([data-style="white"], [data-style="black"]) .reel-steps__bar i.is-current { background: var(--aich-grad); }
:root:is([data-style="white"], [data-style="black"]) .aich-opt.is-on { background: var(--ys-sel); color: var(--ys-on-sel); border-color: var(--ys-sel); }
:root:is([data-style="white"], [data-style="black"]) :is(.aich-bubble, .sb-frame, .sb-settings, .reel-choice, .reel-frame, .reel-card, .aich-chip) { box-shadow: var(--ys-shadow-sm); }
