.decision-flow{color-scheme:dark;--df-bg:#13211b;--df-ink:#f1f1df;--df-muted:#b8c8af;--df-accent:#edbb92;--df-line:#67826545;font-family:'DM Sans',sans-serif;background:var(--df-bg);color:var(--df-ink)}.decision-flow *{box-sizing:border-box}.df-story{height:520svh}.df-stage{height:100svh;min-height:650px;position:sticky;top:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:28px 5% 16px;overflow:hidden}.df-scene-heading{text-align:center;flex:none;z-index:2}.df-eyebrow{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--df-muted);margin:0 0 16px}.df-scene-heading h2{font-weight:500;font-size:clamp(36px,4vw,62px);line-height:1.04;letter-spacing:-.05em;margin:0;min-height:2.08em}.df-scene-caption{font-size:16px;line-height:1.5;margin:16px auto 0;color:var(--df-muted);min-height:24px;max-width:640px}.df-motion-frame{position:relative;flex:none;width:min(1100px,100%,calc((100svh - 360px)*1.81818));aspect-ratio:1200/660;margin:10px 0 0;container-type:inline-size}.df-motion-frame video{display:block;width:100%;height:100%;object-fit:contain;background:var(--df-bg)}.df-scene-overlay{position:absolute;inset:0;opacity:0;pointer-events:none;will-change:opacity}.df-scene-overlay>div,.df-scene-overlay>span,.df-scene-overlay>p{position:absolute;transform:translate(-50%,-50%)}.df-provider{top:23.3%;width:11.3%;height:20.6%;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:12px;font-size:clamp(12px,1.5cqw,18px)}.df-provider img{width:4.4cqw;height:4.4cqw;filter:brightness(0) invert(.94)}.df-openai,.df-replies{left:27.5%}.df-claude,.df-signals{left:50%}.df-gemini,.df-product{left:72.5%}.df-model-name{left:50%;top:66.7%;display:flex;flex-direction:column;align-items:center;gap:7px;white-space:nowrap}.df-model-name span{font-size:1.35cqw;color:#cad7be}.df-model-name strong{font-size:2.6cqw;font-weight:500;letter-spacing:-.02em}.df-source{top:18.5%;font-size:1.7cqw;color:#dae6d0;white-space:nowrap}.df-context-name{left:50%;top:82%;font-size:1.6cqw;white-space:nowrap;color:#c6d4bd}.df-count{left:50%;top:10%;display:flex;align-items:center;gap:18px;white-space:nowrap}.df-count b{font-size:7cqw;font-weight:500;line-height:1;letter-spacing:-.06em;color:var(--df-accent)}.df-count span{font-size:1.6cqw;max-width:15cqw;white-space:normal;line-height:1.3}.df-match-note{left:50%;top:93%;font-size:1.5cqw;white-space:nowrap;color:var(--df-muted)}.df-strategy-count{left:50%;top:6%;display:flex;align-items:center;gap:15px;white-space:nowrap}.df-strategy-count b{font-size:5.2cqw;line-height:1;font-weight:500;letter-spacing:-.06em;color:var(--df-accent)}.df-strategy-count span{font-size:1.6cqw;color:#cfddc4}.df-guard-note{left:50%;top:82%;width:80%;margin:0;text-align:center;font-size:1.7cqw;line-height:1.4;color:var(--df-muted);opacity:0}.df-response-note{left:50%;top:19%;font-size:1.6cqw;letter-spacing:.05em;color:var(--df-accent);white-space:nowrap}.df-feedback-note{left:50%;top:78%;font-size:1.8cqw;white-space:nowrap;opacity:0}.df-story-controls{display:flex;align-items:center;justify-content:space-between;width:min(100%,1050px);gap:20px;flex:none;border-top:1px solid var(--df-line);padding-top:5px;min-height:50px;color:var(--df-muted);font-size:12px}.df-progress{display:flex;gap:0}.df-progress button{width:36px;height:44px;padding:0;background:none;border:0;cursor:pointer;display:grid;place-items:center}.df-progress i{width:18px;height:3px;border-radius:2px;background:#647d5a}.df-progress button[aria-current] i{background:var(--df-accent)}.decision-flow button{font-family:inherit}.df-play,.df-back-start{border:0;background:none;font-size:12px;color:var(--df-ink);padding:12px 0;min-height:44px;cursor:pointer}.df-play{min-width:132px;text-align:right}.decision-flow button:focus-visible,.decision-flow a:focus-visible{outline:2px solid var(--df-accent);outline-offset:4px}.df-sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.df-media-fallback{position:absolute;inset:0;background:var(--df-bg);padding:30px;line-height:1.8}.df-media-fallback p{font-size:22px}.df-media-fallback li{font-size:16px}.df-media-fallback[hidden]{display:none}
@media(min-width:1500px){.df-stage{padding-top:36px}.df-scene-heading h2{font-size:62px}.df-motion-frame{width:min(1140px,100%,calc((100svh - 360px)*1.81818))}}
@media(max-height:790px) and (min-width:701px){.df-stage{padding-top:20px}.df-eyebrow{margin-bottom:12px}.df-scene-heading h2{font-size:43px}.df-scene-caption{margin-top:12px;font-size:15px}.df-motion-frame{width:min(1050px,100%,calc((100svh - 300px)*1.81818))}.df-story-controls{min-height:45px}}
@media(max-width:700px){.df-stage{min-height:620px;padding:30px 16px 14px;justify-content:center}.df-story{height:400svh}.df-scene-heading h2{font-size:36px}.df-eyebrow{font-size:10px}.df-scene-caption{font-size:15px;max-width:340px;min-height:45px}.df-motion-frame{width:calc(100% + 24px);margin-top:20px;margin-bottom:20px}.df-provider{gap:5px;font-size:10px}.df-provider img{width:6cqw;height:6cqw}.df-model-name span{font-size:2.2cqw}.df-model-name strong{font-size:3.2cqw}.df-source{font-size:2.5cqw}.df-context-name{font-size:2.8cqw}.df-count span{font-size:2.7cqw;max-width:25cqw}.df-strategy-count span{font-size:2.7cqw}.df-match-note,.df-guard-note{font-size:2.8cqw}.df-response-note{font-size:2.7cqw}.df-feedback-note{font-size:3cqw}.df-story-controls{gap:6px;flex-wrap:wrap;justify-content:center}.df-scroll-hint{width:100%;text-align:center;font-size:11px}.df-progress button{width:36px}.df-play{min-width:0;padding:12px;font-size:12px}.df-media-fallback{padding:10px;overflow:auto}.df-media-fallback li{font-size:13px}}
@media(prefers-reduced-motion:reduce){.df-scene-overlay{will-change:auto}}

@media(min-width:701px){.df-stage{padding-top:72px}.df-motion-frame{width:min(1100px,100%,calc((100svh - 385px)*1.81818))}}
@media(max-height:790px) and (min-width:701px){.df-motion-frame{width:min(1050px,100%,calc((100svh - 335px)*1.81818))}}
.df-motion-frame video{mask-image:linear-gradient(to right,transparent,#000 7%,#000 93%,transparent),linear-gradient(to bottom,transparent,#000 5%,#000 94%,transparent);mask-composite:intersect}

/* Give each stage room to be read at an ordinary page-scroll pace. */
.df-story{height:600svh}
.df-progress button{width:76px;display:flex;flex-direction:column;justify-content:center;gap:7px;color:var(--df-muted)}
.df-progress button span{font-size:11px;line-height:1}
.df-progress button[aria-current]{color:var(--df-ink)}
@media(max-width:700px){.df-progress button{width:55px}.df-progress button span{font-size:10px}.df-story-controls .df-play{width:100%;text-align:center;padding:6px}}

.df-story{height:700svh}
.df-provider.df-claude img,.df-provider.df-gemini img{filter:none}
.df-learning-note{left:50%;top:88%;font-size:1.7cqw;color:var(--df-muted);white-space:nowrap}
@media(max-width:700px){.df-progress button{width:50px}.df-learning-note{font-size:2.7cqw}}

@media(max-width:360px){.df-progress button{width:44px}.df-progress button span{font-size:9px}}

.df-count span{max-width:26cqw;font-size:1.8cqw;line-height:1.35}
.df-strategy-count span{font-size:1.8cqw;line-height:1.35}
@media(max-width:700px){.df-count span{font-size:2.8cqw;max-width:35cqw}.df-strategy-count span{font-size:2.8cqw}}

/* Approved story, scoped to the homepage section below its persistent navigation. */
.decision-flow{--df-header-height:78px;position:relative;margin:0;width:100%;scroll-margin-top:78px;background:#13211b;color:#f1f1df;isolation:isolate}
.decision-flow .df-stage{top:var(--df-header-height);height:calc(100svh - var(--df-header-height));min-height:0;padding:28px 5% 16px;justify-content:center}
.decision-flow .df-scene-heading h2{color:var(--df-ink);font-family:inherit;text-wrap:balance}
.decision-flow .df-motion-frame{width:min(1100px,100%,calc((100svh - var(--df-header-height) - 290px)*1.81818))}
.decision-flow .df-progress button:hover{color:var(--df-ink)}
.decision-flow .df-progress button:hover i{background:var(--df-accent)}
.decision-flow .df-play:hover{text-decoration:underline;text-underline-offset:4px}
.decision-flow .df-play:disabled{cursor:default;opacity:.65}
@media(max-height:790px) and (min-width:701px){.decision-flow .df-stage{padding-top:18px}.decision-flow .df-motion-frame{width:min(1050px,100%,calc((100svh - var(--df-header-height) - 250px)*1.81818))}}
@media(max-width:760px){.decision-flow{--df-header-height:68px;scroll-margin-top:68px}}
@media(max-width:700px){.decision-flow .df-stage{padding:24px 16px 16px;justify-content:center}.decision-flow .df-motion-frame{width:calc(100% + 24px);margin-top:20px;margin-bottom:20px}.decision-flow .df-scene-heading h2{font-size:clamp(28px,8vw,36px)}.decision-flow .df-story-controls{padding-top:4px}.decision-flow .df-scene-caption{font-size:15px;min-height:45px}.decision-flow .df-play{min-height:44px}}
@media(max-height:580px){.decision-flow .df-stage{height:580px;top:0}.decision-flow .df-motion-frame{width:min(720px,100%)}.decision-flow .df-scene-heading h2{font-size:30px}.decision-flow .df-scene-caption{font-size:14px;margin-top:8px}.decision-flow .df-eyebrow{margin-bottom:8px}}
/* Reset inherited site-footer spacing for the in-section controls. */
.decision-flow .df-story-controls{padding:5px 0 0;background:transparent;line-height:1.4}
.decision-flow.df-failed{height:auto;min-height:720px}
.decision-flow.df-failed .df-stage{position:relative;top:0;height:auto;min-height:720px}
.decision-flow.df-failed .df-motion-frame{height:340px;aspect-ratio:auto}
@media(max-width:700px){.decision-flow .df-progress{width:100%;max-width:390px;justify-content:space-between}.decision-flow .df-progress button{flex:1;width:auto;min-width:44px}.decision-flow .df-story-controls{padding-top:10px}.decision-flow.df-failed .df-media-fallback{overflow:auto}}
@media(max-width:700px){.decision-flow .df-motion-frame{width:min(calc(100vw + 120px),calc((100svh - var(--df-header-height) - 360px)*1.81818));flex-shrink:0}.decision-flow .df-source{font-size:2.5cqw}.decision-flow .df-context-name{font-size:2.5cqw}.decision-flow .df-feedback-note{font-size:2.6cqw}.decision-flow .df-learning-note{font-size:2.5cqw}}
.decision-flow.df-failed .df-stage{padding-top:calc(var(--df-header-height) + 24px)}
.decision-flow.df-failed .df-motion-frame{width:100%;max-width:720px;height:360px;margin:24px 0}
.decision-flow.df-failed .df-media-fallback{padding:16px;line-height:1.5}
.decision-flow.df-failed .df-media-fallback p{font-size:20px;margin-bottom:14px}
.decision-flow.df-failed .df-media-fallback ol{padding-left:20px;margin:0}
.decision-flow.df-failed .df-media-fallback li{font-size:15px;margin-bottom:10px}
@media(max-width:700px){.decision-flow.df-failed .df-motion-frame{height:450px}}