.article-playground .journey-controls{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:var(--cf-space-250)}.article-playground .journey-controls .execution-choices{display:flex;flex-wrap:wrap;gap:var(--cf-space-150)}.article-playground .journey-stepper{display:flex;gap:var(--cf-space-150)}.article-playground .request-journey{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}.article-playground .request-journey>.runtime-pane+.runtime-pane{border-left:1px solid var(--cf-color-border)}.article-playground .journey-steps{margin:0;padding:var(--cf-space-200) 0;list-style:none}.article-playground .journey-steps li{margin:0}.article-playground .journey-step{display:grid;grid-template-columns:var(--cf-space-600) minmax(64px,max-content) minmax(0,1fr);align-items:baseline;grid-gap:var(--cf-space-200);gap:var(--cf-space-200);width:100%;padding:var(--cf-space-150) var(--cf-space-300);border:0;border-left:2px solid rgba(0,0,0,0);background:none;color:var(--cf-color-text-secondary);font-size:var(--cf-font-size-300);line-height:var(--cf-line-height-150);text-align:left;cursor:pointer}.article-playground .journey-step:disabled{cursor:default}.article-playground .journey-step:focus-visible{outline:2px solid var(--cf-color-focus-ring);outline-offset:-2px}.article-playground .is-done .journey-step:hover{background:var(--cf-color-surface-hover)}.article-playground .is-current .journey-step{border-left-color:var(--cf-color-primary-solid);background:var(--cf-color-primary-subtle);color:var(--cf-color-text-strong)}.article-playground .is-next .journey-step{color:var(--cf-color-text-muted)}.article-playground .is-next .journey-step .journey-actor{opacity:.6}.article-playground .journey-number{color:var(--cf-color-text-tertiary);font-family:var(--cf-font-mono);font-size:var(--cf-font-size-250);text-align:right}.article-playground .journey-actor{justify-self:start;padding:0 var(--cf-space-150);border:1px solid var(--cf-color-border);border-radius:var(--cf-radius-full);background:var(--cf-color-surface);color:var(--cf-color-text-secondary);font-size:var(--cf-font-size-250);font-weight:var(--cf-font-weight-semibold);white-space:nowrap}.article-playground .journey-actor.is-nextjs,.article-playground .journey-actor.is-react{border-color:var(--cf-color-secondary-border);background:var(--cf-color-secondary-subtle);color:var(--cf-color-secondary)}.article-playground .journey-actor.is-code{border-color:var(--cf-color-tertiary-border);background:var(--cf-color-tertiary-subtle);color:var(--cf-color-tertiary)}.article-playground .journey-title{min-width:0}.article-playground .journey-travels{display:block;margin-top:var(--cf-space-050);color:var(--cf-color-text-tertiary);font-size:var(--cf-font-size-250);overflow-wrap:anywhere}.article-playground .journey-browser{margin:var(--cf-space-300) var(--cf-space-350) 0;overflow:hidden;border:1px solid var(--cf-color-border-strong);border-radius:var(--cf-radius-200);background:var(--cf-color-bg)}.article-playground .journey-bar{display:flex;align-items:center;gap:var(--cf-space-250);padding:var(--cf-space-150) var(--cf-space-300);border-bottom:1px solid var(--cf-color-border);background:var(--cf-color-surface-raised);font-size:var(--cf-font-size-250)}.article-playground .journey-dots{display:flex;gap:var(--cf-space-100)}.article-playground .journey-dots span{width:8px;height:8px;border-radius:var(--cf-radius-round);background:var(--cf-color-border-strong)}.article-playground .journey-address{flex:1 1;min-width:0;overflow:hidden;padding:var(--cf-space-050) var(--cf-space-250);border-radius:var(--cf-radius-full);background:var(--cf-color-surface-sunken);color:var(--cf-color-text-secondary);font-family:var(--cf-font-mono);text-overflow:ellipsis;white-space:nowrap}.article-playground .journey-screen{min-height:150px;padding:var(--cf-space-300) var(--cf-space-400);color:var(--cf-color-text);font-size:var(--cf-font-size-325)}.article-playground .journey-screen p{margin:0 0 var(--cf-space-100);padding:0}.article-playground .journey-screen p:first-child{color:var(--cf-color-text-strong);font-size:var(--cf-font-size-450);font-weight:var(--cf-font-weight-bold)}.article-playground .journey-screen.is-blank p{color:var(--cf-color-text-muted);font-size:var(--cf-font-size-300);font-weight:var(--cf-font-weight-regular);font-style:italic}.article-playground .runtime-pane>p.journey-react{padding-bottom:0;color:var(--cf-color-text-tertiary);font-size:var(--cf-font-size-275)}.article-playground .runtime-pane>p.journey-react.is-running{color:var(--cf-color-success)}.article-playground .runtime-pane>p.journey-summary{color:var(--cf-color-text-secondary);font-size:var(--cf-font-size-275);font-weight:var(--cf-font-weight-semibold)}@media(max-width:768px){.article-playground .request-journey{grid-template-columns:minmax(0,1fr)}.article-playground .request-journey>.runtime-pane+.runtime-pane{border-left:0;border-top:1px solid var(--cf-color-border)}}@media(max-width:560px){.article-playground .journey-controls{justify-content:flex-start}.article-playground .journey-step,.article-playground .runtime-pane>p.journey-react,.article-playground .runtime-pane>p.journey-summary{font-size:var(--cf-font-size-350)}.article-playground .journey-actor,.article-playground .journey-bar,.article-playground .journey-number,.article-playground .journey-travels{font-size:var(--cf-font-size-300)}.article-playground .journey-screen{font-size:var(--cf-font-size-350)}}