.performance-patterns-lesson .window-controls{display:grid;grid-gap:var(--cf-space-300);gap:var(--cf-space-300)}.performance-patterns-lesson .window-slider{display:grid;grid-gap:var(--cf-space-100);gap:var(--cf-space-100);font-size:var(--cf-font-size-300)}.performance-patterns-lesson .window-slider input{inline-size:100%;accent-color:var(--cf-color-code-button)}.performance-patterns-lesson .window-panes{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.performance-patterns-lesson .window-panes>.runtime-pane+.runtime-pane{border-left:1px solid var(--cf-color-border)}.performance-patterns-lesson .window-viewport{overflow-y:auto;border:1px solid var(--cf-color-border-control);border-radius:var(--cf-radius-150);background:var(--cf-color-surface);color:var(--cf-color-text);font-size:var(--cf-font-size-325)}.performance-patterns-lesson .window-viewport ul{margin:0;padding:0;list-style:none}.performance-patterns-lesson .window-viewport li{display:flex;align-items:center;inset-inline:0;padding:0 var(--cf-space-300);border-bottom:1px solid var(--cf-color-border)}.performance-patterns-lesson .window-chips,.performance-patterns-lesson .window-legend{display:flex;flex-wrap:wrap;gap:var(--cf-space-100);margin:0;padding:0;list-style:none;font-size:var(--cf-font-size-300)}.performance-patterns-lesson .window-chips{margin-top:var(--cf-space-300);font-family:var(--cf-font-mono)}.performance-patterns-lesson .window-chip{padding:var(--cf-space-050) var(--cf-space-150);border:1px solid var(--cf-color-border-control);border-radius:var(--cf-radius-100);color:var(--cf-color-text)}.performance-patterns-lesson .window-chip.is-on-screen{border-color:var(--cf-color-success-border);background:var(--cf-color-success-subtle)}.performance-patterns-lesson .window-chip.is-in-page{border-color:var(--cf-color-tertiary-border);background:var(--cf-color-tertiary-subtle)}.performance-patterns-lesson .window-chip.is-missing{border-style:dashed;color:var(--cf-color-text-muted)}@media(max-width:768px){.performance-patterns-lesson .window-panes{grid-template-columns:minmax(0,1fr)}.performance-patterns-lesson .window-panes>.runtime-pane+.runtime-pane{border-left:0;border-top:1px solid var(--cf-color-border)}}