.creation-flow{--creation-flow-preview-width:min(100%, 236px, calc((100dvh - 330px) * .5625));min-height:0;padding:4px 12px max(12px, env(safe-area-inset-bottom));overscroll-behavior:contain;color:var(--ink);flex-direction:column;flex:1;gap:12px;display:flex;overflow:auto}.creation-flow[data-presentation=running]{padding-top:0;padding-bottom:max(8px, env(safe-area-inset-bottom));gap:6px}.creation-flow-preview{width:var(--creation-flow-preview-width);justify-items:center;display:grid}.creation-flow-preview .creation-flow-media,.creation-flow-preview .creation-flow-transport{width:100%}.creation-flow-preview[data-revealed=false] video{opacity:0}.creation-flow-sr{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.creation-flow-header{text-align:center;flex-shrink:0;align-content:start;gap:4px;height:56px;display:grid}.creation-flow[data-result-shell=true] .creation-flow-header{align-content:center}.creation-flow[data-result-shell=true]{padding-top:0;padding-bottom:max(8px, env(safe-area-inset-bottom));gap:6px}.creation-flow[data-result-shell=true] .creation-flow-header{height:32px}.creation-flow[data-result-shell=true] .creation-flow-media-region{gap:0}.creation-flow[data-result-shell=true] .creation-flow-header h2{font-size:18px}.creation-flow[data-kind=result] .creation-flow-media{box-shadow:none;border:0}.creation-flow-header p,.creation-flow-header h2,.creation-flow-header span{margin:0}.creation-flow-header p{min-height:15px;color:var(--muted);text-overflow:ellipsis;white-space:nowrap;font-size:11px;overflow:hidden}.creation-flow-header h2{letter-spacing:-.55px;font-size:20px;font-weight:600}.creation-flow-header span{color:var(--muted);font-size:12px;line-height:1.4}.creation-flow-media-region{flex-shrink:0;justify-items:center;gap:6px;display:grid}.creation-flow-failure{border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);text-align:center;align-content:center;align-self:center;gap:10px;width:min(100%,360px);min-height:160px;margin-top:auto;padding:20px;display:grid}.creation-flow-failure h3{margin:0;font-size:16px;line-height:1.35}.creation-flow-failure p{color:var(--muted);margin:0;font-size:13px;line-height:1.45}.creation-flow-media,.creation-flow-skeleton-media{width:var(--creation-flow-preview-width);aspect-ratio:9/16;border-radius:var(--radius);place-items:center;min-width:158px;display:grid;position:relative;overflow:hidden}.creation-flow-media{border:1px solid var(--line);background:var(--panel);box-shadow:var(--shadow-inset)}.creation-flow-skeleton-media{background:var(--panel)}.creation-flow-media video{object-fit:contain;background:#050505;width:100%;height:100%;display:block}.creation-flow-preview-empty,.creation-flow-preview-empty{color:var(--muted);text-align:center;gap:10px;font-size:12px}.creation-flow-transport{width:var(--creation-flow-preview-width);justify-content:center;align-self:center;align-items:center;height:44px;padding:0;display:flex}.creation-flow-transport-group{justify-content:center;align-items:center;gap:4px;display:flex}.creation-flow-transport .ds-button{min-width:44px;min-height:44px}.creation-flow-transport .ds-button svg{width:18px;height:18px}.creation-flow-time{color:var(--ink);font-variant-numeric:tabular-nums;white-space:nowrap;font-size:10px}.creation-flow-time span{color:var(--muted)}.creation-flow-steps{border:1px solid var(--line);border-radius:var(--control-radius);background:var(--surface);align-self:center;gap:3px;width:min(100%,360px);margin:0;padding:8px 10px;list-style:none;display:grid}.creation-flow-steps li{min-width:0;min-height:22px;color:var(--muted);grid-template-columns:18px minmax(0,1fr) auto;align-items:center;gap:7px;font-size:11px;display:grid}.creation-flow-step-label{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.creation-flow-step-count{color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap;font-weight:450}.creation-flow-steps li[data-state=active]{color:var(--ink);font-weight:550}.creation-flow-steps li[data-state=pending]{opacity:.55}.creation-flow-step-mark{border:1px solid var(--line);border-radius:50%;place-items:center;width:15px;height:15px;display:grid}.creation-flow-steps li[data-state=complete] .creation-flow-step-mark,.creation-flow-steps li[data-state=active] .creation-flow-step-mark{border-color:var(--accent);color:var(--accent)}.creation-flow-steps li[data-state=complete] .creation-flow-step-mark{background:var(--accent);color:var(--on-accent)}.creation-flow-steps li[data-state=active] .creation-flow-step-mark:after{content:"";background:currentColor;border-radius:50%;width:5px;height:5px}.creation-flow-recovery{border:1px solid var(--line);border-radius:var(--control-radius);width:min(100%,360px);min-height:48px;color:var(--muted);justify-content:center;align-self:center;align-items:center;gap:8px;padding:8px 12px;display:flex}.creation-flow-recovery p,.creation-flow-actions p{margin:0;font-size:12px;line-height:1.4}.creation-flow-actions{width:var(--creation-flow-preview-width);grid-template-columns:repeat(2,minmax(0,1fr));align-self:center;gap:8px;margin-top:auto;display:grid}.creation-flow[data-kind=result] .creation-flow-actions{margin-top:0}.creation-flow-actions>.ds-button:only-child{grid-column:1/-1;justify-self:center}.creation-flow-actions .ds-button{min-height:44px}.creation-flow-actions p{color:var(--muted);text-align:center;grid-column:1/-1}.creation-flow-action-placeholders span{border-radius:var(--control-radius);background:var(--surface);height:44px;animation:1.6s ease-in-out infinite creation-flow-skeleton-pulse}.creation-dialog.creation-flow-export-dialog{border:1px solid var(--line);border-radius:var(--radius);background:var(--raised);width:min(420px,100vw - 24px);height:fit-content;max-height:min(360px,40dvh);box-shadow:none;margin:auto;overflow:hidden}.creation-dialog.creation-flow-export-dialog::backdrop{-webkit-backdrop-filter:none;backdrop-filter:none}.creation-flow-export-dialog .creation-heading{padding:0 20px 10px}.creation-flow-export-sheet{overscroll-behavior:contain;gap:16px;min-height:0;padding:0 20px 20px;display:grid;overflow:auto}.creation-flow-export-sheet>p{color:var(--muted);margin:0;font-size:12px;line-height:1.5}.creation-flow-export-sheet dl{gap:8px;margin:0;display:grid}.creation-flow-export-setting{border:1px solid var(--line);border-radius:var(--control-radius);background:var(--surface);justify-content:space-between;align-items:center;gap:16px;min-height:44px;padding:0 12px;font-size:12px;display:flex}.creation-flow-export-setting dt{color:var(--muted)}.creation-flow-export-setting dd{text-align:right;margin:0;font-weight:600}.creation-flow-export-sheet .creation-flow-export-revision{font-family:var(--font-mono);font-size:10px}.creation-flow-export-actions{justify-content:flex-end;gap:8px;display:flex}.creation-flow-export-actions .ds-button{min-height:44px}@media (max-width:600px){.creation-dialog.creation-flow-export-dialog{width:100vw;height:fit-content;max-height:40dvh;padding-bottom:env(safe-area-inset-bottom);border-width:1px 0 0;border-radius:22px 22px 0 0;margin:auto 0 0}}@media (max-height:660px){.creation-flow{--creation-flow-preview-width:min(100%, 176px);gap:8px}.creation-flow-media{min-width:140px}.creation-flow-steps{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (prefers-reduced-motion:reduce){.creation-flow{transform:none}.creation-flow-action-placeholders span{animation:none}}@keyframes creation-flow-skeleton-pulse{0%,to{opacity:.55}50%{opacity:.9}}
