/* One continuous canvas. Section images dissolve into the same paper tone. */
:root { --paper:#fafbf9; --ink:#19243b; --muted:#56657a; }
body { background:var(--paper); }
main { position:relative; isolation:isolate; overflow:clip; }
.about-section,.builder-section,.apps-section,.usecases-section,.custom-section,
.flow-section,.faq-section,.contact-section,.site-footer { background:transparent; }
.about-section,.usecases-section,.growth-scene,.flow-section,.faq-section,.contact-section { overflow:visible; }
.custom-section { position:relative; isolation:isolate; }
.scene-art:not(.hero-stage) {
  mask-image:linear-gradient(transparent,#000 22%,#000 72%,transparent);
}
.about-section>.scene-art,.faq-art,.flow-section>.scene-art { opacity:.055; }
.about-section::after,.usecases-section::after,.custom-section::after,.flow-section::after {
  content:""; position:absolute; width:95%; height:clamp(240px,30vw,480px);
  right:-45%; bottom:-140px; border:1px solid #a9bdd445; border-radius:50%;
  transform:rotate(-18deg); pointer-events:none; z-index:-1;
}
.usecases-section::after,.flow-section::after { right:auto; left:-55%; transform:rotate(18deg); }
.about-section { padding-top:125px; padding-bottom:90px; }
.about-heading { max-width:1000px; }
.benefits { gap:60px; }
.benefit .small-number { color:#728095; }
.benefit h3 { font-size:27px; }
.builder-scene>.scene-art { opacity:.64; }
.builder-picker { padding-bottom:110px; }
.apps-section { padding-top:65px; }
.apps-art { opacity:.12; }
.usecases-section { padding-top:110px; padding-bottom:100px; }
.industry-ribbon { opacity:.13; }
.portal-photo { border:0; border-radius:45% 45% 42% 42%; }
.industry-portal:nth-child(even) { padding-top:35px; }
.growth-ribbon { opacity:.25; }
.custom-links article+article { border:0; }
.custom-links { padding-top:35px; padding-bottom:90px; }
.flow-section,.faq-section { padding-top:105px; padding-bottom:105px; }
.flow-step { border-bottom-color:#dce3e866; }
.contact-section>.scene-art { opacity:.2; }
.contact-cta { background:#fffaf2; border-color:#e6e7df; }
.footer-art { mask-image:linear-gradient(transparent,#000 20%,#000 80%,transparent); }
.site-header.scrolled { background:#fafbf9ed; box-shadow:none; }
.desktop-nav { gap:28px; }

/* One image identity per app, from the launcher to the detail sheet. */
.os-tile { gap:3px; border-radius:12px; }
.os-tile>.jewel-image { height:calc(100% - 29px); transform:scale(1.16); flex:1; min-height:0; }
.os-tile>span.os-tile-label { position:relative; z-index:2; display:block; width:100%; min-height:26px; margin:0; padding:0; background:none; border-radius:0; font-size:12px; font-weight:500; line-height:1.45; letter-spacing:.025em; white-space:normal; color:#344359; text-align:center; text-wrap:balance; text-shadow:0 1px 6px #fff; }
.os-apps.many,.os-apps.full { gap:7% 4%; }
.os-apps.many .os-tile-label { font-size:11px; }
.os-apps.full .os-tile-label { font-size:11px; white-space:nowrap; letter-spacing:0; }
.os-apps.full .os-tile>.jewel-image { transform:scale(1.08); }
.os-tile:focus-visible { outline:2px solid #405cba; outline-offset:5px; }
.app-picker { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:12px; scroll-margin-top:110px; }
.picker-chip { position:relative; min-width:0; display:flex; flex-direction:column; align-items:center; justify-content:flex-start; gap:0; border:1px solid transparent; border-radius:22px; padding:19px 8px 17px; background:transparent; color:var(--ink); transition:background .25s,border-color .25s,transform .25s; }
.picker-chip .picker-image { display:block; width:80px; height:80px; object-fit:contain; margin:0 0 10px; filter:drop-shadow(0 5px 7px #253a6a0c); transition:transform .3s; }
.picker-chip>span.picker-name { width:100%; height:auto; min-height:2.9em; display:flex; flex-wrap:wrap; align-items:center; align-content:center; justify-content:center; font-size:13px; font-weight:600; line-height:1.45; letter-spacing:.015em; text-wrap:balance; }
.picker-name>span { white-space:nowrap; }
.picker-category { display:block; margin-top:5px; font-size:10px; line-height:1.5; font-weight:400; color:#6a778b; }
.picker-chip>span.picker-state { position:absolute; top:11px; right:11px; width:20px; height:20px; display:grid; place-items:center; border:1px solid #d9e0ea; border-radius:50%; color:#697a91; background:#fafbf9; }
.picker-state .ui-icon { width:12px; height:12px; opacity:.7; }
.picker-chip.selected { background:#edf2fa; color:var(--ink); border-color:#dce5f2; }
.picker-chip.selected .picker-state { background:#425f98; border-color:#425f98; }
.picker-chip.selected .picker-state .ui-icon { opacity:1; }
.picker-chip:hover { background:#f0f3f8; transform:translateY(-2px); }
.picker-chip:hover .picker-image { transform:translateY(-4px) rotate(-3deg); }
.picker-chip:focus-visible { outline:2px solid #405cba; outline-offset:3px; }
.picker-heading { align-items:baseline; margin-bottom:24px; }
.picker-heading>span { font-variant-numeric:tabular-nums; }
.builder-picker .fine-print { margin-top:24px; }
.app-identity { display:block; width:48px; height:48px; object-fit:contain; flex:none; }
.dialog-app-header>.app-identity { width:78px; height:78px; }
.related-app>.app-identity { width:48px; height:48px; }
.app-card-label { gap:12px; }
.app-card-label strong { font-weight:600; letter-spacing:.015em; }
@media (max-width:1100px) and (min-width:701px) {
  .app-picker { grid-template-columns:repeat(5,minmax(0,1fr)); }
}
@media (max-width:700px) {
  .app-picker { grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
  .picker-chip { padding:16px 7px 13px; border-radius:19px; }
  .picker-chip .picker-image { width:70px; height:70px; margin-bottom:6px; }
  .picker-chip>span.picker-name { font-size:12px; min-height:3em; }
  .picker-category { font-size:9px; }
  .picker-chip>span.picker-state { width:18px; height:18px; right:7px; top:8px; }
  .picker-state .ui-icon { width:11px; height:11px; }
  .builder-scene { height:850px; }
  .builder-floater { display:none; }
  .builder-scene:has(.os-apps.full) { height:980px; }
  .builder-scene>.scene-art { opacity:.16; }
  .live-os { left:7%; top:410px; width:86%; height:330px; padding:22px 18px 36px; transform:rotate(-3deg); background:linear-gradient(145deg,#ffffffed,#f4f7fbf0); border:1px solid white; border-radius:30px; box-shadow:0 22px 65px #405e9120,inset 0 0 0 6px #ffffff60; }
  .os-apps { grid-template-columns:repeat(3,minmax(0,1fr)); grid-template-rows:repeat(2,minmax(0,1fr)); gap:12% 8%; padding:0; }
  .os-apps.many { gap:5% 5%; }
  .live-os:has(.os-apps.full) { height:460px; }
  .os-apps.full { grid-template-columns:repeat(3,minmax(0,1fr)); grid-template-rows:repeat(5,minmax(0,1fr)); gap:5% 8%; }
  .os-tile>.jewel-image { height:calc(100% - 26px); transform:scale(1.12); }
  .os-tile>span.os-tile-label { font-size:11px; line-height:1.4; min-height:28px; }
  .os-apps.full .os-tile-label { font-size:10px; min-height:16px; letter-spacing:0; }
  .os-signature { top:auto; bottom:11px; font-size:9px; color:#5f718d; }
  .os-signature>span { font-size:6px; }
  .builder-hint { bottom:35px; }
  .app-identity { width:40px; height:40px; }
  .dialog-app-header>.app-identity { width:62px; height:62px; }
  .app-card-label { gap:8px; }
}
@media (max-width:380px) {
  .app-picker { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (prefers-reduced-motion:reduce) {
  .picker-chip,.picker-chip .picker-image { transition:none; }
  .picker-chip:hover,.picker-chip:hover .picker-image { transform:none; }
}
.motion-paused .picker-chip,.motion-paused .picker-chip .picker-image { transition:none; }
.motion-paused .picker-chip:hover,.motion-paused .picker-chip:hover .picker-image { transform:none; }

/* Opening: generous copy and a separately choreographed, layered orbit. */
.hero { background:var(--paper); }
.js-motion .hero { height:205svh; min-height:1440px; }
.hero-pin { background:radial-gradient(ellipse at 80% 50%,#eaf0ff70,transparent 57%),var(--paper); }
.hero-pin::after {
  content:""; position:absolute; inset:auto 0 0; height:100px;
  background:linear-gradient(transparent,var(--paper)); pointer-events:none; z-index:1;
}
.hero-copy { top:clamp(126px,18.5svh,230px); width:47%; }
.hero h1 { font-size:clamp(42px,5vw,80px); line-height:1.4; }
.hero-kicker { margin-top:24px; font-size:clamp(16px,1.35vw,21px); }
.hero-description { font-size:15px; line-height:2.05; }
.hero-custom-link { display:inline-flex; align-items:center; gap:12px; font-size:12px; color:#4a5d7b; margin-top:20px; pointer-events:auto; }
.hero-custom-link .ui-icon { width:16px; height:16px; }
.hero-custom-link:hover { color:var(--blue); }
.hero-camera { inset:auto 1% auto 46%; top:max(80px,calc(50% - min(39svh,30vw))); width:53%; height:min(78svh,60vw); clip-path:none; }
.hero-stage { opacity:.8; top:10%; left:-12%; width:124%; height:80%; z-index:0; }
.hero-hub { left:28%; top:29%; width:44%; z-index:3; }
.hero-jewel { opacity:1; transform-origin:center; }
.jewel-time { left:11%; top:15%; width:19%; }
.jewel-shift { left:60%; top:8%; width:18%; }
.jewel-sales { left:78%; top:35%; width:19%; }
.jewel-customer { left:5%; top:58%; width:20%; }
.jewel-project { left:32%; top:73%; width:20%; }
.jewel-stock { left:73%; top:66%; width:18%; }
.hero-orbit-line { position:absolute; inset:7% 4%; width:92%; height:86%; overflow:visible; opacity:.7; }
.hero-orbit-line ellipse { fill:none; stroke:#9cb4e8; stroke-width:.8; vector-effect:non-scaling-stroke; }
.hero-orbit-line .orbit-trace { stroke:#587cd1; stroke-width:1.6; stroke-dasharray:28 620; stroke-linecap:round; }
.hero-orbit-line circle { fill:#809bdb; }
.hero-system-label { position:absolute; left:15%; top:85%; width:70%; text-align:center; font:600 10px/1.8 'DM Sans',sans-serif; letter-spacing:.2em; color:#66758e; }
.hero-system-label strong { display:block; font-size:12px; letter-spacing:.1em; color:#3b558c; }
.hero-chapters { left:5.2%; bottom:80px; gap:20px; font-size:10px; color:#718097; }
.hero-chapters span { display:flex; align-items:center; gap:8px; }
.hero-chapters b { display:inline-grid; place-items:center; width:25px; height:25px; border:1px solid #dde4ee; border-radius:50%; font-size:9px; font-weight:500; transition:background .35s,border-color .35s,color .35s; }
.hero-chapters .active b { color:white; background:var(--blue); border-color:var(--blue); }
.hero-bottom { bottom:28px; }
.hero-bottom>p { margin-left:130px; }
.hero-bottom,.hero-chapters { z-index:4; }
.hero-bottom .scroll-cue { min-height:44px; }

/* Design and custom development, shown as an editable product sample. */
.design-studio { position:relative; padding:85px 0 120px; }
.studio-intro { display:flex; justify-content:space-between; gap:70px; align-items:flex-end; }
.studio-intro h2 { font-size:clamp(34px,3.6vw,58px); }
.studio-intro>.body-copy { max-width:370px; margin:0 0 7px; }
.studio-layout { display:grid; grid-template-columns:minmax(240px,.8fr) minmax(0,1.45fr); gap:8%; align-items:start; margin-top:65px; }
.studio-copy { padding-top:18px; }
.studio-tabs { display:grid; gap:10px; }
.studio-tab { display:flex; gap:18px; align-items:center; padding:18px 20px; background:none; border-radius:22px; text-align:left; min-height:88px; transition:background .25s; }
.studio-tab>.studio-tab-index { display:grid; place-items:center; width:35px; height:35px; border:1px solid #dbe1e9; border-radius:50%; flex:none; font-size:11px; color:#75829a; }
.studio-tab strong { display:block; font-size:19px; font-weight:700; }
.studio-tab small { display:block; font-size:12px; font-weight:400; color:#637186; margin-top:3px; }
.studio-tab[aria-selected="true"] { background:#eaf0fb; }
.studio-tab[aria-selected="true"]>.studio-tab-index { background:white; border-color:white; color:var(--blue); }
.studio-description { margin:26px 20px 8px; min-height:130px; color:var(--muted); font-size:14px; line-height:2.05; }
.studio-copy>.text-link { margin-left:20px; font-size:13px; }
.studio-preview { position:relative; min-width:0; }
.studio-preview::before { content:""; position:absolute; inset:-45px -45px -55px; background:radial-gradient(ellipse,#d6e4ff70,transparent 70%); pointer-events:none; z-index:-1; }
.studio-panel { outline-offset:8px; animation:studio-arrive .45s cubic-bezier(.2,.75,.2,1) both; }
@keyframes studio-arrive { from { opacity:.6; transform:translateY(12px); } to { opacity:1; transform:none; } }
.studio-window { --studio-accent:#3e5edd; --studio-soft:#eef2fc; --studio-round:18px; background:#fff; padding:18px; border:1px solid #e0e6ef; border-radius:30px; box-shadow:0 28px 65px -24px #43628d33,0 3px 8px #24375a05; transform:rotate(-2deg); transition:transform .6s; }
.studio-window[data-theme="forest"] { --studio-accent:#277365; --studio-soft:#edf5f0; --studio-round:8px; }
.studio-window[data-theme="terracotta"] { --studio-accent:#ac5441; --studio-soft:#fcf0e9; --studio-round:26px; }
.studio-window-top { display:flex; align-items:center; gap:5px; padding:1px 5px 15px; }
.studio-window-top>i { width:6px; height:6px; background:#d9dfe7; border-radius:50%; }
.studio-window-top>span { margin-left:auto; font:500 9px/1.5 'DM Sans',sans-serif; color:#7b879b; letter-spacing:.1em; }
.studio-workspace { background:var(--studio-soft); border-radius:var(--studio-round); padding:26px; min-height:345px; transition:background .4s,border-radius .4s; }
.studio-brand { display:flex; align-items:center; gap:9px; color:var(--studio-accent); font:700 12px/1.6 'DM Sans',sans-serif; letter-spacing:.06em; transition:color .4s; }
.studio-brand>span { width:14px; height:14px; border-radius:4px; background:currentColor; }
.studio-workspace h3 { font-size:25px; line-height:1.6; margin-top:35px; }
.studio-workspace>p { font-size:11px; color:#627084; margin-top:8px; }
.studio-dashboard { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:25px; }
.studio-dashboard>div { background:#fff; padding:17px; border-radius:var(--studio-round); transition:border-radius .4s; }
.studio-dashboard small { font-size:10px; color:#647286; }
.studio-dashboard strong { display:block; font:600 30px/1.4 'DM Sans',sans-serif; color:var(--studio-accent); }
.studio-dashboard strong span { font-family:var(--font); font-size:11px; margin-left:4px; }
.studio-mini-schedule { display:flex; gap:6px; margin-top:13px; }
.studio-mini-schedule span { display:grid; place-items:center; border:1px solid #e6eaf0; width:26px; height:27px; border-radius:8px; font-size:10px; }
.studio-mini-schedule span:nth-child(3) { background:var(--studio-accent); color:white; border-color:transparent; }
.studio-mini-chart { display:flex; align-items:flex-end; gap:8px; height:40px; margin-top:10px; }
.studio-mini-chart span { width:15%; background:var(--studio-accent); opacity:.24; border-radius:4px 4px 2px 2px; transition:background .4s; }
.studio-mini-chart span:last-child { opacity:1; }
.studio-palette { display:flex; align-items:center; gap:11px; padding:18px 4px 0; }
.studio-palette>span { font-size:11px; margin-right:auto; color:#667389; }
.studio-swatch { display:grid; place-items:center; width:44px; height:44px; background:none; border:1px solid transparent; border-radius:50%; }
.studio-swatch::before { content:""; width:23px; height:23px; border-radius:50%; background:var(--swatch); }
.studio-swatch[aria-pressed="true"] { border-color:var(--swatch); }
.studio-swatch:hover { background:#f1f4f8; }
.studio-footnote { margin-top:27px; display:flex; justify-content:space-between; gap:12px; font-size:10px; color:#718097; }
.studio-theme-label { color:#53647c; }
.studio-workflow { transform:rotate(1deg); }
.studio-workflow .studio-workspace { background:#f2f4f7; }
.studio-workflow h3 { margin-top:25px; font-size:22px; }
.studio-form-sample { display:grid; gap:12px; margin-top:22px; }
.studio-form-sample>div { display:flex; justify-content:space-between; gap:10px; padding:13px 15px; background:white; border-radius:10px; font-size:11px; color:#54637a; }
.studio-form-sample strong { color:#263651; font-weight:600; }
.studio-approval { display:flex; align-items:center; justify-content:space-between; gap:9px; margin-top:23px; font-size:10px; color:#68768a; }
.studio-approval b { background:white; border:1px solid #e0e6ef; border-radius:100px; padding:8px 13px; font-weight:500; }
.studio-approval b:last-child { background:#e4eee8; color:#326953; border-color:transparent; }
.studio-connect { transform:rotate(-1deg); }
.studio-connect .studio-workspace { padding:28px; background:#f3f6fa; text-align:center; }
.studio-connect h3 { margin-top:20px; font-size:22px; }
.studio-hub { display:grid; place-items:center; width:108px; height:108px; border-radius:35px; margin:25px auto 0; background:white; box-shadow:0 12px 30px #3b558b0a; color:var(--blue); font-size:15px; font-weight:900; letter-spacing:-.06em; }
.studio-connections { display:flex; justify-content:space-around; margin-top:12px; gap:12px; }
.studio-connections>div { display:grid; justify-items:center; gap:8px; font-size:11px; }
.studio-connections>div::before { content:"↕"; color:#879ab6; font-size:19px; }
.studio-connections img { width:70px; height:70px; object-fit:contain; }
.studio-panel-note { margin:24px 8px 0; font-size:13px; line-height:1.9; color:#58687e; }
.studio-bridge { max-width:620px; margin:0 auto; padding:5px 22px 60px; text-align:center; color:#64768d; font-size:13px; letter-spacing:.04em; }
.studio-bridge::before { content:""; display:block; width:70px; height:70px; border:1px solid #bdcce280; border-radius:50%; margin:0 auto 20px; }
.growth-scene { margin-top:-25px; }

@media(min-width:761px) and (max-width:1100px) {
  .desktop-nav { gap:20px; font-size:12px; }
  .benefits { gap:28px; }
  .benefit h3 { font-size:22px; }
  .benefit h3 br { display:initial; }
  .benefit p br { display:none; }
  .hero-copy { top:clamp(126px,20svh,210px); }
  .hero h1 { font-size:4.8vw; }
  .hero-description { font-size:13px; }
  .hero-custom-link { font-size:11px; }
  .hero-chapters { font-size:9px; gap:11px; }
  .studio-layout { grid-template-columns:.85fr 1.15fr; gap:5%; }
  .studio-intro { gap:35px; }
  .studio-intro>.body-copy { max-width:300px; font-size:14px; }
  .studio-workspace { padding:20px; }
  .studio-workspace h3 { font-size:22px; }
  .studio-tab { padding:15px 12px; gap:12px; }
  .studio-tab strong { font-size:17px; }
  .studio-palette { gap:5px; }
}
@media(max-width:760px) {
  .js-motion .hero { height:185svh; min-height:1450px; }
  .hero-pin { padding-top:112px; min-height:825px; grid-template-rows:auto minmax(260px,1fr) 100px; }
  .hero-copy { top:auto; width:calc(100% - 44px); padding-bottom:22px; }
  .hero h1 { font-size:clamp(30px,8.6vw,59px); line-height:1.4; }
  .hero-kicker { font-size:14px; margin-top:17px; }
  .hero-description { font-size:13px; margin-top:12px; }
  .hero-actions { margin-top:21px; }
  .hero-custom-link { font-size:11px; margin-top:16px; min-height:30px; gap:9px; }
  .hero-camera { inset:auto; width:100%; height:100%; clip-path:inset(-4% -2% -3% -2%); }
  .hero-stage { top:0; height:100%; left:-12%; width:124%; }
  .hero-hub { width:40%; left:30%; top:29%; }
  .jewel-time { top:8%; left:12%; width:19%; }
  .jewel-shift { top:5%; left:63%; width:18%; }
  .jewel-sales { top:31%; left:78%; width:19%; }
  .jewel-customer { top:54%; left:4%; width:20%; }
  .jewel-project { top:72%; left:31%; width:20%; }
  .jewel-stock { top:66%; left:72%; width:18%; }
  .hero-system-label { display:none; }
  .hero-system-label strong { font-size:9px; }
  .hero-chapters { left:22px; width:calc(100% - 44px); bottom:60px; font-size:8px; gap:15px; }
  .hero-chapters b { width:21px; height:21px; font-size:8px; }
  .hero-chapters span { gap:6px; }
  .hero-bottom { bottom:10px; }
  .hero-pin::after { height:55px; }
  .about-section,.usecases-section { padding-top:75px; padding-bottom:75px; }
  .about-section::after,.usecases-section::after,.custom-section::after,.flow-section::after { bottom:-90px; width:135%; right:-95%; height:250px; opacity:.7; }
  .usecases-section::after,.flow-section::after { right:auto; left:-100%; }
  .benefits { gap:35px; }
  .benefit h3 { font-size:23px; }
  .apps-section { padding-top:50px; }
  .builder-picker { padding-bottom:70px; }
  .industry-portals { gap:25px 18px; }
  .industry-portal:nth-child(even) { padding-top:25px; }
  .design-studio { padding:45px 0 80px; }
  .studio-intro { display:block; }
  .studio-intro h2 { font-size:32px; line-height:1.5; }
  .studio-intro>.body-copy { font-size:14px; margin-top:22px; max-width:none; }
  .studio-layout { grid-template-columns:1fr; gap:32px; margin-top:30px; }
  .studio-copy { padding-top:0; }
  .studio-tabs { gap:6px; }
  .studio-tab { min-height:73px; padding:12px 15px; gap:15px; border-radius:18px; }
  .studio-tab strong { font-size:17px; }
  .studio-tab small { font-size:11px; }
  .studio-description { min-height:100px; margin:21px 5px 5px; font-size:13px; }
  .studio-copy>.text-link { margin-left:5px; font-size:12px; }
  .studio-preview { padding:0 4px; }
  .studio-preview::before { inset:-25px -15px; }
  .studio-window { padding:13px; border-radius:23px; transform:rotate(-1deg); }
  .studio-workspace { padding:20px; min-height:315px; }
  .studio-workspace h3 { font-size:22px; margin-top:26px; }
  .studio-workspace>p { font-size:10px; }
  .studio-dashboard { gap:10px; margin-top:23px; }
  .studio-dashboard>div { padding:13px; }
  .studio-dashboard strong { font-size:26px; }
  .studio-mini-schedule { gap:4px; }
  .studio-mini-schedule span { width:22px; }
  .studio-palette { gap:7px; padding-top:13px; }
  .studio-palette>span { font-size:10px; }
  .studio-swatch { width:44px; height:44px; }
  .studio-footnote { font-size:9px; margin-top:20px; }
  .studio-panel-note { font-size:12px; margin-top:18px; }
  .studio-bridge { font-size:12px; padding-bottom:45px; }
  .studio-bridge::before { width:50px; height:50px; }
  .custom-links { padding-bottom:70px; gap:30px; }
  .flow-section,.faq-section { padding-top:70px; padding-bottom:70px; }
  .contact-copy .body-copy { max-width:450px; }
  .contact-section>.scene-art { opacity:.17; }
}
@media(max-width:360px) {
  .hero-pin { padding-top:103px; }
  .hero-description { font-size:12px; }
  .hero-custom-link { font-size:10px; }
  .hero-chapters { gap:10px; font-size:7px; }
  .studio-intro h2 { font-size:29px; }
  .studio-workspace { padding:15px; }
  .studio-workspace h3 { font-size:20px; }
  .studio-palette { gap:2px; }
  .studio-approval { gap:4px; }
  .studio-approval b { padding:7px 8px; }
}
.motion-paused .studio-window,.motion-paused .studio-panel { animation:none; transition:none; }
.motion-paused .reveal { opacity:1; transform:none; transition:none!important; }
.motion-paused .design-studio *,.motion-paused .hero-chapters b { animation:none!important; transition:none!important; }
@media(prefers-reduced-motion:reduce) {
  .hero,.js-motion .hero { height:100svh; min-height:825px; }
  .hero-system-label { opacity:1!important; transform:none!important; }
  .hero-orbit-line { transform:none!important; }
}