.resilience-block {
  --resilience-cyan: #8cced9;
  --resilience-green: #bbd591;
  --resilience-amber: #e6b56f;
  --resilience-red: #ed9ca3;
  --resilience-rule: color-mix(in srgb, var(--ink, #e7e7e3) 18%, transparent);
  --resilience-soft: color-mix(in srgb, var(--ink, #e7e7e3) 4%, transparent);
  color: var(--ink, #e7e7e3);
  container-type: inline-size;
  overflow-wrap: anywhere;
}
html[data-theme="light"] .resilience-block {
  --resilience-cyan: #266c7a;
  --resilience-green: #526b28;
  --resilience-amber: #92570d;
  --resilience-red: #a23545;
}
.resilience-block [hidden] { display: none !important; }
.resilience-block > .resilience-kicker {
  margin: 0 0 1.1rem;
  font-size: .7rem;
  letter-spacing: .08em;
  color: var(--resilience-cyan);
}
.resilience-kicker span:last-child { font-family: "Noto Sans SC", sans-serif; letter-spacing: .12em; }
.resilience-block > h2 { max-width: 24ch; margin: 0 0 .75rem; padding: 0; border: 0; font-size: clamp(1.25rem, 2.4vw, 1.65rem); line-height: 1.5; }
.resilience-block .resilience-description { color: var(--ink-dim, #b0b6ba); font-size: .94rem; line-height: 1.85; margin: 0 0 1.55rem; }
.resilience-block.is-schedule-buffer { --resilience-cyan: #9cb9c6; --resilience-green: #85c3b1; --resilience-amber: #d7ad77; margin-block: 2.25rem; padding: .25rem 0; border: 0; }
html[data-theme="light"] .resilience-block.is-schedule-buffer { --resilience-cyan: #476d7e; --resilience-green: #327869; --resilience-amber: #965c24; }
.resilience-controls { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem 2.5rem; margin-bottom: .65rem; }
.resilience-range { display: grid; gap: .5rem; min-width: 0; font-size: .82rem; }
.resilience-range > span { display: flex; align-items: baseline; gap: .5rem; justify-content: space-between; flex-wrap: wrap; }
.resilience-range output { color: var(--resilience-cyan); font-size: .84rem; font-variant-numeric: tabular-nums; white-space: nowrap; }
.resilience-range input { -webkit-appearance: none; appearance: none; width: 100%; min-width: 0; margin: 0; height: 36px; padding: 0; background: transparent; cursor: pointer; }
.resilience-range input::-webkit-slider-runnable-track { height: 2px; border: 0; border-radius: 2px; background: color-mix(in srgb, var(--resilience-cyan) 26%, transparent); }
.resilience-range input::-moz-range-track { height: 2px; border: 0; border-radius: 2px; background: color-mix(in srgb, var(--resilience-cyan) 26%, transparent); }
.resilience-range input::-webkit-slider-thumb { -webkit-appearance: none; width: 13px; height: 13px; margin-top: -5.5px; border: 2px solid var(--bg); border-radius: 50%; background: var(--resilience-cyan); box-shadow: 0 0 0 1px color-mix(in srgb, var(--resilience-cyan) 60%, transparent); }
.resilience-range input::-moz-range-thumb { width: 9px; height: 9px; border: 2px solid var(--bg); border-radius: 50%; background: var(--resilience-cyan); box-shadow: 0 0 0 1px color-mix(in srgb, var(--resilience-cyan) 60%, transparent); }
.resilience-block button { color: var(--ink, #e7e7e3); border: 1px solid var(--resilience-rule); border-radius: 0; background: transparent; font: 500 .79rem/1.5 "Noto Sans SC", sans-serif; min-height: 44px; padding: .6rem .9rem; cursor: pointer; }
.resilience-block button:hover { border-color: var(--resilience-cyan); background: var(--resilience-soft); }
.resilience-block :is(button, input, summary):focus-visible { outline: 2px solid var(--resilience-cyan); outline-offset: 4px; }
.resilience-tapes { display: grid; gap: 1.65rem; }
.resilience-tape { padding: .25rem 0; }
.resilience-tape-heading { display: flex; align-items: baseline; justify-content: space-between; gap: .5rem 1rem; flex-wrap: wrap; margin-bottom: .8rem; }
.resilience-tape-heading h3 { margin: 0; font: 500 .88rem/1.6 "Noto Sans SC", sans-serif; }
.resilience-block .resilience-terminal { margin: 0; font-size: .79rem; color: var(--resilience-green); }
.resilience-terminal.has-delay { color: var(--resilience-amber); }
.resilience-track-row { display: grid; grid-template-columns: 2.65rem minmax(0, 1fr); align-items: center; margin-bottom: .4rem; }
.resilience-track-row > span { font-size: .75rem; color: var(--muted, #a5a9b0); }
.resilience-track { position: relative; height: 31px; border-radius: 3px; background: color-mix(in srgb, var(--ink) 3%, transparent); box-shadow: inset 0 1px 3px rgb(0 0 0 / 8%); }
.resilience-track::before { content: ""; position: absolute; inset: 0; border-radius: inherit; background: repeating-linear-gradient(90deg, var(--resilience-rule) 0 1px, transparent 1px 10%); opacity: .35; }
.resilience-track.is-plan { height: 25px; }
.resilience-bar { --bar-tone: var(--resilience-cyan); position: absolute; top: 0; bottom: 0; display: flex; align-items: center; justify-content: center; min-width: 0; overflow: hidden; border: 0; border-radius: 3px; color: var(--bar-tone); background: linear-gradient(180deg, color-mix(in srgb, var(--bar-tone) 25%, var(--bg)), color-mix(in srgb, var(--bar-tone) 13%, var(--bg))); box-shadow: inset 0 1px color-mix(in srgb, var(--bar-tone) 25%, transparent), inset -1px 0 color-mix(in srgb, var(--bg) 70%, transparent), 0 1px 2px rgb(0 0 0 / 10%); }
.resilience-bar > span { font: 400 .72rem/1 "Noto Sans SC", sans-serif; }
.resilience-track.is-actual .resilience-bar { --bar-tone: var(--resilience-green); background: linear-gradient(180deg, color-mix(in srgb, var(--bar-tone) 29%, var(--bg)), color-mix(in srgb, var(--bar-tone) 19%, var(--bg))); }
.resilience-track.is-actual .resilience-bar.has-delay { --bar-tone: var(--resilience-amber); }
.resilience-gap { position: absolute; top: 0; bottom: 0; background: repeating-linear-gradient(135deg, transparent 0 6px, color-mix(in srgb, var(--resilience-cyan) 10%, transparent) 6px 7px); }
.resilience-block .resilience-sr-summary { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; clip-path: inset(50%) !important; white-space: nowrap !important; border: 0 !important; }
.resilience-block .resilience-result { border-left: 2px solid var(--resilience-cyan); padding: .15rem 0 .15rem .9rem; margin: 1.15rem 0; font-size: .87rem; line-height: 1.85; min-height: 3.7em; }
.resilience-block .resilience-details { margin: 1rem 0; padding: 0; border: 0; background: transparent; font-size: .78rem; }
.resilience-details summary { cursor: pointer; padding: .4rem 0; width: fit-content; color: var(--ink-dim, #b0b6ba); min-height: 40px; line-height: 2; }
.resilience-details table { display: table; width: 100%; table-layout: fixed; margin: 0; border-collapse: collapse; text-align: left; font-size: .73rem; font-variant-numeric: tabular-nums; }
.resilience-details caption { text-align: left; padding: .5rem 0; color: var(--muted, #a5a9b0); font-size: .71rem; }
.resilience-details :is(th, td) { min-width: 0; padding: .6rem .5rem; border: 0; border-bottom: 1px solid var(--resilience-rule); background: transparent; font-weight: 400; }
.resilience-details thead th { color: var(--resilience-cyan); }
.resilience-block .resilience-footnote, .resilience-block .resilience-static-note { margin: 1rem 0 0; font-size: .72rem; line-height: 1.85; color: var(--muted, #a5a9b0); }
.resilience-scenarios { display: flex; flex-wrap: wrap; margin: 0 0 1.3rem; gap: .4rem; }
.resilience-scenarios button[aria-pressed="true"] { border-color: var(--resilience-cyan); color: var(--resilience-cyan); background: color-mix(in srgb, var(--resilience-cyan) 10%, transparent); }
.resilience-input-record { display: flex; align-items: baseline; flex-wrap: wrap; gap: .35rem .9rem; padding: .9rem 0; margin: 0 !important; border-block: 1px solid var(--resilience-rule); font-size: .78rem; }
.resilience-input-record strong { font: 500 1.2rem/1.4 "JetBrains Mono", monospace; color: var(--resilience-cyan); margin-left: .2rem; }
.resilience-input-record > span:nth-child(2) { color: var(--muted, #a5a9b0); }
.resilience-input-record .resilience-scenario-name { margin-left: auto; color: var(--muted, #a5a9b0); font-size: .72rem; }
.resilience-paths { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); border-bottom: 1px solid var(--resilience-rule); }
.resilience-path { padding: 1.25rem 1.3rem 1.1rem 0; --path-color: var(--resilience-green); }
.resilience-path + .resilience-path { padding-left: 1.3rem; padding-right: 0; border-left: 1px solid var(--resilience-rule); }
.resilience-path.is-anomaly { --path-color: var(--resilience-red); }
.resilience-path.is-contained { --path-color: var(--resilience-amber); }
.resilience-path h3 { font: 500 .87rem/1.6 "Noto Sans SC", sans-serif; margin: 0 0 1rem; }
.resilience-flow { list-style: none !important; padding: 0 !important; margin: 0 0 1.25rem !important; }
.resilience-flow li { position: relative; display: flex; align-items: baseline; gap: .6rem; font-size: .76rem; line-height: 1.7; padding: .35rem 0 .65rem; margin: 0 !important; }
.resilience-flow li > span { flex: 0 0 1.5rem; color: var(--muted, #a5a9b0); font: var(--fs-micro)/1.5 "JetBrains Mono", monospace; }
.resilience-flow li:not(:last-child)::after { content: ""; position: absolute; width: 1px; height: .4rem; background: var(--resilience-rule); left: .4rem; bottom: .05rem; }
.resilience-flow li:last-child { color: var(--path-color); }
.resilience-outcome { margin: 0; border-top: 1px solid var(--resilience-rule); padding-top: .7rem; }
.resilience-outcome > div { display: grid; grid-template-columns: 4.5em 1fr; align-items: baseline; gap: .6rem; margin: .5rem 0; }
.resilience-outcome dt { color: var(--muted, #a5a9b0); font-size: .71rem; }
.resilience-outcome dd { margin: 0; font-size: .79rem; line-height: 1.6; color: var(--path-color); }
.resilience-outcome dd strong { font: 500 1.75rem/1.4 "JetBrains Mono", monospace; }
.resilience-outcome dd > span { margin-left: .5rem; font-size: var(--fs-micro); color: var(--muted, #a5a9b0); white-space: nowrap; }
.resilience-block .resilience-path-note { font-size: .74rem; line-height: 1.8; margin: .75rem 0 0; color: var(--ink-dim, #b0b6ba); }
.resilience-static-outcomes { padding-left: 1.3rem !important; font-size: .79rem; line-height: 1.9; }
@container (max-width: 450px) {
  .resilience-controls { grid-template-columns: 1fr; gap: .85rem; }
  .resilience-paths { grid-template-columns: 1fr; }
  .resilience-path { padding: 1.1rem 0; }
  .resilience-path + .resilience-path { padding: 1.1rem 0; border-left: 0; border-top: 1px solid var(--resilience-rule); }
  .resilience-flow { display: grid; grid-template-columns: 1fr 1fr; column-gap: .65rem; }
  .resilience-flow li { align-items: baseline; }
  .resilience-flow li:not(:last-child)::after { display: none; }
  .resilience-input-record .resilience-scenario-name { width: 100%; margin: .15rem 0 0; }
  .resilience-tape-heading h3 { font-size: .82rem; }
  .resilience-scenarios { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: .3rem; }
  .resilience-scenarios button { padding: .55rem .3rem; font-size: .73rem; }
}
@media (prefers-reduced-motion: reduce) {
  .resilience-block *, .resilience-block *::before, .resilience-block *::after { animation: none !important; transition: none !important; }
}
@media print {
  .resilience-block { --resilience-cyan: #266c7a; --resilience-green: #526b28; --resilience-amber: #92570d; --resilience-red: #a23545; break-inside: auto; }
  .resilience-controls, .resilience-scenarios { display: none !important; }
  .resilience-path, .resilience-tape { break-inside: avoid; }
}
