/* Заставка после входа: белый фон, цветной знак собирается из шести ромбов, затем два пузыря диалога
   печатаются по буквам, растворение в интерфейс. Логика и тайминги шагов в app.js (playSplash),
   здесь вид и анимация ромбов (всего около 0.7 с на сборку знака).
   По брифу владельца заставка всегда светлая, поэтому её цвета не зависят от темы: локальные токены ниже. */
.splash{--splash-bg:#ffffff;--splash-text:#111111;--splash-muted:#5f6368;--splash-line:#e3e6ea;
  position:fixed;inset:0;z-index:100;display:flex;flex-direction:column;align-items:center;justify-content:center;
  background:var(--splash-bg);color:var(--splash-text);opacity:1;transition:opacity .36s ease;cursor:pointer;user-select:none;color-scheme:light}
.splash.out{opacity:0}.splash.out.fast{transition-duration:.16s}
body.splash-on{overflow:hidden}
.splash-inner{display:flex;flex-direction:column;align-items:center;gap:18px;width:min(420px,92vw)}
/* знак: пропорция как у LOGO_SVG (viewBox 107.51 x 100), не растягивать */
.splash-mark{width:min(150px,40vw);aspect-ratio:107.51/100}
.splash-mark svg{width:100%;height:100%;display:block;overflow:visible}
.splash-mark polygon{opacity:0;transform-box:fill-box;transform-origin:center;animation:splash-seg .38s cubic-bezier(.2,.7,.2,1) forwards}
.splash-mark .seg-1{fill:var(--brand-navy);--dx:0px;--dy:-18px;animation-delay:0s}
.splash-mark .seg-2{fill:var(--brand-blue);--dx:-14px;--dy:-10px;animation-delay:.1s}
.splash-mark .seg-3{fill:var(--brand-blue);--dx:14px;--dy:-10px;animation-delay:.16s}
.splash-mark .seg-4{fill:var(--brand-cyan);--dx:-22px;--dy:0px;animation-delay:.26s}
.splash-mark .seg-5{fill:var(--brand-cyan);--dx:22px;--dy:0px;animation-delay:.32s}
.splash-mark .seg-6{fill:var(--brand-sky);--dx:0px;--dy:18px;animation-delay:.42s}
@keyframes splash-seg{
  0%{opacity:0;transform:translate(var(--dx),var(--dy)) scale(.6)}
  60%{opacity:1}
  100%{opacity:1;transform:translate(0,0) scale(1)}
}
/* подпись под знаком: «алабуга» Muller Extrabold чёрным, разделитель, AI Team обычным */
.splash-brand{display:flex;align-items:baseline;gap:10px;font-family:var(--font-head);opacity:0;transform:translateY(6px);transition:opacity .3s ease,transform .3s ease}
.splash-brand b{font-size:30px;font-weight:800;line-height:1;color:var(--splash-text)}
.splash-brand span{font-size:17px;font-weight:400;font-family:var(--font);color:var(--splash-muted);padding-left:10px;border-left:1px solid var(--splash-line)}
.splash.assembled .splash-brand,.splash.final .splash-brand{opacity:1;transform:none}
/* два пузыря: человек справа синим, модель слева белым с рамкой; курсор печати до конца строки */
.splash-chat{display:flex;flex-direction:column;gap:10px;width:100%;min-height:104px;margin-top:6px}
.splash-bubble{max-width:78%;padding:10px 14px;border-radius:16px;font-size:16px;line-height:1.35;opacity:0;transform:translateY(8px);transition:opacity .22s ease,transform .22s ease;min-height:42px}
.splash-bubble.show{opacity:1;transform:none}
.splash-bubble.user{align-self:flex-end;background:var(--brand-blue);color:var(--splash-bg);border-bottom-right-radius:6px}
.splash-bubble.ai{align-self:flex-start;background:var(--splash-bg);border:1px solid var(--splash-line);color:var(--splash-text);border-bottom-left-radius:6px}
.splash-line::after{content:"";display:inline-block;width:2px;height:1em;margin-left:2px;vertical-align:-2px;background:currentColor;animation:splash-caret 1s steps(2,start) infinite}
.splash-bubble.typed .splash-line::after{display:none}
@keyframes splash-caret{to{visibility:hidden}}
/* подпись пропуска читается, поэтому --splash-muted (6:1), а не бледно-серый #9aa0a6 (2,6:1 на белом, ДС §2) */
.splash-skip{position:absolute;bottom:22px;left:0;right:0;text-align:center;font-size:var(--fs-xs);color:var(--splash-muted)}
/* без движения: сразу финальный кадр */
.splash.reduced .splash-mark polygon,.splash.final .splash-mark polygon{animation:none;opacity:1;transform:none}
.splash.reduced .splash-bubble,.splash.reduced .splash-brand{transition:none}
@media (prefers-reduced-motion: reduce){
  .splash-mark polygon{animation:none;opacity:1;transform:none}
  .splash,.splash-bubble,.splash-brand{transition-duration:.01s}
  .splash-line::after{animation:none}
}