/* Ari's recorded frame form; native Rogo content reflows within the screen. */
body[data-direction=rogo] {
 .workspace-section{width:min(1180px,90.829vw)!important;container-type:inline-size;}
 #demo-canvas{--demo-app-height:723.4px;padding:0!important;border:9px solid #000!important;border-radius:31px!important;background:#000!important;box-shadow:none!important;}
 #demo-canvas::before{display:none!important;}
 #platform-tour{height:var(--demo-app-height,723.4px);min-height:0!important;border-radius:22px!important;background:#fff;box-shadow:none!important;}
 .workspace-foot{display:flex!important;align-items:center!important;justify-content:center!important;gap:10px!important;padding:0!important;margin:14px 0 0!important;min-height:48px;}
 .workspace-modules{position:relative;display:flex;align-items:center;gap:2px;max-width:100%;min-width:0;height:48px;overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-width:none;padding:5px;border:0;border-radius:99px;background:linear-gradient(155deg,#fffffff0 0%,#f6f7f0c7 48%,#f1f3ebbf 100%);box-shadow:inset 0 1px 0 #fff,inset 0 0 0 1px #5b684d1f,0 3px 9px #29322205;backdrop-filter:blur(18px) saturate(1.08);-webkit-backdrop-filter:blur(18px) saturate(1.08);box-sizing:border-box;}
 .workspace-modules::-webkit-scrollbar{display:none;}
 .workspace-modules button{display:inline-flex;align-items:center;justify-content:center;flex:none;height:38px;min-height:38px;max-height:38px;border:0;border-radius:99px;padding:0 17px;background:transparent;color:#5a6453;font:400 12px/14px var(--rp-sans);text-align:center;white-space:nowrap;cursor:pointer;box-sizing:border-box;transition:background-color 180ms ease,color 180ms ease,box-shadow 180ms ease;}
 .workspace-modules button:hover{color:#20241f;background:#ffffffa8;}
 .workspace-modules button[aria-pressed=true]{color:#0049b8;background:#fff;box-shadow:inset 0 0 0 1px #dbe2d3,0 1px 3px #20241f09;}
 .workspace-foot :is(button,a):focus-visible{outline:2px solid #0049b8;outline-offset:-2px;}
 #workflows{width:min(1180px,calc(100% - 64px))!important;padding-top:88px!important;}
 #workflows>.section-heading{margin-bottom:64px;text-align:left;}
 #workflows>.section-heading h2{margin:0;max-width:760px;font-size:46px;letter-spacing:-.04em;}
 #platform-features{gap:100px!important;}
 /* Illustration timelines still own their internal replay hooks. */
 #platform-features .ix-replay{display:none!important;}
 #platform-features>.feature{grid-template-columns:minmax(0,32fr) minmax(0,68fr)!important;gap:48px!important;align-items:center!important;}
 #platform-features>.feature>.caption{grid-column:1!important;grid-row:1!important;max-width:320px!important;margin:0!important;text-align:left;}
 #platform-features>.feature>.caption h3{font-size:36px!important;line-height:1.1!important;letter-spacing:-.035em!important;margin-bottom:17px!important;}
 #platform-features>.feature>.caption p{font-size:16px!important;line-height:1.55!important;max-width:none!important;margin:0!important;}
 #platform-features>.feature>.artwork{grid-column:2!important;grid-row:1!important;height:496px!important;min-height:496px!important;padding:28px 24px!important;background:#f4f5f0!important;border-radius:6px!important;}
 #platform-features>.feature>.ix-feature-label{grid-column:2!important;grid-row:1!important;padding:5px 8px;}
 #platform-features>.feature>.artwork>.ix-scene{height:440px;width:100%;min-width:0;}
 #platform-features .rp-feature-link,#platform-features .featureLink{justify-content:flex-start;margin-top:22px;font-size:13px;}
}
@media(prefers-reduced-transparency:reduce){body[data-direction=rogo] .workspace-modules{background:#f5f6ef;backdrop-filter:none;-webkit-backdrop-filter:none;}}
@media(max-width:1200px) and (min-width:901px){body[data-direction=rogo]{
 #platform-features>.feature{gap:32px!important;grid-template-columns:minmax(0,30fr) minmax(0,70fr)!important;}
 #platform-features>.feature>.caption h3{font-size:32px!important;}
 #platform-features>.feature>.artwork{padding-inline:16px!important;}
}}
@media(max-width:1023px){body[data-direction=rogo]{
 .workspace-section,#workflows{width:calc(100% - 48px)!important;}
 #demo-canvas{--demo-app-height:680px;}
}}
@media(max-width:900px){body[data-direction=rogo]{
 #platform-features{gap:80px!important;}
 #platform-features>.feature{grid-template-columns:minmax(0,1fr)!important;gap:26px!important;max-width:none!important;}
 #platform-features>.feature>.caption{grid-column:1!important;grid-row:1!important;max-width:560px!important;}
 #platform-features>.feature>.caption h3{font-size:34px!important;}
 #platform-features>.feature>.artwork,#platform-features>.feature>.ix-feature-label{grid-column:1!important;grid-row:2!important;}
 #workflows>.section-heading{margin-bottom:44px;}
}}
@media(max-width:760px){body[data-direction=rogo]{
 .workspace-section,#workflows{width:calc(100% - 32px)!important;}
 .workspace-section{width:min(100%,96.15vw)!important;}
 .workspace-foot{flex-direction:row!important;align-items:center!important;gap:8px!important;}
 #workflows{padding-top:80px!important;}
 #workflows>.section-heading h2{font-size:36px;}
 #platform-features>.feature>.caption h3{font-size:32px!important;}
 #platform-features>.feature>.caption p{font-size:15px!important;}
 #platform-features>.feature>.artwork{padding-inline:16px!important;}
}}
/* Give the complete stacked source/list/detail layouts their vertical budget
   before their actual app width crosses the 480px container breakpoint. */
@media(max-width:620px){body[data-direction=rogo]{
 #platform-features>.feature>.artwork{height:568px!important;min-height:568px!important;padding:24px 12px!important;}
 #platform-features>.feature>.artwork>.ix-scene{height:520px;}
}}
@media(max-width:360px){body[data-direction=rogo]{
 #platform-features>.feature>.artwork{height:568px!important;min-height:568px!important;padding:24px 10px!important;}
 #platform-features>.feature>.artwork>.ix-scene{height:520px;}
}}