/* Solutions pages: Sales teams (sa-), Founders raising (fr-), Agencies and
   consultants (ag-) and Customer success (cs-). One stylesheet for the four
   pages. Pieces they share carry so- (names, badges, paper slides, template
   cards); each page's visuals carry its own prefix.
   Shared parts (ui-win, ui-head, ui-chip, ui-tag, av, soon, mini-deck)
   come from /assets/site/site.css. Panel UI uses px and reflows with
   container queries; slides scale as one picture with container units (cqw).
   Loops animate transform and opacity only, stop off screen (site.js) and are
   static under reduced motion. */

/* =========================================================================
   Shared (so-)
   ========================================================================= */
.so-ell{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.so-who{display:grid;gap:1px;min-width:0}
.so-who > b{display:flex;align-items:center;gap:6px;min-width:0;font-weight:500;font-size:15px;line-height:1.3;color:var(--paper)}
.so-who > span{min-width:0;overflow:hidden;font-size:13px;line-height:1.35;color:var(--muted);text-overflow:ellipsis;white-space:nowrap}

/* Verified email: a lavender disc with a check */
.so-ver{position:relative;flex:none;display:inline-block;width:15px;height:15px;border-radius:50%;background:var(--lav)}
.so-ver::before{content:"";position:absolute;left:4.2px;top:4.4px;width:6.4px;height:3.4px;border-left:1.7px solid var(--night);border-bottom:1.7px solid var(--night);transform:rotate(-45deg)}

/* Suggestion tag (Next reply, Next version) */
.so-sg-tag{display:inline-flex;align-items:center;gap:8px;height:30px;padding:0 13px 0 9px;border-radius:999px;background:rgba(123,92,255,.22);box-shadow:inset 0 0 0 1px rgba(183,168,255,.42);font:500 13px/1 var(--sans);color:var(--paper);white-space:nowrap}
.so-sg-tag svg{width:17px;height:17px}

/* Buttons drawn inside product visuals */
.so-mbtn{display:inline-flex;align-items:center;justify-content:center;height:36px;padding:0 16px;border-radius:999px;font:500 14px/1 var(--sans);white-space:nowrap}
.so-mbtn.is-pri{background:linear-gradient(180deg,#7B5CFF,#6A48F5);color:#fff}
.so-mbtn.is-line{box-shadow:inset 0 0 0 1px var(--line-2);color:var(--paper)}

/* A full-width visual under a row head */
.so-wide{position:relative;min-width:0;margin:0}

/* Row head with a link under the body */
.so-head-aside{display:grid;gap:12px;justify-items:start}
.so-head-aside .body{margin-top:0}

/* ---------- Paper slides: a 16:10 page that scales as one picture ---------- */
.so-slide{--c-ink:var(--ink);--c-k:var(--violet);--c-mut:rgba(18,15,46,.62);--c-card:#fff;--c-line:rgba(123,92,255,.2);
  position:relative;display:block;width:100%;aspect-ratio:16 / 10;overflow:hidden;border-radius:10px;background:var(--paper);color:var(--c-ink);container-type:inline-size;isolation:isolate;box-shadow:0 24px 48px -28px rgba(0,0,0,.95)}
.so-slide.is-lilac{--c-card:#F7F5FF;background:#E6E0FF}
.so-slide.is-night{--c-ink:var(--paper);--c-k:var(--lav);--c-mut:rgba(242,239,255,.68);--c-card:rgba(183,168,255,.12);--c-line:rgba(183,168,255,.3);background:linear-gradient(155deg,#241C62,#130F33 72%)}
.so-slide.is-violet{--c-ink:#fff;--c-k:#E4DCFF;--c-mut:rgba(255,255,255,.76);--c-card:rgba(255,255,255,.14);--c-line:rgba(255,255,255,.32);background:linear-gradient(150deg,#8266FF,#5A3EDB 80%)}
.so-k{position:absolute;left:var(--l,7cqw);top:6.6cqw;max-width:calc(100% - var(--l,7cqw) - 14cqw);overflow:hidden;font:500 2.9cqw/1.35 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--c-k);white-space:nowrap;text-overflow:ellipsis}
.so-k svg{display:inline-block;width:3.8cqw;height:3.8cqw;margin:-.5cqw 1.4cqw 0 0;vertical-align:middle;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.so-n{position:absolute;right:7cqw;top:6.6cqw;font:500 2.9cqw/1.35 var(--sans);letter-spacing:.1em;color:var(--c-mut);white-space:nowrap}
.so-t{position:absolute;left:var(--l,7cqw);top:var(--ty,15.5cqw);width:var(--tw,62cqw);font:600 calc(var(--fs,6.4) * 1cqw)/1.08 var(--display);letter-spacing:-.03em;color:var(--c-ink);text-wrap:balance}
.so-t em{font-style:normal;color:var(--violet)}
.is-night .so-t em,.is-violet .so-t em{color:var(--lav)}
.so-m{position:absolute;left:var(--l,7cqw);bottom:7cqw;font:400 2.7cqw/1.45 var(--sans);color:var(--c-mut)}

/* cover with an illustrated panel on the left */
.so-cp{--l:44cqw}
.so-cp-panel{position:absolute;left:0;top:0;bottom:0;width:38cqw;display:grid;place-items:center;background:var(--violet)}
.so-cp-panel svg{width:100%;height:100%}
.is-night .so-cp-panel{background:linear-gradient(170deg,#7B5CFF,#5236C9)}

/* three plan or tier cards along the bottom */
.so-tiers{position:absolute;left:7cqw;right:7cqw;bottom:7cqw;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2.4cqw}
.so-tiers > span{display:grid;gap:1.2cqw;min-width:0;padding:3cqw 3cqw 3.4cqw;border-radius:2cqw;background:var(--c-card);box-shadow:0 0 0 .3cqw var(--c-line)}
.so-tiers b{overflow:hidden;font:600 3.6cqw/1.1 var(--display);letter-spacing:-.02em;color:var(--c-ink);white-space:nowrap;text-overflow:ellipsis}
.so-tiers i{overflow:hidden;font:400 2.5cqw/1.3 var(--sans);color:var(--c-mut);white-space:nowrap;text-overflow:ellipsis}
.so-tiers .is-on{background:var(--violet);box-shadow:none}
.so-tiers .is-on b,.so-tiers .is-on i{color:#fff}
.is-violet .so-tiers .is-on{background:var(--paper)}
.is-violet .so-tiers .is-on b{color:var(--ink)}
.is-violet .so-tiers .is-on i{color:var(--ink-2)}

/* a chip on the slide */
.so-chip-s{position:absolute;left:var(--l,7cqw);bottom:8cqw;display:inline-flex;align-items:center;gap:1.6cqw;height:6.4cqw;padding:0 2.8cqw;border-radius:99px;background:var(--c-card);box-shadow:0 0 0 .3cqw var(--c-line);font:500 2.7cqw/1 var(--sans);color:var(--c-ink);white-space:nowrap}
.so-chip-s::before{content:"";width:1.6cqw;height:1.6cqw;border-radius:50%;background:var(--lav)}

/* a product screen with a play button */
.so-screen{position:absolute;right:7cqw;top:17cqw;width:42cqw;aspect-ratio:16 / 10.5;border-radius:2cqw;background:linear-gradient(160deg,rgba(183,168,255,.32),rgba(123,92,255,.16));box-shadow:0 0 0 .4cqw rgba(183,168,255,.42)}
.so-screen-play{position:absolute;left:50%;top:44%;width:9cqw;height:9cqw;margin:-4.5cqw 0 0 -4.5cqw;border-radius:50%;background:var(--paper)}
.so-screen-play::before{content:"";position:absolute;left:3.6cqw;top:2.6cqw;border-left:2.4cqw solid var(--violet);border-top:1.9cqw solid transparent;border-bottom:1.9cqw solid transparent}
.so-screen-bar{position:absolute;left:3cqw;right:3cqw;bottom:3cqw;height:.9cqw;overflow:hidden;border-radius:9px;background:rgba(242,239,255,.22)}
.so-screen-bar::before{content:"";position:absolute;inset:0 60% 0 0;background:var(--lav)}

/* a short quote card */
.so-quote{position:absolute;right:7cqw;top:17cqw;width:38cqw;display:grid;gap:1.8cqw;padding:3.4cqw;border-radius:2.4cqw;background:var(--c-card);box-shadow:0 0 0 .3cqw var(--c-line);font:400 3cqw/1.4 var(--sans);color:var(--c-ink)}
.so-quote::before{content:"\201C";height:3.6cqw;font:600 9cqw/.7 var(--display);color:var(--violet)}
.so-quote i{font:500 2.4cqw/1.3 var(--sans);color:var(--c-mut)}

/* a chart in the right half */
.so-chart{position:absolute;right:7cqw;top:19cqw;width:38cqw;height:36cqw}
.so-chart svg{width:100%;height:100%}

/* a big number with a label */
.so-big{position:absolute;left:var(--l,7cqw);bottom:9cqw;display:grid;gap:1.6cqw}
.so-big b{font:600 15cqw/.9 var(--display);letter-spacing:-.05em;color:var(--violet)}
.is-night .so-big b,.is-violet .so-big b{color:var(--lav)}
.so-big i{max-width:34cqw;font:400 2.8cqw/1.35 var(--sans);color:var(--c-mut)}

/* a row of stats along the bottom, with a hairline above each */
.so-stats{position:absolute;left:var(--l,7cqw);right:7cqw;bottom:7.5cqw;display:grid;grid-template-columns:repeat(var(--c,3),minmax(0,1fr));gap:3cqw}
.so-stats > span{display:grid;gap:1cqw;min-width:0;padding-top:2.2cqw;border-top:.3cqw solid var(--c-line)}
.so-stats b{font:600 5.4cqw/1 var(--display);letter-spacing:-.03em;color:var(--c-ink);white-space:nowrap}
.so-stats i{font:400 2.5cqw/1.3 var(--sans);color:var(--c-mut)}

/* a checklist */
.so-list{position:absolute;left:var(--l,7cqw);right:7cqw;bottom:7cqw;display:grid;gap:1.6cqw}
.so-list > span{display:grid;grid-template-columns:4.6cqw minmax(0,1fr) auto;align-items:center;gap:2.4cqw;height:7.4cqw;padding:0 2.6cqw;border-radius:1.8cqw;background:var(--c-card);box-shadow:0 0 0 .3cqw var(--c-line);font:500 3cqw/1 var(--sans);color:var(--c-ink);white-space:nowrap}
.so-list > span > i{position:relative;width:4.6cqw;height:4.6cqw;border-radius:50%;box-shadow:inset 0 0 0 .35cqw var(--c-line)}
.so-list .is-done > i{background:var(--violet);box-shadow:none}
.so-list .is-done > i::before{content:"";position:absolute;left:1.3cqw;top:1.35cqw;width:2cqw;height:1.1cqw;border-left:.45cqw solid #fff;border-bottom:.45cqw solid #fff;transform:rotate(-45deg)}
.so-list em{font-style:normal;font-size:2.5cqw;color:var(--c-mut)}

/* three steps on a line */
.so-tl{position:absolute;left:var(--l,7cqw);right:7cqw;bottom:8cqw;display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.so-tl::before{content:"";position:absolute;left:2cqw;right:4cqw;top:2.2cqw;height:.45cqw;border-radius:9px;background:linear-gradient(90deg,var(--lav),var(--violet))}
.so-tl > span{position:relative;display:grid;gap:1.2cqw;justify-items:start}
.so-tl > span > i{width:4.6cqw;height:4.6cqw;border-radius:50%;background:var(--violet);box-shadow:0 0 0 .6cqw var(--paper)}
.so-tl > span:nth-child(2) > i{transform:scale(1.15)}
.so-tl > span:nth-child(3) > i{transform:scale(1.3)}
.is-lilac .so-tl > span > i{box-shadow:0 0 0 .6cqw #E6E0FF}
.is-night .so-tl > span > i{box-shadow:0 0 0 .6cqw #1A1548}
.so-tl b{font:600 3.6cqw/1 var(--display);letter-spacing:-.02em;color:var(--c-ink)}
.so-tl em{font-style:normal;font:400 2.5cqw/1.2 var(--sans);color:var(--c-mut)}

/* simple page thumbnails (SVG) */
.so-pages{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;width:100%}
.so-pages svg{width:100%;height:auto;border-radius:6px;box-shadow:0 14px 30px -18px rgba(0,0,0,.9)}

/* ---------- Template cards ---------- */
.so-tpls{list-style:none;margin:0;padding:0;display:grid;gap:20px}
.so-tpl{display:flex;flex-direction:column;min-width:0;overflow:hidden;border-radius:var(--radius);background:linear-gradient(180deg,var(--night-3),var(--night-2));border:1px solid var(--line)}
.so-tpl-art{position:relative;display:grid;place-items:center;align-content:center;gap:14px;padding:22px;background:
  radial-gradient(70% 80% at 50% 46%,rgba(123,92,255,.22),transparent 72%),
  radial-gradient(rgba(183,168,255,.1) 1px,transparent 1.5px) 0 0 / 22px 22px;border-bottom:1px solid var(--line)}
.so-tpl-copy{display:grid;gap:6px;align-content:start;padding:20px 24px 24px}
.so-tpl-use{margin:0;font:500 13px/1.2 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--lav)}
.so-tpl-t{margin:0;font:600 var(--fs-h3)/1.3 var(--display);letter-spacing:-.02em;color:var(--paper)}
.so-tpl-d{margin:4px 0 0;font-size:16px;line-height:1.5;color:var(--muted)}

/* Sales: one featured deck and four beside it */
.so-tpls.is-bento{grid-template-columns:repeat(4,minmax(0,1fr))}
.is-bento .is-feature{grid-column:span 2;grid-row:span 2}
.is-bento .is-feature .so-tpl-art{flex:1;padding:clamp(24px,3vw,40px)}
/* Fundraising: six in a grid */
.so-tpls.is-six{grid-template-columns:repeat(3,minmax(0,1fr))}
/* Agencies: one wide banner and four under it */
.so-tpls.is-banner{grid-template-columns:repeat(4,minmax(0,1fr))}
.is-banner .is-feature{grid-column:1 / -1;display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr)}
.is-banner .is-feature .so-tpl-art{padding:clamp(24px,3.4vw,44px);border-bottom:0;border-right:1px solid var(--line)}
.is-banner .is-feature .so-tpl-copy{align-content:center;padding:32px clamp(24px,3vw,40px)}
/* Customer success: two by two, slide beside the words */
.so-tpls.is-pairs{grid-template-columns:repeat(2,minmax(0,1fr))}
.is-pairs .so-tpl{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}
.is-pairs .so-tpl-art{border-bottom:0;border-right:1px solid var(--line)}
.is-pairs .so-tpl-copy{align-content:center}

@media (max-width:1099px){
  .so-tpls.is-bento,.so-tpls.is-six,.so-tpls.is-banner{grid-template-columns:repeat(2,minmax(0,1fr))}
  .is-bento .is-feature{grid-column:1 / -1;grid-row:auto;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr)}
  .is-bento .is-feature .so-tpl-art{border-bottom:0;border-right:1px solid var(--line)}
  .is-bento .is-feature .so-tpl-copy{align-content:center}
}
@media (max-width:899px){
  .so-tpls.is-pairs{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:599px){
  .so-tpls.is-bento,.so-tpls.is-six,.so-tpls.is-banner{grid-template-columns:minmax(0,1fr)}
  .is-bento .is-feature,.is-banner .is-feature,.is-pairs .so-tpl{display:flex}
  .is-bento .is-feature .so-tpl-art,.is-banner .is-feature .so-tpl-art,.is-pairs .so-tpl-art{border-right:0;border-bottom:1px solid var(--line)}
  .so-tpl-copy,.is-banner .is-feature .so-tpl-copy{padding:18px 20px 22px}
}

/* =========================================================================
   Sales teams (sa-)
   ========================================================================= */

/* ---------- Hero: the proposal and its readers ---------- */
.sa-room{container-name:sa-room}
.sa-room .ui-win{overflow:hidden}
.sa-room-body{display:grid;grid-template-columns:minmax(0,1fr) 196px;gap:16px;padding:16px}
.sa-stage{display:grid;gap:12px;align-content:start;min-width:0}
.sa-stage-cap{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 12px;font-size:13px;line-height:1.3;color:var(--muted)}
.sa-stage-cap b{font:600 14px/1.3 var(--display);letter-spacing:-.01em;color:var(--paper)}
.sa-stage .so-slide{box-shadow:0 0 0 1px rgba(183,168,255,.24),0 26px 50px -28px rgba(0,0,0,.95)}
.sa-roll .so-t{--fs:6.4;--tw:70cqw;--ty:15cqw}
.sa-phases{position:absolute;left:7cqw;right:7cqw;bottom:7.5cqw;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2.4cqw}
.sa-phases::before{content:"";position:absolute;left:4cqw;right:4cqw;top:50%;height:.45cqw;background:rgba(123,92,255,.28)}
.sa-ph{position:relative;display:grid;gap:1.2cqw;min-width:0;padding:3cqw 3cqw 3.2cqw;border-radius:2.2cqw;background:#fff;box-shadow:0 0 0 .3cqw rgba(123,92,255,.2)}
.sa-ph b{font:500 2.5cqw/1.2 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--violet);white-space:nowrap}
.sa-ph span{font:600 4cqw/1.1 var(--display);letter-spacing:-.02em;color:var(--ink);white-space:nowrap}
.sa-ph i{font:400 2.8cqw/1.2 var(--sans);color:rgba(18,15,46,.62);white-space:nowrap}
.sa-ph.is-new{background:var(--violet);box-shadow:0 0 0 .6cqw rgba(123,92,255,.25)}
.sa-ph.is-new b,.sa-ph.is-new span,.sa-ph.is-new i{color:#fff}
/* time on each page, as a strip under the slide */
.sa-strip{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px}
.sa-strip li{position:relative;overflow:hidden;display:grid;place-items:center;height:34px;border-radius:9px;background:rgba(183,168,255,.05);box-shadow:inset 0 0 0 1px var(--line)}
.sa-strip li i{position:absolute;inset:0;background:linear-gradient(180deg,rgba(183,168,255,.36),rgba(183,168,255,.12));transform-origin:50% 100%;transform:scaleY(var(--a))}
.sa-strip li span{position:relative;font:500 13px/1 var(--sans);color:var(--paper);font-variant-numeric:tabular-nums}
.sa-strip li.is-stop{box-shadow:inset 0 0 0 1.5px var(--lav),0 0 0 3px rgba(123,92,255,.25)}
.sa-strip li.is-stop i{background:linear-gradient(180deg,var(--violet),#5B3FE0)}
.sa-strip li.is-stop span{color:#fff}

.sa-side{display:flex;flex-direction:column;gap:10px;min-width:0}
.sa-side .ui-k{margin:0}
.sa-ppl{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.sa-p{display:grid;grid-template-columns:32px minmax(0,1fr);align-items:center;gap:10px;min-width:0;padding:10px;border-radius:14px;background:rgba(18,15,46,.6);box-shadow:inset 0 0 0 1px var(--line)}
.sa-p .so-who > b{font-size:14px}
.sa-p.is-lead{background:linear-gradient(180deg,rgba(123,92,255,.22),rgba(123,92,255,.07));box-shadow:inset 0 0 0 1px rgba(183,168,255,.42)}
.sa-p.is-lead .so-who > span{color:var(--lav)}
.sa-sum{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin-top:auto;border-radius:14px;background:rgba(183,168,255,.05);box-shadow:inset 0 0 0 1px var(--line)}
.sa-sum span{display:grid;gap:6px;min-width:0;padding:10px 12px 11px;font-size:13px;line-height:1.25;color:var(--muted)}
.sa-sum span + span{border-left:1px solid var(--line)}
.sa-sum b{font:600 19px/1 var(--display);letter-spacing:-.02em;color:var(--paper);white-space:nowrap}

@container sa-room (max-width:559px){
  .sa-room-body{grid-template-columns:minmax(0,1fr);gap:14px;padding:14px}
  .sa-ppl{grid-template-columns:repeat(3,minmax(0,1fr))}
  .sa-p{grid-template-columns:minmax(0,1fr);gap:8px}
  .sa-p .so-who > b{font-size:13px}
  .sa-sum{margin-top:0}
}
@container sa-room (max-width:419px){
  .sa-room-body{padding:12px}
  .sa-ppl{grid-template-columns:minmax(0,1fr)}
  .sa-p{grid-template-columns:32px minmax(0,1fr);padding:8px 10px}
  .sa-p .so-who > b{font-size:14px}
  .sa-strip{gap:4px}
  .sa-strip li{height:30px}
}

/* ---------- The job: a quiet week ---------- */
.sa-week{container-name:sa-week}
.sa-week-in{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));overflow:hidden;border-radius:var(--radius);border:1px solid var(--line-2);background:linear-gradient(180deg,var(--night-3),var(--night-2));box-shadow:var(--shadow)}
.sa-day{display:flex;flex-direction:column;gap:14px;min-width:0;padding:18px 16px 20px}
.sa-day + .sa-day{border-left:1px solid var(--line)}
.sa-day-h{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 8px;font-size:13px;line-height:1.3;color:var(--muted)}
.sa-day-h b{font:600 15px/1.2 var(--display);letter-spacing:-.01em;color:var(--paper)}
.sa-mail{flex:1;display:flex;flex-direction:column;gap:6px;min-width:0;padding:12px 13px 14px;border-radius:12px;background:rgba(183,168,255,.1);box-shadow:inset 0 0 0 1px rgba(183,168,255,.26)}
.sa-mail-ic{display:flex;align-items:center;gap:8px;margin-bottom:4px;font-size:13px;line-height:1.2;color:var(--lav)}
.sa-mail-ic svg{flex:none;width:22px;height:22px;fill:none;stroke:var(--lav);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.sa-mail b{font:600 15px/1.3 var(--display);letter-spacing:-.01em;color:var(--paper)}
.sa-file{font-size:13px;line-height:1.4;color:var(--muted);overflow-wrap:anywhere}
.sa-day.is-fu .sa-mail{background:none;box-shadow:inset 0 0 0 1px var(--line)}
.sa-day.is-fu .sa-mail-ic{color:var(--muted)}
.sa-q{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;min-height:110px;padding:14px;border-radius:12px;border:1px dashed rgba(183,168,255,.28);font-size:14px;line-height:1.4;color:var(--muted);text-align:center}
.sa-q::before{content:"?";display:grid;place-items:center;flex:none;width:30px;height:30px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(183,168,255,.36);font:600 15px/1 var(--display);color:var(--lav)}
@container sa-week (max-width:819px){
  .sa-week-in{grid-template-columns:minmax(0,1fr)}
  .sa-day{display:grid;grid-template-columns:96px minmax(0,1fr);align-items:center;gap:14px;padding:14px 16px}
  .sa-day + .sa-day{border-left:0;border-top:1px solid var(--line)}
  .sa-day-h{flex-direction:column;align-items:flex-start;justify-content:center}
  .sa-q{flex-direction:row;justify-content:flex-start;min-height:52px;padding:10px 12px;text-align:left}
  .sa-q::before{width:26px;height:26px;font-size:14px}
}
@container sa-week (max-width:459px){
  .sa-day{grid-template-columns:minmax(0,1fr);gap:10px}
  .sa-day-h{flex-direction:row;align-items:baseline;justify-content:flex-start}
}

/* ---------- Who opened it: readers by page ---------- */
.sa-mx{container-name:sa-mx}
.sa-mx-body{padding:14px 18px 18px}
.sa-mx-grid{--who:176px;position:relative;isolation:isolate;display:grid;grid-template-columns:var(--who) repeat(7,minmax(0,1fr));grid-template-rows:auto repeat(3,60px);column-gap:5px;align-items:center}
.sa-mx-band{position:absolute;inset:0 -3px;grid-column:6;grid-row:1 / -1;z-index:-1;border-radius:12px;background:linear-gradient(180deg,rgba(123,92,255,.22),rgba(123,92,255,.05));box-shadow:inset 0 0 0 1px rgba(183,168,255,.26)}
.sa-mx-corner{grid-column:1;grid-row:1;align-self:start;padding-top:9px}
.sa-mx-ph{display:flex;flex-direction:column;align-items:center;gap:5px;min-width:0;padding:8px 0 12px;font-size:13px;line-height:1.2;color:var(--muted);text-align:center}
.sa-mx-ph b{font:600 14px/1 var(--display);color:var(--paper)}
.sa-mx-ph span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sa-mx-ph.is-top,.sa-mx-ph.is-top b{color:var(--lav)}
.sa-mx-who{position:relative;display:flex;align-items:center;gap:10px;min-width:0;height:100%;padding-right:8px}
.sa-mx-who .so-who > b{font-size:14px}
.sa-mx-c{position:relative;display:grid;place-items:center;height:44px;border-radius:9px;background:rgba(123,92,255,calc(.1 + var(--a) * .72));font:600 13px/1 var(--display);color:var(--paper);font-variant-numeric:tabular-nums}
.sa-mx-c.is-top{box-shadow:inset 0 0 0 1.5px var(--lav)}
.sa-mx-c.is-none{background:none;border:1px dashed rgba(183,168,255,.26)}
.sa-mx-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 18px;margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}
.sa-key{display:flex;align-items:center;gap:10px;font-size:13px;line-height:1.2;color:var(--muted)}
.sa-key i{width:72px;height:10px;border-radius:9px;background:linear-gradient(90deg,rgba(123,92,255,.14),#7B5CFF)}
@container sa-mx (max-width:539px){
  .sa-mx-body{padding:12px 14px 16px}
  .sa-mx-grid{--who:132px;column-gap:4px}
  .sa-mx-who{gap:8px}
  .sa-ln,.sa-sub,.sa-mx-ph span{display:none}
}
@container sa-mx (max-width:439px){
  .sa-mx-grid{--who:96px;grid-template-rows:auto repeat(3,52px)}
  .sa-mx-who .av,.sa-sub{display:none}
  .sa-mx-c{height:36px;border-radius:7px;color:transparent}
}

/* ---------- Questions: a private thread on page 5 ---------- */
.sa-chat{container-name:sa-chat}
.sa-chat-win{overflow:hidden;border-radius:var(--radius);border:1px solid var(--line-2);background:linear-gradient(180deg,var(--night-3),var(--night-2) 55%);box-shadow:var(--shadow)}
.sa-ctx{display:grid;grid-template-columns:84px minmax(0,1fr) auto;align-items:center;gap:14px;padding:14px 16px;border-bottom:1px solid var(--line);background:rgba(183,168,255,.04)}
.sa-ctx-th svg{width:100%;height:auto;border-radius:6px;box-shadow:0 0 0 1px rgba(183,168,255,.3),0 10px 24px -14px rgba(0,0,0,.9)}
.sa-msgs{list-style:none;margin:0;padding:20px 16px 8px;display:grid;gap:16px}
.sa-msg{display:flex;align-items:flex-end;gap:10px;max-width:90%}
.sa-msg.is-you{justify-self:end}
.sa-bub{display:grid;gap:6px;min-width:0;padding:12px 15px 13px;border-radius:16px 16px 16px 5px;background:var(--night-3);box-shadow:inset 0 0 0 1px var(--line-2);font-size:15px;line-height:1.5;color:var(--paper)}
.sa-msg.is-you .sa-bub{border-radius:16px 16px 5px 16px;background:linear-gradient(180deg,#7B5CFF,#6A48F5);box-shadow:none;color:#fff}
.sa-bub-h{display:flex;flex-wrap:wrap;align-items:center;gap:4px 7px;font-size:13px;line-height:1.3;color:var(--muted)}
.sa-bub-h b{font-weight:500;color:var(--paper)}
.sa-bub-h > span{margin-left:4px}
.sa-msg.is-you .sa-bub-h{color:rgba(255,255,255,.78)}
.sa-msg.is-you .sa-bub-h b{color:#fff}
.sa-sys{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px 10px;padding:2px 8px;font-size:13px;line-height:1.4;color:var(--muted);text-align:center}
.sa-sys-chip{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 10px;border-radius:999px;background:rgba(183,168,255,.14);color:var(--paper);white-space:nowrap}
.sa-sys-chip svg,.sa-st svg{width:14px;height:14px;fill:none;stroke:var(--lav);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.sa-compose{display:flex;align-items:center;justify-content:space-between;gap:12px;height:46px;margin:10px 16px 16px;padding:0 6px 0 16px;border-radius:999px;background:rgba(14,12,36,.6);box-shadow:inset 0 0 0 1px var(--line-2);font-size:14px;color:var(--muted)}
.sa-send{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--violet)}
.sa-send svg{width:16px;height:16px;fill:none;stroke:#fff;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
@container sa-chat (max-width:439px){
  .sa-ctx{grid-template-columns:64px minmax(0,1fr);gap:12px;padding:12px 14px}
  .sa-ctx .ui-chip{display:none}
  .sa-msgs{padding:16px 12px 6px}
  .sa-msg{max-width:96%}
  .sa-bub{font-size:14px}
  .sa-compose{margin:8px 12px 12px}
}

/* ---------- Next version: the card and the draft ---------- */
.sa-nr{container-name:sa-nr}
.sa-nr-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px;align-items:stretch}
.sa-nr-card{display:flex;flex-direction:column;gap:22px;min-width:0;padding:24px;border-radius:var(--radius);background:linear-gradient(180deg,var(--night-3),var(--night-2));border:1px solid var(--line-2);box-shadow:var(--shadow)}
.sa-nr-top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px}
.sa-nr-for{font-size:14px;line-height:1.3;color:var(--muted)}
.sa-ladder{list-style:none;margin:0;padding:0;display:grid}
.sa-ladder li{position:relative;display:grid;grid-template-columns:30px minmax(0,1fr);column-gap:14px;row-gap:4px;padding-bottom:18px}
.sa-ladder li:last-child{padding-bottom:0}
.sa-ladder li::before{content:"";position:absolute;left:14.5px;top:34px;bottom:4px;width:1px;background:var(--line-2)}
.sa-ladder li:last-child::before{display:none}
.sa-l-n{grid-row:1 / span 2;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--night-2);box-shadow:inset 0 0 0 1px var(--line-2);font:600 13px/1 var(--display);color:var(--paper)}
.sa-l-k{align-self:center;min-height:30px;display:flex;align-items:center;font:500 13px/1.2 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--lav)}
.sa-ladder p{grid-column:2;font-size:16px;line-height:1.55;color:var(--paper)}
.sa-ladder li.is-act .sa-l-n{background:var(--violet);box-shadow:0 0 0 4px rgba(123,92,255,.22);color:#fff}
.sa-ladder li.is-ev p{color:var(--muted)}
.sa-draft{display:flex;flex-direction:column;min-width:0;overflow:hidden;border-radius:var(--radius);background:var(--paper);color:var(--ink);box-shadow:var(--shadow)}
.sa-draft-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 22px;border-bottom:1px solid rgba(18,15,46,.1)}
.sa-draft-top b{font:600 16px/1.3 var(--display);letter-spacing:-.01em}
.sa-draft-tag{display:inline-flex;align-items:center;height:24px;padding:0 10px;border-radius:999px;background:rgba(123,92,255,.14);font:500 13px/1 var(--sans);color:var(--violet-deep)}
.sa-field{display:grid;grid-template-columns:64px minmax(0,1fr);gap:10px;padding:11px 22px;border-bottom:1px solid rgba(18,15,46,.08);font-size:15px;line-height:1.35}
.sa-field i{color:rgba(18,15,46,.6)}
.sa-draft-b{flex:1;display:grid;gap:12px;align-content:start;padding:18px 22px 20px;font-size:16px;line-height:1.55}
.sa-caret{display:inline-block;width:2px;height:1.15em;margin-left:3px;vertical-align:-.2em;background:var(--violet)}
.sa-draft-act{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:14px 22px 16px;border-top:1px solid rgba(18,15,46,.1)}
.sa-draft-act .so-mbtn.is-line{box-shadow:inset 0 0 0 1px rgba(18,15,46,.22);color:var(--ink)}
.sa-draft-note{margin-left:auto;font-size:13px;line-height:1.3;color:rgba(18,15,46,.66)}
@container sa-nr (max-width:759px){
  .sa-nr-in{grid-template-columns:minmax(0,1fr)}
}
@container sa-nr (max-width:439px){
  .sa-nr-card{padding:18px 16px}
  .sa-ladder p{font-size:15px}
  .sa-draft-top,.sa-field,.sa-draft-b,.sa-draft-act{padding-left:16px;padding-right:16px}
  .sa-draft-b{font-size:15px}
  .sa-draft-note{margin-left:0;flex-basis:100%}
}

/* ---------- Languages: the reader's phone and your approvals ---------- */
.sa-lang{container-name:sa-lang}
.sa-lang-in{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1fr);gap:24px;align-items:center;padding:28px;border-radius:var(--radius);border:1px solid var(--line-2);box-shadow:var(--shadow);background:
  radial-gradient(60% 60% at 24% 44%,rgba(123,92,255,.24),transparent 72%),
  radial-gradient(rgba(183,168,255,.11) 1px,transparent 1.5px) 0 0 / 20px 20px,
  var(--night)}
.sa-phone{container-type:inline-size;justify-self:center;width:100%;max-width:236px;aspect-ratio:9 / 18.4;padding:3.4%;border-radius:15% / 7.4%;background:#0B0920;box-shadow:inset 0 0 0 1.5px rgba(183,168,255,.38),0 40px 70px -30px rgba(0,0,0,.95)}
.sa-scr{display:flex;flex-direction:column;height:100%;overflow:hidden;border-radius:11cqw;background:var(--paper);color:var(--ink)}
.sa-scr-bar{display:flex;align-items:center;justify-content:space-between;gap:3cqw;padding:9cqw 7cqw 4cqw}
.sa-scr-brand{display:flex;align-items:center;gap:2cqw;font:600 5cqw/1 var(--display);letter-spacing:-.02em}
.sa-scr-brand svg{width:6.4cqw;height:6.4cqw;fill:none;stroke:var(--violet);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.sa-scr-lang{display:inline-flex;align-items:center;gap:1.4cqw;height:9cqw;padding:0 3cqw 0 3.6cqw;border-radius:99px;background:var(--violet);font:500 4.4cqw/1 var(--sans);color:#fff}
.sa-scr-lang svg{width:3.4cqw;height:3.4cqw;fill:none;stroke:#fff;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.sa-scr-page{display:grid;gap:3.4cqw;padding:3cqw 7cqw}
.sa-scr-k{font:500 3.8cqw/1.2 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--violet)}
.sa-scr-t{margin-bottom:1cqw;font:600 8.6cqw/1.1 var(--display);letter-spacing:-.03em}
.sa-scr-row{display:grid;gap:1.4cqw;padding:3.6cqw 4.4cqw;border-radius:4cqw;background:#fff;box-shadow:0 0 0 .5cqw rgba(123,92,255,.16)}
.sa-scr-row b{font:500 3.4cqw/1.2 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--violet)}
.sa-scr-row span{font:600 5.2cqw/1.2 var(--display);letter-spacing:-.02em}
.sa-scr-row.is-new{background:var(--violet);box-shadow:none}
.sa-scr-row.is-new b,.sa-scr-row.is-new span{color:#fff}
.sa-sheet{display:grid;gap:1.8cqw;margin-top:auto;padding:5cqw 5cqw 8cqw;border-radius:9cqw 9cqw 0 0;background:#fff;box-shadow:0 -5cqw 12cqw -5cqw rgba(18,15,46,.4)}
.sa-sheet::before{content:"";justify-self:center;width:14cqw;height:1.4cqw;margin-bottom:1.6cqw;border-radius:9px;background:rgba(18,15,46,.16)}
.sa-sheet-h{padding:0 3cqw 1cqw;font:500 3.6cqw/1.2 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:rgba(18,15,46,.55)}
.sa-opt{position:relative;display:flex;align-items:center;justify-content:space-between;height:11.5cqw;padding:0 4cqw;border-radius:4cqw;font:500 5cqw/1 var(--sans);color:var(--ink)}
.sa-opt.is-on{background:rgba(123,92,255,.13);color:var(--violet-deep)}
.sa-opt.is-on i{position:relative;width:5.4cqw;height:5.4cqw;border-radius:50%;background:var(--violet)}
.sa-opt.is-on i::before{content:"";position:absolute;left:1.5cqw;top:1.6cqw;width:2.4cqw;height:1.3cqw;border-left:.55cqw solid #fff;border-bottom:.55cqw solid #fff;transform:rotate(-45deg)}

.sa-vers{display:grid;gap:12px;min-width:0}
.sa-vers .ui-k{margin:0}
.sa-vers ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.sa-v{display:grid;grid-template-columns:40px minmax(0,1fr);grid-template-areas:"code who" "code st";align-items:center;column-gap:12px;row-gap:8px;padding:12px;border-radius:14px;background:rgba(18,15,46,.86);box-shadow:inset 0 0 0 1px var(--line-2)}
.sa-v.is-on{box-shadow:inset 0 0 0 1px rgba(183,168,255,.5),0 0 0 4px rgba(123,92,255,.12)}
.sa-code{grid-area:code;align-self:start;display:grid;place-items:center;width:40px;height:32px;border-radius:9px;background:rgba(183,168,255,.14);font:600 13px/1 var(--display);letter-spacing:.06em;color:var(--paper)}
.sa-v.is-on .sa-code{background:var(--violet)}
.sa-v .so-who{grid-area:who}
.sa-v .soon{grid-area:st;justify-self:start;margin-left:0}
.sa-st{grid-area:st;justify-self:start;display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 9px;border-radius:999px;background:rgba(183,168,255,.1);font:500 13px/1 var(--sans);color:var(--paper);white-space:nowrap}
.sa-st.is-ok{background:rgba(183,168,255,.2)}
.sa-st.is-draft{background:none;box-shadow:inset 0 0 0 1px rgba(183,168,255,.4);color:var(--lav)}
.sa-v.is-draft .so-who > b{color:var(--muted)}
.sa-flag{display:grid;grid-template-columns:18px minmax(0,1fr);gap:10px;align-items:start;padding:12px 14px;border-radius:14px;background:rgba(123,92,255,.14);box-shadow:inset 0 0 0 1px rgba(183,168,255,.3);font-size:13px;line-height:1.45;color:var(--paper)}
.sa-flag svg{width:16px;height:16px;margin-top:1px;fill:none;stroke:var(--lav);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
@container sa-lang (max-width:479px){
  .sa-lang-in{grid-template-columns:minmax(0,1fr);gap:22px;padding:22px 16px}
  .sa-phone{max-width:196px}
}

/* more slide parts used by the templates */
.so-sub{position:absolute;left:var(--l,7cqw);top:var(--sy,30cqw);font:400 3cqw/1.4 var(--sans);color:var(--c-mut)}
.so-rings{position:absolute;right:7cqw;bottom:7cqw;width:28cqw;aspect-ratio:1}
.so-rings i{position:absolute;bottom:0;left:50%;border-radius:50%}
.so-rings i:nth-child(1){width:100%;height:100%;margin-left:-50%;background:rgba(255,255,255,.18)}
.so-rings i:nth-child(2){width:64%;height:64%;margin-left:-32%;background:rgba(255,255,255,.36)}
.so-rings i:nth-child(3){width:30%;height:30%;margin-left:-15%;background:var(--paper)}
.so-people{position:absolute;left:7cqw;right:7cqw;bottom:7cqw;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:2cqw}
.so-people > span{display:grid;justify-items:center;gap:1.6cqw;min-width:0}
.so-people i{display:grid;place-items:center;width:10cqw;height:10cqw;border-radius:50%;background:var(--violet);font:600 3.2cqw/1 var(--display);color:#fff}
.so-people > span:nth-child(even) i{background:var(--lav);color:var(--ink)}
.so-people b{font:500 2.7cqw/1 var(--sans);color:var(--c-ink)}

/* =========================================================================
   Founders raising (fr-)
   ========================================================================= */

/* ---------- Hero: who reached The ask ---------- */
.fr-reach{container-name:fr-reach}
.fr-reach .ui-win{overflow:hidden}
.fr-reach-body{display:grid;gap:12px;padding:16px}
.fr-ask-cap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 12px;font-size:13px;line-height:1.3;color:var(--muted)}
.fr-ask-cap b{font:600 14px/1.3 var(--display);letter-spacing:-.01em;color:var(--paper)}
.fr-ask-cap > span{display:inline-flex;align-items:center;gap:8px}
.fr-reach .so-slide{box-shadow:0 0 0 1px rgba(183,168,255,.24),0 26px 50px -28px rgba(0,0,0,.95)}
.fr-rings{list-style:none;margin:4px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.fr-r{display:grid;justify-items:center;align-content:start;gap:8px;min-width:0;padding:14px 10px 12px;border-radius:16px;background:rgba(18,15,46,.6);box-shadow:inset 0 0 0 1px var(--line);text-align:center}
.fr-r .so-who{justify-items:center;max-width:100%}
.fr-r .so-who > b{justify-content:center;max-width:100%}
.fr-ring{position:relative;display:grid;place-items:center;width:58px;height:58px}
.fr-ring svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.fr-ring circle{fill:none;stroke-width:3.6}
.fr-ring-bg{stroke:rgba(183,168,255,.16);stroke-dasharray:15.45 2.5}
.fr-ring-fg{stroke:var(--lav)}
.fr-r.is-end .fr-ring-fg{stroke:#9C86FF}
.fr-r-st{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 9px;border-radius:999px;background:rgba(183,168,255,.1);font:500 13px/1 var(--sans);color:var(--paper);white-space:nowrap}
.fr-r.is-end .fr-r-st{background:var(--violet);color:#fff}
@container fr-reach (max-width:499px){
  .fr-reach-body{padding:12px}
  .fr-rings{grid-template-columns:minmax(0,1fr);gap:8px}
  .fr-r{grid-template-columns:48px minmax(0,1fr) auto;justify-items:start;align-items:center;column-gap:12px;padding:10px 12px;text-align:left}
  .fr-r .so-who{justify-items:start}
  .fr-r .so-who > b{justify-content:flex-start}
  .fr-ring{width:48px;height:48px}
  .fr-ring .av{width:30px;height:30px;font-size:13px}
}
@container fr-reach (max-width:379px){
  .fr-r{grid-template-columns:48px minmax(0,1fr);grid-template-areas:"ring who" "ring st"}
  .fr-ring{grid-area:ring}
  .fr-r .so-who{grid-area:who}
  .fr-r-st{grid-area:st}
}

/* ---------- The job: the investor spreadsheet ---------- */
.fr-sheet{container-name:fr-sheet}
.fr-xl{overflow:hidden;border-radius:var(--radius);border:1px solid var(--line-2);background:var(--night-2);box-shadow:var(--shadow)}
.fr-xl-top{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;padding:13px 16px;border-bottom:1px solid var(--line);background:rgba(183,168,255,.05)}
.fr-xl-ic{display:grid;grid-template-columns:repeat(2,8px);gap:2px}
.fr-xl-ic i{width:8px;height:8px;border-radius:2px;background:rgba(183,168,255,.45)}
.fr-xl-ic i:first-child{background:var(--violet)}
.fr-xl-top b{font:600 15px/1.3 var(--display);letter-spacing:-.01em;color:var(--paper)}
.fr-xl-saved{margin-left:auto;font-size:13px;color:var(--muted)}
.fr-xl-grid{display:grid;grid-template-columns:44px minmax(0,1.5fr) minmax(0,1.2fr) minmax(0,.6fr) minmax(0,.9fr) minmax(0,1.15fr) minmax(0,1fr)}
.fr-c{display:flex;align-items:center;min-width:0;min-height:48px;padding:8px 14px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);font-size:15px;line-height:1.3;color:var(--paper)}
.fr-c:nth-child(7n){border-right:0}
.fr-c:nth-last-child(-n+7){border-bottom:0}
.fr-c.is-hd{justify-content:center;min-height:30px;padding:4px;background:rgba(183,168,255,.05);font-size:13px;color:var(--muted)}
.fr-c.is-n{justify-content:center;padding:4px;background:rgba(183,168,255,.05);font-size:13px;color:var(--muted)}
.fr-c.is-lab{font:500 13px/1.25 var(--sans);letter-spacing:.06em;text-transform:uppercase;color:var(--lav)}
.fr-c.is-q{justify-content:center}
.fr-c.is-q i{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(183,168,255,.36);font:600 14px/1 var(--display);color:var(--lav)}
@container fr-sheet (max-width:759px){
  .fr-xl-grid{grid-template-columns:40px minmax(0,1.5fr) minmax(0,.9fr) minmax(0,1.15fr) minmax(0,1fr)}
  .fr-x1,.fr-x2{display:none}
  .fr-c{padding:8px 12px}
}
@container fr-sheet (max-width:519px){
  .fr-xl-grid{grid-template-columns:32px minmax(0,1.3fr) minmax(0,.85fr) minmax(0,1fr)}
  .fr-x3{display:none}
  .fr-c:nth-child(7n-1){border-right:0}
  .fr-c{padding:8px 10px;font-size:14px}
  .fr-c.is-lab{letter-spacing:.04em}
  .fr-xl-saved{display:none}
}

/* ---------- New readers: two readers, page by page ---------- */
.fr-fw{container-name:fr-fw}
.fr-firm{display:grid;place-items:center;flex:none;width:26px;height:26px;border-radius:8px;background:var(--paper);font:600 13px/1 var(--display);color:var(--night)}
.fr-fw-body{padding:16px 18px 18px}
.fr-fw-grid{--pg:100px;display:grid;grid-template-columns:var(--pg) minmax(0,1fr) minmax(0,1fr);column-gap:18px;row-gap:6px;align-items:center}
.fr-fw-corner{align-self:end;padding-bottom:16px}
.fr-fw-p{position:relative;display:grid;grid-template-columns:32px minmax(0,1fr);align-items:center;gap:10px;min-width:0;margin-bottom:8px;padding:10px 12px;border-radius:14px;background:rgba(18,15,46,.6);box-shadow:inset 0 0 0 1px var(--line)}
.fr-fw-p.is-d{box-shadow:inset 0 0 0 1px rgba(183,168,255,.32)}
.fr-pg{display:flex;align-items:baseline;gap:8px;min-width:0;font-size:14px;line-height:1.2;color:var(--paper);white-space:nowrap}
.fr-pg b{flex:none;width:12px;font:600 13px/1 var(--display);color:var(--muted)}
.fr-pg.is-top{color:var(--lav)}
.fr-bar{display:grid;grid-template-columns:minmax(0,1fr) 38px;align-items:center;gap:10px;min-width:0;height:28px}
.fr-bar i{position:relative;height:12px;overflow:hidden;border-radius:6px;background:rgba(183,168,255,.1)}
.fr-bar i::before{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(90deg,var(--violet),var(--lav));transform-origin:0 50%;transform:scaleX(var(--v))}
.fr-bar.is-d i::before{background:rgba(183,168,255,.62)}
.fr-bar.is-top i{box-shadow:0 0 0 3px rgba(123,92,255,.2)}
.fr-bar b{font:600 13px/1 var(--display);color:var(--paper);text-align:right;font-variant-numeric:tabular-nums}
.fr-bar.is-none{display:flex;padding:0 10px;border-radius:8px;border:1px dashed rgba(183,168,255,.26);font-size:13px;color:var(--muted);white-space:nowrap}
.fr-bar.is-none span{min-width:0;overflow:hidden;text-overflow:ellipsis}
@container fr-fw (max-width:539px){
  .fr-fw-body{padding:12px 12px 14px}
  .fr-fw-grid{--pg:74px;column-gap:12px}
  .fr-fw-p{grid-template-columns:minmax(0,1fr);justify-items:start;gap:6px;padding:9px 10px}
  .fr-fw-p .so-who > span{white-space:normal}
  .fr-ln{display:none}
  .fr-pg{font-size:13px;gap:6px}
  .fr-bar{grid-template-columns:minmax(0,1fr) 32px;gap:6px}
  .fr-bar.is-none{padding:0 8px}
}

/* ---------- Time on Traction and The ask ---------- */
.fr-time{container-name:fr-time}
.fr-time-in{display:grid;gap:18px;padding:22px 24px 20px;border-radius:var(--radius);border:1px solid var(--line-2);background:linear-gradient(180deg,var(--night-3),var(--night-2));box-shadow:var(--shadow)}
.fr-time-h{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 20px}
.fr-time-who{display:flex;align-items:center;gap:12px;min-width:0}
.fr-time-total{display:inline-flex;align-items:baseline;gap:8px;font-size:14px;color:var(--muted)}
.fr-time-total b{font:600 26px/1 var(--display);letter-spacing:-.02em;color:var(--paper)}
.fr-rib{display:flex;gap:4px;height:64px}
.fr-seg{flex:var(--s) 1 0;display:flex;flex-direction:column;justify-content:center;gap:6px;min-width:0;overflow:hidden;padding:0 10px;border-radius:10px;background:rgba(183,168,255,.16);box-shadow:inset 0 0 0 1px rgba(183,168,255,.2);transform-origin:0 50%}
.fr-seg b{font:600 15px/1 var(--display);color:var(--paper);white-space:nowrap}
.fr-seg span{font-size:13px;line-height:1.1;color:var(--muted);white-space:nowrap}
.fr-seg.is-hot{background:linear-gradient(180deg,#7B5CFF,#5B3FE0);box-shadow:none}
.fr-seg.is-hot span{color:rgba(255,255,255,.9)}
.fr-seg.is-sm > *,.fr-seg.is-xs > *{display:none}
.fr-rib-key{display:none;list-style:none;margin:0;padding:0;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 14px;font-size:13px;line-height:1.3;color:var(--muted)}
.fr-rib-key li{display:flex;align-items:baseline;gap:8px}
.fr-rib-key b{font:600 13px/1 var(--display);color:var(--paper)}
.fr-rib-key .is-hot{color:var(--paper)}
.fr-rib-key .is-hot b{color:var(--lav)}
.fr-views{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.fr-view{display:grid;gap:12px;min-width:0}
.fr-view-cap{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;font-size:13px;color:var(--muted)}
.fr-view-cap b{font:600 15px/1.3 var(--display);letter-spacing:-.01em;color:var(--paper)}
.fr-view-t{margin-left:auto;font:600 16px/1 var(--display);color:var(--paper);font-variant-numeric:tabular-nums}
.fr-view .so-slide{box-shadow:0 0 0 1px rgba(183,168,255,.24),0 26px 50px -28px rgba(0,0,0,.95)}
.fr-time-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 20px;padding-top:14px;border-top:1px solid var(--line);font-size:13px;line-height:1.3;color:var(--muted)}
/* Traction: a big number and two stats */
.fr-tr-stats{position:absolute;right:7cqw;top:19cqw;width:32cqw;display:grid;gap:3.2cqw}
.fr-tr-stats > span{display:grid;gap:1cqw;padding:2cqw 2.4cqw 2.2cqw;border-radius:1.6cqw;border-top:.35cqw solid rgba(123,92,255,.25)}
.fr-tr-stats b{font:600 7cqw/1 var(--display);letter-spacing:-.03em;color:var(--ink)}
.fr-tr-stats i{font:400 2.7cqw/1.3 var(--sans);color:rgba(18,15,46,.62)}
.fr-tr-stats .is-chg{border-top-color:transparent;background:rgba(123,92,255,.12);box-shadow:0 0 0 .45cqw var(--violet)}
.fr-tr-stats .is-chg b{color:var(--violet-deep)}
@container fr-time (max-width:639px){
  .fr-time-in{gap:14px;padding:16px 14px}
  .fr-rib{height:40px;gap:3px}
  .fr-seg > *{display:none}
  .fr-rib-key{display:grid}
  .fr-views{grid-template-columns:minmax(0,1fr);gap:18px}
}
@container fr-time (min-width:640px) and (max-width:899px){
  .fr-views{gap:16px}
}

/* ---------- Updates: versions on the same link ---------- */
.fr-rev{container-name:fr-rev}
.fr-rev .ui-chip svg{width:14px;height:14px}
.fr-rev-body{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:22px;align-items:start;padding:18px}
.fr-rev-art{display:grid;gap:10px;min-width:0}
.fr-rev-art .so-slide{box-shadow:0 0 0 1px rgba(183,168,255,.24),0 26px 50px -28px rgba(0,0,0,.95)}
.fr-rev-cap{font-size:13px;line-height:1.3;color:var(--muted)}
.fr-vers{position:relative;list-style:none;margin:0;padding:0;display:grid;gap:18px}
.fr-vers::before{content:"";position:absolute;left:7.25px;top:14px;bottom:14px;width:1.5px;background:var(--line-2)}
.fr-vers > li{position:relative;display:grid;gap:10px;min-width:0;padding-left:30px}
.fr-v-node{position:absolute;left:0;top:2px;width:16px;height:16px;border-radius:50%;background:var(--night-2);box-shadow:inset 0 0 0 2px var(--lav)}
.fr-vers .is-now .fr-v-node{background:var(--violet);box-shadow:0 0 0 4px rgba(123,92,255,.25)}
.fr-v-h{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;font-size:13px;line-height:1.3;color:var(--muted)}
.fr-v-h b{font:600 16px/1.2 var(--display);color:var(--paper)}
.fr-v-d{font-size:14px;line-height:1.45;color:var(--muted)}
.fr-diff{display:flex;flex-wrap:wrap;align-items:center;gap:6px 9px;padding:10px 12px;border-radius:12px;background:rgba(123,92,255,.16);box-shadow:inset 0 0 0 1px rgba(183,168,255,.32);font-size:14px;line-height:1.3;color:var(--paper)}
.fr-diff s{font:600 16px/1 var(--display);color:var(--muted)}
.fr-diff b{font:600 18px/1 var(--display);color:var(--paper)}
.fr-diff svg{width:14px;height:14px;fill:none;stroke:var(--lav);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.fr-v-notes{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.fr-v-notes li{display:grid;grid-template-columns:30px minmax(0,1fr);align-items:center;gap:10px;font-size:14px;line-height:1.35;color:var(--paper)}
.fr-code{display:grid;place-items:center;width:30px;height:24px;border-radius:7px;background:rgba(183,168,255,.16);box-shadow:inset 0 0 0 1px rgba(183,168,255,.3);font:600 13px/1 var(--display);color:var(--lav)}
@container fr-rev (max-width:519px){
  .fr-rev-body{grid-template-columns:minmax(0,1fr);gap:18px;padding:14px}
}

/* ---------- Next version: four quarters ---------- */
.fr-nr{container-name:fr-nr}
.fr-nr-card{display:grid;gap:18px;padding:22px;border-radius:var(--radius);border:1px solid var(--line-2);background:linear-gradient(180deg,var(--night-3),var(--night-2));box-shadow:var(--shadow)}
.fr-nr-h{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px}
.fr-nr-to{display:flex;align-items:center;gap:10px;min-width:0}
.fr-avs{display:flex;flex:none}
.fr-avs .av + .av{margin-left:-8px;box-shadow:0 0 0 2px var(--night-3)}
.fr-quad{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.fr-q{display:grid;gap:10px;align-content:start;min-width:0;padding:16px;border-radius:16px;background:rgba(14,12,36,.62);box-shadow:inset 0 0 0 1px var(--line)}
.fr-q-k{display:flex;align-items:center;gap:8px;font:500 13px/1.2 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--lav)}
.fr-q-k svg{flex:none;width:16px;height:16px;fill:none;stroke:var(--lav);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.fr-q p{font-size:15px;line-height:1.5;color:var(--paper)}
.fr-q.is-act{background:linear-gradient(180deg,rgba(123,92,255,.32),rgba(123,92,255,.12));box-shadow:inset 0 0 0 1px rgba(183,168,255,.46)}
.fr-q.is-ev p{color:var(--muted)}
.fr-nr-f{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.fr-nr-note{margin-left:auto;font-size:13px;line-height:1.3;color:var(--muted)}
@container fr-nr (max-width:479px){
  .fr-nr-card{padding:16px}
  .fr-quad{grid-template-columns:minmax(0,1fr)}
  .fr-nr-note{margin-left:0;flex-basis:100%}
}

/* more slide parts used by the templates */
.so-sw{position:absolute;left:7cqw;right:7cqw;bottom:7cqw;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2cqw}
.so-sw > span{display:grid;gap:1.4cqw;min-width:0}
.so-sw i{height:13cqw;border-radius:1.6cqw;background:var(--c);box-shadow:inset 0 0 0 .3cqw rgba(18,15,46,.08)}
.so-sw b{font:500 2.6cqw/1 var(--sans);color:var(--c-ink)}
.so-lines{position:absolute;left:7cqw;bottom:10cqw;width:62cqw;display:grid;gap:2.8cqw}
.so-lines i{height:2.8cqw;border-radius:9px;background:var(--c-mut);opacity:.45}
.so-lines i:nth-child(2){width:84%}
.so-lines i:nth-child(3){width:62%}

/* =========================================================================
   Agencies and consultants (ag-)
   ========================================================================= */
.ag-logo{display:grid;place-items:center;flex:none;width:34px;height:34px;border-radius:10px;background:var(--paper)}
.ag-logo svg{width:20px;height:20px;fill:none;stroke:var(--violet-deep);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ag-code{display:grid;place-items:center;flex:none;width:38px;height:28px;border-radius:8px;background:rgba(183,168,255,.14);font:600 13px/1 var(--display);letter-spacing:.06em;color:var(--paper)}
.ag-code.is-on{background:var(--violet)}

/* ---------- Hero: one cover, two languages ---------- */
.ag-pitch{container-name:ag-pitch}
.ag-player{overflow:hidden;border-radius:var(--radius);border:1px solid var(--line-2);background:linear-gradient(180deg,var(--night-3),var(--night-2));box-shadow:0 60px 100px -50px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.04)}
.ag-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px;padding:14px 16px}
.ag-brand{display:flex;align-items:center;gap:10px;min-width:0}
.ag-seg{position:relative;display:grid;grid-template-columns:repeat(2,44px);height:34px;padding:3px;border-radius:999px;background:rgba(14,12,36,.72);box-shadow:inset 0 0 0 1px var(--line-2)}
.ag-seg span{position:relative;z-index:1;display:grid;place-items:center;font:600 13px/1 var(--display);letter-spacing:.04em;color:var(--paper)}
.ag-seg-ind{position:absolute;left:3px;top:3px;width:44px;height:28px;border-radius:999px;background:var(--violet);box-shadow:0 4px 14px -4px rgba(123,92,255,.9)}
.ag-player .so-slide{width:auto;margin:0 16px;border-radius:12px;box-shadow:0 0 0 1px rgba(183,168,255,.22)}
.ag-tt{position:absolute;left:7cqw;top:17cqw;width:56cqw;height:26cqw}
.ag-l{position:absolute;left:0;top:0;display:grid;gap:3cqw;width:100%}
.ag-l b{font:600 6.4cqw/1.06 var(--display);letter-spacing:-.035em;color:#fff}
.ag-l i{font:400 2.8cqw/1.3 var(--sans);color:rgba(255,255,255,.8)}
.ag-l.is-tr{opacity:0}
.ag-route{position:absolute;right:5cqw;bottom:7cqw;width:32cqw;height:auto}
.ag-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 18px 14px;font-size:13px;line-height:1.2;color:var(--muted)}
.ag-dots{display:flex;align-items:center;gap:6px}
.ag-dots i{width:6px;height:6px;border-radius:9px;background:rgba(183,168,255,.35)}
.ag-dots i.is-on{width:18px;background:var(--lav)}
.ag-langs{list-style:none;margin:12px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.ag-lr{position:relative;isolation:isolate;display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:10px;min-width:0;padding:10px 12px;border-radius:14px;background:var(--night-2);box-shadow:inset 0 0 0 1px var(--line)}
.ag-lr::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:linear-gradient(180deg,rgba(123,92,255,.28),rgba(123,92,255,.08));box-shadow:inset 0 0 0 1px rgba(183,168,255,.46);opacity:0}
.ag-lr.is-en::before{opacity:1}
.ag-lr .so-who > b{font-size:14px}
@container ag-pitch (max-width:559px){
  .ag-bar{padding:12px}
  .ag-player .so-slide{margin:0 12px}
  .ag-lr{grid-template-columns:minmax(0,1fr);justify-items:start;gap:8px}
}
@container ag-pitch (max-width:419px){
  .ag-langs{grid-template-columns:minmax(0,1fr);gap:8px}
  .ag-lr{grid-template-columns:auto minmax(0,1fr);align-items:center}
}

/* ---------- The job: a folder of PDFs ---------- */
.ag-files{container-name:ag-files}
.ag-fl{overflow:hidden;border-radius:var(--radius);border:1px solid var(--line-2);background:linear-gradient(180deg,var(--night-3),var(--night-2));box-shadow:var(--shadow)}
.ag-fl-top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 16px;padding:14px 20px;border-bottom:1px solid var(--line)}
.ag-fl-path{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;font-size:14px;line-height:1.3;color:var(--muted)}
.ag-fl-path svg{width:10px;height:10px;fill:none;stroke:var(--muted);stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.ag-fl-path b{font-weight:500;color:var(--paper)}
.ag-fl-n{font-size:13px;color:var(--muted)}
.ag-fl-h,.ag-fl-list li{display:grid;grid-template-columns:42px minmax(0,1fr) 72px minmax(0,250px);align-items:center;column-gap:16px;padding:0 20px}
.ag-fl-h{min-height:38px;border-bottom:1px solid var(--line);font:500 13px/1.2 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--lav)}
.ag-fl-h span:first-child{grid-column:1 / span 2}
.ag-fl-list{list-style:none;margin:0;padding:0}
.ag-fl-list li{min-height:64px;padding-top:10px;padding-bottom:10px;border-bottom:1px solid var(--line)}
.ag-pdf{display:grid;place-items:center;width:38px;height:44px;border-radius:6px 13px 6px 6px;background:rgba(183,168,255,.12);box-shadow:inset 0 0 0 1px rgba(183,168,255,.3);font:600 13px/1 var(--display);color:var(--lav)}
.ag-fl-list b{font:500 15px/1.35 var(--sans);color:var(--paper);overflow-wrap:anywhere}
.ag-x1{font-size:14px;color:var(--muted)}
.ag-tag{justify-self:start;display:inline-flex;align-items:center;min-height:28px;padding:4px 12px;border-radius:999px;background:rgba(183,168,255,.14);font-size:13px;line-height:1.3;color:var(--paper)}
.ag-tag.is-q{background:none;border:1px dashed rgba(183,168,255,.38);color:var(--muted)}
.ag-fl-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 20px;font-size:14px;color:var(--muted)}
.ag-fl-foot b{font:600 18px/1 var(--display);color:var(--paper)}
@container ag-files (max-width:639px){
  .ag-fl-top,.ag-fl-foot{padding-left:14px;padding-right:14px}
  .ag-fl-h,.ag-fl-list li{grid-template-columns:38px minmax(0,1fr);column-gap:12px;row-gap:8px;padding-left:14px;padding-right:14px}
  .ag-fl-h .ag-x1,.ag-fl-list .ag-x1{display:none}
  .ag-fl-h span:last-child{display:none}
  .ag-pdf{grid-row:span 2;align-self:start}
  .ag-tag{grid-column:2}
}

/* ---------- The pitch: one theme on every page ---------- */
.ag-kit{container-name:ag-kit}
.ag-kit-body{display:grid;grid-template-columns:184px minmax(0,1fr);gap:18px;padding:18px}
.ag-kit-col{display:grid;gap:18px;align-content:start;min-width:0;padding:16px;border-radius:16px;background:rgba(14,12,36,.62);box-shadow:inset 0 0 0 1px var(--line)}
.ag-kit-logo{display:flex;align-items:center;gap:12px;min-width:0}
.ag-kit-row{display:grid;gap:10px;min-width:0}
.ag-kit-row .ui-k{margin:0}
.ag-sws{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.ag-sws i{aspect-ratio:1;border-radius:9px;background:var(--c);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}
.ag-type{display:flex;align-items:center;gap:12px;font-size:13px;line-height:1.4;color:var(--muted)}
.ag-type b{font:600 34px/1 var(--display);letter-spacing:-.03em;color:var(--paper)}
.ag-kit-pages{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-content:center;min-width:0}
.ag-kit-pages .so-slide{border-radius:8px;box-shadow:0 0 0 1px rgba(183,168,255,.22),0 18px 36px -22px rgba(0,0,0,.95)}
.ag-moon{position:absolute;right:7cqw;top:16cqw;bottom:8cqw;width:36cqw;overflow:hidden;border-radius:2.6cqw;background:#241B6A}
.ag-moon i{position:absolute;right:9cqw;top:7cqw;width:12cqw;height:12cqw;border-radius:50%;box-shadow:-2.6cqw 2cqw 0 0 var(--paper)}
.ag-moon::after{content:"";position:absolute;left:5cqw;right:5cqw;bottom:6cqw;height:2.6cqw;border-radius:9px;background:var(--lav)}
@container ag-kit (max-width:559px){
  .ag-kit-body{grid-template-columns:minmax(0,1fr);gap:14px;padding:14px}
  .ag-kit-col{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;align-items:start}
  .ag-kit-logo{flex-direction:column;align-items:flex-start;gap:8px}
  .ag-type{flex-direction:column;align-items:flex-start;gap:6px}
}
@container ag-kit (max-width:419px){
  .ag-kit-col{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .ag-kit-logo{grid-column:1 / -1;flex-direction:row;align-items:center}
  .ag-kit-pages{gap:10px}
}

/* ---------- Languages: one page, two languages ---------- */
.ag-tri{container-name:ag-tri}
.ag-tri-row{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.ag-col{display:grid;gap:14px;align-content:start;min-width:0;padding:16px;border-radius:var(--radius);border:1px solid var(--line-2);background:linear-gradient(180deg,var(--night-3),var(--night-2));box-shadow:var(--shadow)}
.ag-col-h{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;min-width:0}
.ag-col-h .so-who{flex:1 1 140px}
.ag-st{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 10px;border-radius:999px;background:rgba(183,168,255,.08);box-shadow:inset 0 0 0 1px var(--line-2);font:500 13px/1 var(--sans);color:var(--paper);white-space:nowrap}
.ag-st.is-ok{background:rgba(183,168,255,.2);box-shadow:none}
.ag-st svg{width:14px;height:14px;fill:none;stroke:var(--lav);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ag-col .so-slide{box-shadow:0 0 0 1px rgba(183,168,255,.22),0 22px 44px -26px rgba(0,0,0,.95)}
.ag-idea .so-m{max-width:50cqw}
.ag-idea-art{position:absolute;right:7cqw;top:15cqw;bottom:7cqw;width:32cqw;display:grid;place-items:center;border-radius:2.4cqw;background:var(--violet)}
.ag-idea-art svg{width:80%;height:80%}
.ag-queue{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:14px;margin-top:20px;padding:14px 16px;border-radius:16px;background:rgba(123,92,255,.14);box-shadow:inset 0 0 0 1px rgba(183,168,255,.32);font-size:15px;line-height:1.45;color:var(--muted)}
.ag-queue b{font-weight:500;color:var(--paper)}
.ag-queue-ic{display:grid;place-items:center;width:36px;height:36px;border-radius:10px;background:rgba(183,168,255,.16)}
.ag-queue-ic svg{width:16px;height:16px;fill:none;stroke:var(--lav);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
@container ag-tri (max-width:619px){
  .ag-tri-row{grid-template-columns:minmax(0,1fr);gap:14px}
  .ag-col{padding:14px}
  .ag-queue{grid-template-columns:auto minmax(0,1fr);padding:14px}
  .ag-queue .so-mbtn{grid-column:1 / -1;justify-self:start}
}

/* ---------- What landed: time per idea, ranked ---------- */
.ag-rank{container-name:ag-rank}
.ag-rank-list{list-style:none;margin:0;padding:6px 18px 4px;display:grid}
.ag-rank-list li{display:grid;grid-template-columns:20px 84px minmax(0,1fr) auto;grid-template-areas:"n th who v" "n th bar bar";align-items:center;column-gap:14px;row-gap:10px;padding:16px 0}
.ag-rank-list li + li{border-top:1px solid var(--line)}
.ag-rank-n{grid-area:n;font:600 15px/1 var(--display);color:var(--muted)}
.ag-rank-list li.is-top .ag-rank-n{color:var(--lav)}
.ag-rank-th{grid-area:th;align-self:center}
.ag-rank-th svg{width:100%;height:auto;border-radius:6px;box-shadow:0 0 0 1px rgba(183,168,255,.22),0 12px 26px -16px rgba(0,0,0,.9)}
.ag-rank-list .so-who{grid-area:who}
.ag-rank-v{grid-area:v;font:600 18px/1 var(--display);letter-spacing:-.01em;color:var(--paper);font-variant-numeric:tabular-nums}
.ag-rank-bar{grid-area:bar;display:flex;gap:2px;width:calc(var(--t) / 400 * 100%);height:14px;transform-origin:0 50%}
.ag-rank-bar i{flex:var(--s) 1 0;min-width:3px;border-radius:4px}
.ag-rank .r1{background:var(--violet)}
.ag-rank .r2{background:var(--lav)}
.ag-rank .r3{background:rgba(183,168,255,.38)}
.ag-legend{list-style:none;margin:0;padding:14px 18px 18px;display:flex;flex-wrap:wrap;gap:8px 18px;border-top:1px solid var(--line);font-size:13px;line-height:1.3;color:var(--muted)}
.ag-legend li{display:flex;align-items:center;gap:8px}
.ag-legend i{flex:none;width:12px;height:12px;border-radius:4px}
@container ag-rank (max-width:459px){
  .ag-rank-list{padding:4px 14px 2px}
  .ag-rank-list li{grid-template-columns:18px 64px minmax(0,1fr) auto;column-gap:10px}
  .ag-legend{flex-direction:column;padding:12px 14px 14px}
}

/* ---------- Questions: pinned to the idea ---------- */
.ag-pins{container-name:ag-pins}
.ag-pins-in{display:grid;gap:16px;padding:18px;border-radius:var(--radius);border:1px solid var(--line-2);box-shadow:var(--shadow);background:
  radial-gradient(70% 50% at 50% 26%,rgba(123,92,255,.22),transparent 72%),
  radial-gradient(rgba(183,168,255,.1) 1px,transparent 1.5px) 0 0 / 20px 20px,
  var(--night)}
.ag-stage{position:relative}
.ag-stage .so-slide{box-shadow:0 0 0 1px rgba(183,168,255,.24),0 26px 50px -28px rgba(0,0,0,.95)}
.ag-pin,.ag-pin-n{display:grid;place-items:center;width:30px;height:30px;border-radius:50% 50% 50% 5px;background:var(--paper);font:600 13px/1 var(--display);color:var(--violet-deep)}
.ag-pin{position:absolute;z-index:2;left:94%;top:9%;margin:-15px 0 0 -15px;box-shadow:0 0 0 4px rgba(123,92,255,.55),0 12px 24px -8px rgba(0,0,0,.85)}
.ag-notes{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.ag-note{display:grid;grid-template-columns:30px minmax(0,1fr);gap:12px;padding:14px;border-radius:16px;background:rgba(18,15,46,.9);box-shadow:inset 0 0 0 1px var(--line-2)}
.ag-note-b{display:grid;gap:8px;min-width:0}
.ag-note-h{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;font-size:13px;line-height:1.3;color:var(--muted)}
.ag-note-h b{font-weight:500;font-size:14px;color:var(--paper)}
.ag-note-q{font-size:15px;line-height:1.5;color:var(--paper)}
.ag-reply{display:grid;gap:3px;padding:10px 12px;border-radius:12px;background:rgba(123,92,255,.18);box-shadow:inset 2px 0 0 var(--lav);font-size:14px;line-height:1.45;color:var(--paper)}
.ag-reply b{font-weight:500;font-size:13px;color:var(--lav)}
.ag-open{display:inline-flex;align-items:center;gap:8px;font-size:13px;line-height:1.3;color:var(--lav)}
.ag-open::before{content:"";flex:none;width:6px;height:6px;border-radius:50%;background:var(--lav)}
@container ag-pins (max-width:439px){
  .ag-pins-in{padding:12px}
  .ag-note{gap:10px;padding:12px}
  .ag-pin{width:26px;height:26px;margin:-13px 0 0 -13px}
}

/* =========================================================================
   Customer success (cs-)
   ========================================================================= */
.cs-logo{display:grid;place-items:center;flex:none;width:26px;height:26px;border-radius:8px;background:var(--lav);font:600 13px/1 var(--display);color:var(--night)}

/* ---------- Hero: the account and its two decks ---------- */
.cs-acct{container-name:cs-acct}
.cs-acct .ui-win{overflow:hidden}
.cs-acct-body{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;padding:16px}
.cs-deck{display:grid;gap:12px;align-content:start;min-width:0;padding:12px 12px 14px;border-radius:16px;background:rgba(18,15,46,.6);box-shadow:inset 0 0 0 1px var(--line)}
.cs-deck .so-slide{box-shadow:0 0 0 1px rgba(183,168,255,.22),0 18px 36px -22px rgba(0,0,0,.95)}
.cs-deck-h{display:grid;gap:2px;font-size:13px;line-height:1.3;color:var(--muted)}
.cs-deck-h b{font:600 15px/1.3 var(--display);letter-spacing:-.01em;color:var(--paper)}
.cs-faces{list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:7px;height:30px}
.cs-faces .av{position:relative;width:28px;height:28px;font-size:12px}
.cs-faces .av i{position:absolute;right:-4px;bottom:-3px;width:14px;height:14px;border-radius:50%;background:var(--lav);box-shadow:0 0 0 2px var(--night-2)}
.cs-faces .av i::before{content:"";position:absolute;left:3.8px;top:4px;width:6px;height:3.2px;border-left:1.6px solid var(--night);border-bottom:1.6px solid var(--night);transform:rotate(-45deg)}
.cs-squares{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));align-items:center;gap:4px;height:30px}
.cs-squares li{aspect-ratio:1;border-radius:4px;background:rgba(183,168,255,.1);box-shadow:inset 0 0 0 1px var(--line-2)}
.cs-squares li.is-done{background:var(--violet);box-shadow:none}
.cs-squares li.is-mid{background:rgba(183,168,255,.55);box-shadow:none}
.cs-meter{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:baseline;gap:8px 10px;font-size:13px;line-height:1.3;color:var(--muted)}
.cs-meter b{font:600 15px/1 var(--display);color:var(--paper);white-space:nowrap}
.cs-meter i{grid-column:1 / -1;position:relative;height:6px;overflow:hidden;border-radius:9px;background:rgba(183,168,255,.14)}
.cs-meter i::before{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(90deg,var(--violet),var(--lav));transform-origin:0 50%;transform:scaleX(var(--v))}
.cs-acct-foot{display:grid;grid-template-columns:36px minmax(0,1fr) auto;align-items:center;gap:12px;margin:0 16px 16px;padding:10px 10px 10px 12px;border-radius:16px;background:linear-gradient(90deg,rgba(123,92,255,.24),rgba(123,92,255,.06));box-shadow:inset 0 0 0 1px rgba(183,168,255,.36)}
.cs-spark{display:grid;place-items:center;width:36px;height:36px;border-radius:10px;background:rgba(183,168,255,.12)}
.cs-spark svg{width:20px;height:20px}
.cs-acct-foot .so-mbtn{height:34px;padding:0 14px}
@container cs-acct (max-width:439px){
  .cs-acct-body{grid-template-columns:minmax(0,1fr);gap:10px;padding:12px}
  .cs-deck{grid-template-columns:112px minmax(0,1fr);column-gap:12px;row-gap:8px;padding:10px}
  .cs-deck .so-slide{grid-row:1 / span 3;align-self:start}
  .cs-faces{gap:5px}
  .cs-faces .av{width:24px;height:24px}
  .cs-squares{gap:3px}
  .cs-acct-foot{margin:0 12px 12px}
}

/* ---------- The job: an invite and an attachment ---------- */
.cs-agenda{container-name:cs-agenda}
.cs-ag-in{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:20px}
.cs-ag-cal,.cs-ag-mail{display:flex;flex-direction:column;gap:14px;min-width:0;padding:20px;border-radius:var(--radius);border:1px solid var(--line-2);background:linear-gradient(180deg,var(--night-3),var(--night-2));box-shadow:var(--shadow)}
.cs-ag-top{display:flex;align-items:center;gap:14px;min-width:0}
.cs-ag-date{display:grid;place-items:center;align-content:center;gap:5px;flex:none;width:60px;height:60px;border-radius:14px;background:var(--paper);color:var(--ink)}
.cs-ag-date span{font:500 13px/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--violet-deep)}
.cs-ag-date b{font:600 15px/1 var(--display);letter-spacing:-.01em}
.cs-ag-env{display:grid;place-items:center;flex:none;width:46px;height:46px;border-radius:12px;background:rgba(183,168,255,.12)}
.cs-ag-env svg{width:22px;height:22px;fill:none;stroke:var(--lav);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.cs-ag-att{display:inline-flex;align-items:center;gap:8px;align-self:flex-start;max-width:100%;padding:8px 12px;border-radius:10px;background:rgba(183,168,255,.08);box-shadow:inset 0 0 0 1px var(--line-2);font-size:14px;line-height:1.3;color:var(--paper);overflow-wrap:anywhere}
.cs-ag-att svg{flex:none;width:14px;height:14px;fill:none;stroke:var(--lav);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.cs-ag-list{list-style:none;margin:0;padding:0;display:grid}
.cs-ag-list li{display:grid;grid-template-columns:48px minmax(0,1fr) auto;align-items:center;gap:12px;padding:11px 0;border-top:1px solid var(--line);font-size:14px;line-height:1.3;color:var(--muted)}
.cs-ag-list b{font-weight:500;font-size:15px;color:var(--paper)}
.cs-ag-list em{font-style:normal;font-size:13px;white-space:nowrap}
.cs-ag-list li.is-read{margin:0 -10px;padding:10px;border:1px dashed rgba(183,168,255,.5);border-radius:12px;background:rgba(183,168,255,.07)}
.cs-ag-list li.is-read + li{border-top-color:transparent}
.cs-ag-list li.is-read em{color:var(--lav)}
.cs-ag-dots{list-style:none;margin:4px 0 0;padding:0;display:grid;grid-template-columns:repeat(6,36px);justify-content:space-between;row-gap:12px}
.cs-ag-dots li{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;border:1.5px dashed rgba(183,168,255,.4)}
.cs-ag-dots li::before{content:"?";font:600 13px/1 var(--display);color:var(--lav)}
.cs-ag-q{margin-top:auto;padding-top:12px;border-top:1px solid var(--line);font-size:14px;line-height:1.4;color:var(--muted)}
@container cs-agenda (max-width:759px){
  .cs-ag-in{grid-template-columns:minmax(0,1fr);gap:14px}
}
@container cs-agenda (max-width:419px){
  .cs-ag-cal,.cs-ag-mail{padding:16px}
  .cs-ag-list li{grid-template-columns:44px minmax(0,1fr);row-gap:2px}
  .cs-ag-list em{grid-column:2}
  .cs-ag-dots{grid-template-columns:repeat(6,32px)}
  .cs-ag-dots li{width:32px;height:32px}
}

/* ---------- Quarterly reviews: visits before the meeting ---------- */
.cs-lanes{container-name:cs-lanes}
.cs-lanes-body{padding:8px 18px 16px}
.cs-ln-grid{--who:152px;--meet:89.6%;display:grid;grid-template-columns:var(--who) minmax(0,1fr);grid-template-rows:auto repeat(4,54px);column-gap:14px;align-items:center}
.cs-ln-corner{grid-column:1;align-self:end;padding-bottom:12px}
.cs-axis{grid-column:2;position:relative;align-self:end;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));padding:34px 0 10px;font-size:13px;line-height:1;color:var(--muted)}
.cs-axis > span{padding-left:7px;border-left:1px solid var(--line)}
.cs-meet-k{position:absolute;left:var(--meet);top:4px;transform:translateX(-78%);display:inline-flex;align-items:center;height:24px;padding:0 10px;border-radius:999px;background:var(--violet);font:500 13px/1 var(--sans);color:#fff;white-space:nowrap}
.cs-ln-who{display:flex;align-items:center;gap:10px;min-width:0}
.cs-track{position:relative;align-self:stretch;margin:7px 0;border-radius:10px;background:repeating-linear-gradient(90deg,var(--line) 0 1px,transparent 1px 25%),rgba(183,168,255,.04)}
.cs-track::before{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:rgba(183,168,255,.18)}
.cs-track::after{content:"";position:absolute;left:var(--meet);top:-7px;bottom:-7px;width:2px;margin-left:-1px;background:var(--violet)}
.cs-dot{position:absolute;left:calc(var(--x) * 100%);top:50%;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:var(--lav);box-shadow:0 0 0 4px rgba(183,168,255,.18)}
.cs-dot.is-part{background:var(--night-2);box-shadow:inset 0 0 0 2px var(--lav)}
.cs-dot b{position:absolute;left:50%;bottom:calc(100% + 3px);transform:translateX(-50%);font:600 13px/1 var(--display);color:var(--paper);white-space:nowrap}
.cs-lanes-foot{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin-top:12px;padding-top:14px;border-top:1px solid var(--line);font-size:13px;line-height:1.3;color:var(--muted)}
@container cs-lanes (max-width:479px){
  .cs-lanes-body{padding:6px 12px 14px}
  .cs-ln-grid{--who:86px;column-gap:10px}
  .cs-ln-corner,.cs-ln,.cs-ln-who .so-who > span{display:none}
  .cs-ln-who{gap:8px}
  .cs-ln-who .so-who > b{font-size:14px}
  .cs-axis > span{padding-left:4px}
}

/* ---------- Onboarding: each new user's progress ---------- */
.cs-board{container-name:cs-board}
.cs-chips{display:flex;flex-wrap:wrap;gap:6px}
.cs-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;padding:16px}
.cs-col{display:flex;flex-direction:column;gap:10px;min-width:0;padding:14px;border-radius:16px;background:rgba(14,12,36,.55);box-shadow:inset 0 0 0 1px var(--line)}
.cs-col-h{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 2px 2px;font:500 13px/1.2 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--lav)}
.cs-col-h b{display:grid;place-items:center;min-width:28px;height:24px;padding:0 8px;border-radius:999px;background:rgba(183,168,255,.14);font:600 13px/1 var(--display);letter-spacing:0;color:var(--paper)}
.cs-col.is-done .cs-col-h b{background:var(--violet)}
.cs-cards{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.cs-card{display:grid;grid-template-columns:26px minmax(0,1fr);grid-template-areas:"av who" "steps steps";align-items:center;column-gap:10px;row-gap:12px;padding:12px;border-radius:14px;background:var(--night-3);box-shadow:inset 0 0 0 1px var(--line-2)}
.cs-card .av{grid-area:av}
.cs-card .so-who{grid-area:who}
.cs-card.is-stuck{box-shadow:inset 0 0 0 1px rgba(183,168,255,.52),0 0 0 4px rgba(123,92,255,.12)}
.cs-card.is-stuck .so-who > span{color:var(--lav)}
.cs-steps{grid-area:steps;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px}
.cs-steps i{height:6px;border-radius:9px;background:rgba(183,168,255,.14);transform-origin:0 50%}
.cs-steps i.is-done{background:var(--violet)}
.cs-steps i.is-now{background:var(--lav)}
.cs-col-f{margin-top:auto;padding:4px 2px 0;font-size:13px;line-height:1.3;color:var(--muted)}
.cs-legend{list-style:none;margin:0;padding:0 16px 16px;display:flex;flex-wrap:wrap;gap:8px 20px;font-size:13px;line-height:1.3;color:var(--muted)}
.cs-legend li{display:flex;align-items:center;gap:8px}
.cs-legend b{display:grid;place-items:center;width:22px;height:22px;border-radius:6px;background:rgba(183,168,255,.14);font:600 13px/1 var(--display);color:var(--paper)}
@container cs-board (max-width:639px){
  .cs-cols{grid-template-columns:minmax(0,1fr);gap:10px;padding:12px}
  .cs-legend{padding:0 12px 14px}
}

/* ---------- Questions: grouped by page ---------- */
.cs-inbox{container-name:cs-inbox}
.cs-groups{list-style:none;margin:0;padding:8px;display:grid;gap:4px}
.cs-g{border-radius:16px}
.cs-g.is-open{background:rgba(14,12,36,.55);box-shadow:inset 0 0 0 1px var(--line-2)}
.cs-g-h{display:grid;grid-template-columns:34px minmax(0,1fr);align-items:center;gap:12px;padding:12px}
.cs-g + .cs-g + .cs-g .cs-g-h{border-top:1px solid var(--line)}
.cs-g-pg{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:rgba(183,168,255,.12);box-shadow:inset 0 0 0 1px var(--line-2);font:600 14px/1 var(--display);color:var(--paper)}
.cs-g.is-open .cs-g-pg{background:var(--violet);box-shadow:none}
.cs-thread{display:grid;gap:10px;padding:0 12px 14px 58px}
.cs-q{display:grid;grid-template-columns:26px minmax(0,1fr);gap:10px;align-items:start}
.cs-q-b{display:grid;gap:4px;min-width:0}
.cs-q-h{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;font-size:13px;line-height:1.3;color:var(--muted)}
.cs-q-h b{font-weight:500;font-size:14px;color:var(--paper)}
.cs-q-b > p:last-child,.cs-a > p:last-child{font-size:15px;line-height:1.5;color:var(--paper)}
.cs-a{display:grid;gap:4px;margin-left:36px;padding:12px 14px;border-radius:14px 14px 14px 4px;background:rgba(123,92,255,.2);box-shadow:inset 0 0 0 1px rgba(183,168,255,.3)}
.cs-a .cs-q-h b{color:var(--lav)}
@container cs-inbox (max-width:439px){
  .cs-groups{padding:6px}
  .cs-g-h{padding:10px}
  .cs-thread{padding:0 10px 12px}
  .cs-a{margin-left:0}
}

/* ---------- Next version: page 3, now and suggested ---------- */
.cs-nv{container-name:cs-nv}
.cs-nv-card{display:grid;gap:18px;padding:20px;border-radius:var(--radius);border:1px solid var(--line-2);background:linear-gradient(180deg,var(--night-3),var(--night-2));box-shadow:var(--shadow)}
.cs-nv-h{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px}
.cs-nv-for{font-size:14px;line-height:1.3;color:var(--muted)}
.cs-nv-pair{display:grid;grid-template-columns:minmax(0,1fr) 26px minmax(0,1fr);grid-template-areas:"ln . ls" "now arr a";align-items:center;column-gap:10px;row-gap:8px;padding:14px;border-radius:16px;background:rgba(14,12,36,.55);box-shadow:inset 0 0 0 1px var(--line)}
.cs-nv-lab{font:500 13px/1.2 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.cs-nv-lab.is-now{grid-area:ln}
.cs-nv-lab.is-new{grid-area:ls;color:var(--lav)}
.cs-nv-pair .so-slide{border-radius:7px;box-shadow:0 0 0 1px rgba(183,168,255,.24)}
.cs-p3{grid-area:now}
.cs-p3a{grid-area:a}
.cs-nv-pair .cs-p3a{box-shadow:0 0 0 1.5px var(--lav)}
.cs-nv-arrow{grid-area:arr;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--violet)}
.cs-nv-arrow svg{width:13px;height:13px;fill:none;stroke:#fff;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.cs-dense{position:absolute;left:7cqw;right:7cqw;top:35cqw;display:grid;gap:2cqw}
.cs-dense i{height:2.2cqw;border-radius:9px;background:rgba(18,15,46,.28)}
.cs-dense i:nth-child(2n){width:88%}
.cs-dense i:nth-child(3n){width:72%}
.cs-add{position:absolute;left:7cqw;right:7cqw;bottom:7cqw;display:grid;gap:1cqw;padding:2.4cqw 3cqw 2.6cqw;border-radius:2cqw;background:#fff;box-shadow:0 0 0 .5cqw var(--violet)}
.cs-add b{display:flex;align-items:center;gap:1.6cqw;font:600 3.4cqw/1.2 var(--display);letter-spacing:-.01em;color:var(--ink)}
.cs-add i{padding:.8cqw 1.5cqw;border-radius:99px;background:var(--violet);font:500 2.2cqw/1 var(--sans);font-style:normal;letter-spacing:.08em;text-transform:uppercase;color:#fff}
.cs-add span{font:400 2.8cqw/1.35 var(--sans);color:rgba(18,15,46,.68)}
.cs-nv-rows{margin:0;display:grid}
.cs-nv-rows > div{display:grid;grid-template-columns:150px minmax(0,1fr);gap:4px 16px;padding:12px 2px;border-top:1px solid var(--line)}
.cs-nv-rows dt{font:500 13px/1.55 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--lav)}
.cs-nv-rows dd{margin:0;font-size:15px;line-height:1.5;color:var(--paper)}
.cs-nv-rows .is-act{margin:0 -10px;padding:12px;border-radius:12px;border-top-color:transparent;background:rgba(123,92,255,.2);box-shadow:inset 0 0 0 1px rgba(183,168,255,.36)}
.cs-nv-rows .is-act + div{border-top-color:transparent}
.cs-nv-rows .is-ev dd{color:var(--muted)}
.cs-nv-f{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.cs-nv-note{margin-left:auto;font-size:13px;line-height:1.3;color:var(--muted)}
@container cs-nv (max-width:459px){
  .cs-nv-card{padding:16px}
  .cs-nv-pair{grid-template-columns:minmax(0,1fr);grid-template-areas:"ln" "now" "arr" "ls" "a";padding:12px}
  .cs-nv-arrow{justify-self:center;transform:rotate(90deg)}
  .cs-nv-rows > div{grid-template-columns:minmax(0,1fr)}
  .cs-nv-note{margin-left:0;flex-basis:100%}
}

/* =========================================================================
   Motion. Entrances run once when a figure reveals (.is-in from site.js);
   loops live under prefers-reduced-motion: no-preference, are paused off
   screen by site.js, and the base styles above are the static frame.
   ========================================================================= */
.fr-tr-stats .is-chg{position:relative}
.fr-tr-stats .is-chg::after{content:"";position:absolute;inset:-1cqw;border-radius:2.2cqw;box-shadow:0 0 0 .4cqw var(--lav);opacity:0}
.ag-pin::after{content:"";position:absolute;inset:-5px;border-radius:inherit;box-shadow:0 0 0 2px var(--lav);opacity:0}

/* entrances */
.js .sa-day,.js .sa-msgs > li,.js .sa-ladder li,.js .fr-vers > li,.js .fr-q,.js .ag-fl-list li,.js .ag-col,.js .ag-note,.js .cs-ag-list li,.js .cs-col,.js .cs-thread > *,.js .cs-nv-rows > div{opacity:0;transform:translateY(10px);transition:opacity .55s var(--ease),transform .55s var(--ease);transition-delay:calc(250ms + var(--k,0) * 140ms)}
.js .sa-msgs > li{transition-delay:calc(300ms + var(--k) * 420ms)}
.js .cs-thread > *{transition-delay:calc(300ms + var(--k) * 420ms)}
.js .is-in .sa-day,.js .is-in .sa-msgs > li,.js .is-in .sa-ladder li,.js .is-in .fr-vers > li,.js .is-in .fr-q,.js .is-in .ag-fl-list li,.js .is-in .ag-col,.js .is-in .ag-note,.js .is-in .cs-ag-list li,.js .is-in .cs-col,.js .is-in .cs-thread > *,.js .is-in .cs-nv-rows > div{opacity:1;transform:none}

.js .sa-mx-c{opacity:0;transform:scale(.7);transition:opacity .45s var(--ease),transform .5s var(--ease);transition-delay:calc(250ms + var(--k) * 60ms)}
.js .is-in .sa-mx-c{opacity:1;transform:none}
.js .sa-sheet{opacity:0;transform:translateY(40%);transition:opacity .5s var(--ease) .5s,transform .7s var(--ease) .5s}
.js .is-in .sa-sheet{opacity:1;transform:none}

.js .fr-bar i::before{transform:scaleX(0);transition:transform .8s var(--ease);transition-delay:calc(250ms + var(--k) * 80ms)}
.js .is-in .fr-bar i::before{transform:scaleX(var(--v))}
.js .fr-seg{opacity:0;transition:opacity .5s var(--ease);transition-delay:calc(200ms + var(--k) * 90ms)}
.js .is-in .fr-seg{opacity:1}
.js .fr-c.is-q i{opacity:0;transform:scale(.6);transition:opacity .4s var(--ease) .45s,transform .5s var(--ease) .45s}
.js .is-in .fr-c.is-q i{opacity:1;transform:none}

.js .ag-kit-pages .so-slide{opacity:0;transform:translateY(10px) scale(.97);transition:opacity .55s var(--ease),transform .6s var(--ease);transition-delay:calc(300ms + var(--k) * 120ms)}
.js .is-in .ag-kit-pages .so-slide{opacity:1;transform:none}
.js .ag-rank-bar{transform:scaleX(0);transition:transform .9s var(--ease);transition-delay:calc(300ms + var(--k) * 150ms)}
.js .is-in .ag-rank-bar{transform:none}

.js .cs-dot{opacity:0;transform:scale(.4);transition:opacity .4s var(--ease),transform .5s var(--ease);transition-delay:calc(300ms + var(--k) * 200ms)}
.js .is-in .cs-dot{opacity:1;transform:none}

/* loops */
@keyframes so-grow-y{from{transform:scaleY(0)}}
@keyframes so-grow-x{from{transform:scaleX(0)}}
@keyframes so-blink{0%,48%{opacity:1}52%,100%{opacity:0}}
@keyframes so-ring{0%{opacity:.8;transform:scale(1)}70%,100%{opacity:0;transform:scale(1.18)}}
@keyframes ag-lang{0%,46%{opacity:1}50%,96%{opacity:0}100%{opacity:1}}
@keyframes ag-ind{0%,46%{transform:translateX(0)}50%,96%{transform:translateX(100%)}100%{transform:translateX(0)}}

@media (prefers-reduced-motion:no-preference){
  .sa-p,.fr-r,.cs-deck{animation:intro .7s var(--ease) both;animation-delay:calc(520ms + var(--r,0) * 160ms)}
  .sa-ppl .sa-p:nth-child(2){--r:1}
  .sa-ppl .sa-p:nth-child(3){--r:2}
  .sa-strip li i{animation:so-grow-y .6s var(--ease) both;animation-delay:.7s}
  .sa-caret{animation:so-blink 1.1s steps(1) infinite}
  .fr-tr-stats .is-chg::after{animation:so-ring 2.6s var(--ease) infinite}
  .ag-pitch .ag-l.is-en,.ag-lr.is-en::before{animation:ag-lang 9s linear infinite}
  .ag-pitch .ag-l.is-tr,.ag-lr.is-tr::before{animation:ag-lang 9s linear -4.5s infinite}
  .ag-seg-ind{animation:ag-ind 9s var(--flip) infinite}
  .ag-pin::after{animation:so-ring 2.4s var(--ease) infinite}
  .cs-meter i::before{animation:so-grow-x .9s var(--ease) both;animation-delay:.9s}
}

@media (prefers-reduced-motion:reduce){
  .js .sa-day,.js .sa-msgs > li,.js .sa-ladder li,.js .fr-vers > li,.js .fr-q,.js .ag-fl-list li,.js .ag-col,.js .ag-note,.js .cs-ag-list li,.js .cs-col,.js .cs-thread > *,.js .cs-nv-rows > div,
  .js .sa-mx-c,.js .sa-sheet,.js .fr-seg,.js .fr-c.is-q i,.js .ag-kit-pages .so-slide,.js .cs-dot{opacity:1;transform:none}
  .js .ag-rank-bar{transform:none}
  .js .fr-bar i::before{transform:scaleX(var(--v))}
}

@media (max-width:599px){
  .ui-title .so-ell{white-space:normal;text-overflow:clip}
}