.acp255-story {
  margin: 3rem 0 4rem;
  color: #f0ede8;
  border-top: 1px solid #222;
  padding-top: 2rem;
  width: 100vw;
  margin-left: calc(-50vw + 50%);
  padding-left: 2rem;
  padding-right: 2rem;
  box-sizing: border-box;
}
.acp255-story * { box-sizing: border-box; }
.acp255-story h2, .acp255-story h3 { color: #f0ede8; }
.acp255-story p, .acp255-story span, .acp255-story label, .acp255-story div { color: #c4beb6; }
.acp255-kicker, .live-label, .acp255-control label {
  color: #888;
  font-family: 'Geist Mono', monospace;
  font-size: 1.05rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.acp255-story-intro {
  max-width: 980px;
  margin-bottom: 2.2rem;
}
.acp255-story h2 {
  margin: 0 0 0.8rem;
  font-family: 'Instrument Serif', Georgia, serif;
  font-size: clamp(3rem, 5vw, 5.4rem);
  font-weight: 400;
  line-height: 0.95;
}
.acp255-story-intro p, .acp255-chart-copy p {
  max-width: 880px;
  font-size: 1.8rem;
  line-height: 1.58;
}
.acp255-board {
  display: grid;
  grid-template-columns: 320px minmax(0, 1fr);
  gap: 1.4rem;
  align-items: start;
}
.acp255-sidebar {
  position: sticky;
  top: 88px;
  display: grid;
  gap: 1rem;
}
.acp255-sidebar-block,
.acp255-chart-panel,
.acp255-summary-grid article {
  padding: 1.1rem 1.15rem;
  border: 1px solid #222;
  border-radius: 16px;
  background: rgba(20,20,20,0.34);
}
.acp255-control + .acp255-control { margin-top: 1rem; }
.acp255-control-hint {
  display: block;
  margin-top: 0.5rem;
  color: #666;
  font-size: 1.1rem;
  line-height: 1.45;
}
.acp255-control-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 1rem;
  margin: 0.5rem 0 0.8rem;
}
.acp255-control-head span { color: #888; font-size: 1.2rem; }
.acp255-control-head strong, .acp255-live-card strong {
  color: #f0ede8;
  font-size: 2.2rem;
  line-height: 1;
}
.acp255-control input[type="range"] { width: 100%; accent-color: #e8c547; }
.acp255-metrics { display: grid; gap: 0.8rem; }
.acp255-live-card {
  padding: 0.95rem 1rem;
  border: 1px solid rgba(255,255,255,0.04);
  border-radius: 12px;
  background: rgba(12,12,12,0.45);
}
.live-acp77 { box-shadow: inset 0 2px 0 #e8c547; }
.live-current { box-shadow: inset 0 2px 0 #ff7a90; }
.live-mono { box-shadow: inset 0 2px 0 #5dd39e; }
.live-hybrid { box-shadow: inset 0 2px 0 #7aa2ff; }
.acp255-main { min-width: 0; }
.acp255-chart-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.4rem;
}
.acp255-chart-panel {
  display: grid;
  grid-template-rows: auto 1fr;
  gap: 1rem;
}
.acp255-story h3 {
  margin: 0.2rem 0 0.7rem;
  font-size: clamp(2rem, 2.2vw, 2.7rem);
  line-height: 1.08;
}
.chart2d {
  display: block;
  width: 100%;
  height: 480px;
  border-radius: 16px;
  border: 1px solid #222;
  background: rgba(8,8,8,0.56);
}
.acp255-summary-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  margin-top: 1.4rem;
}
@media (min-width: 768px) and (max-width: 1180px) {
  .acp255-board { grid-template-columns: 280px minmax(0, 1fr); gap: 1rem; }
  .chart2d { height: 380px; }
  .acp255-control-head strong, .acp255-live-card strong { font-size: 1.85rem; }
  .acp255-story-intro p, .acp255-chart-copy p { font-size: 1.65rem; }
}
@media (max-width: 980px) {
  .acp255-board, .acp255-chart-grid, .acp255-summary-grid { grid-template-columns: 1fr; }
  .acp255-sidebar { position: static; }
  .chart2d { height: 320px; }
}

/* Scroll-sync highlight states */
.acp255-story[data-active-formula] .acp255-live-card {
  opacity: 0.35;
  transition: opacity 0.3s ease, transform 0.3s ease;
}
.acp255-story[data-active-formula="acp77"]   .live-acp77,
.acp255-story[data-active-formula="gaussian"] .live-current,
.acp255-story[data-active-formula="mono"]     .live-mono,
.acp255-story[data-active-formula="hybrid"]   .live-hybrid {
  opacity: 1;
  transform: scale(1.03);
}
.acp255-story[data-active-formula] .acp255-summary-grid article {
  opacity: 0.3;
  transition: opacity 0.3s ease;
}
.acp255-story[data-active-formula="acp77"]   .acp255-summary-grid article:nth-child(1),
.acp255-story[data-active-formula="gaussian"] .acp255-summary-grid article:nth-child(2),
.acp255-story[data-active-formula="mono"]     .acp255-summary-grid article:nth-child(3),
.acp255-story[data-active-formula="hybrid"]   .acp255-summary-grid article:nth-child(4) {
  opacity: 1;
}