/* Экран «Диалог» (.p0-stage--dialogue). Подключается после frontend-demo/styles/presentation0.css. */


.p0-dlg-rays {
  position: absolute;
  left: -40vmax;
  top: -40vmax;
  width: 110vmax;
  height: 110vmax;
  border-radius: 50%;
  background: conic-gradient(from 80deg, transparent, #e6cd9a1c 6%, transparent 12%, #e6cd9a12 20%, transparent 27%, #f0a95a14 34%, transparent 42%);
  mask-image: radial-gradient(circle, #000 20%, transparent 70%);
  animation: p0-dlg-rays 90s linear infinite alternate;
  transition: opacity 1.2s;
  opacity: .8;
}
@keyframes p0-dlg-rays { from { transform: rotate(-10deg); } to { transform: rotate(25deg); } }
.p0-stage--dialogue:not([data-beat="0"]) .p0-dlg-rays { opacity: 1; filter: saturate(1.4); }
.p0-dlg-grid {
  position: absolute;
  inset: 0;
  opacity: .5;
  background: linear-gradient(#d9c59e0a 1px, transparent 1px) 0 0 / 88px 88px, linear-gradient(90deg, #d9c59e0a 1px, transparent 1px) 0 0 / 88px 88px;
}
.p0-dlg-sparks { position: absolute; inset: 0; width: 100%; height: 100%; fill: #f3dfb0; }
.p0-dlg-sparks circle { animation: cs-breathe 5s ease-in-out infinite; }

.p0-dlg-feed {
  position: absolute;
  z-index: 3;
  left: calc(3 * var(--su));
  top: calc(4.4 * var(--su));
  width: calc(57 * var(--su));
  height: calc(34 * var(--su));
  display: flex;
  flex-direction: column;
  gap: calc(.8 * var(--su));
  transition: opacity .8s var(--ease), filter .8s;
}
.p0-dlg-act {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: calc(1 * var(--su));
  padding-bottom: calc(.5 * var(--su));
  border-bottom: 1px solid #e6cd9a26;
  font: 500 calc(.85 * var(--su)) var(--mono);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #dcc699;
}
.p0-dlg-act__when { color: #a9b5b1; }
.p0-dlg-lines {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: calc(.7 * var(--su));
  min-height: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
  list-style: none;
  mask-image: linear-gradient(180deg, transparent, #000 12%);
}
.p0-dlg-line { display: flex; align-items: flex-end; gap: calc(.8 * var(--su)); animation: p0-dlg-line-in .5s var(--ease-out) both; }
.p0-dlg-line[data-state="pending"] { display: none; }
/* Первая реплика акта видна с первого кадра пустым пузырём: полный текст
   прозрачен и держит размер, печать заполняет пузырь. */
.p0-dlg-line[data-state="pending"][data-lead="true"] { display: flex; }
/* Эстафета `idea`: пузырь прилетает с «Возврата» FLIP-анимацией, собственное
   появление строки не должно его скрывать. */
.p0-dlg-line:has([data-handoff-live]) { animation: none; }
.p0-dlg-bubble[data-handoff-live] { box-shadow: 0 0 calc(3 * var(--su)) rgba(187, 163, 217, .35); }
@keyframes p0-dlg-line-in { from { opacity: 0; translate: 0 calc(1.2 * var(--su)); } }
.p0-dlg-line--alexey { justify-content: flex-end; }
.p0-dlg-line--signal { justify-content: center; }
.p0-dlg-bubble {
  position: relative;
  max-width: calc(50 * var(--su));
  padding: calc(.7 * var(--su)) calc(1.2 * var(--su));
  border-radius: calc(1.3 * var(--su));
  border: 1px solid #efe6d52e;
  background: linear-gradient(135deg, #3a3a33e0, #24272480);
}
.p0-dlg-line--alexey .p0-dlg-bubble { border-bottom-right-radius: calc(.3 * var(--su)); }
.p0-dlg-line--cog .p0-dlg-bubble {
  border-color: #e6cd9a66;
  border-bottom-left-radius: calc(.3 * var(--su));
  background: linear-gradient(135deg, #243231f5, #121a19f5 65%);
  box-shadow: 0 0 calc(2.5 * var(--su)) #e6cd9a14;
}
.p0-dlg-line--cog .p0-dlg-bubble::before {
  content: "";
  position: absolute;
  left: 8%;
  right: 35%;
  top: -1px;
  height: 1px;
  background: linear-gradient(90deg, transparent, #e6cd9a, transparent);
}
.p0-dlg-line--signal .p0-dlg-bubble {
  display: flex;
  align-items: center;
  gap: .6em;
  padding: calc(.35 * var(--su)) calc(1 * var(--su));
  border-radius: 999px;
  border-color: #7ee1c866;
  background: #0f1918ee;
}
.p0-dlg-author {
  display: block;
  margin-bottom: calc(.25 * var(--su));
  font: 500 calc(.75 * var(--su)) var(--mono);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #a9b5b1;
}
.p0-dlg-line--cog .p0-dlg-author { color: #e6cd9a; }
.p0-dlg-line--signal .p0-dlg-author { margin: 0; color: #7ee1c8; }
.p0-dlg-line--signal .p0-dlg-author .ui-icon { width: calc(1.3 * var(--su)); height: calc(1.3 * var(--su)); }
.p0-dlg-text { margin: 0; font-size: calc(1.34 * var(--su)); line-height: 1.3; color: #f4f0e7; }
.p0-dlg-line--signal .p0-dlg-text { font-size: calc(1.1 * var(--su)); color: #c8f0e4; }
.p0-dlg-text__rest { color: transparent; }
.p0-dlg-line[data-state="typing"] .p0-dlg-text__typed::after { content: "▍"; color: #e6cd9a; margin-right: -.6em; }
.p0-dlg-line[data-state="thinking"] .p0-dlg-text { position: absolute; visibility: hidden; }
.p0-dlg-dots { display: none; gap: .35em; padding: .3em 0; }
.p0-dlg-line[data-state="thinking"] .p0-dlg-dots { display: flex; }
.p0-dlg-dots i { width: calc(.6 * var(--su)); height: calc(.6 * var(--su)); border-radius: 50%; background: #e6cd9a; animation: cs-breathe .9s ease-in-out infinite; }
.p0-dlg-dots i:nth-child(2) { animation-delay: .15s; }
.p0-dlg-dots i:nth-child(3) { animation-delay: .3s; }

/* Чипы источников ответа (приём «Спросить систему»): во время обдумывания
   фрагменты слетаются к ядру, во время печати место под ними держится,
   после печати они становятся цитатами. */
.p0-dlg-sources {
  display: flex;
  flex-wrap: wrap;
  gap: calc(.35 * var(--su));
  margin: calc(.55 * var(--su)) 0 0;
  padding: 0;
  list-style: none;
}
.p0-dlg-source {
  display: inline-flex;
  align-items: center;
  gap: .4em;
  padding: .15em .65em;
  border-radius: 999px;
  border: 1px solid rgba(var(--entity-rgb), .5);
  background: rgba(var(--entity-rgb), .12);
  font-size: calc(.82 * var(--su));
  line-height: 1.35;
  color: #e7ece8;
  white-space: nowrap;
}
.p0-dlg-source .entity-icon { color: rgb(var(--entity-rgb)); font-size: 1.05em; }
.p0-dlg-line[data-state="thinking"] .p0-dlg-source {
  border-style: dashed;
  background: transparent;
  opacity: .7;
  animation: p0-dlg-gather .5s var(--ease-out) calc(var(--k) * 110ms) both;
}
@keyframes p0-dlg-gather { from { opacity: 0; translate: calc(9 * var(--su)) 0; } }
.p0-dlg-line[data-state="typing"] .p0-dlg-sources { visibility: hidden; }
.p0-dlg-line[data-state="done"] .p0-dlg-source { animation: p0-dlg-cite .55s var(--ease-out) calc(150ms + var(--k) * 140ms) both; }
@keyframes p0-dlg-cite { from { opacity: 0; scale: .8; translate: calc(-1.5 * var(--su)) 0; } }
.p0-dlg-core {
  position: relative;
  flex: none;
  display: grid;
  place-items: center;
  width: calc(2.8 * var(--su));
  height: calc(2.8 * var(--su));
  border-radius: 50%;
  background: radial-gradient(circle, #f5e6c4, #b78945 45%, #1b2928 72%);
  box-shadow: 0 0 calc(1.6 * var(--su)) #e6cd9a66;
  animation: cs-breathe 3s ease-in-out infinite;
}
.p0-dlg-core span {
  position: absolute;
  inset: -20%;
  border-radius: 50%;
  border: 1px dashed #e6cd9a99;
  animation: cs-orbit 8s linear infinite;
}
.p0-dlg-line[data-state="thinking"] .p0-dlg-core span { animation-duration: 1.2s; }
.p0-dlg-voice { flex: 1; display: flex; align-items: center; justify-content: center; gap: calc(.8 * var(--su)); height: calc(1.6 * var(--su)); color: #e6cd9a; }
.p0-dlg-voice .signal-trace { width: calc(7 * var(--su)); height: calc(1.5 * var(--su)); }
.p0-dlg-voice .signal-trace + .signal-trace { color: #b7a2f5; }
.p0-dlg-voice__mark {
  padding: .1em .9em;
  border-radius: 999px;
  border: 1px dashed #e6cd9a66;
  font: 500 calc(.8 * var(--su)) var(--mono);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #e6d6b3;
}
.p0-dlg-jump {
  position: absolute;
  z-index: 4;
  left: calc(3 * var(--su));
  top: calc(8 * var(--su));
  width: calc(57 * var(--su));
  display: grid;
  justify-items: center;
  gap: calc(1 * var(--su));
  opacity: 0;
  pointer-events: none;
  transition: opacity .6s var(--ease);
}
.p0-dlg-jump svg { width: calc(18 * var(--su)); height: calc(18 * var(--su)); overflow: visible; }
.p0-dlg-jump p { margin: 0; font: 500 calc(1.5 * var(--su)) var(--mono); letter-spacing: .12em; text-transform: uppercase; color: #f1d9a3; }
.p0-dlg-jump__ring { stroke: #e6cd9a55; stroke-width: .6; }
.p0-dlg-jump__ticks { stroke: #cab68d99; stroke-width: .6; }
.p0-dlg-jump__hand { stroke: #f5e6c4; stroke-width: 1.4; stroke-linecap: round; transform-origin: 0 0; }
.p0-dlg-jump__hand--hour { stroke: #b7a2f5; stroke-width: 2; }
.p0-dlg-jump__pin { fill: #f5e6c4; }
.p0-stage--dialogue[data-beat="1"] .p0-dlg-jump { opacity: 1; }
.p0-stage--dialogue[data-beat="1"] .p0-dlg-jump__hand { animation: cs-orbit .35s linear infinite; }
.p0-stage--dialogue[data-beat="1"] .p0-dlg-jump__hand--hour { animation-duration: 3.5s; }
.p0-stage--dialogue[data-beat="1"] .p0-dlg-feed { opacity: .12; filter: blur(2px); }

.p0-dlg-panel {
  position: absolute;
  z-index: 3;
  left: calc(63 * var(--su));
  top: calc(4.4 * var(--su));
  width: calc(34 * var(--su));
  height: calc(34 * var(--su));
  display: flex;
  flex-direction: column;
  gap: calc(.8 * var(--su));
  padding: calc(1.2 * var(--su)) calc(1.4 * var(--su));
  border: 1px solid #e6cd9a3d;
  border-radius: calc(1.4 * var(--su));
  background: linear-gradient(145deg, #1c2827d9, #0f1716e6);
  backdrop-filter: blur(22px) saturate(145%);
  -webkit-backdrop-filter: blur(22px) saturate(145%);
  box-shadow: inset 0 1px #f3e6c91c, 0 20px 60px #04070766;
}
.p0-dlg-panel__title { margin: 0; font: 500 calc(.85 * var(--su)) var(--mono); letter-spacing: .16em; text-transform: uppercase; color: #dcc699; }
.p0-dlg-mini { position: relative; height: calc(10 * var(--su)); flex: none; }
.p0-dlg-mini svg { width: 100%; height: 100%; overflow: visible; }
.p0-dlg-mini__orbit { stroke: #d9c59e3a; stroke-width: .3; stroke-dasharray: 1 1.5; }
.p0-dlg-mini__core { fill: #e6cd9a; filter: drop-shadow(0 0 2px #e6cd9a); }
.p0-dlg-mini__halo { stroke: #e6cd9a66; stroke-width: .4; stroke-dasharray: 2 2; transform-origin: 50px 27px; animation: cs-orbit 12s linear infinite; }
.p0-dlg-mini__edge { stroke: #f1d9a3; stroke-width: .6; stroke-dasharray: 100; stroke-dashoffset: 100; transition: stroke-dashoffset 1.2s var(--ease-out); }
.p0-dlg-mini__node { color: rgb(var(--entity-rgb)); transition: opacity .7s var(--ease), transform .7s var(--ease-out); }
.p0-dlg-mini__node circle { fill: rgba(var(--entity-rgb), .18); stroke: rgb(var(--entity-rgb)); stroke-width: .5; }
.p0-dlg-mini__node path { stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.p0-dlg-mini__node--thought, .p0-dlg-mini__node--idea { opacity: 0; }
.p0-dlg-mini__node--project { opacity: .45; }
.p0-dlg-mini__satellites { opacity: 0; transition: opacity .8s; }
.p0-dlg-mini__satrotor { animation: cs-orbit 20s linear infinite; }
.p0-dlg-mini__satorbit { stroke: #8bb5d466; stroke-width: .3; stroke-dasharray: 1 1; }
.p0-dlg-mini__sat { fill: rgb(139, 181, 212); }
.p0-dlg-mini__label {
  position: absolute;
  translate: -50% 0;
  padding: .1em .6em;
  border-radius: 999px;
  border: 1px solid rgba(var(--entity-rgb, 230, 205, 154), .45);
  background: #0f1716ee;
  font-size: calc(.85 * var(--su));
  white-space: nowrap;
  opacity: 0;
  transition: opacity .6s var(--ease);
}
.p0-dlg-mini__label--node { left: 73%; top: 44%; }
.p0-dlg-mini__label--project { left: 28%; top: 83%; }
.p0-dlg-mini__label--condition { left: 58%; top: 2%; color: #f1d9a3; border-color: #e6cd9a66; }
.p0-dlg-mini__idea { display: none; }
.p0-dlg-cards, .p0-dlg-steps { display: grid; gap: calc(.35 * var(--su)); margin: 0; padding: 0; list-style: none; }
.p0-dlg-cards li, .p0-dlg-steps li {
  display: flex;
  align-items: baseline;
  gap: .45em;
  padding: calc(.3 * var(--su)) calc(.8 * var(--su));
  border-radius: calc(.6 * var(--su));
  border: 1px solid rgba(var(--entity-rgb), .4);
  background: rgba(var(--entity-rgb), .1);
  font-size: calc(1 * var(--su));
}
.p0-dlg-cards, .p0-dlg-plan { display: none; }
@keyframes p0-dlg-card-in { from { opacity: 0; translate: calc(-6 * var(--su)) calc(-6 * var(--su)); scale: .3; } }
@keyframes p0-dlg-step-in { from { opacity: 0; translate: calc(2 * var(--su)) 0; } }
/* Блок трёх шагов плана — источник эстафеты `plan` (виден на последнем бите). */
.p0-dlg-plan { gap: calc(.4 * var(--su)); }
.p0-dlg-plan__title { font: 500 calc(.75 * var(--su)) var(--mono); letter-spacing: .14em; text-transform: uppercase; color: #8bb5d4; }
.p0-dlg-badges { display: flex; flex-wrap: wrap; gap: calc(.5 * var(--su)); margin-top: auto; }
.p0-dlg-badge {
  display: inline-flex;
  align-items: center;
  gap: .4em;
  padding: .2em .8em;
  border-radius: 999px;
  border: 1px solid #e6cd9a44;
  font-size: calc(.9 * var(--su));
  opacity: 0;
  transition: opacity .6s;
}
.p0-dlg-badge .ui-icon { width: 1.1em; height: 1.1em; }
.p0-dlg-badge--private { border-color: rgba(var(--entity-rgb), .6); color: #cfeae3; }
.p0-dlg-badge--calm { color: #b8e9da; border-color: #7ee1c855; }
.p0-dlg-day { margin-top: calc(1 * var(--su)); display: grid; grid-template-columns: auto 1fr; align-items: center; gap: calc(.8 * var(--su)); font-size: calc(.85 * var(--su)); color: #a9b5b1; }
.p0-dlg-day__track {
  position: relative;
  height: calc(2.4 * var(--su));
  border-radius: calc(.5 * var(--su));
  border: 1px solid #ffffff14;
  background: #ffffff08;
}
.p0-dlg-day__track i {
  position: absolute;
  top: calc(-1.3 * var(--su));
  translate: -50% 0;
  font: normal calc(.65 * var(--su)) var(--mono);
  color: #7f8c88;
}
.p0-dlg-day__track i:first-child { translate: 0 0; }
.p0-dlg-day__track i:nth-child(5) { translate: -100% 0; }
.p0-dlg-day__block {
  position: absolute;
  left: 37.5%;
  width: 25%;
  top: 2px;
  bottom: 2px;
  display: flex;
  align-items: center;
  overflow: hidden;
  padding: 0 .4em;
  border-radius: calc(.4 * var(--su));
  border: 1px solid rgba(var(--entity-rgb), .7);
  background: rgba(var(--entity-rgb), .25);
  font-size: calc(.7 * var(--su));
  color: #eef3f1;
  white-space: nowrap;
  transform-origin: left;
  transform: scaleX(0);
  opacity: 0;
  transition: transform .9s var(--ease-out) .6s, opacity .4s .6s;
}
.p0-dlg-caption { margin: 0; font-size: calc(1.15 * var(--su)); color: #e6d6b3; font-style: italic; opacity: 0; transition: opacity .8s 1s; }

.p0-dlg-panel:not([data-effect="0"]) .p0-dlg-mini__label--node,
.p0-dlg-panel:not([data-effect="0"]) .p0-dlg-badge--private { opacity: 1; }
.p0-dlg-panel[data-effect="1"] .p0-dlg-mini__node--thought { opacity: 1; }
.p0-dlg-panel:is([data-effect="1"], [data-effect="2"]) .p0-dlg-badge--calm { opacity: 1; }
.p0-dlg-panel:is([data-effect="2"], [data-effect="3"], [data-effect="4"]) .p0-dlg-mini__node--idea { opacity: 1; }
.p0-dlg-panel:is([data-effect="2"], [data-effect="3"], [data-effect="4"]) .p0-dlg-mini__thought { display: none; }
.p0-dlg-panel:is([data-effect="2"], [data-effect="3"], [data-effect="4"]) .p0-dlg-mini__idea { display: inline; }
.p0-dlg-panel:is([data-effect="2"], [data-effect="3"], [data-effect="4"]) .p0-dlg-mini__edge { stroke-dashoffset: 0; }
.p0-dlg-panel:is([data-effect="2"], [data-effect="3"], [data-effect="4"]) :is(.p0-dlg-mini__node--project) { opacity: 1; }
.p0-dlg-panel:is([data-effect="2"], [data-effect="3"], [data-effect="4"]) .p0-dlg-mini__label--project { opacity: 1; }
.p0-dlg-panel:is([data-effect="2"], [data-effect="3"]) .p0-dlg-mini__label--condition { opacity: 1; }
.p0-dlg-panel[data-effect="3"] .p0-dlg-cards { display: grid; }
.p0-dlg-panel[data-effect="3"] .p0-dlg-cards li { animation: p0-dlg-card-in .7s var(--ease-out) calc(var(--k) * 250ms) both; }
.p0-dlg-panel[data-effect="4"] .p0-dlg-plan { display: grid; }
.p0-dlg-panel[data-effect="4"] .p0-dlg-steps li { animation: p0-dlg-step-in .6s var(--ease-out) calc(var(--k) * 250ms) both; }
.p0-dlg-panel[data-effect="4"] .p0-dlg-mini__satellites { opacity: 1; }
.p0-dlg-panel[data-effect="4"] .p0-dlg-day__block { opacity: 1; transform: none; }
.p0-dlg-panel[data-effect="4"] .p0-dlg-caption { opacity: 1; }