/* Экран «Возврат» (.p0-stage--recall). Подключается после frontend-demo/styles/presentation0.css.
   Биты: 0 поиск · 1 условия · 2 контекст · 3 идея в проекте · 4 окно, человек,
   место. Reduced motion показывает бит 2, поэтому его состояние — базовое:
   группы карточек других битов скрыты правилами data-group. */

.p0-recall-rings { position: absolute; inset: 0; width: 100%; height: 100%; fill: none; stroke: #d9c59e1c; stroke-width: .12; }
.p0-recall-sweep {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 180vmax;
  height: 180vmax;
  margin: -90vmax 0 0 -90vmax;
  border-radius: 50%;
  background: conic-gradient(from 0deg, #e6cd9a0a, transparent 16%);
  animation: cs-orbit 24s linear infinite;
}
.p0-recall-lines {
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(180deg, transparent 0 7.9vh, #b9c7c20d 7.9vh calc(7.9vh + 1px));
}

/* --- Бит 0: поиск ------------------------------------------------------------ */

.p0-recall-trails { z-index: 4; }
.p0-recall-trail { stroke: #e6cd9a26; stroke-width: .08; stroke-dasharray: .4 .5; }
.p0-recall-trail__pulse { stroke-width: .18; }
.p0-recall-trails path { opacity: 0; transition: opacity .5s; }
.p0-stage--recall[data-beat="0"] .p0-recall-trails path { opacity: 1; transition-delay: calc(1.8s + var(--k) * 150ms); }
.p0-stage--recall:not([data-beat="0"]) .p0-recall-trail__pulse { animation: none; }
.p0-stage--recall[data-beat="0"] .p0-sphere-chip:not([data-match]) .p0-sphere-chip__body { opacity: .3; }
.p0-stage--recall[data-beat="0"] .p0-sphere-chip[data-match] .p0-sphere-chip__body { animation: p0-recall-match 1s ease-in-out 1.4s 2 both; }
@keyframes p0-recall-match {
  50% { transform: scale(2.4); box-shadow: 0 0 calc(2 * var(--su)) rgba(var(--entity-rgb), 1); }
}
.p0-recall-search {
  position: absolute;
  z-index: 5;
  left: calc(6 * var(--su));
  top: calc(20.8 * var(--su));
  width: calc(38 * var(--su));
  height: calc(3.5 * var(--su));
  display: flex;
  align-items: center;
  gap: calc(.8 * var(--su));
  padding: 0 calc(1.2 * var(--su));
  border: 1px solid #e6cd9a55;
  border-radius: calc(1.1 * var(--su));
  background: linear-gradient(120deg, #22302ff2, #111918f5);
  box-shadow: 0 0 calc(3 * var(--su)) #e6cd9a1f, inset 0 1px #f3e6c91c;
  font-size: calc(1.7 * var(--su));
}
.p0-recall-search > .ui-icon { width: calc(1.8 * var(--su)); height: calc(1.8 * var(--su)); color: #e6cd9a; }
.p0-recall-search__query { color: #f7f2e8; font-weight: 520; }
.p0-recall-search__caret { width: 2px; height: 1.1em; background: #e6cd9a; }
.p0-stage--recall[data-beat="0"] .p0-recall-search__caret { animation: p0-recall-caret 1s steps(1) infinite; }
@keyframes p0-recall-caret { 50% { opacity: 0; } }
.p0-recall-search__hint { margin-left: auto; font: 500 calc(.75 * var(--su)) var(--mono); letter-spacing: .14em; text-transform: uppercase; color: #8f9c98; }
.p0-stage--recall[data-beat="0"] .p0-recall-search__query { animation: p0-recall-type 1.2s steps(4, end) .5s both; }
@keyframes p0-recall-type { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0 0 0 0); } }
.p0-recall-results { position: absolute; inset: 0; z-index: 5; margin: 0; padding: 0; list-style: none; pointer-events: none; }
.p0-recall-result {
  position: absolute;
  left: calc(6 * var(--su));
  width: calc(38 * var(--su));
  height: calc(1.8 * var(--su));
  display: flex;
  align-items: center;
  gap: calc(.6 * var(--su));
  padding: 0 calc(1 * var(--su));
  border-radius: calc(.6 * var(--su));
  border: 1px solid rgba(var(--entity-rgb), .3);
  background: linear-gradient(100deg, rgba(var(--entity-rgb), .14), #0f1716e6 55%);
  font-size: calc(1.05 * var(--su));
}
.p0-recall-result b { font-weight: 540; color: #f2eee6; white-space: nowrap; }
.p0-recall-result small { margin-left: auto; font-size: calc(.82 * var(--su)); color: #97a4a0; white-space: nowrap; }
.p0-stage--recall[data-beat="0"] .p0-recall-result { animation: p0-recall-fly 900ms var(--ease-out) calc(1.9s + var(--i) * 160ms) both; }
@keyframes p0-recall-fly {
  from { opacity: 0; transform: translate(var(--fx), var(--fy)) scale(.2); }
  40% { opacity: 1; }
}
.p0-recall-note {
  position: absolute;
  z-index: 5;
  left: calc(50 * var(--su));
  top: calc(25.4 * var(--su));
  width: calc(40 * var(--su));
  margin: 0;
  padding-left: calc(1.2 * var(--su));
  border-left: 2px solid #e6cd9a;
  font-size: calc(1.5 * var(--su));
  line-height: 1.3;
  color: #e9e3d4;
}
.p0-recall-search, .p0-recall-results, .p0-recall-note { transition: opacity .8s var(--ease), transform .8s var(--ease-out); }
.p0-stage--recall:not([data-beat="0"]) :is(.p0-recall-search, .p0-recall-results, .p0-recall-note) {
  opacity: 0;
  transform: translateY(calc(-4 * var(--su)));
  pointer-events: none;
}

/* --- Условия: веер (бит 1) и крылья у радара (биты 2–4) ---------------------- */

.p0-recall-conditions { position: absolute; inset: 0; z-index: 5; pointer-events: none; }
.p0-recall-cond-list { margin: 0; padding: 0; list-style: none; }
.p0-recall-cond-head,
.p0-recall-cond {
  position: absolute;
  left: calc(var(--wing-left) * var(--su));
  top: calc(var(--wing-top) * var(--su));
  transition: left 1s var(--ease-out), top 1s var(--ease-out), width 1s var(--ease-out), rotate 1s var(--ease-out),
    opacity .7s var(--ease), border-color .5s, box-shadow .5s, scale .5s var(--ease-out);
}
.p0-recall-cond-head {
  margin: 0;
  display: flex;
  align-items: center;
  gap: calc(.6 * var(--su));
  font: 500 calc(.75 * var(--su)) var(--mono);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #dcc699;
  white-space: nowrap;
}
.p0-recall-cond-head .p0-stage-badge { letter-spacing: .04em; text-transform: none; }
.p0-recall-cond {
  width: calc(26 * var(--su));
  display: grid;
  grid-template-columns: auto 1fr;
  column-gap: calc(.6 * var(--su));
  align-items: center;
  padding: calc(.25 * var(--su)) calc(.9 * var(--su));
  border: 1px solid rgba(var(--entity-rgb), .3);
  border-radius: calc(.7 * var(--su));
  background: linear-gradient(120deg, rgba(var(--entity-rgb), .12), #0f1716eb 60%);
  font-size: calc(.98 * var(--su));
  opacity: .55;
}
.p0-recall-cond[data-concept="true"] { border-style: dashed; }
.p0-recall-cond .entity-icon { grid-row: span 2; font-size: calc(1.35 * var(--su)); }
.p0-recall-cond b { font-weight: 560; color: #f2eee6; white-space: nowrap; }
.p0-recall-cond small { font-size: calc(.78 * var(--su)); color: #a0ada9; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.p0-recall-cond[data-active="true"] {
  opacity: 1;
  border-color: rgb(var(--entity-rgb));
  box-shadow: 0 0 calc(2.5 * var(--su)) rgba(var(--entity-rgb), .35);
  scale: 1.04;
}
.p0-stage--recall[data-beat="0"] :is(.p0-recall-cond, .p0-recall-cond-head) { opacity: 0; }
.p0-stage--recall[data-beat="1"] .p0-recall-cond-head { left: calc(6 * var(--su)); top: calc(var(--fan-top) * var(--su)); }
.p0-stage--recall[data-beat="1"] .p0-recall-cond {
  opacity: 1;
  left: calc(var(--fan-left) * var(--su));
  top: calc(var(--fan-top) * var(--su));
  width: calc(16.4 * var(--su));
  rotate: calc(var(--fan-rot) * 1deg);
  transition-delay: calc(var(--i) * 70ms);
}
.p0-stage--recall[data-beat="1"] .p0-recall-cond :is(b, small) { white-space: normal; }

/* --- Карточки битов 2–4 ------------------------------------------------------- */

.p0-recall-cards { position: absolute; inset: 0; z-index: 6; pointer-events: none; }
.p0-recall-group { transition: opacity .8s var(--ease), transform .9s var(--ease-out); }
.p0-recall-group:not([data-group="2"]),
.p0-stage--recall:not([data-beat="2"]) .p0-recall-group[data-group="2"] { opacity: 0; transform: translateY(calc(2 * var(--su))); }
.p0-stage--recall[data-beat="3"] .p0-recall-group[data-group="3"],
.p0-stage--recall[data-beat="4"] .p0-recall-group[data-group="4"] { opacity: 1; transform: none; }
.p0-stage--recall:is([data-beat="3"], [data-beat="4"]) .p0-recall-group[data-group="2"] { transform: translateY(calc(-3 * var(--su))); }

.p0-recall-card, .p0-recall-chain, .p0-recall-person-caption { position: absolute; top: calc(21.4 * var(--su)); }
.p0-recall-card {
  display: grid;
  align-content: start;
  gap: calc(.5 * var(--su));
  padding: calc(1 * var(--su)) calc(1.3 * var(--su));
  border: 1px solid #e6cd9a55;
  border-radius: calc(1.1 * var(--su));
  background: linear-gradient(135deg, #243231f2, #121a19f5 60%);
  box-shadow: inset 0 1px #f3e6c924, 0 0 calc(3 * var(--su)) #e6cd9a14;
}
.p0-recall-card::before {
  content: "";
  position: absolute;
  left: 8%;
  right: 30%;
  top: -1px;
  height: 1px;
  background: linear-gradient(90deg, transparent, #e6cd9a, #b7a2f5aa, transparent);
}
.p0-recall-card__eyebrow { display: flex; flex-wrap: wrap; align-items: center; gap: .5em; font: 500 calc(.8 * var(--su)) var(--mono); letter-spacing: .12em; text-transform: uppercase; color: #dcc699; }
.p0-recall-card__eyebrow .p0-stage-badge { margin-left: auto; letter-spacing: .04em; text-transform: none; }
.p0-recall-card p { margin: 0; font-size: calc(1.2 * var(--su)); color: #d8dedb; line-height: 1.3; }
.p0-recall-card .p0-recall-card__title { font-size: calc(1.7 * var(--su)); font-weight: 560; color: #f7f2e8; line-height: 1.2; }
.p0-recall-card__small { font-size: calc(.9 * var(--su)); color: #a0ada9; }
.p0-recall-budget { justify-self: start; padding: .2em .7em; border-radius: 999px; border: 1px solid #7ee1c855; font-size: calc(.9 * var(--su)); color: #b8e9da; white-space: nowrap; }

/* Бит 2: цепочка сценария H и вернувшаяся идея. */
.p0-recall-chain { left: calc(6 * var(--su)); width: calc(40 * var(--su)); display: grid; gap: calc(.6 * var(--su)); margin: 0; padding: 0; list-style: none; }
.p0-recall-chain li {
  position: relative;
  display: grid;
  grid-template-columns: auto 1fr;
  column-gap: calc(.7 * var(--su));
  align-items: center;
  padding: calc(.4 * var(--su)) calc(1 * var(--su));
  border: 1px solid rgba(var(--entity-rgb), .35);
  border-radius: calc(.7 * var(--su));
  background: linear-gradient(110deg, rgba(var(--entity-rgb), .12), #0f1716eb 60%);
}
.p0-recall-chain li + li::before {
  content: "";
  position: absolute;
  left: calc(1.7 * var(--su));
  bottom: 100%;
  height: calc(.6 * var(--su));
  border-left: 1px solid #e6cd9a88;
}
.p0-recall-chain .entity-icon { grid-row: span 2; font-size: calc(1.4 * var(--su)); }
.p0-recall-chain b { font: 500 calc(.75 * var(--su)) var(--mono); letter-spacing: .14em; text-transform: uppercase; color: #dcc699; }
.p0-recall-chain small { font-size: calc(1.05 * var(--su)); color: #e6ebe9; line-height: 1.25; }
.p0-stage--recall[data-beat="2"] .p0-recall-chain li { animation: p0-recall-rise .6s var(--ease-out) calc(.3s + var(--i) * 350ms) both; }
@keyframes p0-recall-rise { from { opacity: 0; transform: translateY(calc(1 * var(--su))); } }
.p0-recall-card--idea, .p0-recall-card--why, .p0-recall-card--plan { left: calc(50 * var(--su)); width: calc(44 * var(--su)); }
.p0-recall-card--why { top: calc(27.2 * var(--su)); }
.p0-recall-card--idea, .p0-recall-card--why { left: calc(48 * var(--su)); width: calc(46 * var(--su)); }
.p0-recall-card--idea .p0-recall-card__title { font-size: calc(1.3 * var(--su)); white-space: nowrap; }
.p0-recall-card--plan { gap: calc(.4 * var(--su)); }
.p0-recall-plan li { font-size: calc(1.05 * var(--su)); }
/* На телефоне бейджи внутри сцены масштабируются вместе с кадром. */
@media (max-width: 700px) {
  .p0-stage--recall :is(.p0-recall-cards, .p0-recall-conditions) .p0-stage-badge { font-size: calc(.8 * var(--su)); }
}
.p0-recall-card--project .p0-recall-card__title { font-size: calc(1.4 * var(--su)); }
.p0-recall-card--project .p0-recall-private b { font-size: calc(1.1 * var(--su)); }
.p0-recall-chain li { padding-block: calc(.3 * var(--su)); }
.p0-recall-chain small { font-size: calc(.95 * var(--su)); }
.p0-stage--recall[data-beat="2"] .p0-recall-card--idea { animation: p0-recall-return 900ms var(--ease-out) 1.4s both; }
@keyframes p0-recall-return {
  from { opacity: 0; transform: translate(calc(-2 * var(--su)), calc(-16 * var(--su))) scale(.12); }
  60% { opacity: 1; }
}
.p0-stage--recall[data-beat="2"] .p0-recall-card--why { transition-delay: 2.2s; }

/* Бит 3: сценарий C — частная идея в проекте и план проверки. */
.p0-recall-card--project { left: calc(6 * var(--su)); width: calc(40 * var(--su)); }
.p0-recall-private {
  display: grid;
  gap: calc(.25 * var(--su));
  padding: calc(.6 * var(--su)) calc(.9 * var(--su));
  border: 1px dashed rgba(var(--entity-rgb), .7);
  border-radius: calc(.7 * var(--su));
  background: rgba(var(--entity-rgb), .08);
}
.p0-recall-private__eyebrow { display: flex; align-items: center; gap: .4em; font: 500 calc(.72 * var(--su)) var(--mono); letter-spacing: .12em; text-transform: uppercase; color: rgb(var(--entity-rgb)); }
.p0-recall-private__eyebrow .ui-icon { width: 1.2em; height: 1.2em; }
.p0-recall-private b { font-size: calc(1.3 * var(--su)); font-weight: 560; color: #f7f2e8; }
.p0-recall-private small { font-size: calc(.9 * var(--su)); color: #a0ada9; }
.p0-recall-private .p0-recall-private__note { color: #b8e9da; }
.p0-recall-plan { display: grid; gap: calc(.45 * var(--su)); margin: 0; padding: 0; list-style: none; counter-reset: p0-recall-plan; }
.p0-recall-plan li { position: relative; padding-left: calc(2.2 * var(--su)); font-size: calc(1.15 * var(--su)); color: #e6ebe9; counter-increment: p0-recall-plan; }
.p0-recall-plan li::before {
  content: counter(p0-recall-plan);
  position: absolute;
  left: 0;
  width: calc(1.5 * var(--su));
  height: calc(1.5 * var(--su));
  display: grid;
  place-items: center;
  border: 1px solid #e6cd9a88;
  border-radius: 50%;
  font: 600 calc(.8 * var(--su)) var(--mono);
  color: #f1d9a3;
}
.p0-stage--recall[data-beat="3"] .p0-recall-plan li { animation: p0-recall-rise .6s var(--ease-out) calc(1.6s + var(--i) * 450ms) both; }
.p0-stage--recall[data-beat="3"] .p0-recall-card--plan .p0-recall-mock-btn { animation: p0-recall-rise .6s var(--ease-out) 3.4s both; }

/* Бит 4: окно, человек, место. */
.p0-recall-card--window, .p0-recall-card--person, .p0-recall-card--place { width: calc(28.6 * var(--su)); min-height: calc(9.6 * var(--su)); }
.p0-recall-card--window { left: calc(6 * var(--su)); }
.p0-recall-card--person { left: calc(35.7 * var(--su)); }
.p0-recall-card--place { left: calc(65.4 * var(--su)); }
.p0-recall-card--window p { font-size: calc(1.05 * var(--su)); }
.p0-recall-card--person .p0-recall-card__title, .p0-recall-card--place .p0-recall-card__title { font-size: calc(1.4 * var(--su)); }
.p0-stage--recall[data-beat="4"] .p0-recall-card--person { transition-delay: .5s; }
.p0-stage--recall[data-beat="4"] .p0-recall-card--place { transition-delay: 1s; }
.p0-recall-card__footer { display: flex; flex-wrap: wrap; align-items: center; gap: calc(.7 * var(--su)); }
.p0-recall-card__actions { display: flex; flex-wrap: wrap; gap: calc(.5 * var(--su)); }
.p0-recall-mock-btn { justify-self: start; padding: .3em .9em; border-radius: 999px; border: 1px solid #e6cd9a44; font-size: calc(.95 * var(--su)); color: #efe6d2; background: #e6cd9a14; white-space: nowrap; }
.p0-recall-mock-btn:first-child, .p0-recall-mock-btn--primary { background: #e6cd9a; color: #1c2a29; font-weight: 560; }
.p0-recall-quiet { display: inline-flex; align-items: center; gap: calc(.5 * var(--su)); font-size: calc(.9 * var(--su)); color: #c9d0cd; }
.p0-recall-quiet small { font-size: calc(.8 * var(--su)); color: #97a4a0; }
.p0-recall-switch { position: relative; width: calc(2.2 * var(--su)); height: calc(1.2 * var(--su)); border-radius: 999px; background: #7ee1c855; }
.p0-recall-switch::after { content: ""; position: absolute; right: 2px; top: 2px; bottom: 2px; aspect-ratio: 1; border-radius: 50%; background: #d9f5ec; }
.p0-recall-card--person p { display: flex; gap: .4em; align-items: baseline; }
.p0-recall-confirmed { font-size: calc(1 * var(--su)); color: #8fe0b5; }
.p0-recall-person-caption {
  top: calc(32.2 * var(--su));
  left: calc(6 * var(--su));
  width: calc(88 * var(--su));
  display: flex;
  align-items: center;
  gap: calc(1.2 * var(--su));
  font-size: calc(1.15 * var(--su));
  color: #e6d6b3;
}
.p0-recall-person-caption i { font-style: italic; }
.p0-stage--recall[data-beat="4"] .p0-recall-person-caption { transition-delay: 1.6s; }

/* --- Лента дня: приёмник эстафеты «day-strip» --------------------------------- */

.p0-recall-day { position: absolute; z-index: 4; left: calc(6 * var(--su)); width: calc(88 * var(--su)); top: calc(36.2 * var(--su)); }
.p0-recall-day__track {
  position: relative;
  height: calc(2.4 * var(--su));
  border-radius: calc(.5 * var(--su));
  background: linear-gradient(90deg, #ffffff0a, #ffffff05);
  border: 1px solid #ffffff14;
}
.p0-recall-day__hour {
  position: absolute;
  bottom: calc(100% + .3 * var(--su));
  translate: -50% 0;
  font: 500 calc(.7 * var(--su)) var(--mono);
  color: #7f8c88;
}
.p0-recall-day__block {
  position: absolute;
  top: 2px;
  bottom: 2px;
  display: flex;
  align-items: center;
  gap: .25em;
  padding: 0 .35em;
  overflow: hidden;
  border-radius: calc(.4 * var(--su));
  border: 1px solid rgba(var(--entity-rgb), .55);
  background: rgba(var(--entity-rgb), .18);
  font-size: calc(.72 * var(--su));
  color: #e6ebe9;
  white-space: nowrap;
}
.p0-recall-day__block[data-protected="true"] {
  background: repeating-linear-gradient(135deg, rgba(var(--entity-rgb), .22) 0 4px, rgba(var(--entity-rgb), .1) 4px 8px);
}
.p0-recall-day__block .ui-icon { width: 1.05em; height: 1.05em; flex: none; }
.p0-recall-day__window { position: absolute; top: -2px; bottom: -2px; border-radius: calc(.4 * var(--su)); border: 1px dashed #7ee1c855; transition: box-shadow .8s, background .8s; }
.p0-stage--recall[data-beat="4"] .p0-recall-day__window {
  background: #7ee1c822;
  box-shadow: 0 0 calc(2 * var(--su)) #7ee1c866;
  animation: cs-breathe 2.4s ease-in-out infinite;
}
/* Сигналы — под лентой: над ней место карточек бита. */
.p0-recall-day__signal {
  position: absolute;
  top: calc(100% + .5 * var(--su));
  translate: -50% 0;
  padding: .1em .6em;
  border-radius: 999px;
  border: 1px solid #e6cd9a66;
  background: #121a19f2;
  font-size: calc(.8 * var(--su));
  color: #f1d9a3;
  white-space: nowrap;
  opacity: 0;
  transition: opacity .6s;
}
/* На последнем бите два сигнала рядом: Нина — влево от своей точки,
   книжный магазин (концепт) — вправо. */
.p0-recall-day__signal[data-k="2"] { translate: -100% 0; }
.p0-recall-day__signal[data-k="3"] { translate: 0 0; border-style: dashed; border-color: rgba(var(--lav-rgb), .6); color: #d4c8fa; }
.p0-stage--recall[data-beat="2"] .p0-recall-day__signal[data-beat="2"],
.p0-stage--recall[data-beat="3"] .p0-recall-day__signal[data-beat="3"],
.p0-stage--recall[data-beat="4"] .p0-recall-day__signal[data-beat="4"] { opacity: 1; transition-delay: .9s; }
.p0-recall-day__now {
  position: absolute;
  top: calc(-1 * var(--su));
  bottom: calc(-.5 * var(--su));
  width: 2px;
  margin-left: -1px;
  background: #f5e6c4;
  box-shadow: 0 0 10px #e6cd9a;
  transition: left 2s var(--ease-out);
}
.p0-recall-day__now span {
  position: absolute;
  bottom: 100%;
  left: 50%;
  translate: -50% 0;
  font: 600 calc(.75 * var(--su)) var(--mono);
  color: #f5e6c4;
  white-space: nowrap;
}
