.insights-page {
  --ins-ease: cubic-bezier(.22,.61,.36,1);
  --ins-card: linear-gradient(160deg, rgba(13,34,57,.78), rgba(7,22,39,.52));
  --ins-edge: rgba(255,255,255,.075);
}

/* ---------- hero ---------- */

.insights-page .page-hero {
  padding: 178px 0 92px;
  background:
    radial-gradient(circle at 80% 24%, rgba(44,104,148,.26), transparent 30rem),
    radial-gradient(circle at 12% 88%, rgba(201,154,66,.1), transparent 26rem),
    linear-gradient(152deg, #061726, #020a12 74%);
}
.insights-page .page-hero h1 { margin: 26px 0 22px; }
.insights-page .page-hero h1 em { color: var(--gold-400); font-style: normal; }
.insights-page .hero-lead { font-size: 18px; color: #a6b3c1; max-width: 62ch; }

.hero-flags { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 22px; }
.status-chip {
  display: inline-flex; align-items: center; gap: 11px;
  margin: 0; padding: 8px 17px 8px 14px;
  border: 1px solid rgba(224,181,95,.34); border-radius: 999px;
  background: rgba(201,154,66,.07);
  color: var(--gold-300);
  font-size: 10px; letter-spacing: .2em; text-transform: uppercase; font-weight: 600;
}
.status-chip i {
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--gold-400);
  box-shadow: 0 0 0 4px rgba(224,181,95,.14);
}
.hero-meta {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px 26px;
  margin-top: 36px; padding-top: 22px;
  border-top: 1px solid rgba(255,255,255,.08);
  color: #8b9aaa; font-size: 9px; letter-spacing: .17em; text-transform: uppercase;
}
.hero-meta span { position: relative; }
.hero-meta span + span::before {
  content: ""; position: absolute; left: -15px; top: 50%;
  width: 3px; height: 3px; border-radius: 50%; background: var(--gold-500);
}

/* ---------- retrieval stage ---------- */

.retrieval { position: relative; padding: 104px 0 108px; overflow: hidden; }
.retrieval-texture {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; opacity: .12; z-index: 0;
  filter: saturate(.55) contrast(1.05);
  mask-image: radial-gradient(ellipse at 50% 42%, #000 6%, transparent 64%);
  -webkit-mask-image: radial-gradient(ellipse at 50% 42%, #000 6%, transparent 64%);
  pointer-events: none;
}
.retrieval .container { z-index: 2; }
.retrieval-head { max-width: 760px; }
.retrieval-head h2 {
  font-family: var(--serif); font-weight: 500;
  font-size: clamp(42px,5.4vw,70px); line-height: .96; letter-spacing: -.035em;
  margin: 16px 0 22px;
}
.retrieval-head h2 em { color: var(--gold-400); font-style: normal; }
.retrieval-head p { color: #9dabb9; max-width: 60ch; margin: 0; }

.flow-stage {
  display: grid;
  grid-template-columns: minmax(0,1fr) clamp(88px,9vw,152px) minmax(0,1fr);
  align-items: center;
  margin-top: 62px;
}
.flow-panel {
  border: 1px solid var(--ins-edge);
  border-radius: var(--radius);
  background: var(--ins-card);
  box-shadow: 0 34px 90px rgba(0,0,0,.34);
  padding: 26px 26px 30px;
  min-width: 0;
}
.flow-panel-head {
  display: flex; align-items: center; gap: 14px;
  padding-bottom: 18px; margin-bottom: 8px;
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.flow-panel svg { display: block; width: 100%; height: auto; }
.flow-caption { margin: 6px 0 0; color: #8fa0b1; font-size: 13px; line-height: 1.55; }
.flow-caption strong { color: var(--ivory); font-weight: 600; }

.flow-link { display: grid; place-items: center; }
.flow-link svg { display: block; }
.flow-link-h { width: 100%; max-width: 160px; height: auto; }
.flow-link-v { display: none; width: 60px; height: 160px; }

/* stage svg base state is the finished state */

.wi-shape { fill: none; stroke: rgba(224,181,95,.55); stroke-width: 1.6; vector-effect: non-scaling-stroke; }
.wi-ring { fill: none; stroke: rgba(224,181,95,.16); stroke-width: 1; vector-effect: non-scaling-stroke; }
.wi-grid { stroke: rgba(160,190,214,.1); stroke-width: 1; vector-effect: non-scaling-stroke; }
.wi-sweep { opacity: 0; }
.wi-pip { fill: var(--gold-300); opacity: .58; transform-box: fill-box; transform-origin: center; }
.wi-port { fill: none; stroke: rgba(224,181,95,.6); stroke-width: 1.4; vector-effect: non-scaling-stroke; }
.wi-port-core { fill: var(--gold-400); }
.wi-stream { fill: var(--gold-300); opacity: 0; transform-box: fill-box; transform-origin: center; }
.stage-label { font-family: var(--sans); font-size: 12px; letter-spacing: .22em; text-transform: uppercase; fill: #7f8fa0; }
.stage-value { font-family: var(--serif); font-size: 30px; fill: var(--ivory); }

.chart-frame { fill: rgba(4,16,28,.45); stroke: rgba(255,255,255,.07); stroke-width: 1; vector-effect: non-scaling-stroke; }
.chart-grid { stroke: rgba(255,255,255,.055); stroke-width: 1; vector-effect: non-scaling-stroke; }
.chart-bar { fill: url(#barFill); transform-box: fill-box; transform-origin: bottom; }
.chart-bar-lead { fill: url(#barLead); }
.chart-trend { fill: none; stroke: var(--gold-400); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.chart-node { fill: var(--gold-300); opacity: 0; transform-box: fill-box; transform-origin: center; }
.chart-scan { fill: url(#scanFill); opacity: 0; transform-box: fill-box; transform-origin: left center; }

.link-rail { stroke: rgba(224,181,95,.3); stroke-width: 1.4; stroke-dasharray: 5 9; vector-effect: non-scaling-stroke; fill: none; }
.link-token { fill: var(--gold-400); opacity: 0; }
.link-cap { fill: rgba(224,181,95,.75); }

/* ---------- live readout ---------- */

.stage-readout {
  display: grid; grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 1px; margin-top: 46px;
  border: 1px solid var(--ins-edge); border-radius: 20px;
  background: rgba(255,255,255,.06);
  overflow: hidden;
}
.readout { padding: 28px 30px 30px; background: rgba(5,18,31,.86); }
.readout > span {
  display: block; color: var(--gold-400);
  font-size: 9px; letter-spacing: .22em; text-transform: uppercase;
}
.readout > strong {
  display: block; margin: 12px 0 10px;
  font-family: var(--serif); font-weight: 500; font-size: clamp(34px,3.6vw,50px);
  line-height: 1; letter-spacing: -.02em; color: var(--ivory);
  font-variant-numeric: tabular-nums;
}
.readout > small { display: block; color: #8b9aaa; font-size: 12.5px; line-height: 1.6; }
.readout > strong.readout-status {
  position: relative; min-height: 1.2em;
  font-family: var(--sans); font-weight: 500;
  font-size: clamp(15px,1.5vw,19px); letter-spacing: -.005em; color: var(--silver);
}
.readout-status i { display: block; font-style: normal; }
.readout-status i + i { position: absolute; left: 0; top: 0; opacity: 0; }

/* ---------- measured facts ---------- */

.measure-grid {
  display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 22px;
  margin-top: 58px;
}
.measure-card {
  position: relative; display: flex; flex-direction: column;
  padding: 34px 32px 36px;
  border: 1px solid var(--ins-edge); border-radius: var(--radius);
  background: var(--ins-card);
  transition: border-color .4s var(--ins-ease), transform .4s var(--ins-ease);
}
.measure-card:hover { border-color: rgba(224,181,95,.34); }
.measure-card h3 {
  font-family: var(--serif); font-weight: 500; font-size: 27px;
  line-height: 1.14; letter-spacing: -.02em; margin: 0 0 24px; color: var(--ivory);
}
.measure-figure {
  font-family: var(--serif); font-weight: 600;
  font-size: clamp(44px,4.4vw,62px); line-height: 1;
  letter-spacing: -.03em; color: var(--gold-300);
  font-variant-numeric: tabular-nums;
}
.measure-figure sup { font-size: .42em; vertical-align: super; color: var(--gold-400); }
.measure-unit {
  display: block; margin-top: 10px;
  color: var(--silver); font-size: 11px; letter-spacing: .16em; text-transform: uppercase;
}
.measure-card p { color: #93a2b2; font-size: 13.5px; line-height: 1.65; margin: 18px 0 0; }
.measure-card p sup { color: var(--gold-300); font-weight: 700; }
.measure-note {
  margin-top: auto; padding-top: 20px;
  color: #7e8d9d; font-size: 11.5px; line-height: 1.6;
  border-top: 1px solid rgba(255,255,255,.06);
}
.measure-note b { color: var(--gold-300); font-weight: 600; }

.hours-grid { display: flex; gap: 7px; margin-bottom: 20px; }
.hours-grid i {
  display: block; flex: 1; height: 54px; border-radius: 6px;
  border: 1px solid rgba(224,181,95,.32);
  background: linear-gradient(180deg, rgba(224,181,95,.85), rgba(201,154,66,.55));
}
.hours-grid i.hour-off {
  border-color: rgba(255,255,255,.1);
  background: linear-gradient(180deg, rgba(160,190,214,.16), rgba(160,190,214,.02) 70%);
}
.hours-legend {
  display: flex; flex-wrap: wrap; gap: 8px 20px; margin-bottom: 4px;
  color: #8b9aaa; font-size: 10px; letter-spacing: .14em; text-transform: uppercase;
}
.hours-legend b { color: var(--gold-300); font-weight: 600; }

/* ---------- topics rail ---------- */

.topics { position: relative; }
.topics-head { max-width: 720px; margin-bottom: 54px; }
.topic-list { list-style: none; margin: 0; padding: 0; }
.topic-step {
  position: relative;
  display: grid; grid-template-columns: 52px minmax(0,1fr);
  gap: 0 30px; padding: 0 0 46px 0;
}
.topic-step:last-child { padding-bottom: 0; }
.topic-rail {
  position: absolute; left: 26px; top: 46px; bottom: -2px;
  width: 1px; background: rgba(224,181,95,.26);
  transform-origin: top; transform: scaleY(1);
}
.topic-step:last-child .topic-rail { display: none; }
.topic-num {
  position: relative; z-index: 1;
  display: grid; place-items: center;
  width: 52px; height: 52px; border-radius: 50%;
  border: 1px solid rgba(224,181,95,.34);
  background: var(--ob-900, #111113);
  transition: border-color .45s var(--ins-ease), box-shadow .45s var(--ins-ease);
}
.topic-num::before {
  content: ""; display: block; width: 10px; height: 10px; border-radius: 50%;
  background: radial-gradient(circle at 40% 35%, var(--gold-300), var(--awa-gold-deep, #c99a42));
  opacity: .62; transition: opacity .45s var(--ins-ease), box-shadow .45s var(--ins-ease);
}
.topic-step.is-active .topic-num::before { opacity: 1; box-shadow: 0 0 12px rgba(224,181,95,.55); }
.topic-step.is-active .topic-num {
  border-color: var(--gold-400);
  box-shadow: 0 0 0 6px rgba(201,154,66,.1), 0 0 22px rgba(224,181,95,.22);
}
.topic-body { padding-top: 5px; transition: opacity .45s var(--ins-ease); }
.topic-body h3 {
  font-family: var(--serif); font-weight: 500;
  font-size: clamp(27px,2.9vw,38px); line-height: 1.05; letter-spacing: -.025em;
  margin: 0 0 12px; color: var(--ivory);
}
.topic-body p { margin: 0; color: #93a2b2; font-size: 14.5px; line-height: 1.7; max-width: 62ch; }
.topic-tag {
  display: inline-block; margin-top: 14px;
  color: var(--gold-400); font-size: 9px; letter-spacing: .2em; text-transform: uppercase;
}

/* ---------- meanwhile ---------- */

.meanwhile { position: relative; }
.meanwhile-rail {
  position: relative; height: 1px; margin: 44px 0 0;
  background: linear-gradient(90deg, rgba(224,181,95,.5), rgba(224,181,95,.16) 62%, transparent);
  transform-origin: left; transform: scaleX(1);
}
.meanwhile-grid {
  display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 20px;
  margin-top: 34px;
}
.meanwhile-card {
  position: relative; display: flex; flex-direction: column; min-height: 226px;
  padding: 30px 26px 28px;
  border: 1px solid var(--ins-edge); border-radius: 22px;
  background: linear-gradient(160deg, rgba(30,30,33,.92), rgba(17,17,19,.94));
  transition: transform .45s var(--ins-ease), border-color .45s var(--ins-ease), background .45s var(--ins-ease);
}
.meanwhile-card::before {
  content: ""; position: absolute; left: 26px; right: 26px; top: -1px; height: 1px;
  background: linear-gradient(90deg, var(--gold-500), transparent);
  opacity: 0; transition: opacity .45s var(--ins-ease);
}
.meanwhile-card:hover { transform: translateY(-5px); border-color: rgba(224,181,95,.34); }
.meanwhile-card:hover::before { opacity: 1; }
.meanwhile-card span {
  color: var(--gold-400); font-size: 9px; letter-spacing: .2em; text-transform: uppercase;
}
.meanwhile-card h3 {
  font-family: var(--serif); font-weight: 500; font-size: 26px; line-height: 1.1;
  letter-spacing: -.02em; margin: 16px 0 12px; color: var(--ivory);
}
.meanwhile-card p { margin: 0; color: #8fa0b1; font-size: 13px; line-height: 1.6; }
.meanwhile-card b {
  margin-top: auto; padding-top: 20px;
  color: var(--gold-300); font-size: 10px; letter-spacing: .16em; text-transform: uppercase; font-weight: 700;
}
.meanwhile-card b i { display: inline-block; font-style: normal; transition: transform .3s var(--ins-ease); }
.meanwhile-card:hover b i { transform: translateX(6px); }

/* ---------- pre-desk archive ---------- */

.insights-page .archive.section-dark { background: linear-gradient(180deg, rgba(21,21,23,.4), rgba(21,21,23,.94) 18%, rgba(21,21,23,.94) 82%, rgba(21,21,23,.4)); border-block-color: rgba(242,238,230,.05); }
.archive-head { max-width: 780px; }
.archive-head .hero-flags { margin-bottom: 6px; }
.archive-head .section-kicker { margin-bottom: 0; }
.archive-chip {
  border-color: rgba(255,255,255,.14);
  background: rgba(255,255,255,.028);
  color: var(--silver);
}
.insights-page .archive-chip i {
  background: rgba(215,219,226,.6);
  box-shadow: 0 0 0 4px rgba(215,219,226,.07);
  animation: none;
}
.archive-head .section-lead { max-width: 68ch; }

.archive-stack { position: relative; margin-top: 52px; }
.archive-rail {
  position: absolute; left: 5px; top: 12px; bottom: 12px;
  width: 1px; transform-origin: top;
  background: linear-gradient(180deg, rgba(224,181,95,.55), rgba(224,181,95,.12));
}
.archive-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 18px; }
.archive-item { position: relative; padding-left: 38px; min-width: 0; }
.archive-marker {
  position: absolute; left: 0; top: 38px;
  width: 11px; height: 11px; border-radius: 50%;
  border: 1px solid rgba(224,181,95,.42);
  background: var(--navy-900);
  transition: background .5s var(--ins-ease), box-shadow .5s var(--ins-ease);
  transition-delay: .18s;
}
.archive-item.visible .archive-marker {
  background: var(--gold-400);
  box-shadow: 0 0 0 5px rgba(201,154,66,.11);
}
.archive-card {
  display: block; padding: 28px 30px 26px;
  border: 1px solid var(--ins-edge); border-radius: 22px;
  background: linear-gradient(160deg, rgba(30,30,33,.92), rgba(17,17,19,.94));
  color: inherit; text-decoration: none;
  transition: transform .45s var(--ins-ease), border-color .45s var(--ins-ease);
}
.archive-card:hover, .archive-card:focus-visible { transform: translateY(-4px); border-color: rgba(224,181,95,.34); }
.archive-meta {
  display: flex; flex-wrap: wrap; align-items: center; gap: 7px 18px;
  color: #8b9aaa; font-size: 9.5px; letter-spacing: .18em; text-transform: uppercase;
}
.archive-meta .archive-tag { color: var(--gold-400); font-weight: 600; }
.archive-card h3 {
  font-family: var(--serif); font-weight: 500;
  font-size: clamp(23px,2.3vw,30px); line-height: 1.12; letter-spacing: -.02em;
  margin: 15px 0 12px; color: var(--ivory);
}
.archive-card > p { margin: 0; color: #8fa0b1; font-size: 13.5px; line-height: 1.65; max-width: 66ch; }
.archive-go {
  display: inline-flex; align-items: center; gap: 9px; margin-top: 18px;
  color: var(--gold-300); font-size: 10px; letter-spacing: .16em; text-transform: uppercase; font-weight: 700;
}
.archive-go i { display: inline-block; font-style: normal; transition: transform .3s var(--ins-ease); }
.archive-card:hover .archive-go i, .archive-card:focus-visible .archive-go i { transform: translateX(6px); }
.archive-foot {
  margin: 30px 0 0; padding-left: 38px;
  color: #7e8d9d; font-size: 12.5px; line-height: 1.65; max-width: 64ch;
}

/* ---------- sign-off ---------- */

.signoff {
  display: grid; grid-template-columns: 104px minmax(0,1fr); gap: 32px; align-items: center;
  margin: 72px 0 0; padding: 38px 42px;
  border: 1px solid var(--ins-edge); border-radius: var(--radius);
  background: linear-gradient(120deg, rgba(16,42,67,.6), rgba(7,22,39,.42));
}
.signoff img {
  width: 104px; height: 104px; border-radius: 50%; object-fit: cover; object-position: 50% 18%;
  border: 1px solid rgba(224,181,95,.3);
}
.signoff p {
  margin: 0 0 14px; color: #c3ccd6;
  font-family: var(--serif); font-size: clamp(20px,2.1vw,27px); line-height: 1.32;
}
.signoff cite {
  display: block; font-style: normal;
  color: #8b9aaa; font-size: 10px; letter-spacing: .18em; text-transform: uppercase;
}

/* ---------- responsive ---------- */

@media (max-width: 1080px) {
  .measure-grid { grid-template-columns: 1fr; }
  .meanwhile-grid { grid-template-columns: 1fr 1fr; }
  .measure-card { padding: 30px 26px 32px; }
}

@media (max-width: 900px) {
  .flow-stage { grid-template-columns: minmax(0,1fr); }
  .flow-link { padding: 22px 0; }
  .flow-link-h { display: none; }
  .flow-link-v { display: block; }
  .stage-readout { grid-template-columns: 1fr; }
  .retrieval { padding: 88px 0 92px; }
}

@media (max-width: 620px) {
  .insights-page .page-hero { padding: 146px 0 72px; }
  .insights-page .hero-lead { font-size: 16px; }
  .flow-panel { padding: 20px 18px 24px; border-radius: 20px; }
  .readout { padding: 24px 22px 26px; }
  .meanwhile-grid { grid-template-columns: 1fr; }
  .topic-step { grid-template-columns: 42px minmax(0,1fr); gap: 0 18px; padding-bottom: 38px; }
  .topic-num { width: 42px; height: 42px; }
  .topic-num::before { width: 8px; height: 8px; }
  .topic-rail { left: 21px; top: 38px; }
  .archive-item, .archive-foot { padding-left: 26px; }
  .archive-rail { left: 4px; }
  .archive-marker { width: 9px; height: 9px; top: 32px; }
  .archive-card { padding: 22px 20px 24px; border-radius: 18px; }
  .archive-card h3 { font-size: 22px; }
  .signoff { grid-template-columns: 1fr; gap: 22px; padding: 30px 24px; text-align: left; }
  .signoff img { width: 82px; height: 82px; }
  .hours-grid i { height: 44px; }
  .stage-label { font-size: 20px; letter-spacing: .16em; }
}

/* ---------- motion ---------- */

@media (prefers-reduced-motion: no-preference) {

  @keyframes wi-sweep { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
  @keyframes wi-fade { from { opacity: 0; } to { opacity: 1; } }
  @keyframes wi-pip { 0% { opacity: .95; transform: scale(2.1); } 13% { opacity: .58; transform: scale(1); } 100% { opacity: .58; transform: scale(1); } }
  @keyframes wi-stream { 0% { offset-distance: 0%; opacity: 0; } 12% { opacity: .95; } 78% { opacity: .95; } 100% { offset-distance: 100%; opacity: 0; } }
  @keyframes wi-port { 0%,100% { opacity: .5; } 50% { opacity: 1; } }
  @keyframes chart-rise { from { transform: scaleY(0); } to { transform: scaleY(1); } }
  @keyframes chart-draw { from { stroke-dashoffset: 520; } to { stroke-dashoffset: 0; } }
  @keyframes chart-node { 0% { offset-distance: 0%; opacity: 0; } 10% { opacity: 1; } 88% { opacity: 1; } 100% { offset-distance: 100%; opacity: 0; } }
  @keyframes chart-scan { 0% { transform: translateX(0); opacity: 0; } 12% { opacity: .85; } 84% { opacity: .85; } 100% { transform: translateX(376px); opacity: 0; } }
  @keyframes link-flow { to { stroke-dashoffset: -28; } }
  @keyframes link-token-h { 0% { transform: translateX(0); opacity: 0; } 14% { opacity: 1; } 80% { opacity: 1; } 100% { transform: translateX(126px); opacity: 0; } }
  @keyframes link-token-v { 0% { transform: translateY(0); opacity: 0; } 14% { opacity: 1; } 80% { opacity: 1; } 100% { transform: translateY(126px); opacity: 0; } }
  @keyframes status-cycle { 0% { opacity: 0; } 4% { opacity: 1; } 30% { opacity: 1; } 35% { opacity: 0; } 100% { opacity: 0; } }
  @keyframes hour-drain { 0%,100% { opacity: .38; transform: translateY(0); } 50% { opacity: .92; transform: translateY(5px); } }
  @keyframes chip-pulse { 0%,100% { box-shadow: 0 0 0 4px rgba(224,181,95,.14); } 50% { box-shadow: 0 0 0 9px rgba(224,181,95,.03); } }
  @keyframes rail-draw { from { transform: scaleX(0); } to { transform: scaleX(1); } }
  @keyframes archive-rail-draw { from { transform: scaleY(0); } to { transform: scaleY(1); } }

  .status-chip i { animation: chip-pulse 2.6s ease-in-out infinite; }

  .wi-sweep {
    transform-box: view-box; transform-origin: 260px 258px;
    animation: wi-sweep 6.5s linear infinite, wi-fade 1.4s ease-out both;
  }
  .wi-pip { animation: wi-pip 6.5s linear infinite; }
  .wi-port-core { animation: wi-port 2.4s ease-in-out infinite; }
  .chart-scan { animation: chart-scan 5.2s ease-in-out infinite 1.4s; }
  .link-rail { animation: link-flow 1.4s linear infinite; }
  .link-token { animation: link-token-h 3.1s var(--ins-ease) infinite; }
  .flow-link-v .link-token { animation-name: link-token-v; }
  .link-token:nth-of-type(2) { animation-delay: 1s; }
  .link-token:nth-of-type(3) { animation-delay: 2s; }

  .flow-stage.is-armed:not(.is-live) .wi-sweep,
  .flow-stage.is-armed:not(.is-live) .wi-pip,
  .flow-stage.is-armed:not(.is-live) .wi-stream,
  .flow-stage.is-armed:not(.is-live) .wi-port-core,
  .flow-stage.is-armed:not(.is-live) .chart-scan,
  .flow-stage.is-armed:not(.is-live) .chart-node,
  .flow-stage.is-armed:not(.is-live) .link-rail,
  .flow-stage.is-armed:not(.is-live) .link-token { animation-play-state: paused; }

  .flow-stage.is-shown .chart-bar { animation: chart-rise .82s var(--ins-ease) calc(var(--reveal-delay, 0ms) + .2s) backwards; }
  .flow-stage.is-shown .chart-trend { stroke-dasharray: 520; animation: chart-draw 1.7s var(--ins-ease) calc(var(--reveal-delay, 0ms) + .65s) backwards; }
  .flow-stage.is-shown .chart-bar:nth-of-type(2) { animation-delay: calc(var(--reveal-delay, 0ms) + .29s); }
  .flow-stage.is-shown .chart-bar:nth-of-type(3) { animation-delay: calc(var(--reveal-delay, 0ms) + .38s); }
  .flow-stage.is-shown .chart-bar:nth-of-type(4) { animation-delay: calc(var(--reveal-delay, 0ms) + .47s); }
  .flow-stage.is-shown .chart-bar:nth-of-type(5) { animation-delay: calc(var(--reveal-delay, 0ms) + .56s); }
  .flow-stage.is-shown .chart-bar:nth-of-type(6) { animation-delay: calc(var(--reveal-delay, 0ms) + .65s); }
  .flow-stage.is-shown .chart-bar:nth-of-type(7) { animation-delay: calc(var(--reveal-delay, 0ms) + .74s); }
  .flow-stage.is-shown .chart-bar:nth-of-type(8) { animation-delay: calc(var(--reveal-delay, 0ms) + .83s); }
  .flow-stage.is-shown .chart-bar:nth-of-type(9) { animation-delay: calc(var(--reveal-delay, 0ms) + .92s); }

  .readout-status i { animation: status-cycle 9s ease-in-out infinite; }
  .readout-status i + i { animation-delay: 3s; }
  .readout-status i + i + i { animation-delay: 6s; }

  .hours-grid i.hour-off { animation: hour-drain 3.4s ease-in-out infinite; }
  .hours-grid i.hour-off:nth-of-type(5) { animation-delay: .18s; }
  .hours-grid i.hour-off:nth-of-type(6) { animation-delay: .36s; }
  .hours-grid i.hour-off:nth-of-type(7) { animation-delay: .54s; }
  .hours-grid i.hour-off:nth-of-type(8) { animation-delay: .72s; }

  .topic-rail { transition: transform .9s var(--ins-ease); }
  .topic-list.is-armed .topic-step:not(.is-lit) .topic-rail { transform: scaleY(0); }
  .topic-list.is-armed .topic-step:not(.is-lit) .topic-body { opacity: .4; }
  .meanwhile-rail { transition: transform 1.15s var(--ins-ease); }
  .meanwhile-rail.is-armed:not(.is-drawn) { transform: scaleX(0); }
  .archive-stack:has(.archive-item.is-shown) .archive-rail { animation: archive-rail-draw 1.3s var(--ins-ease) backwards; }

  @supports (offset-path: path("M 0 0 L 1 1")) {
    .wi-stream { animation: wi-stream 2.9s var(--ins-ease) infinite; }
    .wi-stream-1 { offset-path: path("M 161 174 C 262 148 382 168 468 256"); }
    .wi-stream-2 { offset-path: path("M 291 303 C 344 300 420 290 468 258"); animation-delay: .72s; }
    .wi-stream-3 { offset-path: path("M 246 361 C 322 360 422 320 468 260"); animation-delay: 1.44s; }
    .wi-stream-4 { offset-path: path("M 359 248 C 392 248 432 250 468 257"); animation-delay: 2.16s; }
    .chart-node {
      offset-path: path("M 89 316 L 131 282 L 173 298 L 215 240 L 257 260 L 299 202 L 341 224 L 383 165 L 425 132");
      animation: chart-node 3.4s var(--ins-ease) infinite 1.1s;
    }
  }

  @supports (animation-timeline: view()) {
    .meanwhile-rail,
    .meanwhile-rail.is-armed:not(.is-drawn) {
      transform: scaleX(1); transition: none;
      animation: rail-draw linear both;
      animation-timeline: view();
      animation-range: entry 14% cover 38%;
    }
    .archive-rail,
    .archive-stack:has(.archive-item.is-shown) .archive-rail {
      animation: archive-rail-draw linear both;
      animation-timeline: view();
      animation-range: entry 6% cover 54%;
    }
  }
}

@media (prefers-reduced-motion: reduce) {
  .wi-sweep, .wi-stream, .chart-node, .chart-scan, .link-token { display: none; }
  .readout-status i + i { display: none; }
}