html.remembered-pending #content { visibility: hidden; }
html.memory-active, html.memory-forgetting, html.memory-closed { overflow: hidden; overscroll-behavior: none; }
.memory-active #content, .memory-active #ride-ui, .memory-forgetting #ride-ui,
.memory-closed #content, .memory-closed #ride-ui, .memory-closed #ride-canvas, .memory-closed #ride-display,
.memory-active #bg-canvas, .memory-closed #bg-canvas,
.memory-active .color-flip, .memory-forgetting .color-flip, .memory-closed .color-flip,
.memory-active .presence-sign, .memory-forgetting .presence-sign, .memory-closed .presence-sign,
.memory-active .liminal-floor, .memory-closed .liminal-floor { visibility: hidden !important; }
#remembered-ending[hidden], #memory-quiet[hidden] { display: none; }
#remembered-ending {
  position: fixed; inset: 0; z-index: 12; color: var(--ride-ink);
  display: grid; place-items: center; padding: 10vh 7vw;
  font-family: var(--f-frag); isolation: isolate;
}
#remembered-ending.is-flat {
  background: radial-gradient(ellipse at 18% 72%, oklch(39% .09 290 / .35), transparent 65%),
    radial-gradient(ellipse at 84% 20%, oklch(38% .07 220 / .28), transparent 57%), var(--ride-ground);
}
#remembered-ending canvas { position: absolute; inset: 0; width: 100%; height: 100%; z-index: -1; }
#remembered-ending:not(.is-flat) canvas { display: none; }
.memory-writing { width: min(calc(650 * var(--ride-ui-unit)), 100%); transform: translateY(-3vh); }
.memory-phrase {
  min-height: 9em; display: grid; place-items: center; margin: 0 auto calc(48 * var(--ride-ui-unit)); max-width: 32ch;
  text-align: center; font-size: clamp(calc(20 * var(--ride-ui-unit)), 2.25vw, calc(33 * var(--ride-ui-unit))); line-height: 1.9; letter-spacing: .025em;
  color: var(--ride-ink); text-shadow: 0 0 calc(28 * var(--ride-ui-unit)) oklch(79% .06 210 / .28);
  transition: filter 1.5s ease, transform 1.5s ease, color 1.5s ease;
}
.memory-phrase:not(.is-present) { color: transparent; filter: blur(5px); transform: translateY(-7px); }
.memory-links { display: flex; flex-wrap: wrap; gap: calc(16 * var(--ride-ui-unit)) calc(27.2 * var(--ride-ui-unit)); align-items: center; justify-content: center; }
.memory-links a { color: var(--ride-secondary); text-decoration: none; font: calc(14 * var(--ride-ui-unit)) var(--f-digital); letter-spacing: .05em; display: inline-flex; align-items: center; gap: calc(8 * var(--ride-ui-unit)); }
.memory-links a:hover, .memory-links a:focus-visible { color: var(--ride-cyan); }
.memory-links svg { width: calc(15 * var(--ride-ui-unit)); height: calc(15 * var(--ride-ui-unit)); }
.memory-forget { position: absolute; bottom: max(4vh, calc(24 * var(--ride-ui-unit))); right: 5vw; background: color-mix(in oklab, var(--ride-ground) 82%, transparent); border: 1px solid var(--ride-line); color: var(--ride-secondary); font: calc(14 * var(--ride-ui-unit)) var(--f-frag); letter-spacing: .06em; cursor: pointer; padding: calc(12 * var(--ride-ui-unit)) calc(18 * var(--ride-ui-unit)); }
.memory-forget:hover, .memory-forget:focus-visible { color: var(--ride-ink); border-color: var(--ride-cyan); }
.memory-dialog { position: fixed; inset: 0; margin: auto; max-width: min(calc(560 * var(--ride-ui-unit)), 88vw); padding: calc(40 * var(--ride-ui-unit)); border: 1px solid var(--ride-line); background: var(--ride-panel); color: var(--ride-ink); font-family: var(--f-frag); }
.memory-dialog::backdrop { background: oklch(10% .01 300 / .76); backdrop-filter: blur(8px); }
.memory-dialog > p { font-size: clamp(calc(22 * var(--ride-ui-unit)), 2.3vw, calc(30 * var(--ride-ui-unit))); line-height: 1.6; margin: 0 0 calc(32 * var(--ride-ui-unit)); }
.memory-dialog > div:has([data-stay]) { display: flex; gap: calc(20.8 * var(--ride-ui-unit)); flex-wrap: wrap; }
.memory-dialog button { border: 0; border-bottom: 1px solid var(--ride-line); padding: calc(10 * var(--ride-ui-unit)) 0; background: transparent; color: var(--ride-secondary); font: calc(16 * var(--ride-ui-unit)) var(--f-frag); cursor: pointer; }
.memory-dialog button:focus-visible, .memory-dialog button:hover { color: var(--ride-cyan); }
.memory-dialog button:focus-visible { outline: 1px dashed var(--ride-cyan); outline-offset: 6px; }
.memory-records { max-width: min(calc(980 * var(--ride-ui-unit)), 93vw); width: calc(980 * var(--ride-ui-unit)); max-height: 88vh; overflow-y: auto; overscroll-behavior: contain; }
.memory-records-content { zoom: calc(var(--ride-ui-unit) / 1px); }
.memory-records .hscroll { flex-wrap: wrap; overflow: visible; padding-inline: 0; }
.memory-records .case-card { width: min(100%, 390px); }
.memory-records .memory-close { position: sticky; top: 0; z-index: 2; display: block; margin-left: auto; font-size: calc(27 * var(--ride-ui-unit)); padding: 0 calc(10 * var(--ride-ui-unit)); background: var(--ride-panel); }
#memory-quiet { position: fixed; inset: 0; z-index: 20; display: grid; place-content: center; gap: calc(32 * var(--ride-ui-unit)); padding: 10vw; background: var(--ride-ground); text-align: center; font-family: var(--f-frag); color: var(--ride-secondary); }
#memory-quiet p { font-size: clamp(calc(20 * var(--ride-ui-unit)), 2.4vw, calc(30 * var(--ride-ui-unit))); }
#memory-quiet a { font: calc(12 * var(--ride-ui-unit)) var(--f-digital); color: var(--ride-muted); text-decoration: none; }
.memory-closed body::before, .memory-closed body::after { display: none; }
@media (prefers-reduced-motion: reduce) { .memory-phrase { transition: none; } }

#remembered-ending::before { content: ""; position: absolute; inset: -10%; pointer-events: none; z-index: -1; background: transparent; }
html[data-memory-state="arriving"] #remembered-ending::before { animation: memory-arrival 3.2s ease-out both; }
@keyframes memory-arrival {
  0% { background: radial-gradient(ellipse, oklch(88% .055 230 / 0), transparent 70%); transform: scale(.65); }
  35% { background: radial-gradient(ellipse, oklch(88% .055 230 / .28), transparent 70%); }
  100% { background: radial-gradient(ellipse, oklch(88% .055 230 / 0), transparent 70%); transform: scale(1.35); }
}
@media (prefers-reduced-motion: reduce) { html[data-memory-state="arriving"] #remembered-ending::before { animation: none; } }