.article-page .state-management-controls{display:flex;flex-wrap:wrap;gap:var(--cf-space-200);align-items:center}.article-page .state-management-slider{display:grid;grid-gap:var(--cf-space-100);gap:var(--cf-space-100);flex:1 1 100%;max-width:100%;color:var(--cf-color-text-secondary);font-size:var(--cf-font-size-300)}.article-page .state-management-slider input{width:100%;accent-color:var(--cf-color-primary)}.article-page .state-management-playground{align-items:stretch}.article-page .state-management-runtime{display:grid;grid-gap:var(--cf-space-300);gap:var(--cf-space-300)}.article-page .state-management-summary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-gap:var(--cf-space-250);gap:var(--cf-space-250)}.article-page .state-management-action-log,.article-page .state-management-summary div,.article-page .state-management-todo-list li{border:1px solid var(--cf-color-paper-border);border-radius:var(--cf-radius-250);background:var(--cf-color-paper-raised)}.article-page .state-management-summary div{display:grid;grid-gap:var(--cf-space-100);gap:var(--cf-space-100);padding:var(--cf-space-250)}.article-page .state-management-action-log>span,.article-page .state-management-summary span{color:var(--cf-color-paper-text-secondary);font-size:var(--cf-font-size-275);text-transform:uppercase;letter-spacing:var(--cf-letter-spacing-wide)}.article-page .state-management-summary strong{color:var(--cf-color-paper-text);font-size:var(--cf-font-size-450)}.article-page .state-management-action-log ol,.article-page .state-management-todo-list{display:grid;grid-gap:var(--cf-space-150);gap:var(--cf-space-150);margin:0;padding:0;list-style:none}.article-page .state-management-todo-list li{display:flex;justify-content:space-between;gap:var(--cf-space-250);padding:var(--cf-space-250);color:var(--cf-color-paper-text)}.article-page .state-management-todo-list li[data-done=true] span{color:var(--cf-color-paper-text-secondary);text-decoration:line-through}.article-page .state-management-action-log{display:grid;grid-gap:var(--cf-space-200);gap:var(--cf-space-200);padding:var(--cf-space-250)}.article-page .state-management-action-log li{padding:var(--cf-space-100) var(--cf-space-150);border-radius:var(--cf-radius-150);color:var(--cf-color-paper-text-secondary)}.article-page .state-management-action-log li[aria-current=step]{background:var(--cf-color-paper-primary-subtle);color:var(--cf-color-paper-text)}.article-page .state-management-library-list{display:grid;grid-gap:var(--cf-space-250);gap:var(--cf-space-250);margin:var(--cf-space-350) 0;padding:0;list-style:none}.article-page .state-management-library-list li{padding:var(--cf-space-300);border:1px solid var(--cf-color-border);border-radius:var(--cf-radius-300);background:var(--cf-color-surface-raised)}.article-page .state-management-library-list strong{color:var(--cf-color-text-strong)}@media(max-width:768px){.article-page .state-management-summary{grid-template-columns:1fr}.article-page .state-management-slider{min-width:100%}}