:root {
  color-scheme: light;
  --ink: #17211d;
  --muted: #718079;
  --line: rgba(38, 61, 52, 0.11);
  --green: #31c98c;
  --green-dark: #0c7150;
  --violet: #7667e8;
  --orange: #f19a58;
  --blue: #4e8cc9;
  --shadow: 0 42px 110px rgba(17, 26, 23, 0.34);
}

* { box-sizing: border-box; }
html, body { width: 100%; height: 100%; }
body {
  margin: 0;
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 12%, #f5f0e6 0, #d9d2c5 58%, #b7b0a5 100%);
  color: var(--ink);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
button { font: inherit; }

.stage {
  display: grid;
  width: 100%;
  height: 100%;
  place-items: center;
  padding: clamp(16px, 3vw, 44px);
}
.computer {
  position: relative;
  width: min(1380px, 96vw, calc(92vh * 16 / 10.2));
  aspect-ratio: 16 / 10.2;
  border: clamp(8px, 1.2vw, 16px) solid #171b20;
  border-bottom-width: clamp(18px, 2.2vw, 28px);
  border-radius: clamp(16px, 2vw, 28px);
  background: #171b20;
  box-shadow: var(--shadow);
}
.camera-dot {
  position: absolute;
  z-index: 8;
  top: calc(clamp(8px, 1.2vw, 16px) * -0.72);
  left: 50%;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #353b42;
  transform: translateX(-50%);
}
.screen {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: 9px;
  background: #a8ccc2;
}
.computer-base {
  position: absolute;
  bottom: clamp(-38px, -3vw, -26px);
  left: 50%;
  width: 44%;
  height: clamp(18px, 2vw, 28px);
  border-radius: 0 0 70% 70%;
  background: linear-gradient(180deg, #878b8e, #c7c8c9);
  transform: translateX(-50%);
  box-shadow: 0 14px 24px rgba(35, 38, 40, 0.24);
}
.desktop {
  position: absolute;
  inset: 0;
  overflow: hidden;
  background:
    radial-gradient(circle at 13% 20%, rgba(255, 255, 255, 0.88), transparent 26%),
    radial-gradient(circle at 88% 14%, rgba(92, 209, 169, 0.72), transparent 30%),
    linear-gradient(140deg, #dcebe3 0%, #94c8bb 43%, #677f9e 100%);
}
.desktop::after {
  position: absolute;
  inset: 0;
  content: "";
  pointer-events: none;
  background: linear-gradient(115deg, transparent 42%, rgba(255, 255, 255, 0.14));
}
.menu-bar {
  position: relative;
  z-index: 9;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 4.5%;
  min-height: 28px;
  background: rgba(244, 249, 247, 0.76);
  color: #25323a;
  padding: 0 1.25%;
  font-size: clamp(8px, 0.85vw, 12px);
  backdrop-filter: blur(18px);
}
.menu-left, .menu-right { display: flex; align-items: center; gap: 16px; }
.menu-logo {
  display: grid;
  width: 22px;
  height: 22px;
  place-items: center;
  border-radius: 7px;
  background: linear-gradient(145deg, #14372a, #35ad7e);
  color: #d7fff0;
  box-shadow: 0 4px 10px rgba(37, 151, 109, 0.2);
}
.menu-logo svg { width: 16px; height: 16px; overflow: visible; }
.menu-logo path { fill: none; stroke: currentColor; stroke-width: 2.5; stroke-linecap: round; }
.menu-logo circle { fill: currentColor; }
.desktop-note {
  position: absolute;
  top: 12%;
  right: 6%;
  display: grid;
  width: 12%;
  min-width: 106px;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, 0.48);
  border-radius: 22px;
  background: rgba(248, 252, 250, 0.25);
  color: white;
  padding: 2.4% 1%;
  text-shadow: 0 1px 8px rgba(20, 40, 35, 0.22);
  backdrop-filter: blur(15px);
}
.desktop-note span { font-size: clamp(7px, 0.7vw, 10px); font-weight: 850; letter-spacing: 0.16em; }
.desktop-note strong { margin: 8% 0 4%; font-size: clamp(22px, 3.2vw, 46px); letter-spacing: -0.07em; line-height: 0.9; }
.desktop-note small { font-size: clamp(7px, 0.65vw, 10px); font-weight: 750; opacity: 0.82; }

.cursor {
  position: absolute;
  z-index: 30;
  top: 24%;
  left: 78%;
  width: clamp(20px, 2vw, 30px);
  filter: drop-shadow(0 2px 2px rgba(0, 0, 0, 0.25));
  transition: top 650ms cubic-bezier(0.2, 0.8, 0.2, 1), left 650ms cubic-bezier(0.2, 0.8, 0.2, 1), transform 120ms ease, opacity 180ms ease;
}
.cursor.to-terminal { top: 88%; left: 62%; }
.cursor.to-stock { top: 55%; left: 88%; }
.cursor.to-stock-scroll { top: 68%; left: 80%; }
.cursor.clicking { transform: scale(0.78); }
.cursor.hidden { opacity: 0; }
.cursor.scrolling { animation: cursor-scroll 850ms ease-in-out infinite; }

.terminal-window, .assistant-window, .stock-detail-window {
  position: absolute;
  z-index: 6;
  overflow: hidden;
  border: 1px solid rgba(31, 51, 43, 0.16);
  border-radius: clamp(13px, 1.5vw, 21px);
  box-shadow: 0 30px 80px rgba(27, 42, 36, 0.3);
}
.terminal-window {
  top: 24%;
  left: 23%;
  width: 54%;
  height: 39%;
  opacity: 0;
  background: rgba(17, 24, 22, 0.96);
  color: #e9fff6;
  transform: scale(0.72) translateY(24%);
  transform-origin: 70% 100%;
  transition: opacity 250ms ease, transform 410ms cubic-bezier(0.18, 0.9, 0.2, 1);
}
.terminal-window.open { opacity: 1; transform: scale(1) translateY(0); }
.terminal-window.complete { opacity: 0; transform: scale(1.07) translateY(-5%); }
.window-header {
  display: flex;
  align-items: center;
  min-height: 15%;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  padding: 0 2.5%;
}
.traffic-lights { display: flex; gap: 6px; width: 30%; }
.traffic-lights span { width: clamp(7px, 0.75vw, 11px); height: clamp(7px, 0.75vw, 11px); border-radius: 50%; background: #ff5f57; }
.traffic-lights span:nth-child(2) { background: #febc2e; }
.traffic-lights span:nth-child(3) { background: #28c840; }
.terminal-header strong { flex: 1; color: #cfd9d4; font-size: clamp(8px, 0.85vw, 12px); text-align: center; }
.terminal-header > span { width: 30%; color: #6e7c76; font-size: clamp(7px, 0.65vw, 10px); text-align: right; }
.terminal-body { padding: 6% 7%; font-family: "SFMono-Regular", Consolas, monospace; }
.terminal-prompt { display: flex; align-items: center; min-height: 1.5em; font-size: clamp(14px, 1.8vw, 26px); }
.prompt-path { margin-right: 12px; color: #66e8b4; font-weight: 850; }
.command-caret { width: 0.55em; height: 1.05em; margin-left: 3px; background: #72efbd; animation: blink 650ms steps(1) infinite; }
.command-caret.enter { width: 0; animation: none; }
.boot-status {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 8%;
  opacity: 0;
  transform: translateY(8px);
  transition: opacity 180ms ease, transform 180ms ease;
}
.boot-status.visible { opacity: 1; transform: translateY(0); }
.boot-status div { display: grid; gap: 3px; }
.boot-status strong { color: #bcefd9; font-family: inherit; font-size: clamp(8px, 0.85vw, 12px); }
.boot-status small { color: #73857e; font-family: inherit; font-size: clamp(7px, 0.65vw, 10px); }
.boot-spinner { width: 16px; height: 16px; border: 2px solid #3a4a44; border-top-color: #66e8b4; border-radius: 50%; animation: spin 700ms linear infinite; }

.assistant-window {
  inset: 6% 5% 8%;
  opacity: 0;
  background:
    radial-gradient(circle at 90% 3%, rgba(104, 222, 174, 0.14), transparent 25%),
    linear-gradient(145deg, #fbfcf8, #f3f5ef);
  transform: scale(0.91) translateY(4%);
  transition: opacity 360ms ease, transform 540ms cubic-bezier(0.18, 0.9, 0.2, 1);
}
.assistant-window.visible { opacity: 1; transform: scale(1) translateY(0); }
.assistant-window.receded { opacity: 0.28; transform: scale(0.94) translateY(0); filter: blur(2px); }
.assistant-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 9%;
  border-bottom: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.72);
  padding: 0 3%;
}
.brand-lockup { display: flex; align-items: center; gap: 10px; }
.brand-lockup div, .assistant-date { display: grid; gap: 2px; }
.brand-lockup strong { font-size: clamp(9px, 0.95vw, 14px); }
.brand-lockup small { display: flex; align-items: center; gap: 5px; color: var(--green-dark); font-size: clamp(6px, 0.6vw, 9px); font-weight: 750; }
.brand-lockup small i { width: 6px; height: 6px; border-radius: 50%; background: var(--green); }
.agent-mark {
  display: grid;
  width: clamp(27px, 2.8vw, 40px);
  aspect-ratio: 1;
  place-items: center;
  border-radius: 11px;
  background: linear-gradient(145deg, #14372a, #35ad7e);
  color: #c6ffe9;
  font-size: clamp(7px, 0.7vw, 10px);
  font-weight: 900;
  box-shadow: 0 8px 20px rgba(37, 151, 109, 0.22);
}
.agent-mark svg { width: 70%; height: 70%; overflow: visible; }
.agent-mark path { fill: none; stroke: currentColor; stroke-width: 2.5; stroke-linecap: round; }
.agent-mark circle { fill: currentColor; }
.assistant-date { text-align: right; }
.assistant-date strong { font-size: clamp(8px, 0.78vw, 12px); }
.assistant-date span { color: var(--muted); font-size: clamp(6px, 0.58vw, 9px); }
.day-heading { display: flex; align-items: center; justify-content: space-between; opacity: 0; transform: translateY(8px); transition: opacity 260ms ease, transform 260ms ease; }
.day-heading.visible { opacity: 1; transform: translateY(0); }
.day-heading div { display: grid; gap: 2px; }
.day-heading strong { font-size: clamp(15px, 1.8vw, 27px); letter-spacing: -0.045em; }
.day-heading small { color: var(--muted); font-size: clamp(7px, 0.7vw, 10px); }
.weather-pill { border-radius: 999px; background: #e9f5ef; color: var(--green-dark); padding: 6px 10px; font-size: clamp(6px, 0.6vw, 9px); font-weight: 800; }

.important-card { display: grid; gap: 14px; opacity: 0; margin-top: 2%; border: 1px solid #ecd9cb; border-radius: clamp(10px, 1vw, 14px); background: linear-gradient(90deg, #fff8f2, #fffdf9); padding: 2.6% 3%; transform: translateY(8px); transition: opacity 260ms ease, transform 300ms ease; }
.important-card.visible { opacity: 1; transform: translateY(0); }
.important-title { display: grid; gap: 5px; }
.important-title span { color: #af5c2b; font-size: clamp(10px, 0.95vw, 14px); font-weight: 900; letter-spacing: 0.13em; }
.important-title strong { font-size: clamp(15px, 1.5vw, 22px); }
.result-source { color: #7b6c63; font-size: clamp(10px, 0.86vw, 13px); font-weight: 650; line-height: 1.35; }
.important-items { display: grid; gap: 8px; }
.important-items span { display: flex; align-items: center; color: #544b45; font-size: clamp(12px, 1.15vw, 17px); font-weight: 700; line-height: 1.35; }
.important-items b { display: inline-grid; flex: 0 0 auto; width: 26px; height: 26px; place-items: center; margin-right: 10px; border-radius: 50%; background: #f8e5d8; color: #9d4d20; font-size: 10px; }

.schedule-card {
  opacity: 0;
  margin-top: 1.1%;
  border: 1px solid var(--line);
  border-radius: clamp(12px, 1.25vw, 18px);
  background: linear-gradient(115deg, #173b30, #245b49);
  color: white;
  padding: 1.3% 2%;
  transform: translateY(10px);
  box-shadow: 0 16px 32px rgba(31, 75, 59, 0.15);
  transition: opacity 300ms ease, transform 350ms cubic-bezier(0.18, 0.9, 0.2, 1);
}
.schedule-card.visible { opacity: 1; transform: translateY(0); }
.schedule-header { display: flex; align-items: center; justify-content: space-between; }
.section-label { color: #7ce0b8; font-size: clamp(5px, 0.54vw, 8px); font-weight: 900; letter-spacing: 0.14em; }
.schedule-header h1 { margin: 2px 0 0; font-size: clamp(11px, 1.25vw, 18px); letter-spacing: -0.025em; }
.schedule-source { color: #b6d1c5; }
.schedule-count { border-radius: 999px; background: rgba(255, 255, 255, 0.11); color: #d5e9e0; padding: 5px 8px; font-size: clamp(5px, 0.54vw, 8px); }
.schedule-line { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.6%; margin-top: 1%; }
.schedule-line article { display: grid; grid-template-columns: auto auto 1fr; align-items: center; gap: 8px; min-width: 0; border-left: 1px solid rgba(255, 255, 255, 0.12); padding-left: 8%; }
.schedule-line article:first-child { border-left: 0; padding-left: 0; }
.schedule-line time { color: #acd0c0; font-size: clamp(6px, 0.62vw, 9px); font-weight: 800; }
.schedule-line article div { display: grid; gap: 1px; min-width: 0; }
.schedule-line strong { overflow: hidden; font-size: clamp(7px, 0.72vw, 11px); text-overflow: ellipsis; white-space: nowrap; }
.schedule-line small { overflow: hidden; color: #a9c7ba; font-size: clamp(5px, 0.52vw, 8px); text-overflow: ellipsis; white-space: nowrap; }
.event-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 3px rgba(49, 201, 140, 0.15); }
.event-dot.meeting { background: #9b8ff5; }
.event-dot.lunch { background: #f5a56e; }
.event-dot.company { background: #73aee7; }

.report-sections { display: grid; grid-template-rows: repeat(6, minmax(94px, auto)); gap: 10px; height: auto; margin: 2% 0 3%; opacity: 0; transform: translateY(10px); transition: opacity 300ms ease, transform 350ms cubic-bezier(0.18, 0.9, 0.2, 1); }
.report-sections.visible { opacity: 1; transform: translateY(0); }
.report-section { overflow: hidden; opacity: 0; border: 1px solid var(--line); border-radius: clamp(11px, 1.1vw, 16px); background: rgba(255, 255, 255, 0.9); transform: translateY(10px); box-shadow: 0 8px 22px rgba(39, 61, 51, 0.055); transition: opacity 280ms ease, transform 320ms ease; }
.report-section.visible { opacity: 1; transform: translateY(0); }
.report-trigger { display: grid; grid-template-columns: auto 1fr auto auto; align-items: center; gap: 1.4%; width: 100%; height: 100%; min-height: 94px; border: 0; background: transparent; color: inherit; padding: 12px 16px; text-align: left; pointer-events: none; }
.report-icon { display: grid; width: clamp(44px, 4vw, 56px); aspect-ratio: 1; place-items: center; border-radius: 11px; background: #e6f5ee; color: var(--green-dark); font-family: "Apple Color Emoji", "Segoe UI Emoji", sans-serif; font-size: clamp(24px, 2.3vw, 32px); font-weight: 900; }
.news-section .report-icon { background: #eceaff; color: #594bc4; }
.food-section .report-icon { background: #fff0df; color: #ad5b21; }
.work-section .report-icon { background: #e8f1fa; color: #3478b6; }
.deals-section .report-icon { background: #fff4cf; color: #9b6a00; }
.secondhand-section .report-icon { background: #f1e9fb; color: #7145a7; }
.report-title { display: grid; gap: 2px; }
.report-title strong { font-size: clamp(16px, 1.45vw, 21px); }
.report-title small { display: block; color: #78847e; font-size: clamp(11px, 0.95vw, 14px); font-weight: 650; line-height: 1.3; }
.report-status { border-radius: 999px; background: #f0f2f1; color: #68756f; padding: 6px 10px; font-size: clamp(11px, 0.95vw, 14px); font-weight: 850; }
.report-status.positive { background: #e6f7ef; color: var(--green-dark); }
.report-arrow { color: #829089; font-size: clamp(18px, 1.7vw, 24px); font-weight: 800; }

.stock-detail-window {
  top: 14%;
  left: 37%;
  z-index: 12;
  width: 58%;
  height: 77%;
  opacity: 0;
  background:
    radial-gradient(circle at 92% 5%, rgba(91, 217, 166, 0.16), transparent 27%),
    linear-gradient(145deg, #fbfcf9, #f1f4ef);
  transform: scale(0.88) translateY(5%);
  transition: opacity 360ms ease, transform 520ms cubic-bezier(0.18, 0.9, 0.2, 1);
}
.stock-detail-window.visible { opacity: 1; transform: scale(1) translateY(0); }
.detail-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 9%;
  border-bottom: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.76);
  padding: 0 3%;
}
.detail-brand, .market-state { display: flex; align-items: center; gap: 10px; }
.detail-brand div, .market-state div { display: grid; gap: 2px; }
.detail-mark {
  display: grid;
  width: clamp(28px, 2.8vw, 40px);
  aspect-ratio: 1;
  place-items: center;
  border-radius: 11px;
  background: #173c2f;
  color: #79e0b7;
  font-size: clamp(6px, 0.6vw, 9px);
  font-weight: 900;
}
.detail-brand span, .market-state span { color: var(--muted); font-size: clamp(5px, 0.52vw, 8px); font-weight: 800; letter-spacing: 0.09em; }
.detail-brand strong, .market-state strong { font-size: clamp(8px, 0.8vw, 12px); }
.market-state i { width: 7px; height: 7px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 4px rgba(49, 201, 140, 0.13); }
.stock-scroll {
  height: 91%;
  overflow: hidden;
  scroll-behavior: smooth;
}
.stock-overview {
  display: grid;
  min-height: 100%;
  align-content: center;
  justify-items: center;
  padding: 7%;
  text-align: center;
}
.detail-eyebrow, .feed-heading > span, .story-news > span { color: var(--green-dark); font-size: clamp(5px, 0.54vw, 8px); font-weight: 900; letter-spacing: 0.13em; }
.stock-overview h1 { max-width: 76%; margin: 1.5% 0; font-size: clamp(26px, 3.8vw, 55px); letter-spacing: -0.06em; line-height: 1; }
.stock-overview > p { max-width: 62%; margin: 0; color: var(--muted); font-size: clamp(8px, 0.9vw, 13px); line-height: 1.5; }
.stock-overview > p strong { color: var(--green-dark); }
.overview-facts { display: flex; gap: 10px; margin-top: 4%; }
.overview-facts span { border-radius: 999px; background: white; color: var(--muted); padding: 8px 12px; font-size: clamp(6px, 0.62vw, 9px); box-shadow: 0 7px 18px rgba(39, 61, 51, 0.07); }
.overview-facts b { color: #33423b; }
.scroll-prompt { display: flex; align-items: center; gap: 8px; margin-top: 7%; color: #7b8882; font-size: clamp(6px, 0.62vw, 9px); }
.scroll-prompt span { display: grid; width: 24px; height: 24px; place-items: center; border-radius: 50%; background: #e5f4ed; color: var(--green-dark); }
.stock-feed { min-height: 100%; padding: 7% 8% 10%; background: #f7f8f4; }
.feed-heading { margin-bottom: 4%; }
.feed-heading h2 { margin: 0.8% 0; font-size: clamp(18px, 2.3vw, 33px); letter-spacing: -0.045em; }
.feed-heading p { margin: 0; color: var(--muted); font-size: clamp(7px, 0.7vw, 10px); }
.stock-story {
  display: grid;
  grid-template-columns: 24% 1fr auto;
  align-items: center;
  gap: 3%;
  border-top: 1px solid #dfe5e1;
  padding: 3.4% 0;
}
.story-stock { display: flex; align-items: center; gap: 10px; }
.story-stock div, .story-news { display: grid; gap: 2px; }
.story-ticker { display: grid; width: clamp(34px, 3.5vw, 50px); aspect-ratio: 1; place-items: center; border-radius: 11px; background: #e4f3ec; color: var(--green-dark); font-size: clamp(6px, 0.62vw, 9px); font-weight: 900; }
.story-stock strong { font-size: clamp(8px, 0.82vw, 12px); }
.story-stock small { color: var(--muted); font-size: clamp(5px, 0.52vw, 8px); }
.story-news strong { font-size: clamp(8px, 0.86vw, 13px); line-height: 1.3; }
.story-news p { margin: 2px 0 0; color: var(--muted); font-size: clamp(6px, 0.6vw, 9px); line-height: 1.4; }
.story-action { min-width: 58px; border-radius: 999px; padding: 6px 8px; font-size: clamp(5px, 0.5vw, 7px); font-weight: 900; text-align: center; }
.story-action.watch { background: #fff0df; color: #ad5b21; }
.story-action.hold { background: #e4f4ec; color: var(--green-dark); }
.story-action.research { background: #eceaff; color: #594bc4; }

@keyframes spin { to { transform: rotate(360deg); } }
@keyframes blink { 50% { opacity: 0; } }
@keyframes cursor-scroll { 50% { transform: translateY(14px); } }
@keyframes prep-pulse { 50% { opacity: 0.45; transform: scale(0.82); } }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 1ms !important; transition-duration: 1ms !important; }
}
@media (max-aspect-ratio: 4 / 5) {
  .stage { padding: 10px; }
  .computer { width: 98vw; transform: rotate(90deg) scale(0.62); }
}

/* ---- Stock scene rewrite: causal chain + memory receipts ---- */

.causal-chain { display: grid; gap: 0; margin: 0 0 6%; padding: 0; list-style: none; }
.chain-link {
  position: relative;
  display: grid;
  gap: 3px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: white;
  padding: 2.4% 3%;
  opacity: 0;
  transform: translateY(14px);
  box-shadow: 0 10px 26px rgba(39, 61, 51, 0.06);
  transition: opacity 340ms ease, transform 340ms ease;
}
.chain-link.visible { opacity: 1; transform: translateY(0); }
.chain-link + .chain-link { margin-top: 26px; }
.chain-link + .chain-link::before {
  content: "↓";
  position: absolute;
  top: -23px;
  left: 50%;
  display: grid;
  width: 20px;
  height: 20px;
  place-items: center;
  transform: translateX(-50%);
  color: var(--green);
  font-size: 13px;
  font-weight: 900;
}
.chain-scope { color: var(--green-dark); font-size: clamp(5px, 0.54vw, 8px); font-weight: 900; letter-spacing: 0.13em; }
.chain-link strong { font-size: clamp(9px, 1vw, 15px); line-height: 1.3; letter-spacing: -0.02em; }
.chain-link.chain-alert { border-color: #f0c9a6; background: #fff7ef; }
.chain-link.chain-alert .chain-scope { color: #ad5b21; }
.chain-link.chain-alert .chain-scope::before { content: "⚠ "; }
.chain-link.chain-alert strong { color: #8f4715; }
.chain-link.chain-alert + .chain-link::before,
.chain-link.chain-alert::before { color: #d99155; }

.memory-block { margin-bottom: 6%; }
.memory-receipt {
  display: grid;
  gap: 2px;
  border: 1px solid #cfe4d9;
  border-left: 3px solid var(--green);
  border-radius: 14px;
  background: linear-gradient(120deg, rgba(235, 248, 241, 0.9), white);
  padding: 2.4% 3%;
  opacity: 0;
  transform: translateY(14px);
  transition: opacity 360ms ease, transform 360ms ease;
}
.memory-receipt.visible { opacity: 1; transform: translateY(0); }
.memory-receipt + .memory-receipt { margin-top: 2.4%; }
.receipt-question { margin: 0; color: var(--muted); font-size: clamp(7px, 0.76vw, 11px); }
.receipt-verdict { margin: 1px 0 0; font-size: clamp(10px, 1.15vw, 17px); font-weight: 800; letter-spacing: -0.03em; line-height: 1.2; }
.receipt-source { display: flex; align-items: center; gap: 5px; margin: 4px 0 0; color: var(--green-dark); font-size: clamp(6px, 0.62vw, 9px); font-weight: 700; }
.receipt-source i { font-style: normal; opacity: 0.65; }
.receipt-source b { border-radius: 999px; background: rgba(49, 201, 140, 0.16); padding: 2px 6px; font-weight: 900; }

.closing-action {
  display: grid;
  gap: 3px;
  border-radius: 16px;
  background: var(--ink);
  padding: 3% 3.4%;
  color: white;
  opacity: 0;
  transform: translateY(14px);
  transition: opacity 360ms ease, transform 360ms ease;
}
.closing-action.visible { opacity: 1; transform: translateY(0); }
.closing-action > span { color: var(--green); font-size: clamp(5px, 0.54vw, 8px); font-weight: 900; letter-spacing: 0.13em; }
.closing-action strong { font-size: clamp(10px, 1.15vw, 17px); letter-spacing: -0.03em; line-height: 1.25; }
.closing-action p { margin: 2px 0 0; color: rgba(255, 255, 255, 0.62); font-size: clamp(6px, 0.64vw, 9px); }

/* ---- Stock entry press feedback: make the click unmistakable ---- */
.report-section { transition: transform 160ms ease, box-shadow 220ms ease, border-color 220ms ease; }
.report-section.opening {
  transform: scale(0.975);
  border-color: var(--green);
  box-shadow: 0 0 0 3px rgba(49, 201, 140, 0.28), 0 10px 26px rgba(39, 61, 51, 0.14);
}
.report-section.opening .report-arrow { color: var(--green-dark); transform: translateX(3px); }
.report-arrow { transition: transform 200ms ease, color 200ms ease; }


/* ---- Stock scene: show the work ---- */
.scan-row + .scan-row::before,
.scan-total::before { content: none !important; }
.scan-row + .scan-row, .scan-total { margin-top: 0 !important; }
.scan-grid { list-style: none; margin: 0 0 30px; padding: 0; display: grid; gap: 7px; }
.scan-row {
  display: grid; grid-template-columns: 1fr auto; align-items: center;
  column-gap: 14px; row-gap: 6px;
  padding: 9px 14px; border: 1px solid rgba(23, 33, 29, 0.09);
  border-radius: 9px; background: #fff;
}
.scan-row span { font-size: 12.5px; color: var(--muted); letter-spacing: 0.01em; }
.scan-row b { font-size: 15px; font-weight: 700; color: var(--ink); font-variant-numeric: tabular-nums; }
.scan-row i {
  grid-column: 1 / -1; display: block; height: 3px; border-radius: 2px;
  background: linear-gradient(90deg, var(--green), rgba(49, 201, 140, 0.25));
  width: var(--w); transform-origin: left center; transform: scaleX(0);
  transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1) 0.1s;
}
.scan-row.visible i { transform: scaleX(1); }
.scan-total {
  display: flex; justify-content: space-between; align-items: baseline;
  padding: 13px 16px; border-radius: 10px; margin-top: 3px;
  background: var(--ink); color: #fff;
}
.scan-total span { font-size: 11.5px; letter-spacing: 0.13em; text-transform: uppercase; opacity: 0.62; }
.scan-total b { font-size: 26px; font-weight: 700; font-variant-numeric: tabular-nums; }

.gate-list { list-style: none; margin: 0 0 30px; padding: 0; display: grid; gap: 9px; }
.gate-row {
  display: flex; justify-content: space-between; align-items: center; gap: 16px;
  padding: 13px 16px; border-radius: 10px;
  border: 1px solid rgba(23, 33, 29, 0.09); background: #fff;
}
.gate-q { font-size: 13.5px; color: var(--ink); line-height: 1.4; }
.gate-n {
  flex: none; font-size: 15px; font-weight: 700; color: var(--green-dark);
  font-variant-numeric: tabular-nums; white-space: nowrap;
}
.gate-n i { font-style: normal; opacity: 0.4; margin: 0 4px; }
.gate-final { border-color: rgba(49, 201, 140, 0.5); background: rgba(49, 201, 140, 0.07); }
.gate-final .gate-n { font-size: 17px; }

.lead-card { border-color: rgba(23, 33, 29, 0.13); }
.lead-head { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; margin-bottom: 12px; }
.lead-tic {
  font-size: 15px; font-weight: 700; color: #fff; background: var(--ink);
  padding: 3px 9px; border-radius: 6px; letter-spacing: 0.03em;
}
.lead-co { font-size: 13px; color: var(--muted); }
.lead-mv { margin-left: auto; font-size: 13px; color: var(--green-dark); font-weight: 600; }
.lead-mv b { font-weight: 700; color: var(--ink); }
.lead-rows { margin: 0; display: grid; gap: 9px; }
.lead-rows > div { display: grid; grid-template-columns: 96px 1fr; gap: 12px; align-items: start; }
.lead-rows dt {
  font-size: 10.5px; letter-spacing: 0.11em; text-transform: uppercase;
  color: var(--muted); padding-top: 2px;
}
.lead-rows dd { margin: 0; font-size: 13px; line-height: 1.45; color: var(--ink); }
.lead-rows dd b { font-variant-numeric: tabular-nums; }
.lead-src { color: var(--green-dark); font-weight: 600; }
.lead-src i { font-style: normal; }

.against-card { border-color: rgba(214, 138, 40, 0.42); background: rgba(230, 160, 60, 0.07); }
.against-list { margin: 10px 0 12px; padding-left: 17px; display: grid; gap: 5px; }
.against-list li { font-size: 13px; line-height: 1.45; color: var(--ink); }

.missing-card { border-color: rgba(214, 138, 40, 0.42); background: rgba(230, 160, 60, 0.07); }
.invest-step.warn { color: #d68a28; }


/* ---- Provenance card ---- */
.proof-card { border-color: rgba(23, 33, 29, 0.13); }
.proof-rows { margin: 11px 0 10px; display: grid; gap: 7px; }
.proof-rows > div {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 12px; align-items: baseline;
  padding-bottom: 7px; border-bottom: 1px dashed rgba(23, 33, 29, 0.12);
}
.proof-rows > div:last-child { border-bottom: none; padding-bottom: 0; }
.proof-rows dt { font-size: 13px; font-weight: 700; color: var(--ink); font-variant-numeric: tabular-nums; }
.proof-rows dd { margin: 0; font-size: 12px; color: var(--green-dark); font-weight: 600; text-align: right; }

/* Link from the demo to the write-up */
.writeup-link {
  position: fixed;
  z-index: 40;
  right: clamp(14px, 2.4vw, 30px);
  bottom: clamp(12px, 2vw, 24px);
  border: 1px solid rgba(23, 33, 29, 0.16);
  border-radius: 999px;
  background: rgba(255, 254, 250, 0.86);
  padding: 8px 15px;
  color: var(--green-dark);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-decoration: none;
  backdrop-filter: blur(7px);
  transition: background 160ms ease, border-color 160ms ease;
}

.writeup-link:hover {
  border-color: rgba(12, 113, 80, 0.45);
  background: #fffefa;
}