/* ════════════════════════════════════════════════════════════════════
   ДВИЖОК СЦЕН AiDocMaker — ЕДИНЫЙ ИСТОЧНИК СТИЛЯ ДЛЯ ВСЕХ «МУЛЬТИКОВ».
   Меняешь токены в .dm-scene ниже — меняется во ВСЕХ роликах разом (SSOT).
   Разметку и проигрывание делает js/scene-engine.js; сцены = данные в
   js/scenes-data.js. Здесь только внешний вид.
   ════════════════════════════════════════════════════════════════════ */

.dm-scene{
  --accent:#A04E33; --accent-2:#C26B4C; --accent-soft:#FBF1EC; --accent-line:#ECC7B5;
  --paper:#F7F4EE; --sand:#F0EBDF; --line:#E7E1D6;
  --ink:#1C1B19; --graphite:#4A463E; --muted:#847E72;
  --docbg:#FFFFFF; --docline:#E7E1D6; --skeleton:#ECE8DF;
  --frame-bg:#FBFAF6; --shadow:rgba(40,30,20,.14);
  --ok:#3F7D53; --ok-soft:#EAF3EC; --warn:#B8792B; --warn-soft:#FBF2E3; --drop:#A79E8E;
  --scene-dur:1;                 /* глобальный множитель скорости: 0.8=быстрее, 1.3=медленнее */
  width:100%; color:var(--ink);
  font-family:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .dm-scene{
  --paper:#1A1815; --sand:#221F1B; --line:#332E28;
  --ink:#F4F1EA; --graphite:#D8D1C4; --muted:#A8A294;
  --accent:#C26B4C; --accent-2:#D08767; --accent-soft:#2A211C; --accent-line:#5A3D2E;
  --docbg:#F7F4EE; --docline:#DBD3C4; --skeleton:#E4DDCE;
  --frame-bg:#221F1B; --shadow:rgba(0,0,0,.5);
  --ok:#6FA980; --ok-soft:#20261F; --warn:#D0A25A; --warn-soft:#2A2318; --drop:#6E6A60;
}}
:root[data-theme="dark"] .dm-scene{
  --paper:#1A1815; --sand:#221F1B; --line:#332E28;
  --ink:#F4F1EA; --graphite:#D8D1C4; --muted:#A8A294;
  --accent:#C26B4C; --accent-2:#D08767; --accent-soft:#2A211C; --accent-line:#5A3D2E;
  --docbg:#F7F4EE; --docline:#DBD3C4; --skeleton:#E4DDCE;
  --frame-bg:#221F1B; --shadow:rgba(0,0,0,.5);
  --ok:#6FA980; --ok-soft:#20261F; --warn:#D0A25A; --warn-soft:#2A2318; --drop:#6E6A60;
}

.dm-scene *{box-sizing:border-box}

/* ---------- Рамка сцены ---------- */
.dm-scene .frame{position:relative;background:var(--frame-bg);border:1px solid var(--line);border-radius:24px;
  padding:18px 20px 22px;box-shadow:0 1px 0 rgba(255,255,255,.4) inset,0 30px 60px -30px var(--shadow);}
.dm-scene .basehdr{display:flex;align-items:center;justify-content:space-between;margin:0 2px 10px;gap:8px;}
.dm-scene .basehdr .hleft{display:flex;align-items:baseline;gap:9px;min-width:0;}
.dm-scene .basehdr .lbl{font-size:11px;font-weight:600;color:var(--muted);letter-spacing:.03em;}
/* мягкий индикатор масштаба базы — растёт по ходу, читается «база большая» */
.dm-scene .scanned{font-size:10px;font-weight:500;color:var(--muted);white-space:nowrap;font-variant-numeric:tabular-nums;}
.dm-scene .scanned b{font-weight:700;color:var(--graphite);}
.dm-scene .counters{display:flex;gap:10px;font-size:10.5px;font-weight:600;font-variant-numeric:tabular-nums;}
.dm-scene .counters .c{display:flex;align-items:center;gap:4px;color:var(--muted);transition:color .3s;}
.dm-scene .counters .c.on-ok{color:var(--ok);}.dm-scene .counters .c.on-miss{color:var(--drop);}
.dm-scene .counters .c svg{width:12px;height:12px;}

/* ---------- Лента документов клиента (непрерывный поток) ---------- */
.dm-scene .lineup{position:relative;min-height:96px;overflow:hidden;padding:2px;}
.dm-scene .track{display:flex;gap:9px;align-items:stretch;will-change:transform;}
/* фокус-узел: колонка, в которой бот берёт документ в обработку */
.dm-scene .lineup .focus{position:absolute;top:0;bottom:0;width:132px;transform:translateX(-50%);
  pointer-events:none;z-index:5;}
.dm-scene .lineup .focus::before,.dm-scene .lineup .focus::after{content:'';position:absolute;left:9px;right:9px;
  height:2px;border-radius:2px;background:var(--accent);opacity:.5;}
.dm-scene .lineup .focus::before{top:1px;}.dm-scene .lineup .focus::after{bottom:1px;}
.dm-scene .card{flex:0 0 128px;width:128px;background:var(--docbg);border:1px solid var(--docline);border-radius:11px;
  padding:9px 9px 10px;position:relative;box-shadow:0 6px 15px -12px var(--shadow);will-change:transform,opacity;}
/* проходные филлеры — приглушены, бот их проматывает мимо */
.dm-scene .card.filler{opacity:.5;filter:grayscale(.35);}
.dm-scene .card .cap{display:flex;align-items:center;gap:5px;margin-bottom:8px;}
.dm-scene .card .cap .fmt{font-size:6.5px;font-weight:800;letter-spacing:.02em;padding:2px 3px;border-radius:3px;line-height:1;flex:none;}
.dm-scene .card .cap span.nm{font-size:8px;color:var(--muted);font-weight:600;line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.dm-scene .fmt-pdf{color:#C0392B;background:#FBEAE8}.dm-scene .fmt-xlsx{color:#1E7A46;background:#E7F3EB}
.dm-scene .fmt-docx{color:#2B5CB8;background:#E8EEF9}.dm-scene .fmt-audio{color:#7A3FA0;background:#F1E9F6}.dm-scene .fmt-jpg{color:#B87A2B;background:#FBF2E3}
.dm-scene .sk{height:4.5px;border-radius:3px;background:var(--skeleton);margin:5px 0;}
.dm-scene .sk.s2{width:80%}.dm-scene .sk.s3{width:60%}
.dm-scene .grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;margin:5px 0;}
.dm-scene .grid b{height:6px;background:var(--skeleton);border-radius:1.5px;}
.dm-scene .grid b.h{background:var(--accent-line);}
/* аудио: иконка ▶ + симметричный waveform вокруг центральной линии + бегущая позиция */
.dm-scene .wave{position:relative;display:flex;align-items:center;gap:4px;height:20px;margin:5px 0;}
.dm-scene .wave .wico{flex:none;display:flex;}
.dm-scene .wave .wico svg{width:11px;height:11px;fill:#7A3FA0;}
.dm-scene .wave .wbars{position:relative;flex:1;display:flex;align-items:center;gap:1.5px;height:100%;}
.dm-scene .wave .wbars::before{content:'';position:absolute;left:0;right:0;top:50%;height:1px;background:var(--docline);}
.dm-scene .wave .wbars i{position:relative;flex:1;background:#C9BFE0;border-radius:1px;min-width:1.5px;}
.dm-scene .wave .wplay{position:absolute;top:2px;bottom:2px;width:2px;border-radius:2px;background:var(--accent);
  opacity:.85;left:19px;animation:dm-wplay 1.8s linear infinite;}
@keyframes dm-wplay{0%{left:19px}100%{left:calc(100% - 4px)}}
.dm-scene .card .data{position:relative;margin-top:8px;font-size:8px;line-height:1.25;font-weight:700;color:var(--graphite);padding:4px 5px;border-radius:5px;transition:color .3s;}
.dm-scene .card .data .hl{position:absolute;inset:0;border-radius:5px;background:var(--accent-soft);border:1px solid var(--accent-line);transform:scaleX(0);transform-origin:left;opacity:0;}
.dm-scene .card .data .num{color:var(--accent);}
.dm-scene .card.lit{box-shadow:0 0 0 2px var(--accent),0 10px 22px -12px var(--shadow);}
.dm-scene .card.lit .data{color:var(--accent);}
.dm-scene .card .stamp{position:absolute;top:7px;right:7px;width:16px;height:16px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;opacity:0;transform:scale(.5);}
.dm-scene .card .stamp svg{width:10px;height:10px;stroke-width:3;fill:none;stroke-linecap:round;stroke-linejoin:round;}
.dm-scene .card.ok .stamp{background:var(--ok-soft);opacity:1;transform:scale(1);}.dm-scene .card.ok .stamp svg{stroke:var(--ok);}
.dm-scene .card.miss{filter:grayscale(.6);opacity:.5;}
.dm-scene .card.miss .stamp{background:#EDE7DC;opacity:1;transform:scale(1);}.dm-scene .card.miss .stamp svg{stroke:var(--drop);}
.dm-scene .card.flag .stamp{background:var(--warn-soft);opacity:1;transform:scale(1);}.dm-scene .card.flag .stamp svg{stroke:var(--warn);}
.dm-scene .card.flag{box-shadow:0 0 0 2px var(--warn);}
.dm-scene .card.shake{animation:dm-shake .34s ease;}
@keyframes dm-shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-3px)}75%{transform:translateX(3px)}}

/* ---------- Узел-обработка + мысль ---------- */
.dm-scene .brain{display:flex;align-items:center;gap:10px;margin:14px 4px 12px;}
.dm-scene .node{width:34px;height:34px;border-radius:50%;background:var(--ink);color:var(--paper);flex:none;
  display:flex;align-items:center;justify-content:center;box-shadow:0 8px 18px -8px var(--shadow);position:relative;}
.dm-scene .node svg{width:17px;height:17px}
.dm-scene .node .ring{position:absolute;inset:-5px;border-radius:50%;border:2px solid var(--accent);opacity:0;}
.dm-scene .node.think svg{animation:dm-spin 1.4s linear infinite;}
@keyframes dm-spin{to{transform:rotate(360deg)}}
.dm-scene .thought{font-size:11.5px;color:var(--graphite);line-height:1.35;min-height:16px;}
.dm-scene .thought .cur{display:inline-block;width:1px;background:var(--accent);margin-left:1px;animation:dm-blink 1s step-end infinite;}
@keyframes dm-blink{50%{opacity:0}}

/* ---------- Итоговый документ ---------- */
.dm-scene .report{background:var(--docbg);border:1px solid var(--docline);border-radius:13px;padding:18px 20px 20px;position:relative;overflow:hidden;}
.dm-scene .report .badge{position:absolute;top:15px;right:16px;font-size:9px;font-weight:700;letter-spacing:.04em;color:var(--accent);background:var(--accent-soft);border:1px solid var(--accent-line);padding:3px 7px;border-radius:6px;}
.dm-scene .report .done{position:absolute;top:15px;right:16px;display:flex;align-items:center;gap:5px;font-size:9px;font-weight:700;color:var(--ok);background:var(--ok-soft);border:1px solid transparent;padding:3px 7px;border-radius:6px;opacity:0;transform:translateY(-3px);}
.dm-scene .report .done svg{width:11px;height:11px;fill:none;stroke:var(--ok);stroke-width:3;stroke-linecap:round;stroke-linejoin:round;}
.dm-scene .rtitle{height:10px;width:52%;background:var(--ink);opacity:.9;border-radius:4px;}
.dm-scene .rsub{height:6px;width:34%;background:var(--skeleton);border-radius:3px;margin-top:8px;}
.dm-scene .progress{margin-top:12px;display:flex;align-items:center;gap:8px;font-size:9.5px;color:var(--muted);font-weight:600;font-variant-numeric:tabular-nums;}
.dm-scene .progress .bar{flex:1;height:3px;border-radius:2px;background:var(--sand);overflow:hidden;}
.dm-scene .progress .bar i{display:block;height:100%;width:0;background:var(--accent);transition:width .5s ease;}
/* ---------- Живая сборка: лист растёт сверху вниз ----------
   .rstage резервирует финальную высоту (min-height ставит JS по замеру сцены):
   рамка стоит, а «бумага» .report внутри растёт → рост не дёргает колонку героя. */
.dm-scene .rstage{position:relative;margin-top:12px;}
.dm-scene .rbody{display:block;margin-top:10px;}
/* каждый блок итога рождается схлопнутым и вырастает, толкая подпись вниз */
.dm-scene .rtext,.dm-scene .rline,.dm-scene .rpara{
  max-height:0;opacity:0;overflow:hidden;margin-top:0;transform:translateY(5px);
  transition:max-height .6s cubic-bezier(.22,.61,.36,1),opacity .5s ease,transform .5s ease,margin-top .5s ease;}
.dm-scene .rtext.in,.dm-scene .rline.in,.dm-scene .rpara.in{opacity:1;transform:none;}
.dm-scene .rline.in,.dm-scene .rpara.in{margin-top:9px;}
/* капы max-height щедрее контента: рендер-высота = контент, роста хватает, но
   ничего не обрезается (в отличие от точного scrollHeight) */
.dm-scene .rtext.in{max-height:60px;}
.dm-scene .rline.in{max-height:34px;}
.dm-scene .rpara.in{max-height:150px;}
/* вводный «шаблонный» абзац-скелетон — верх оболочки документа */
.dm-scene .rtext{display:flex;flex-direction:column;gap:5px;}
.dm-scene .rtext.in{margin-top:2px;}
.dm-scene .rtext .tl{height:4.5px;border-radius:3px;background:var(--skeleton);}
.dm-scene .rtext .tl.w1{width:100%}.dm-scene .rtext .tl.w2{width:92%}.dm-scene .rtext .tl.w3{width:74%}
/* строка-факт: проза шаблона в одну линию с многоточием (единая высота у всех сцен) */
.dm-scene .rline{display:flex;align-items:center;gap:8px;min-width:0;}
.dm-scene .rline .dot{width:5px;height:5px;border-radius:50%;background:var(--accent);flex:none;}
.dm-scene .rline.warn .dot{background:var(--warn);}
.dm-scene .rline .tx{flex:1;min-width:0;font-size:10px;color:var(--graphite);line-height:1.3;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.dm-scene .rline .tx b{color:var(--accent);font-weight:700;}
.dm-scene .rline.warn .tx{color:var(--warn);font-style:italic;}
.dm-scene .rline.warn .tx b{color:var(--warn);}
/* пустой слот-плейсхолдер до подстановки — подчёркнутая «дырка» шаблона, пульсирует */
.dm-scene .rline .tx b.slot{display:inline-block;min-width:54px;height:9px;vertical-align:-1px;
  border-bottom:1.5px dashed var(--accent-line);border-radius:1px;animation:dm-slot 1.15s ease-in-out infinite;}
.dm-scene .rline.warn .tx b.slot{border-bottom-color:var(--warn);}
@keyframes dm-slot{0%,100%{border-bottom-color:var(--accent-line);opacity:.6}50%{border-bottom-color:var(--accent);opacity:1}}
/* снап: цифра «встаёт» в слот с упругим доводом */
.dm-scene .rline .tx b.snap{display:inline-block;animation:dm-snap .5s cubic-bezier(.2,1.5,.4,1);}
@keyframes dm-snap{0%{transform:scale(.35);opacity:0}60%{transform:scale(1.14)}100%{transform:scale(1);opacity:1}}
/* факт-АБЗАЦ: целый кусок прозы из документа-источника, вставленный в итог.
   Паддинг/фон/бордюр — на внутреннем .pcard, чтобы схлопывающийся .rpara
   (max-height:0) сжимался в ноль без «пола» из паддинга. */
.dm-scene .rpara .pcard{position:relative;padding:8px 10px 9px 12px;border-radius:8px;
  background:var(--accent-soft);border-left:2px solid var(--accent);}
.dm-scene .rpara .psrc{display:block;font-size:7.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;
  color:var(--accent);opacity:.85;margin-bottom:4px;}
.dm-scene .rpara .ptext{font-size:10px;line-height:1.5;color:var(--graphite);opacity:0;transition:opacity .55s ease .12s;}
.dm-scene .rpara.in .ptext{opacity:1;}
.dm-scene .rpara .ptext b{color:var(--accent);font-weight:700;}
/* .measure — синхронный замер финальной высоты: раскрыть все блоки без анимаций.
   .noanim (на время замера) глушит transition, чтобы схлопывание не давало вспышку. */
.dm-scene .rbody.measure .rtext,.dm-scene .rbody.measure .rline,.dm-scene .rbody.measure .rpara{
  max-height:none;opacity:1;transform:none;transition:none;margin-top:9px;}
.dm-scene .rbody.measure .rtext{margin-top:2px;}
.dm-scene .rbody.measure .rpara .ptext{opacity:1;}
.dm-scene.noanim .rtext,.dm-scene.noanim .rline,.dm-scene.noanim .rpara,.dm-scene.noanim .rpara .ptext{transition:none;}
.dm-scene .sign{margin-top:16px;display:flex;justify-content:flex-end;align-items:flex-end;}
.dm-scene .sign svg{width:88px;height:30px}
.dm-scene .sign path{fill:none;stroke:var(--accent);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:210;stroke-dashoffset:210;}
.dm-scene .sign .rule{width:104px;border-top:1px solid var(--docline);text-align:center;font-size:8px;color:var(--muted);padding-top:3px;margin-left:6px;}

/* ---------- Летящие данные ---------- */
.dm-scene .fx{position:absolute;inset:0;pointer-events:none;overflow:visible;z-index:6;}
.dm-scene .chip{position:absolute;left:0;top:0;white-space:nowrap;font-size:10px;font-weight:700;color:#fff;background:var(--accent);padding:4px 9px;border-radius:999px;box-shadow:0 8px 18px -6px rgba(160,78,51,.55);will-change:transform,opacity;}
/* летящий факт-АБЗАЦ: мини-карточка текста (несколько строк прозы) */
.dm-scene .chipdoc{position:absolute;left:0;top:0;width:92px;padding:8px;display:flex;flex-direction:column;gap:4px;
  background:var(--docbg);border:1px solid var(--accent);border-radius:8px;box-shadow:0 12px 24px -8px rgba(160,78,51,.5);will-change:transform,opacity;}
.dm-scene .chipdoc .tl{height:4px;border-radius:2px;background:var(--accent-line);}
.dm-scene .chipdoc .tl.s{width:58%;}

.dm-scene :focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:6px;}

/* ---------- Меньше движения: финальный кадр без анимаций ---------- */
@media (prefers-reduced-motion:reduce){
  .dm-scene .wave .wplay{animation:none;left:50%;}
  .dm-scene .node.think svg,.dm-scene .thought .cur{animation:none;}
  .dm-scene .rtext,.dm-scene .rline,.dm-scene .rpara,.dm-scene .rpara .ptext{transition:none;}
  .dm-scene .rline .tx b.slot{animation:none;}
}

/* ---------- Точки-переключатели ниш (карусель героя) ---------- */
.hero-scene-dots{display:flex;justify-content:center;gap:8px;margin-top:12px;}
.hero-scene-dots .hs-dot{width:8px;height:8px;padding:0;border:none;border-radius:999px;cursor:pointer;
  background:#CFC8B8;opacity:.6;transition:all .2s;}
.hero-scene-dots .hs-dot:hover{opacity:.9;}
.hero-scene-dots .hs-dot.on{background:#A04E33;opacity:1;width:20px;}
.hero-scene-dots .hs-dot:focus-visible{outline:2px solid #A04E33;outline-offset:2px;}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .hero-scene-dots .hs-dot{background:#4A463E;}
  :root:not([data-theme="light"]) .hero-scene-dots .hs-dot.on{background:#C26B4C;}}
:root[data-theme="dark"] .hero-scene-dots .hs-dot{background:#4A463E;}
:root[data-theme="dark"] .hero-scene-dots .hs-dot.on{background:#C26B4C;}