/* Scoped to the passive, directed homepage episodes inside the demo frames. */
.home-story[data-story-product="ofa"]{--bg:#101923;--panel:#1b2532;--raised:#263343;--drawer:#263343;--selected:#304259;--edge:#71859e66;--text:#e8edf4;--muted:#acbbcf;--faint:#8598b0;--accent:#accdf6;--good:#a6d5c5;--warn:#e3c595}
.home-story .work,.home-story .deep-main{position:relative;overflow:hidden;padding:0}
.home-story .work>:not(.hs-root),.home-story .deep-main>:not(.hs-root){display:none!important}
.home-story .site-return,.home-story .back-to-site{display:none!important}
.hs-root{position:absolute;inset:0;background:var(--bg);color:var(--text);display:grid;grid-template-rows:86px minmax(0,1fr) 38px;isolation:isolate;font-family:Inter,Arial,sans-serif}
.hs-root *{box-sizing:border-box}
.hs-root svg{width:20px;height:20px;flex-shrink:0;vertical-align:middle}
.hs-root h1,.hs-root h2,.hs-root h3,.hs-root p{margin:0;text-wrap:pretty}
.hs-root h1{font-size:25px;line-height:1.15;font-weight:600;letter-spacing:-.65px}
.hs-root h2{font-size:20px;line-height:1.25;font-weight:550;letter-spacing:-.35px}
.hs-root h3{font-size:16px;line-height:1.25;font-weight:600}
.hs-root p{font-size:13px;line-height:1.55;color:var(--muted)}
.hs-kicker{font:10px/1.4 ui-monospace,SFMono-Regular,monospace;letter-spacing:1px;text-transform:uppercase;color:var(--faint)}
.hs-header{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 22px;border-bottom:1px solid var(--edge);background:var(--panel)}
.hs-header .hs-kicker{margin-bottom:8px}
.hs-badge{display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;border:1px solid var(--edge);border-radius:3px;padding:5px 8px;font:11px/1.2 ui-monospace,SFMono-Regular,monospace;color:var(--muted)}
.hs-badge.hs-live{color:var(--accent);background:var(--selected);border-color:transparent}
.hs-good{color:var(--good)}.hs-warn{color:var(--warn)}
.hs-layout{min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 266px;gap:16px;padding:18px 20px;animation:hs-reveal .42s ease both}
.hs-center{min-width:0;min-height:0;display:flex;flex-direction:column;justify-content:flex-start}
.hs-pane,.hs-workflow{background:var(--panel);border:1px solid var(--edge);border-radius:6px;overflow:hidden;box-shadow:0 2px 3px #0002,0 9px 18px -11px #0008}
.hs-pane{min-height:0;flex:1}
.hs-pane-title{padding:12px 16px;border-bottom:1px solid var(--edge);color:var(--muted);font-size:12px;background:color-mix(in srgb,var(--raised) 50%,var(--panel))}
.hs-row{min-height:72px;display:flex;align-items:center;gap:11px;padding:15px 16px;border-bottom:1px solid var(--edge);position:relative}
.hs-row:last-child{border-bottom:0}
.hs-row>div{min-width:0;flex:1}
.hs-row strong{display:block;font-size:13px;line-height:1.4;font-weight:550;color:var(--text)}
.hs-row small{display:block;font-size:11px;line-height:1.5;margin-top:5px;color:var(--muted)}
.hs-row-icon{color:var(--faint)}
.hs-row.hs-selected{background:var(--selected);box-shadow:inset 3px 0 var(--accent)}
.hs-row .hs-badge{font-size:10px}
.hs-inspector{background:var(--drawer);border:1px solid var(--edge);border-radius:6px;padding:20px 18px;box-shadow:0 2px 3px #0003,0 8px 16px -10px #0009;display:flex;flex-direction:column;min-height:0}
.hs-inspector>.hs-kicker{margin-bottom:10px}
.hs-inspector>h2{font-size:21px;margin-bottom:22px}
.hs-fact{padding:12px 0;border-bottom:1px solid var(--edge);font-size:12px;line-height:1.45}
.hs-fact>span{display:block;color:var(--faint);font-size:10px;margin-bottom:5px}
.hs-fact>strong{font-weight:500}
.hs-inspector-foot{margin-top:auto;padding-top:20px}
.hs-note{padding:16px;margin:12px 16px;border-left:2px solid var(--accent);background:color-mix(in srgb,var(--selected) 40%,transparent)}
.hs-note strong{display:block;font-size:12px;font-weight:550;margin-bottom:7px}
.hs-note p{font-size:12px}
.hs-inspector .hs-note{margin:0;padding:0 0 0 12px;background:none}
.hs-inspector .hs-row{padding:12px 0;min-height:72px}
.hs-inspector .hs-row strong{font-size:12px}
.hs-card{min-width:0;border:1px solid var(--edge);background:var(--raised);padding:17px 14px;border-radius:5px;box-shadow:0 2px 4px #0002}
.hs-card h3{margin:11px 0 8px}
.hs-card p{font-size:12px;line-height:1.5}
.hs-glyph{display:inline-flex;color:var(--accent)}
.hs-card.hs-active{border-color:var(--accent)}
.hs-card.hs-focus{border-color:color-mix(in srgb,var(--warn) 70%,transparent);background:color-mix(in srgb,var(--warn) 9%,var(--raised));color:var(--text)}
.hs-workflow{flex:1;display:flex;flex-direction:column}
.hs-workflow-head{padding:16px;border-bottom:1px solid var(--edge);position:relative}
.hs-workflow-head h2{margin:7px 0 12px;font-size:20px}
.hs-flow-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;padding:18px 14px;flex:1;background-image:radial-gradient(var(--edge) .6px,transparent .6px);background-size:16px 16px}
.hs-flow-grid>div>.hs-kicker{margin-bottom:13px}
.hs-flow-grid .hs-card{padding:13px 11px;min-height:145px}
.hs-flow-grid h3{font-size:15px}
.hs-doc{display:flex;align-items:center;gap:7px;padding:11px 8px;background:var(--raised);border:1px solid var(--edge);margin-bottom:7px;border-radius:3px;font-size:11px;line-height:1.25}
.hs-doc>span{flex:1}.hs-doc small{display:block;font-size:10px;color:var(--faint);margin-top:5px}
.hs-doc svg{width:14px;height:14px;color:var(--faint)}
.hs-doc svg:last-child{color:var(--good);width:12px}
.hs-mini-check{display:flex;align-items:center;gap:7px;font-size:11px;padding:13px 0 10px;color:var(--muted)}
.hs-mini-check svg{width:14px;height:14px}
.hs-child{display:flex;align-items:center;gap:6px;font-size:10px;color:var(--muted);margin-left:7px;padding:9px 0 9px 10px;border-left:1px solid var(--edge)}
.hs-child svg{width:13px;height:13px}
.hs-workflow-foot{border-top:1px solid var(--edge);padding:12px 14px;color:var(--muted);font-size:11px;background:var(--panel);display:flex;gap:7px;align-items:center}
.hs-workflow-foot svg{width:14px;height:14px}
.hs-condition{display:flex;align-items:center;gap:9px;padding:12px 0;border-bottom:1px solid var(--edge);font-size:12px}
.hs-condition svg{width:16px;height:16px;color:var(--good)}
.hs-pipeline,.hs-handoff{display:grid;grid-template-columns:1fr 26px 1fr 26px 1fr;align-items:center;gap:3px;padding:20px 16px}
.hs-pipeline .hs-card{min-height:142px}.hs-moving{color:var(--accent);text-align:center;animation:hs-arrow 1.7s ease infinite}
.hs-moving svg{width:18px;height:18px}
.hs-transfer{height:3px;background:var(--edge);overflow:hidden;margin:0 16px}
.hs-transfer>i{display:block;width:38%;height:100%;background:var(--accent);animation:hs-transfer 2s ease-in-out infinite}
.hs-transfer.hs-complete>i{width:100%;animation:hs-complete 1s ease both;background:var(--good)}
.hs-console{padding-top:20px}.hs-console>.hs-kicker{padding:0 16px 8px}.hs-console .hs-row{min-height:66px;padding:11px 16px}
.hs-supervisor{display:flex;gap:16px;align-items:center;padding:25px 20px}.hs-supervisor>svg{width:36px;height:36px;color:var(--accent)}
.hs-supervisor>div{flex:1}.hs-supervisor p{margin-top:6px}
.hs-agent-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:0 20px}.hs-agent-grid .hs-card{min-height:151px}
.hs-progress-row{display:flex;justify-content:space-between;margin:28px 20px 13px;font-size:12px;color:var(--muted)}
.hs-logline{display:flex;gap:10px;align-items:center;margin:28px 20px;color:var(--good);font-size:12px}
.hs-result-banner{display:flex;align-items:center;gap:14px;padding:23px 18px;background:color-mix(in srgb,var(--good) 7%,var(--panel));border-bottom:1px solid var(--edge)}
.hs-result-banner>svg{color:var(--good);width:28px;height:28px}.hs-result-banner h2{font-size:20px}.hs-result-banner p{margin-top:7px}
.hs-network{padding:12px 12px 0;min-height:0}.hs-network>svg{width:100%;height:auto;max-height:374px;display:block}
.hs-net-lines path{stroke:var(--edge);stroke-width:1.5;fill:none}
.hs-net-lines .hs-link-active{stroke:var(--accent);stroke-dasharray:6 4;animation:hs-flow 2.5s linear infinite;animation-delay:var(--delay,0s);opacity:.6}
.hs-net-node{animation:hs-node .45s ease both;animation-delay:var(--delay,0s)}
.hs-net-node rect{fill:var(--raised);stroke:var(--edge);stroke-width:1.2;filter:drop-shadow(0 3px 3px #0003)}
.hs-net-node text{fill:var(--text);font:16px Inter,Arial,sans-serif}.hs-net-node text.hs-net-sub{fill:var(--faint);font-size:12px}
.hs-net-node circle{fill:var(--faint)}
.hs-net-selected rect{fill:var(--selected);stroke:var(--accent);stroke-width:2}.hs-net-selected circle{fill:var(--accent)}
.hs-net-impact rect{stroke:var(--good)}.hs-net-impact circle{fill:var(--good)}
.hs-legend{display:flex;justify-content:space-between;gap:10px;padding:15px 5px;color:var(--faint);font-size:10px;border-top:1px solid var(--edge);margin-top:12px}
.hs-version-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:22px 18px}
.hs-version-grid>div{padding:22px 16px;border:1px solid var(--edge);border-radius:4px;background:var(--raised)}
.hs-version-grid h2{font-size:26px;margin:14px 0}.hs-version-grid p{min-height:56px;margin-bottom:16px}
.hs-version-current{box-shadow:inset 2px 0 var(--accent)}
.hs-handoff{padding:15px 16px 0}.hs-handoff .hs-card{padding:12px;min-height:130px}.hs-handoff h3{font-size:15px}
.hs-handoff-pane .hs-network>svg{max-height:225px}.hs-handoff-pane .hs-legend{margin-top:0;padding:8px 5px}
.hs-source-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;padding:24px 18px}.hs-source-grid .hs-card{min-height:185px}
.hs-trace{display:flex;align-items:center;justify-content:center;gap:12px;padding:20px;color:var(--accent);font-size:12px}
.hs-chain{padding:20px}.hs-chain .hs-card{display:grid;grid-template-columns:28px 1fr;column-gap:14px;padding:15px;margin-bottom:13px}
.hs-chain .hs-glyph{grid-row:1/3}.hs-chain .hs-card h3{margin:0 0 7px}.hs-chain .hs-card p{grid-column:2}
.hs-review-card{margin:25px;padding:26px;background:var(--raised);border:1px solid var(--edge);border-radius:5px;box-shadow:0 6px 15px -10px #0009}
.hs-review-card h2{font-size:26px;margin:20px 0}.hs-review-card p{font-size:15px;line-height:1.65}
.hs-review-sign{display:flex;gap:12px;align-items:center;border-top:1px solid var(--edge);margin-top:28px;padding-top:20px;font-size:12px}
.hs-review-sign>div{flex:1}.hs-review-sign small{display:block;color:var(--faint);font-size:10px;margin-top:7px}.hs-review-sign>svg:last-child{color:var(--good)}
.hs-episode{display:flex;align-items:center;gap:20px;padding:0 22px;border-top:1px solid var(--edge);font-size:10px;color:var(--faint);background:var(--panel)}
.hs-episode>div{display:flex;gap:5px;flex:1;max-width:370px;margin-left:auto}.hs-episode i{height:2px;flex:1;background:var(--edge)}.hs-episode i.is-done{background:var(--accent)}
.hs-episode strong{font:10px ui-monospace,SFMono-Regular,monospace;white-space:nowrap}
.hs-arrival{animation:hs-reveal .55s ease both;animation-delay:var(--delay,0s)}
@keyframes hs-reveal{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}
@keyframes hs-node{from{opacity:0}to{opacity:1}}
@keyframes hs-arrow{0%,100%{opacity:.35;transform:translateX(-2px)}50%{opacity:1;transform:translateX(2px)}}
@keyframes hs-transfer{from{transform:translateX(-110%)}to{transform:translateX(370%)}}
@keyframes hs-complete{from{transform:scaleX(.15);transform-origin:left}to{transform:scaleX(1);transform-origin:left}}
@keyframes hs-flow{to{stroke-dashoffset:-40}}
/* Continuous movement within persistent workspaces. */
.hs-layout{animation:none}
.hs-center,.hs-inspector,.hs-header{position:relative}
.hs-center{isolation:isolate}
.hs-inspector,.hs-header{overflow:hidden}
.hs-outgoing{position:absolute;inset:0;z-index:5;display:flex;flex-direction:column;pointer-events:none;animation:hs-leave .48s cubic-bezier(.2,.7,.2,1) both;background:var(--bg)}
.hs-outgoing *{animation:none!important}
.hs-center>.hs-outgoing{background:var(--bg)}
.hs-center>.hs-outgoing>.hs-pane,.hs-center>.hs-outgoing>.hs-workflow{height:100%}
.hs-inspector>.hs-outgoing{padding:20px 18px;background:var(--drawer)}
.hs-inspector>.hs-outgoing>.hs-kicker{margin-bottom:10px}
.hs-inspector>.hs-outgoing>h2{font-size:21px;margin-bottom:22px}
.hs-header>.hs-outgoing{padding:18px 22px;flex-direction:row;align-items:center;justify-content:space-between;gap:20px;background:var(--panel)}
.hs-enter{animation:hs-enter .65s cubic-bezier(.18,.7,.18,1) both}
.hs-inspector>.hs-enter{animation-delay:90ms}
.hs-updated{animation:hs-update .5s ease both}
.hs-sequence{animation:hs-sequence .7s cubic-bezier(.18,.7,.18,1) both;animation-delay:var(--arrival-delay,100ms)}
.hs-sequence.hs-arrival{animation-delay:var(--arrival-delay,100ms)}
.hs-card,.hs-net-node rect,.hs-net-node circle,.hs-badge,.hs-doc{transition:background-color .6s,border-color .6s,fill .6s,stroke .6s,color .5s,box-shadow .6s}
.hs-doc{position:relative}.hs-doc.is-verified{border-color:color-mix(in srgb,var(--good) 45%,var(--edge));background:color-mix(in srgb,var(--good) 6%,var(--raised))}
.hs-doc.is-verified svg:last-child{animation:hs-check .45s ease both}
.hs-net-lines .hs-link-active{animation-duration:1.55s}
.hs-net-node circle{animation:hs-signal 2.7s ease-in-out infinite;animation-delay:var(--delay,0s)}
.hs-moving{animation-duration:1.15s}
.hs-transfer>i{animation-duration:1.35s}
.home-story[data-story-product="concert"] .hs-root[data-phase="2"] .hs-transfer>i{animation:none;width:100%;transform:scaleX(min(1,calc(var(--phase-progress,0)*1.2)));transform-origin:left}
.hs-episode i{position:relative;overflow:hidden}
.hs-episode i.is-current{background:var(--edge)}
.hs-episode i.is-current::after{content:"";position:absolute;inset:0;background:var(--accent);transform:scaleX(var(--phase-progress,0));transform-origin:left}
.home-story .sidebar nav a,.home-story .rail-sections a,.home-story .deep-side nav a{transition:background-color .35s,color .35s,border-color .35s}
@keyframes hs-enter{from{opacity:.15;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@keyframes hs-leave{from{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-7px)}}
@keyframes hs-sequence{from{opacity:.3;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@keyframes hs-update{from{opacity:.35;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}
@keyframes hs-check{from{opacity:.25;transform:scale(.7)}to{opacity:1;transform:scale(1)}}
@keyframes hs-signal{0%,65%,100%{opacity:.5}35%{opacity:1}}
html[data-story-motion="paused"] .hs-root *,html[data-story-motion="paused"] .hs-root{animation-play-state:paused!important}
@media(prefers-reduced-motion:reduce){.hs-root *{animation:none!important;transition:none!important}.hs-outgoing{display:none!important}}
