[data-algorithm-animation="minimum-window"] {
  container-type: inline-size;
  display: grid;
  min-width: 0;
  background: #f5f8fc;
  color: #202c3c;
  border-color: #d5deea;
}
[data-algorithm-animation="minimum-window"] .algorithm-animation-head {
  flex-direction: row; align-items: center; gap: 8px;
  padding: 8px 12px; background: white; border-color: #d5deea;
}
[data-algorithm-animation="minimum-window"] .algorithm-animation-head > div:first-child { flex: 1; min-width: 0; }
[data-algorithm-animation="minimum-window"] .algorithm-animation-kicker { display: none; }
[data-algorithm-animation="minimum-window"] h3 { color: #202c3c; font-size: 14px; line-height: 1.4; }
[data-algorithm-animation="minimum-window"] .algorithm-animation-controls { flex: 0 0 auto; gap: 4px; }
[data-algorithm-animation="minimum-window"] .algorithm-animation-controls button {
  width: 28px; height: 28px; background: white; color: #2563eb; border-color: #b8c9e0;
}
[data-algorithm-animation="minimum-window"] .zeroes-stage {
  min-height: calc(56.25cqw - 72px); padding: 10px; gap: 4px; min-width: 0;
}
[data-algorithm-animation="minimum-window"] .zeroes-result {
  display: none;
}
[data-algorithm-animation="minimum-window"] .zeroes-message {
  order: 3; min-height: 36px; margin: 0; color: #334155;
  text-align: left; font-size: 13px; line-height: 18px; overflow-wrap: anywhere;
}
[data-algorithm-animation="minimum-window"] .zeroes-progress { padding: 6px 12px; background: white; border-color: #d5deea; }
[data-algorithm-animation="minimum-window"] .zeroes-progress span { color: #64748b; }
[data-algorithm-animation="minimum-window"] .zeroes-progress div { background: #e1e8f2; }
[data-algorithm-animation="minimum-window"] .zeroes-progress i { background: #2563eb; }
[data-algorithm-animation="minimum-window"] .minimum-window-animation { display: block; order: 1; padding: 0; overflow: visible; min-width: 0; }
.minimum-window-visual {
  display: grid; grid-template-areas: "summary counts" "rail rail" "legend legend";
  grid-template-columns: minmax(0, 1fr) minmax(160px, 1fr); gap: 6px 16px; min-width: 0;
}
.minimum-window-summary { grid-area: summary; display: grid; align-content: center; gap: 6px; min-width: 0; }
.minimum-window-target { color: #202c3c; font: 600 13px/1.5 monospace; overflow-wrap: anywhere; }
.minimum-window-phase { color: #2563eb; font-size: 13px; }
.minimum-window-range { color: #64748b; font: 11px/1.5 monospace; overflow-wrap: anywhere; }
.minimum-window-best { color: #147d45; font: 600 13px/1.5 monospace; overflow-wrap: anywhere; }
.minimum-window-counts { grid-area: counts; width: 100%; table-layout: fixed; border-spacing: 2px; font: 11px/1.4 monospace; }
.minimum-window-counts caption { color: #64748b; text-align: left; font: 11px/1.5 sans-serif; }
.minimum-window-counts th, .minimum-window-counts td { height: 22px; padding: 2px 0; background: white; color: #334155; text-align: center; border: 0; border-radius: 3px; }
.minimum-window-counts thead th { background: #e9eef6; color: #475569; }
.minimum-window-counts [data-satisfied="true"] { background: #e4f6ee; color: #147d45; }
.minimum-window-counts [data-satisfied="false"] { background: #fdebed; color: #b32f40; }
.minimum-window-rail { grid-area: rail; display: grid; gap: 22px; padding: 18px 3px 0; min-width: 0; }
.minimum-window-track { position: relative; display: grid; gap: 4px; min-width: 0; }
.minimum-window-char { position: relative; display: grid; grid-template-rows: 36px 18px; min-width: 0; text-align: center; }
.minimum-window-char strong { display: grid; place-items: center; min-width: 0; background: white; color: var(--letter-color); border: 1px solid #d5deea; border-radius: 4px; font: 700 16px/1 monospace; }
.minimum-window-char span { padding-top: 5px; color: #64748b; font: 10px/1 monospace; }
.minimum-window-char em { position: absolute; inset: -17px 0 auto; color: #2563eb; font: normal 700 10px/1 monospace; }
.minimum-window-char.in-window strong { background: #eef4ff; }
.minimum-window-char.best strong { box-shadow: inset 0 -3px #147d45; }
.minimum-window-char.enter strong { border: 2px solid #087f68; background: #e4f6ee; }
.minimum-window-char.leave strong { border: 2px dashed #c94345; background: #fdebed; }
.minimum-window-outline { position: absolute; top: -2px; height: 40px; border: 3px solid #2563eb; border-radius: 6px; pointer-events: none; transition: left .35s ease, width .35s ease, border-color .2s; }
.minimum-window-outline[hidden] { display: none; }
.minimum-window-legend { grid-area: legend; color: #64748b; font-size: 10px; line-height: 16px; overflow-wrap: anywhere; }
@container (max-width: 420px) {
  [data-algorithm-animation="minimum-window"] .algorithm-animation-head { flex-wrap: wrap; }
  [data-algorithm-animation="minimum-window"] .zeroes-stage { min-height: 0; padding: 10px; }
  .minimum-window-visual { grid-template-areas: "summary" "rail" "counts" "legend"; grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .minimum-window-summary { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 4px 8px; }
  .minimum-window-range, .minimum-window-best { grid-column: 1 / -1; }
}
@media (prefers-reduced-motion: reduce) { .minimum-window-outline { transition: none; } }
