.ss-app-friction{margin-top:38px;padding-top:30px;border-top:1px solid #fa632733;display:grid;grid-template-columns:1fr 1.2fr;gap:48px;text-align:start}.ss-app-friction h3{font-size:28px!important;color:#e5f6fa}.ss-app-friction p{font-size:16px}
.ss-dashboard-demo{position:relative;border:1px solid #f2683e44;border-radius:12px;padding:32px;background:linear-gradient(125deg,#281821aa,#111421 45%);box-shadow:0 -15px 80px -35px #f34c2455;isolation:isolate}
.ss-demo-top{display:flex;align-items:center;justify-content:space-between;gap:16px}.ss-demo-top h3{font-size:29px;margin-top:6px}.ss-demo-kicker{font-size:12px;color:#b4b6c7}.ss-demo-badge{font-size:11px;color:#e0b39b;border:1px solid #b4704f55;padding:5px 10px;border-radius:3px;white-space:nowrap}
.ss-demo-tabs{display:flex;gap:24px;border-bottom:1px solid #ffffff15;margin-top:24px}.ss-demo-tabs button{background:none;border:0;border-bottom:2px solid transparent;padding:10px 2px;color:#a7a8b7;font:inherit;font-size:14px;cursor:pointer;min-height:44px}.ss-demo-tabs button[aria-selected=true]{color:#ff7d3d;border-bottom-color:#f45525}
.ss-demo-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;padding:25px 0;border-bottom:1px solid #ffffff15}.ss-demo-metrics>div{display:flex;flex-direction:column;border-inline-end:1px solid #ffffff12;padding-inline:12px}.ss-demo-metrics>div:last-child{border:0}.ss-demo-metrics span{font-size:13px;color:#b4b6c7}.ss-demo-metrics strong{font-size:40px;color:#e5f6fa;font-weight:500;line-height:1.3}
.ss-demo-main{display:grid;grid-template-columns:1fr 1.25fr;gap:44px;padding-top:30px;min-height:420px}.ss-demo-main h4{font-size:16px;margin-bottom:18px}.ss-status-chart button,.ss-team-chart>div{position:relative;display:grid;grid-template-columns:1fr auto;width:100%;text-align:start;padding:12px 12px 18px;margin-bottom:8px;border:1px solid transparent;background:#ffffff02;color:#c8c5ce;font:inherit;font-size:13px;border-radius:3px;gap:8px}.ss-status-chart button{cursor:pointer}.ss-status-chart button:hover,.ss-status-chart button[aria-pressed=true]{background:#ff582510;border-color:#ff793e66}.ss-status-chart b,.ss-team-chart b{font-weight:500;color:#f49662}.ss-status-chart i,.ss-team-chart i{grid-column:1/-1;height:5px;background:#ffffff0a;position:relative}.ss-status-chart i:after,.ss-team-chart i:after{content:'';display:block;width:var(--bar);height:100%;background:linear-gradient(90deg,#ab3023,#ff7d3b);border-radius:1px}.ss-demo-note{font-size:11px!important;margin-top:15px!important}
.ss-demo-list-heading{display:flex;justify-content:space-between;gap:12px;align-items:baseline}.ss-demo-list-heading button{background:transparent;border:0;color:#ff965c;font:inherit;font-size:12px;cursor:pointer}.ss-demo-work ul{list-style:none;margin:0;padding:0}.ss-demo-work li{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid #ffffff10}.ss-demo-work li>div{display:flex;flex-direction:column;gap:3px}.ss-demo-work strong{font-size:13px;font-weight:500}.ss-demo-work li>div>span{font-size:11px;color:#aaa7b5}.ss-status-badge{font-size:10px;white-space:nowrap;border:1px solid #e0955a33;color:#d2aa90;padding:3px 7px;border-radius:3px}.ss-status-badge[data-status=waiting]{color:#ff7d55;border-color:#ff58254a}.ss-status-badge[data-status=complete]{color:#d3d7df;border-color:#ffffff33}
.ss-demo-footnote{font-size:11px!important;border-top:1px solid #ffffff15;margin-top:20px!important;padding-top:16px;max-width:850px}.ss-decision-list{list-style:none;padding:0;margin:0}.ss-decision-list li{padding:16px 0;border-bottom:1px solid #ffffff15}.ss-decision-list strong{font-size:14px;font-weight:500}.ss-decision-list p{font-size:13px;margin-top:8px!important}
.ss-visibility-scope{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:38px;margin-block:30px}.ss-visibility-scope p{display:flex;flex-direction:column;gap:10px}.ss-visibility-scope strong{font-size:16px;font-weight:500;color:#e5f6fa}.ss-visibility-scope span{font-size:13px}
@media(max-width:700px){.ss-app-friction{grid-template-columns:1fr;gap:18px}.ss-dashboard-demo{padding:20px 15px}.ss-demo-top h3{font-size:24px}.ss-demo-badge{font-size:9px;padding:4px 7px}.ss-demo-main{grid-template-columns:1fr;gap:24px;min-height:740px}.ss-demo-metrics{gap:8px}.ss-demo-metrics>div{padding-inline:3px}.ss-demo-metrics span{font-size:11px;min-height:40px}.ss-demo-metrics strong{font-size:32px}.ss-demo-tabs{gap:20px}.ss-visibility-scope{grid-template-columns:1fr;gap:22px}.ss-status-badge{font-size:9px}.ss-demo-work strong{font-size:12px}}
/* The hero used to inherit pointer-events:none from a decorative image wrapper. */
.ss-hero .cx-world{pointer-events:auto}.cx-hero-svg{pointer-events:none}.cx-controls{position:relative;z-index:3}.cx-controls input{height:28px;background:linear-gradient(#ff985440,#ff985440) center/100% 3px no-repeat;touch-action:pan-y}.cx-controls input:focus-visible{outline-offset:3px}.cx-replay{min-height:44px}.cx-context{font-size:12px;color:#c9c2c7;text-align:center;margin-top:14px!important}
/* Filtering the demo should not pull the following page sections upward. */
.ss-demo-work ul{min-height:430px}.ss-demo-main{min-height:510px}
@media(max-width:700px){.ss-demo-main{min-height:910px}}