.workflow-demo{margin:2rem 0 3rem;padding:clamp(20px,4vw,36px);border:1px solid var(--control-line,#73786b);border-radius:24px;background:var(--surface,#10110f);color:var(--text-primary,#fff)}
.workflow-demo *{min-width:0}
.workflow-demo [hidden]{display:none!important}
.workflow-demo h2{margin:0 0 18px;font-size:clamp(1.8rem,4vw,2.6rem);line-height:1.12}
.workflow-demo__heading>p{max-width:68ch}
.workflow-demo__heading>.eyebrow{margin-top:0}
.workflow-demo__disclosure{color:var(--accent,#bfff00);font-size:.9375rem}
.workflow-demo__input-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:24px;margin-top:28px}
.workflow-demo fieldset{margin:0;padding:0;border:0}
.workflow-demo legend{margin:0 0 18px;padding:0;font-weight:600;font-size:1.05rem}
.workflow-demo .field{margin-bottom:18px}
.workflow-demo .field small{color:var(--text-secondary,#abada6);font-size:.8125rem;line-height:1.7}
.workflow-demo select{width:100%;font-size:1rem}
.workflow-demo fieldset:disabled{opacity:.65}
.workflow-demo__source{padding:22px;border:1px solid var(--line,rgba(255,255,255,.12));border-radius:16px;background:var(--background,#050505)}
.workflow-demo__kicker{margin:0 0 10px!important;color:var(--text-secondary,#abada6);font:500 .6875rem/1.6 var(--mono,monospace);letter-spacing:.08em;text-transform:uppercase}
.workflow-demo__source h3{margin:0 0 12px;font-size:1.25rem;line-height:1.3}
.workflow-demo__source>p:last-child{margin:0;font-size:.9375rem;line-height:1.8}
.workflow-demo__steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:28px 0!important;padding:0!important;list-style:none!important}
.workflow-demo__steps li{position:relative;display:flex;flex-direction:column;margin:0!important;padding:17px 14px;border:1px solid var(--control-line,#73786b);border-radius:14px;background:var(--background,#050505)}
.workflow-demo__steps li::before{display:none!important}
.workflow-demo__number{color:var(--text-secondary,#abada6);font:500 .75rem/1.6 var(--mono,monospace)}
.workflow-demo__steps h3{margin:7px 0 9px;font-size:1rem;line-height:1.35}
.workflow-demo__steps p{margin:0 0 16px;font-size:.8125rem;line-height:1.65;color:var(--text-secondary,#abada6)}
.workflow-demo__state{display:block;margin-top:auto;font-size:.75rem;font-weight:600;line-height:1.5}
.workflow-demo__steps [data-state=complete]{border-color:var(--accent,#bfff00)}
.workflow-demo__steps [data-state=complete] .workflow-demo__state{color:var(--accent,#bfff00)}
.workflow-demo__steps [data-state=attention]{border-color:#f5ca77}
.workflow-demo__steps [data-state=attention] .workflow-demo__state{color:#f5ca77}
.workflow-demo__steps [data-state=review]{border-style:dashed;border-color:var(--text-primary,#fff)}
.workflow-demo__result{padding:clamp(18px,3vw,28px);border:1px solid var(--accent,#bfff00);border-radius:18px;background:var(--background,#050505);scroll-margin-top:110px;scroll-margin-bottom:130px}
.workflow-demo__result:focus{outline:3px solid var(--focus,#bfff00);outline-offset:5px}
.workflow-demo__result h3{margin:0 0 14px;font-size:clamp(1.4rem,3vw,1.8rem);line-height:1.25}
.workflow-demo__result-summary{font-size:.9375rem;line-height:1.8}
.workflow-demo__brief{display:grid;grid-template-columns:minmax(110px,.7fr) minmax(0,1.3fr);gap:0;margin:22px 0}
.workflow-demo__brief dt,.workflow-demo__brief dd{margin:0;padding:12px 0;border-bottom:1px solid var(--line,rgba(255,255,255,.12));font-size:.875rem;line-height:1.7;overflow-wrap:anywhere}
.workflow-demo__brief dt{padding-right:20px;color:var(--text-secondary,#abada6);font-weight:500}
.workflow-demo__question{margin:22px 0;padding:18px;border-left:3px solid #f5ca77;background:var(--surface,#10110f)}
.workflow-demo__question h4{margin:0 0 9px;font-size:1rem;line-height:1.5}
.workflow-demo__question p{margin:0;font-size:.9375rem;line-height:1.8}
.workflow-demo__review{font-size:.9375rem;line-height:1.8}
.workflow-demo__footnote{margin-bottom:0;font-size:.8125rem;line-height:1.7;color:var(--text-secondary,#abada6)}
.workflow-demo__noscript{padding:18px;border:1px solid var(--control-line,#73786b);border-radius:14px;font-size:.9375rem}
.workflow-demo__next{margin-top:26px;padding-top:22px;border-top:1px solid var(--line,rgba(255,255,255,.12))}
.workflow-demo__next>p{font-size:.9375rem;line-height:1.8;margin:0 0 18px}
.workflow-demo__links{display:flex;align-items:center;flex-wrap:wrap;gap:20px}
.workflow-demo__links .btn{white-space:normal;text-align:center;max-width:100%}
.workflow-demo__links .text-link{white-space:normal;font-size:.75rem}
@media(max-width:760px){.workflow-demo__input-grid{grid-template-columns:1fr}.workflow-demo__steps{grid-template-columns:repeat(2,minmax(0,1fr))}.workflow-demo__links{align-items:flex-start;flex-direction:column}}
@media(max-width:480px){.workflow-demo{padding:20px 16px;border-radius:18px}.workflow-demo__steps{gap:9px}.workflow-demo__steps li{padding:14px 12px}.workflow-demo__source{padding:18px}.workflow-demo__brief{display:block}.workflow-demo__brief dt{padding:14px 0 0;border:0}.workflow-demo__brief dd{padding-top:5px}.workflow-demo__form .btn,.workflow-demo__links .btn{width:100%;padding-inline:18px;gap:12px;font-size:.6875rem}.workflow-demo__result{padding:18px 15px}}
@media(forced-colors:active){.workflow-demo,.workflow-demo__source,.workflow-demo__steps li,.workflow-demo__result,.workflow-demo__question{border-color:CanvasText}.workflow-demo__result:focus{outline-color:Highlight}}
