.studio{max-width:calc(1080px + 2 * var(--gutter));padding-bottom:clamp(48px,7vw,96px)}
.stage__cap{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px;min-height:40px}
.stage__for{margin:0;font:italic 400 1.0625rem/1.2 var(--italic)}
.stage__note{margin-left:auto;font-size:.75rem}
.preview-playback{flex:none;display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;padding:10px;background:transparent;border:1px solid var(--line);color:var(--wine);cursor:pointer}
.preview-playback:hover{border-color:var(--wine);background:var(--paper-light)}
.preview-rail{margin-top:12px}
.shelf{position:relative;display:flex;gap:14px;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;padding:6px 6px 10px}
.shelf::-webkit-scrollbar{display:none}
.shelf li{flex:0 0 156px;min-width:0}
.shelf a{display:block;text-decoration:none}
.shelf img{width:100%;height:auto;border:1px solid var(--line);background:var(--paper-deep)}
.shelf span{display:block;padding-top:7px;font-size:.8125rem;line-height:1.3;color:var(--muted)}
.shelf a:hover span,.shelf [aria-current] span{color:var(--wine)}
.shelf a:hover img{border-color:var(--wine)}
.shelf [aria-current] img{outline:2px solid var(--wine);outline-offset:-3px}
@media(max-width:599px){.shelf li{flex-basis:132px}.stage__note{max-width:18ch;line-height:1.4;font-size:.6875rem}}
@media print{.preview-rail,.preview-playback{display:none!important}}

.visual{padding-block:clamp(72px,9vw,128px);overflow:hidden}
.visual--connect,.visual--operate{background:var(--paper-light)}
.visual--place{background:var(--paper-deep)}
.visual__grid{display:grid;gap:clamp(32px,5vw,64px) 48px}
.visual__head h2{max-width:15ch;font-size:clamp(2rem,1.4rem + 2.2vw,3.25rem)}
.visual__head p{margin-top:16px;max-width:36ch}
.visual figure img{width:100%;height:auto}
.visual .v-ico{flex:none;width:20px;height:20px;vertical-align:middle}
.v-tag{display:inline-block;font-size:.75rem;line-height:1.4;color:var(--muted)}
.v-tag--wine{color:var(--wine)}
.v-note{font-size:.8125rem;color:var(--muted)}
.v-bar{display:block;height:2px;min-width:48px;background:var(--line)}
.v-bar i{display:block;height:100%;background:var(--wine);transform-origin:left}
.v-w15{width:15%}.v-w25{width:25%}.v-w40{width:40%}.v-w70{width:70%}.v-w100{width:100%}
.v-st{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;font-size:.8125rem}
.v-st i{flex:none;width:9px;height:9px;border:1px solid var(--wine)}
.v-st--ready i{background:var(--wine)}
.v-st--running i{padding:2px;background:var(--wine);background-clip:content-box}
.v-st--approval i{background:var(--wine);transform:rotate(45deg)}
.v-st--limit i{border-color:var(--ink);background:var(--ink)}
.v-st--paused i{width:8px;border-block:0;border-inline:3px solid var(--ink)}
.v-con,.v-acct,.v-ctx,.v-ops{display:grid;gap:16px}
.v-con__map{position:relative;display:grid;gap:36px}
.v-con__lines{display:none}
.v-core{display:flex;align-items:center;gap:14px;justify-self:center;color:var(--wine)}
.v-core b{display:block;font:italic 400 clamp(1.75rem,1rem + 1.5vw,2.5rem)/1.1 var(--italic);color:var(--wine)}
.v-core small{display:block;margin-top:8px;font-size:.8125rem;color:var(--ink-soft)}
.visual .v-core .v-ico,.visual .v-con__g .v-ico{width:32px;height:32px}
.v-con__groups{display:grid;gap:32px}
.v-con__g{min-width:0}
.v-con__g p{margin-bottom:16px;font:400 1.375rem/1.2 var(--display)}
.v-con__g ul{display:flex;gap:14px;justify-content:space-between}
.v-con__g li{display:grid;justify-items:center;gap:10px;min-width:0;flex:1;font-size:.75rem;line-height:1.3;text-align:center;overflow-wrap:break-word}
@media (min-width:600px){.v-con__groups{grid-template-columns:1fr 1fr;gap:48px}}
@media (min-width:1100px){
.v-con__lines{display:block;position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:var(--line)}
.v-con__groups{column-gap:30%;row-gap:170px}
.v-core{position:absolute;z-index:1;left:50%;top:50%;width:30%;transform:translate(-50%,-50%);flex-direction:column;padding:20px 0;text-align:center;background:var(--paper-light)}}
.v-acct{display:grid;gap:28px;min-width:0}
.v-routing-job{font:italic 400 clamp(1.5rem,1rem + 1.5vw,2.25rem)/1.2 var(--italic);color:var(--wine)}
.v-routing{display:grid;grid-template-columns:minmax(0,1fr) 36px minmax(0,1fr);align-items:center;gap:12px}
.v-provider{display:grid;justify-items:start;gap:10px;min-width:0}
.visual .v-provider>.v-ico{width:44px;height:44px}
.v-provider strong{display:block;font:400 1.5rem/1.2 var(--display)}
.v-provider small{display:block;margin-top:5px;color:var(--muted);font-size:.8125rem;line-height:1.4}
.v-routing__line{width:100%;fill:none;stroke:var(--wine);stroke-width:1.5;overflow:visible}
.v-routing-caption{display:flex;align-items:center;gap:14px;color:var(--wine);font-size:.875rem}
.v-acct__others{display:flex;flex-wrap:wrap;gap:32px 48px;padding-top:28px;border-top:1px solid var(--line)}
.v-acct__others>div{flex:1 1 120px}
.v-acct__others .v-provider{grid-template-columns:24px minmax(0,1fr);gap:8px 12px}
.visual .v-acct__others .v-provider>.v-ico{width:24px;height:24px}
.v-acct__others .v-provider strong{font:500 .9375rem/1.3 var(--text)}
.v-acct__others .v-st{grid-column:2}
.v-acct__others>div>p{margin:12px 0 0 36px;font-size:.8125rem;color:var(--ink-soft)}
.v-more{display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px;font-size:.8125rem;color:var(--ink-soft)}
.v-more span{display:inline-flex;align-items:center;gap:8px;color:var(--ink)}
.v-win__bar>span,.v-rail li,.v-io>span:not(.v-tag),.v-ops__who{display:inline-flex;align-items:center;gap:8px}
.v-win{background:none}
.v-win__bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;font-size:.875rem}
.v-rail{display:flex;flex-wrap:wrap;gap:16px 24px;font-size:.75rem;color:var(--ink-soft)}
.v-rail .is-on{color:var(--wine)}
.v-page{display:grid;gap:24px;padding:clamp(24px,4vw,48px);background:var(--paper-light)}
.v-page__t{font:400 1.5rem/1.2 var(--display)}
.v-lines{display:grid;gap:12px}
.v-lines li{display:flex;align-items:center;gap:6px}
.v-lines i{height:4px;background:var(--line)}
.v-lines sup{font-size:.6875rem;line-height:1;color:var(--wine)}
.v-src{display:grid;gap:12px;padding-left:1.25em;list-style:decimal;font-size:.8125rem;color:var(--ink-soft)}
.v-src .v-ico{margin:0 8px 0 4px}
.v-io{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;font-size:.8125rem}
.v-win__body{display:grid;gap:28px;padding-top:28px}
.v-team{display:grid;gap:clamp(28px,4vw,48px);align-items:center}
.v-team__work{display:grid;gap:32px}
.v-obj{display:flex;align-items:flex-start;gap:12px;font:italic 400 1.5rem/1.25 var(--italic);color:var(--wine)}
.v-obj small,.v-ops li small{display:block;font-size:.75rem;color:var(--muted)}
.v-lanes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 24px}
.v-lane{display:grid;grid-template-columns:24px minmax(0,1fr);align-content:start;gap:8px 10px;font-size:.8125rem;line-height:1.4}
.v-lane strong{display:block;font-size:.9375rem;font-weight:500}
.v-lane .v-bar{grid-column:2}
.v-hand{display:flex;align-items:center;gap:10px;font:italic 400 1.25rem/1.2 var(--italic);color:var(--wine)}
.v-doc{display:grid;gap:16px;min-width:0}
.v-doc .v-tag{justify-self:start}
.v-doc .v-doc__ready{font:italic 400 1.375rem/1.25 var(--italic)}
.v-city{display:grid;grid-template-columns:7fr 5fr;gap:clamp(12px,2vw,28px);align-items:start}
.v-city .photo{margin:0}
.v-city .photo:last-child{margin-top:clamp(40px,9vw,128px)}
.v-city .photo img{aspect-ratio:4/5;object-fit:cover}
.v-city .photo figcaption{position:static;margin-top:10px;padding:0;background:none;font:italic 400 .9375rem/1.4 var(--italic);color:var(--ink-soft)}
.v-ops>.v-tag{display:inline-block;font-size:.75rem;line-height:1.4;color:var(--muted)}
.v-ops__flow{display:grid;gap:8px}
.v-ops__col{display:grid;align-content:start;gap:24px;min-width:0}
.v-ops__h{font:400 1.75rem/1.2 var(--display);color:var(--wine)}
.v-ops__col ul{display:grid;gap:20px}
.v-ops__col li{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 12px;font-size:.875rem;line-height:1.3}
.v-ops__col:first-child li{justify-content:flex-start}
.v-ops__out .v-tag{font:italic 400 1.5rem/1.25 var(--italic)}
.v-ops__who{font-size:.875rem}
.v-ops__to{justify-self:center;color:var(--wine);transform:rotate(90deg)}
.v-ctl{display:flex;flex-wrap:wrap;gap:20px 32px;padding-top:28px;border-top:1px solid var(--line)}
.v-ctl li{display:flex;align-items:center;gap:8px;font-size:.8125rem}
.v-ctl .v-bar{width:48px}
.v-pause{flex:none;width:12px;height:14px;border-inline:4px solid var(--wine)}
@media (min-width:900px){
.visual__grid{grid-template-columns:repeat(12,minmax(0,1fr))}
.visual__head{grid-column:1/6;align-self:center}
.v-team,.v-ops{grid-column:1/-1}
.visual--adapt .visual__head{grid-column:1/9}
.visual--connect .visual__head{grid-column:1/5}
.v-con{grid-column:5/-1}
.visual--accounts .visual__head{grid-area:1/8/2/-1}
.v-acct{grid-area:1/1/2/7}
.v-ctx{grid-column:6/-1}
.visual--agents .visual__head,.visual--operate .visual__head{grid-column:1/8}
.v-team{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}
.v-ops__flow{grid-template-columns:minmax(0,1fr) auto minmax(0,1.15fr) auto minmax(0,1fr)}
.v-ops__to{align-self:center;transform:none}
.visual--place .visual__head{align-self:end;grid-column:1/5}
.v-city{grid-column:5/-1}}
.v-action{grid-column:1/-1;display:flex;justify-content:flex-start}
.visual--accounts .v-action{justify-content:flex-end}
.v-note:has(.v-replay){display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px}
.v-replay{display:inline-flex;align-items:center;justify-self:end;gap:7px;flex:none;min-height:44px;padding:7px 0;background:none;border:0;color:var(--wine);font:inherit;font-size:.8125rem;cursor:pointer;text-underline-offset:4px}
.v-replay:hover{text-decoration:underline}
.v-replay[hidden],.v-example[hidden],.v-example-tabs[hidden]{display:none}
.v-team>.v-replay,.v-ops>.v-replay{justify-self:end;grid-column:1/-1}
.v-sandbox{grid-column:1/-1;display:grid;gap:16px;min-width:0}
.v-sandbox__frame{min-width:0}
.v-sandbox__task{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;font:italic 400 clamp(1.5rem,1rem + 1.5vw,2.25rem)/1.2 var(--italic)}
.v-sandbox__task .v-tag{font:400 .75rem/1.4 var(--text)}
.v-sandbox__panes{display:grid;gap:48px;padding-block:48px}
.v-sandbox__pane{position:relative;min-width:0}
.v-sandbox__pane h3{display:grid;gap:20px;margin-bottom:24px;font:400 1.75rem/1.2 var(--display)}
.v-browser ul,.v-sandbox__files{display:grid;gap:16px;padding:0;font-size:.875rem}
.v-browser li,.v-sandbox__files li{display:flex;align-items:center;gap:10px}
.v-code{display:grid;gap:16px;font-size:.875rem}
.v-code li{display:flex;gap:14px}
.v-code code{font:inherit}
.v-sandbox__files{padding:0}
.v-sandbox__result{padding:12px;background:var(--paper-light);color:var(--wine)}
.v-sandbox__result .v-ico{filter:none}
.v-retain{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px;padding-top:24px;border-top:1px solid var(--bronze);font-size:.8125rem}
.v-retain li{display:flex;align-items:center;gap:8px}
.visual--examples{background:var(--paper-light)}
.v-examples{grid-column:1/-1;min-width:0;display:grid;gap:24px}
.v-example-tabs{display:flex;flex-wrap:wrap;gap:6px 24px}
.v-example-tabs button{border:0;border-bottom:1px solid transparent;background:none;padding:10px 0;min-height:44px;color:var(--muted);font:inherit;font-size:.875rem;cursor:pointer}
.v-example-tabs button:hover{color:var(--wine)}
.v-example-tabs button[aria-selected=true]{border-color:var(--wine);color:var(--wine)}
.v-example{display:grid;gap:24px;min-width:0}
.v-example__image{display:grid;gap:12px;min-width:0}
.v-example__image img{display:block;width:100%;height:auto}
.v-example__image .v-tag{justify-self:start}
.v-example__story{display:grid;align-content:center;gap:24px}
.v-example__story h3{max-width:22ch;font:400 clamp(1.5rem,1.15rem + 1vw,2rem)/1.15 var(--display)}
.v-example__story ol{display:flex;flex-wrap:wrap;gap:12px 20px;font-size:.8125rem;color:var(--ink-soft)}
.v-example__story li{display:flex;align-items:center;gap:12px}
.v-example__story li:last-child .icon{display:none}
.v-example__result{display:flex;gap:10px;align-items:flex-start;color:var(--wine);font:italic 400 1.25rem/1.3 var(--italic)}
.v-example__result .v-ico{margin-top:3px}
.v-proof{display:grid;gap:28px;margin-top:24px;padding-top:32px;border-top:1px solid var(--line)}
.v-proof h3{font:400 1.5rem/1.2 var(--display)}
.v-proof ul{display:grid;gap:28px}
.v-proof a{display:grid;gap:14px}
.v-proof a>span:last-child{display:flex;align-items:center;gap:10px;color:var(--wine);font-size:.8125rem}
@media(min-width:720px){.v-sandbox__panes{grid-template-columns:repeat(3,minmax(0,1fr));gap:40px}.v-example{grid-template-columns:minmax(0,7fr) minmax(0,3fr);gap:32px}.v-proof ul{grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}}
@media(min-width:900px){.visual--sandbox .visual__head,.visual--examples .visual__head{grid-column:1/9}.v-example__story{padding:20px 0}}
.v-lane .v-st{grid-column:2}
.v-obj>.v-ico{margin-top:5px}
.visual--sandbox{background:var(--wine);color:var(--paper-light)}
.visual--sandbox .visual__head h2,.visual--sandbox .visual__head p,.visual--sandbox h3,.visual--sandbox .v-note,.visual--sandbox .v-tag,.visual--sandbox .v-replay{color:var(--paper-light)}
.v-sandbox .v-ico{filter:brightness(0) invert(1)}
.visual .v-sandbox__pane h3>.v-ico{width:48px;height:48px}
.v-sandbox__result .v-ico{filter:none}
.v-proof a>span:first-child{font:italic 400 1.5rem/1.2 var(--italic);color:var(--wine)}
@media(min-width:600px){.v-routing{grid-template-columns:minmax(0,1fr) 80px minmax(0,1fr);gap:24px}}
@media(min-width:720px){.v-sandbox__pane:not(:last-child)::after{content:"";position:absolute;top:24px;left:70px;right:0;border-top:1px dashed var(--bronze);transform-origin:left}}
@media(prefers-reduced-motion:no-preference){
.v-con.is-running .v-con__lines path{stroke-dasharray:180;animation:v-trace 1.5s var(--ease) both}
.v-con.is-running .v-core{animation:v-ink 1s 1s both}
.v-acct.is-running .v-routing__line path{stroke-dasharray:180;animation:v-trace 1.4s var(--ease) .5s both}
.v-acct.is-running .is-fallback{animation:v-ink .8s 1.8s both}
.v-ctx.is-running .v-lines i{transform-origin:left;animation:v-grow 1s var(--ease) .3s both}
.v-ctx.is-running .v-src{animation:v-ink 1s 1s both}
.v-ctx.is-running .v-io{animation:v-ink .7s 2s both}
.v-team.is-running .v-lane .v-bar i{animation:v-grow 1.7s var(--ease) .2s both}
.v-team.is-running .v-doc__ready{animation:v-ink .8s 2s both}
.v-ops.is-running .v-ops__to{animation:v-ink .8s .5s both}
.v-ops.is-running .v-ops__out{animation:v-ink 1.2s 1.8s both}
.v-sandbox.is-running .v-browser li{animation:v-ink .7s var(--ease) .3s both}
.v-sandbox.is-running .v-code li{animation:v-type 1.3s steps(20,end) .9s both}
.v-sandbox.is-running .v-sandbox__pane::after{animation:v-grow 1.5s var(--ease) .6s both}
.v-sandbox.is-running .v-sandbox__files li{animation:v-ink .7s 2s both}
.v-sandbox.is-running .v-sandbox__result{animation:v-ink .7s 2.7s both}
.v-sandbox.is-running .v-retain li:last-child{animation:v-ink 1s 3.4s both}
[data-demo].is-running:not(.demo-inview) *,[data-demo].is-running:not(.demo-inview) *::after,[data-demo].demo-hidden *,[data-demo].demo-hidden *::after{animation-play-state:paused!important}
}
@keyframes v-trace{from{stroke-dashoffset:180}to{stroke-dashoffset:0}}
@keyframes v-grow{from{transform:scaleX(0)}}
@keyframes v-ink{from{opacity:.15}to{opacity:1}}
@keyframes v-type{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0)}}

.live-workspace{grid-column:1/-1;display:grid;gap:20px;min-width:0}
.live-request{display:flex;align-items:center;gap:16px;min-height:76px;padding:16px 0;color:var(--wine)}
.live-you{flex:none;font-size:.8125rem;color:var(--muted)}
.live-request p{flex:1;min-width:0;max-width:45ch;font:italic 400 clamp(1.25rem,1rem + 1.3vw,2rem)/1.25 var(--italic)}
.live-caret{display:none;height:1em;width:1px;background:var(--wine);margin-left:3px;vertical-align:-.1em}
.is-typing .live-caret{display:inline-block}
.live-play{display:flex;align-items:center;justify-content:center;flex:none;align-self:center;margin-left:auto;width:44px;height:44px;padding:12px;background:none;border:1px solid var(--line);color:var(--wine);cursor:pointer}
.live-play:hover{border-color:var(--wine)}
.live-app{background:var(--paper-light);min-width:0}
.live-app__bar{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 24px;border-bottom:1px solid var(--line);font-size:.8125rem;color:var(--ink-soft)}
.live-brand{font:400 1.5rem/1 var(--display);color:var(--wine)}
.live-app__body{display:grid;grid-template-columns:82px minmax(0,1fr);min-height:380px}
.live-rail{display:grid;align-content:start;gap:28px;padding:32px 12px;background:var(--paper-deep)}
.live-rail>span{display:grid;justify-items:center;gap:8px;text-align:center}
.live-rail small{font-size:.6875rem;color:var(--ink-soft)}
.live-centre{padding:clamp(20px,3vw,40px);min-width:0}
.live-centre__head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:12px 24px;margin-bottom:32px}
.live-centre__head h3{font:400 clamp(1.75rem,1.4rem + 1vw,2.5rem)/1.1 var(--display)}
.live-centre__head>span{font-size:.75rem;color:var(--muted)}
.live-pieces{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:28px 48px;min-height:225px}
.live-piece{min-width:0}
.live-piece h4{margin:0 0 24px;font:400 1.25rem/1.2 var(--display);color:var(--wine)}
.live-piece ul{display:grid;gap:18px}
.live-piece li{display:flex;align-items:flex-start;gap:10px;font-size:.9375rem;line-height:1.4}
.live-context{padding-left:28px;border-left:1px solid var(--line)}
.live-context li{font-size:.8125rem;color:var(--ink-soft)}
.live-result{grid-column:1/-1;display:flex;align-items:center;gap:10px;color:var(--wine);font:italic 400 1.25rem/1.3 var(--italic)}
.live-pieces[data-layout=board] .live-primary ul{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.live-pieces[data-layout=board] .live-primary li{display:grid;gap:16px;padding-top:16px;border-top:1px solid var(--wine)}
.live-pieces[data-layout=board]{grid-template-columns:minmax(0,8fr) minmax(0,3fr)}
.live-pieces[data-layout=timeline]{grid-template-columns:1fr}
.live-pieces[data-layout=timeline] .live-primary ul{display:flex;justify-content:space-between;gap:24px}
.live-pieces[data-layout=timeline] .live-primary li{flex:1;border-top:1px solid var(--line);padding-top:16px}
.live-pieces[data-layout=timeline] .live-context{padding:0;border:0}
.live-pieces[data-layout=timeline] .live-context h4{margin-bottom:12px}
.live-pieces[data-layout=timeline] .live-context ul{display:flex;flex-wrap:wrap;gap:16px 32px}
.live-choices{display:flex;flex-wrap:wrap;gap:8px 28px}
.live-choices button{border:0;border-bottom:1px solid transparent;padding:10px 0;min-height:44px;background:none;color:var(--muted);font:inherit;font-size:.875rem;cursor:pointer}
.live-choices button:hover,.live-choices button[aria-pressed=true]{color:var(--wine)}
.live-choices button[aria-pressed=true]{border-color:var(--wine)}
.delivery{display:grid;gap:40px;padding-block:clamp(72px,9vw,128px)}
.delivery h2{max-width:20ch;font-size:clamp(2rem,1.4rem + 2.2vw,3.25rem)}
.delivery .lede{margin-top:16px;max-width:45ch}
.delivery ol{display:grid;gap:28px}
.delivery li h3{margin-bottom:12px;font-size:1.75rem}
.delivery li p{max-width:30ch;font-size:.9375rem;color:var(--ink-soft)}
.delivery>.link-arrow{justify-self:start}
@media(min-width:720px){.delivery ol{grid-template-columns:repeat(3,minmax(0,1fr));gap:48px}}
@media(max-width:599px){
.live-request{align-items:flex-start;min-height:120px;gap:10px}
.live-you{padding-top:4px}
.live-request p{font-size:1.25rem}
.live-app__bar{padding:16px;gap:12px;font-size:.75rem}
.live-brand{font-size:1.25rem}
.live-app__body{grid-template-columns:1fr;min-height:560px}
.live-rail{display:flex;align-items:center;justify-content:flex-start;gap:24px;padding:12px 16px}
.live-rail>span{display:flex;gap:8px}
.live-rail small{display:none}
.live-centre{padding:24px 18px;min-height:490px}
.live-centre__head{margin-bottom:28px;gap:10px}
.live-pieces,.live-pieces[data-layout=board]{grid-template-columns:1fr;gap:28px;min-height:340px}
.live-context{border:0;padding:0}
.live-piece h4{margin-bottom:16px}
.live-piece li{font-size:.8125rem}
.live-piece ul{gap:12px}
.live-result{font-size:1.125rem}
.live-pieces[data-layout=board] .live-primary ul{gap:10px}
.live-pieces[data-layout=board] .live-primary li{font-size:.75rem}
.live-pieces[data-layout=timeline] .live-primary ul{gap:12px}
.live-pieces[data-layout=timeline] .live-primary li{display:grid}
}
@media(prefers-reduced-motion:reduce){.live-caret{display:none!important}}

.live-app,.portal-setup{--portal-surface:#fff;--portal-soft:#f7f5f1;--portal-stroke:#e7e1d8;font-family:var(--text);color:var(--ink)}
.live-app{border-radius:20px;overflow:hidden;background:var(--portal-surface);box-shadow:0 24px 70px rgb(36 35 33 / .1)}
.live-app__bar{padding:20px 24px;border-color:var(--portal-stroke);font-size:.875rem}
.live-brand{font-size:1.5rem}
.live-app__body{grid-template-columns:164px minmax(0,1fr);min-height:430px}
.live-rail{gap:8px;background:var(--portal-soft);padding:24px 12px}
.live-rail button{display:flex;align-items:center;gap:10px;min-height:44px;padding:10px 12px;border:0;border-radius:9px;background:none;text-align:left;color:var(--ink-soft);font:500 .875rem/1.35 var(--text);cursor:pointer}
.live-rail button:hover{background:var(--paper-deep)}
.live-rail button[aria-pressed=true]{background:var(--wine-mist);color:var(--wine)}
.live-app button:disabled{opacity:1;cursor:default}
.live-centre{padding:30px;min-width:0}
.live-centre__head{margin-bottom:28px}
.live-centre__head h3{font:600 clamp(1.125rem,1rem + .7vw,1.625rem)/1.25 var(--text);letter-spacing:-.025em;color:var(--ink)}
.live-centre__head>span{font-size:.8125rem;line-height:1.4;max-width:26ch}
.live-pieces,.live-pieces[data-layout=board]{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;min-height:280px}
.portal-section-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}
.live-piece h4,.portal-inspector h4{font:600 .9375rem/1.4 var(--text);letter-spacing:-.01em;color:var(--ink);margin:0 0 16px}
.portal-section-head h4{margin:0}
.portal-badge{font-size:.75rem;padding:4px 9px;border-radius:6px;background:var(--portal-soft);color:var(--muted)}
.live-primary ul,.live-pieces[data-layout=board] .live-primary ul{display:grid;grid-template-columns:1fr;gap:8px}
.live-primary .portal-row,.live-pieces[data-layout=board] .live-primary .portal-row,.live-pieces[data-layout=timeline] .live-primary .portal-row{display:flex;align-items:center;gap:10px;min-height:56px;padding:0;border:0}
.portal-row>button{display:flex;flex:1;align-items:center;justify-content:space-between;gap:14px;min-height:56px;padding:12px;border:1px solid var(--portal-stroke);border-radius:10px;background:var(--portal-surface);font:500 .875rem/1.4 var(--text);text-align:left;color:var(--ink);cursor:pointer}
.portal-row>button:hover{background:var(--portal-soft);border-color:var(--control)}
.portal-row>button[aria-pressed=true]{border-color:var(--wine);background:var(--portal-soft)}
.portal-row>button small{font-size:.75rem;color:var(--muted)}
.portal-row.is-reviewed>button>span{text-decoration:line-through;color:var(--muted)}
.portal-check{display:flex;align-items:center;justify-content:center;min-width:32px;min-height:44px}
.portal-check input{width:18px;height:18px;margin:0;accent-color:var(--wine)}
.live-context{border:0;padding:20px;border-radius:12px;background:var(--portal-soft)}
.live-context h5{margin:0 0 10px;font:600 1rem/1.4 var(--text);color:var(--ink)}
.live-context>[data-preview-description]{font:400 .875rem/1.55 var(--text);color:var(--ink-soft)}
.portal-sources{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:20px}
.portal-sources>span:first-child{width:100%;font-size:.75rem;color:var(--muted)}
.source-tag{display:inline-flex;align-items:center;gap:6px;font-size:.75rem;color:var(--ink-soft)}
.visual .source-tag .v-ico{width:16px;height:16px}
.portal-toggle{display:flex;align-items:center;gap:10px;min-height:44px;margin-top:16px;font:500 .8125rem/1.4 var(--text);cursor:pointer}
.portal-toggle input{width:18px;height:18px;accent-color:var(--wine);flex:none}
.portal-schedule,[data-routine-status]{font:400 .75rem/1.4 var(--text);color:var(--muted)}
.live-result{font:500 .875rem/1.5 var(--text);gap:10px;padding-top:8px}
.live-result small{margin-left:auto;padding:3px 7px;border-radius:6px;background:var(--wine-mist);color:var(--wine);font-variant-numeric:tabular-nums}
.live-result small:empty{display:none}
.live-pieces[data-layout=timeline]{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.live-pieces[data-layout=timeline] .live-primary ul{display:grid;gap:8px}
.live-pieces[data-layout=timeline] .live-context{padding:20px;background:var(--portal-soft)}
.portal-inspector{min-height:290px;font-size:.875rem}
.portal-inspector>p{max-width:48ch;color:var(--ink-soft)}
.portal-file-list{display:grid;gap:10px;margin-block:20px}
.portal-file-list button{min-height:48px;padding:12px 16px;text-align:left;border:1px solid var(--portal-stroke);border-radius:10px;background:var(--portal-surface);font:500 .875rem/1.4 var(--text);color:var(--ink);cursor:pointer}
.portal-file-list button[aria-pressed=true]{border-color:var(--wine);background:var(--portal-soft)}
.portal-file-detail{padding:20px;background:var(--portal-soft);border-radius:12px}
.portal-agent{display:flex;gap:16px;align-items:flex-start;padding:20px;background:var(--portal-soft);border-radius:12px;margin-bottom:20px}
.portal-agent h4{margin-bottom:8px}
.portal-agent p{color:var(--ink-soft);line-height:1.5}
.portal-setup{grid-column:1/-1;max-width:880px;width:100%;justify-self:center;padding:clamp(24px,4vw,40px);background:var(--portal-surface);border-radius:20px;box-shadow:0 24px 70px rgb(36 35 33 / .08)}
.visual--setup .visual__head{grid-column:1/-1}
.setup-steps{display:flex;justify-content:space-between;gap:18px;margin-bottom:32px;font-size:.8125rem;color:var(--muted)}
.setup-steps li{flex:1;padding-bottom:12px;border-bottom:2px solid var(--portal-stroke)}
.setup-steps [aria-current=step]{font-weight:600;color:var(--wine)}
.setup-steps li:has([aria-current=step]){border-color:var(--wine)}
.setup-content{min-height:300px}
.setup-content fieldset{min-width:0;padding:0;margin:0;border:0}
.setup-content legend{float:left;width:100%;margin-bottom:24px;font:600 clamp(1.125rem,1rem + .5vw,1.5rem)/1.3 var(--text);letter-spacing:-.02em}
.setup-content legend+*{clear:both}
.setup-options{display:grid;gap:12px}
.setup-options label{display:flex;align-items:center;gap:12px;min-height:60px;padding:16px;border:1px solid var(--portal-stroke);border-radius:12px;font-size:.9375rem;cursor:pointer}
.setup-options label:has(:checked){border-color:var(--wine);background:var(--portal-soft)}
.setup-options input{margin-left:auto;width:18px;height:18px;accent-color:var(--wine);flex:none}
.setup-hint{display:flex;align-items:flex-start;gap:8px;margin-top:16px;font-size:.8125rem;line-height:1.5;color:var(--muted)}
.setup-actions{display:flex;align-items:center;justify-content:flex-end;gap:12px;margin-block:24px}
.setup-actions button{min-height:44px;padding:10px 18px;border:1px solid var(--portal-stroke);border-radius:9px;background:var(--portal-surface);color:var(--ink);font:500 .875rem/1.4 var(--text);cursor:pointer}
.setup-actions .portal-primary{background:var(--wine);color:var(--paper-light);border-color:var(--wine)}
.setup-actions button:hover{border-color:var(--wine)}
.setup-actions button:disabled{opacity:.45;cursor:not-allowed}
.setup-actions>[data-setup-back]{margin-right:auto}
.setup-summary{display:grid;gap:16px;margin-bottom:20px}
.setup-summary>div{display:grid;grid-template-columns:110px minmax(0,1fr);gap:16px;font-size:.875rem}
.setup-summary dt{color:var(--muted)}
.setup-summary dd{font-weight:500}
.setup-complete{font-size:.875rem;color:var(--wine);margin-bottom:24px}
.portal-setup>.v-note{max-width:60ch}
@media(max-width:899px){.live-app__body{grid-template-columns:120px minmax(0,1fr)}.live-centre{padding:24px}.live-pieces,.live-pieces[data-layout=board],.live-pieces[data-layout=timeline]{grid-template-columns:1fr}.live-app__body{min-height:610px}}
@media(max-width:899px){[data-view=files] .live-app__body,[data-view=agents] .live-app__body,[data-view=files] .live-centre,[data-view=agents] .live-centre,[data-view=files] .portal-inspector,[data-view=agents] .portal-inspector{min-height:0}}
@media(max-width:599px){
.live-app{border-radius:16px}
.live-app__bar{padding:16px;font-size:.8125rem}
.live-app__body{grid-template-columns:1fr;min-height:680px}
.live-rail{display:flex;padding:10px;gap:4px}
.live-rail button{justify-content:center;flex:1;min-width:0;gap:6px;padding:10px 6px;font-size:.75rem}
.live-rail button>span{display:block}
.live-centre{padding:22px 16px;min-height:590px}
.live-centre__head h3{font-size:1.25rem}
.live-centre__head>span{font-size:.75rem}
.live-piece h4{font-size:.9375rem}
.portal-row>button{font-size:.875rem;padding:12px 10px}
.portal-row>button small{display:none}
.live-context{padding:16px}
.live-result{font-size:.8125rem}
.portal-setup{padding:24px 18px;border-radius:16px}
.setup-steps{font-size:.75rem;gap:10px}
.setup-summary>div{grid-template-columns:1fr;gap:6px}
}

.live-pieces[data-layout]{min-height:400px}
.live-request{min-height:120px}
.live-pieces[data-layout=reports],.live-pieces[data-layout=kanban],.live-pieces[data-layout=roadmap],.live-pieces[data-layout=planner],.live-pieces[data-layout=meals]{grid-template-columns:1fr}
.live-pieces[data-layout] .live-primary{min-width:0}
.live-pieces[data-layout] .adaptive-resources{min-width:0}
.live-pieces[data-layout] .live-context{padding:24px}
.live-pieces[data-layout] .portal-row{min-width:0}
.report-shelf{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.live-pieces[data-layout=reports] .report-cover{display:block}
.live-pieces[data-layout=reports] .report-cover>button{display:grid;grid-template-columns:30px minmax(0,1fr);gap:6px 12px;width:100%;min-height:104px;padding:18px;background:var(--portal-soft)}
.report-cover>button>.v-ico{grid-row:1/3}
.report-cover>button>small{display:block!important;font-size:.6875rem;color:var(--muted)}
.live-pieces[data-layout=reports] .live-context{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:32px;padding:32px;background:#fff;border:1px solid var(--portal-stroke);border-radius:4px}
.live-pieces[data-layout=reports] .adaptive-detail h5{font-size:1.75rem;letter-spacing:-.025em;line-height:1.2}
.live-pieces[data-layout=reports] [data-preview-description]{max-width:48ch;font-size:1rem;line-height:1.75;color:var(--ink-soft)}
.live-pieces[data-layout=reports] .adaptive-resources{border-left:1px solid var(--portal-stroke);padding-left:24px}
.adaptive-kanban{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;min-height:260px}
.kanban-column{min-width:0;background:var(--portal-soft);padding:14px;border-radius:12px}
.kanban-column h5{margin:0 0 20px;font:600 .8125rem/1.4 var(--text);color:var(--ink-soft)}
.kanban-stack{display:grid;align-content:start;gap:12px}
.live-pieces[data-layout=kanban] .kanban-task{display:grid;grid-template-columns:24px minmax(0,1fr);align-items:start;gap:8px;padding:12px;background:#fff;border-radius:10px;border:1px solid var(--portal-stroke)}
.live-pieces[data-layout=kanban] .kanban-task>button[data-preview]{display:block;border:0;min-height:44px;padding:0;background:none;font-size:.875rem}
.live-pieces[data-layout=kanban] .kanban-task .portal-check{min-width:24px}
.kanban-move{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:44px;border:0;border-top:1px solid var(--portal-stroke);padding:12px 0 0;background:none;font:500 .75rem/1.4 var(--text);color:var(--wine);cursor:pointer}
.kanban-task.is-reviewed [data-preview]>span{text-decoration:line-through;color:var(--muted)}
.live-pieces[data-layout=kanban] .live-context,.live-pieces[data-layout=planner] .live-context,.live-pieces[data-layout=roadmap] .live-context{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px;background:none;border-top:1px solid var(--portal-stroke);border-radius:0;padding:24px 0 0}
.live-pieces[data-layout=roadmap] .live-primary{background:var(--wine);color:var(--paper-light);padding:28px;border-radius:14px}
.live-pieces[data-layout=roadmap] .live-primary h4{color:inherit}
.roadmap-label{font-size:.8125rem;color:var(--wine-mist);margin-bottom:32px}
.adaptive-roadmap{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;position:relative;padding-block:8px 28px}
.adaptive-roadmap::before{content:"";position:absolute;top:24px;left:8%;right:8%;border-top:1px solid var(--bronze)}
.live-pieces[data-layout=roadmap] .milestone{position:relative;display:block}
.live-pieces[data-layout=roadmap] .milestone>button{display:grid;justify-items:center;align-content:start;gap:20px;min-height:110px;width:100%;background:none;color:var(--paper-light);border:0;padding:0 12px;text-align:center}
.milestone-node{display:block;width:32px;height:32px;border-radius:50%;border:7px solid var(--wine);background:var(--bronze)}
.milestone>button[aria-pressed=true] .milestone-node{background:var(--paper-light);outline:1px solid var(--paper-light)}
.roadmap-calendar{display:flex;gap:10px;align-items:flex-start;font-size:.8125rem;line-height:1.5;color:var(--wine-mist)}
.roadmap-calendar>.v-ico{filter:brightness(0) invert(1)}
.planner-days{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-bottom:24px;padding-left:74px}
.planner-days span{text-align:center;padding:10px 4px;font-size:.8125rem;color:var(--muted)}
.planner-days .is-today{background:var(--wine);border-radius:8px;color:#fff}
.planner-hours{display:grid;gap:14px}
.planner-hour{display:grid;grid-template-columns:58px minmax(0,1fr);gap:16px;align-items:start}
.planner-hour time{font-size:.8125rem;color:var(--muted);padding-top:16px;font-variant-numeric:tabular-nums}
.live-pieces[data-layout=planner] .planner-hour .portal-row{display:block}
.live-pieces[data-layout=planner] .planner-hour button{width:100%;min-height:76px;background:var(--wine-mist);border:0;border-left:1px solid var(--wine);border-radius:0 10px 10px 0;padding:16px 22px}
.live-pieces[data-layout=planner] .planner-hour:nth-child(2) button{min-height:110px;background:var(--portal-soft);border-color:var(--bronze)}
.live-pieces[data-layout=planner] .planner-hour:nth-child(3) button{min-height:65px;background:var(--paper)}
.live-pieces[data-layout=study]{grid-template-columns:minmax(0,3fr) minmax(0,5fr);gap:32px}
.study-topics{display:grid;gap:16px}
.live-pieces[data-layout=study] .study-topic{display:flex;gap:10px}
.live-pieces[data-layout=study] .study-topic>button{border:0;border-bottom:1px solid var(--portal-stroke);border-radius:0;background:none;min-height:70px;padding:12px 0}
.live-pieces[data-layout=study] .live-context{padding:0;background:none}
.live-pieces[data-layout=study] .adaptive-detail{min-height:300px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:32px;background:var(--wine);color:var(--paper-light);border-radius:18px}
.live-pieces[data-layout=study] .adaptive-detail h4{color:var(--wine-mist);font-weight:400;font-size:.8125rem}
.live-pieces[data-layout=study] .adaptive-detail h5{font-size:.8125rem;order:-1;color:var(--wine-mist);margin-bottom:24px}
.study-question{font:600 clamp(1.375rem,1rem + 1vw,2rem)/1.3 var(--text);letter-spacing:-.025em;margin-bottom:24px}
.live-pieces[data-layout=study] [data-preview-description]{font-size:1.125rem;line-height:1.55;margin-bottom:24px}
[data-flip]{min-height:44px;padding:10px 16px;border:1px solid var(--wine-mist);border-radius:8px;background:none;color:var(--paper-light);font:500 .8125rem/1.4 var(--text);cursor:pointer}
.live-pieces[data-layout=study] .adaptive-resources{padding:8px 16px}
.adaptive-recipes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.live-pieces[data-layout=meals] .recipe{display:grid;align-content:start;gap:14px;padding:24px 20px;min-height:220px;border-radius:14px;background:var(--paper);border:0}
.live-pieces[data-layout=meals] .recipe--1{background:var(--wine-mist)}
.live-pieces[data-layout=meals] .recipe--2{background:var(--portal-soft)}
.live-pieces[data-layout=meals] .recipe>button{display:grid;gap:20px;align-content:start;border:0;padding:0;background:none;min-height:130px;justify-content:start;box-shadow:none}
.live-pieces[data-layout=meals] .recipe>button small{display:block;font-size:.75rem;color:var(--ink-soft)}
.live-pieces[data-layout=meals] .recipe>button>span{font-size:1.25rem;line-height:1.35;font-weight:600}
.recipe>p{font-size:.8125rem;color:var(--ink-soft)}
.live-pieces[data-layout=meals] .live-context{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px;background:none;padding:24px 0 0;border-top:1px solid var(--portal-stroke);border-radius:0}
.grocery-list{display:grid;gap:12px;margin-block:16px 24px}
.grocery-list label{display:flex;align-items:center;gap:12px;min-height:44px;font-size:.9375rem;cursor:pointer}
.grocery-list input{width:18px;height:18px;accent-color:var(--wine)}
.grocery-list label:has(:checked)>span{text-decoration:line-through;color:var(--muted)}
@media(max-width:899px){.live-pieces[data-layout=study]{grid-template-columns:1fr}.live-pieces[data-layout=study] .adaptive-detail{min-height:250px}}
@media(max-width:599px){
.live-pieces[data-layout]{gap:24px;min-height:0}
.report-shelf{grid-template-columns:1fr;gap:8px}
.live-pieces[data-layout=reports] .report-cover>button{min-height:62px;grid-template-columns:24px minmax(0,1fr);padding:12px}
.live-pieces[data-layout=reports] .live-context,.live-pieces[data-layout=kanban] .live-context,.live-pieces[data-layout=planner] .live-context,.live-pieces[data-layout=roadmap] .live-context,.live-pieces[data-layout=meals] .live-context{grid-template-columns:1fr;gap:24px;padding:20px 0;background:none;border:0}
.live-pieces[data-layout=reports] .adaptive-resources{border:0;padding:0}
.live-pieces[data-layout=reports] .adaptive-detail h5{font-size:1.5rem}
.adaptive-kanban{grid-template-columns:1fr;gap:14px}
.kanban-column{padding:16px}
.kanban-column h5{margin-bottom:12px}
.live-pieces[data-layout=roadmap] .live-primary{padding:22px 14px}
.adaptive-roadmap{grid-template-columns:1fr;gap:20px;padding:0}
.adaptive-roadmap::before{top:16px;bottom:16px;left:16px;right:auto;border:0;border-left:1px solid var(--bronze)}
.live-pieces[data-layout=roadmap] .milestone>button{display:flex;align-items:center;justify-content:flex-start;text-align:left;min-height:44px;padding:0;gap:16px}
.milestone-node{flex:none}
.roadmap-calendar{margin-top:24px}
.planner-days{gap:4px;padding-left:54px}
.planner-hour{grid-template-columns:44px minmax(0,1fr);gap:10px}
.live-pieces[data-layout=planner] .planner-hour button{padding:16px}
.live-pieces[data-layout=study] .adaptive-detail{padding:24px}
.adaptive-recipes{grid-template-columns:1fr;gap:12px}
.live-pieces[data-layout=meals] .recipe{min-height:0;padding:20px}
.live-pieces[data-layout=meals] .recipe>button{grid-template-columns:1fr auto;gap:14px;min-height:0;width:100%}
.live-pieces[data-layout=meals] .recipe>button>span{grid-column:1/-1;font-size:1.25rem}
}
.live-pieces:not([data-layout=reports]) .portal-badge{display:none}