.update-story { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .75rem; margin: 1rem 0 0; padding: 0; list-style: none; color: #526079; font-size: .6875rem; }
.update-story li { border-top: 1px solid #acc9ff; padding-top: .625rem; }
.update-story li span { margin-right: .375rem; }
.update-story li.current { color: var(--color-accent); border-color: var(--color-accent); }
.update-story li.done { color: #46546a; }
.update-task { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; border: 1px solid #c8dcff; border-left: 3px solid var(--color-accent); border-radius: .375rem; padding: .875rem; background: #f5f9ff; }
.update-task > svg { width: 1.375rem; height: 1.375rem; color: var(--color-accent); flex-shrink: 0; }
.update-task > div { flex: 1; min-width: min(100%,8rem); }
.update-task strong { display: block; font-size: .8125rem; line-height: 1.4; }
.update-task p { color: #657085; font-size: .6875rem; margin-top: .25rem; }
.update-caption { display: block; font-size: .5625rem; letter-spacing: .1em; color: #657085; margin-bottom: .25rem; }
.update-checks { margin-top: 1.25rem; }
.update-meter { height: .1875rem; overflow: hidden; background: #e6edf7; border-radius: 1rem; margin-bottom: .75rem; }
.update-meter > span { display: block; height: 100%; background: var(--color-accent); transform-origin: left; }
.update-check { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; padding-block: .5rem; color: #657085; font-size: .6875rem; }
.update-check > svg { width: 1rem; height: 1rem; flex-shrink: 0; opacity: .25; }
.update-check > span { flex: 1; min-width: min(100%,6rem); }
.update-check small { font-size: .625rem; }
.update-check.done > svg { opacity: 1; color: #167653; }
.update-check.done small { color: #167653; }
.update-check.checking { color: var(--color-accent); }
.update-check.checking > svg { opacity: .7; }
.update-publication { margin-top: .875rem; }
.update-stage .sd-section-label { flex-wrap: wrap; }
.update-release { margin-bottom: 0; }
.update-stage .chart-line { stroke-dasharray: 1; }
.support-motion-player { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: .625rem; margin-top: 1.5rem; min-height: 2.75rem; }
.support-motion-player[hidden] { display: none; }
.support-motion-player progress { width: 3.75rem; height: 2px; appearance: none; border: none; color: var(--color-accent); background: #e1eafa; }
.support-motion-player progress::-webkit-progress-bar { background: #e1eafa; }
.support-motion-player progress::-webkit-progress-value { background: var(--color-accent); }
.support-motion-player progress::-moz-progress-bar { background: var(--color-accent); }
#support-status { margin-right: auto; color: #46546a; font-size: .75rem; line-height: 1.5; }
.support-motion-player button { min-height: 2.75rem; max-width: 100%; padding: .5rem .875rem; border: 1px solid var(--color-rule); border-radius: .375rem; background: #fff; color: var(--color-accent); font: inherit; font-size: .8125rem; cursor: pointer; }
.support-motion-player button:hover:not(:disabled) { border-color: var(--color-accent); background: #f0f6ff; }
.support-motion-player button:focus-visible { outline: 2px solid var(--color-accent); outline-offset: 3px; }
.support-motion-player button:disabled { color: #6a7890; cursor: default; }
@media (width < 40rem) {
  #support-status { width: 100%; }
  .support-motion-player { justify-content: flex-start; }
  .support-motion-player progress { margin-right: auto; }
}
@media (prefers-reduced-motion: reduce) {
  .update-story li { transition: none; }
}

@media (min-width: 68.75rem) {
  .update-stage .sd-overview { display: none; }
  .update-checks { container-type: inline-size; }
  @container (min-width: 26rem) {
    .update-check-list { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .625rem; }
    .update-check { display: grid; grid-template-columns: 1rem minmax(0,1fr); align-content: start; padding: .75rem .625rem; border: 1px solid var(--support-border); border-radius: .375rem; background: #f9fbff; }
    .update-check > span { min-width: 0; }
    .update-check small { grid-column: 2; }
  }
}