/* =====================================================================================================
   assets/pg-os-pages.css · the four RIVET OS pages' own layouts (reset Round 2/4, lane page:os, 3 Nov 2026).
   Loaded LAST, after assets/pg-os.css (the OS theme, foundation lane), on /infinite-os-overview, /agents, /superstar
   and /license. Prefix osx-. Only what the theme does not already give: page compositions, the read states of the
   static IP figures, the agent roster tiles, the ceiling tool, the license proof and form frame.
   Rules as the theme: tokens only; magenta = the one decision + one insight per screen; one duo per viewport;
   cards on elev-1 with no border; nothing fixed to a bottom corner (the ElevenLabs widget).
   ===================================================================================================== */

/* ---------- 0. shared ---------- */
main.osx{ --osx-gap:clamp(24px, 3vw, 40px); }
main.osx .k-sec{ scroll-margin-top:calc(var(--header-h, 64px) + 64px); }
main.osx .os-scene{ scroll-margin-top:var(--header-h, 64px); }
main.osx .k-head{ margin-bottom:clamp(28px, 3.4vw, 48px); }
main.osx .k-head .t-lead{ max-width:44rem; }
main.osx .k-qa{ margin-top:clamp(24px, 3vw, 40px); max-width:48rem; }
main.osx .k-head .k-qa{ margin-top:20px; }
/* the authored mark icon (assets/ip/mark/infinite-icon.svg) as a mask, so it takes the ink */
.osx-mk{ display:inline-block; flex:none; width:24px; height:24px; background:currentColor;
  -webkit-mask:url("ip/mark/infinite-icon.svg") center / contain no-repeat; mask:url("ip/mark/infinite-icon.svg") center / contain no-repeat; }
/* two-column chapter: copy + figure (5/7), --flip puts the figure first on desktop */
.osx-two{ display:grid; gap:var(--osx-gap); align-items:center; }
@media (min-width:1024px){
  .osx-two{ grid-template-columns:minmax(0, 5fr) minmax(0, 7fr); gap:clamp(40px, 5vw, 80px); }
  .osx-two--flip > .osx-two__copy{ order:2; }
}
.osx-two__copy{ display:grid; gap:20px; align-content:start; }
.osx-two__copy .k-head{ margin-bottom:0; }
/* member proof line under a quote */
.osx-by{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.osx-by img{ width:48px; height:48px; border-radius:50%; object-fit:cover; flex:none; }
.osx-by > span{ display:grid; gap:2px; }
.osx-by b{ font:600 15px/1.3 var(--font-sans); }
.osx-by > span > span{ font:400 14px/1.4 var(--font-sans); color:var(--ink-muted); }
.osx-li{ margin-inline-start:auto; font:500 12px/1 var(--font-mono); letter-spacing:var(--track-label); text-transform:uppercase; color:var(--ink-muted); text-decoration:none; }
.osx-li:hover{ color:var(--ink); }
.osx-quote{ display:grid; gap:20px; padding:clamp(22px, 2.6vw, 32px); }
.osx-quote blockquote{ margin:0; }
.osx-quote blockquote p{ font:500 clamp(18px, 1.6vw, 21px)/1.5 var(--font-sans); quotes:"\201C" "\201D"; }
.osx-quote blockquote p::before{ content:open-quote; } .osx-quote blockquote p::after{ content:close-quote; }
.osx-src{ margin-top:16px; }

/* ---------- 1. /infinite-os-overview ---------- */
/* hero (clickup.com/brain): copy first on the black anchor, the operating view (K6, dark) full width below it, where
   the band turns cyan. Command aimed down (180deg): text only in the top part of the band (BRAND Command, anchor half). */
.os-hero__band.osx-hero{ --os-aim:180deg; --os-hold:46%; grid-template-columns:minmax(0, 1fr); min-height:0; gap:clamp(32px, 4vw, 56px); padding-bottom:clamp(20px, 3vw, 48px); }
@media (min-width:1024px){ .os-hero__band.osx-hero{ grid-template-columns:minmax(0, 1fr); } }
.osx-hero .os-hero__copy{ max-width:none; display:grid; gap:20px 64px; align-items:end; }
@media (min-width:1024px){
  .osx-hero .os-hero__copy{ grid-template-columns:minmax(0, 7fr) minmax(0, 5fr); }
  .osx-hero .os-hero__copy > .os-k, .osx-hero .os-hero__copy > .t-hero{ grid-column:1; }
  .osx-hero .os-hero__copy > .t-lead, .osx-hero .os-hero__copy > .k-acts, .osx-hero .os-hero__copy > .os-tools{ grid-column:2; }
  .osx-hero .os-hero__copy > .t-lead{ grid-row:1 / span 2; align-self:end; }
}
.osx-hero .os-hero__copy .t-hero{ max-width:15ch; }
.osx-hero__art{ width:100%; }
.osx-hero__art .pui{ width:100%; }
/* the board's feed card ends where its rows end (review P1-6): no empty card below the fold */
.osx-hero__art .pui-grid{ align-items:start; }
.osx-hero__art .pui-feed{ gap:16px; }
@media (max-width:767px){ .os-hero__band.osx-hero{ --os-aim:180deg; --os-hold:52%; } }
/* the eight models: island + the marks beside it */
.osx-models{ display:grid; gap:var(--osx-gap); align-items:start; }

.osx-models__fig{ min-width:0; }
.osx-models__fig .ipk{ background:var(--elev-1); box-shadow:inset 0 0 0 1px var(--elev-4); }
.osx-marks.ds-models{ gap:10px; }
.osx-marks .ds-model svg{ width:36px; height:36px; }
/* the island's own chips stay in the DOM (ip.js reads them) but the marks are the controls */
.osx-models .ipk__reads{ display:none; }
.osx-models .ipk__body{ padding-top:clamp(12px, 2vw, 20px); }
/* the marks stay mono: the island is where the read turns magenta (one insight per screen) */
.osx-marks .ds-model:is(:hover, :focus-visible, .is-on, [aria-pressed="true"], [aria-current]){ --ip-insight:var(--ds-ip); background:var(--elev-2); box-shadow:inset 0 0 0 1px var(--cyan); }
/* after the pinned scene: one line and the member who said it */
.osx-after__in{ display:grid; gap:var(--osx-gap); align-items:center; }
@media (min-width:1024px){ .osx-after__in{ grid-template-columns:minmax(0, 6fr) minmax(0, 6fr); } }
.osx-after .k-head{ margin-bottom:0; }
.osx-after .t-row{ max-width:22ch; }
/* Desert Camel: one stage read at a time */
.osx-readout{ min-height:4.8em; }
.osx-readout p{ font:400 var(--fs-lead, 18px)/1.55 var(--font-sans); color:var(--ink); max-width:34rem; }
.osx-readout p b{ font-weight:600; }
html.js .osx-readout p:not([data-os-first]):not([data-os-live]){ display:none; }
.osx-camel .ds-island__canvas{ min-height:300px; }
.osx-camel svg{ width:min(100%, 960px); max-width:none; }
.osx-stage{ transition:opacity var(--dur-quick) var(--ease-standard); }
.osx-stage circle:first-child{ transition:stroke-width var(--dur-quick) var(--ease-standard); }
[data-os-fig].is-reading .osx-stage{ opacity:.5; }
[data-os-fig].is-reading .osx-stage.is-on{ opacity:1; }
.osx-stage.is-on circle:first-child{ stroke-width:4; }
.osx-stage.is-on text{ fill:var(--ink) !important; }
/* AI-SCORE: copy beside the island */
@media (min-width:1024px){ .osx-two--score{ grid-template-columns:minmax(0, 4fr) minmax(0, 8fr); } }
/* AI-SCORE island on dark: the elev-1 card */
.osx-ipk{ background:var(--elev-1); box-shadow:inset 0 0 0 1px var(--elev-4); }
/* the "how it runs" chain: small light paper pages inside each step */
.osx-chain .os-step{ align-content:start; grid-template-rows:auto auto auto 1fr; }
.osx-mini{ display:grid; gap:10px; align-content:start; padding:16px; border-radius:10px; background:var(--white) !important; color:var(--black); }
.osx-mini__k{ font:500 10.5px/1.4 var(--font-mono); letter-spacing:var(--track-label); text-transform:uppercase; color:var(--slate); }
.osx-mini__t{ font:600 16px/1.35 var(--font-sans); letter-spacing:-0.005em; }
.osx-mini__rows{ display:grid; list-style:none; }
.osx-mini__rows li{ display:grid; grid-template-columns:minmax(0, 1fr) auto; gap:10px; padding:8px 0; box-shadow:inset 0 1px 0 var(--silver); font:400 13px/1.4 var(--font-sans); }
.osx-mini__rows b{ font:500 11.5px/1.4 var(--font-mono); color:var(--slate); white-space:nowrap; }
.osx-kpis{ display:grid; gap:8px; }
.osx-kpis > div{ display:flex; align-items:baseline; justify-content:space-between; gap:12px; padding:9px 12px; border-radius:8px; background:var(--ghost-white); }
.osx-kpis span{ font:400 13px/1.35 var(--font-sans); color:var(--slate); }
.osx-kpis b{ font:500 18px/1 var(--font-mono); font-variant-numeric:tabular-nums; }
/* the team view (full width, so the board reads) with its notes as one row under it */
.os-dash.osx-dash{ grid-template-columns:minmax(0, 1fr); }
@media (min-width:900px){ .osx-dash .os-notes{ grid-template-columns:repeat(3, minmax(0, 1fr)); gap:0 32px; } }
.osx-dash .os-dash__frame .pui-island{ margin:0; }
/* proof: the quote card beside four stats */
.osx-proof{ display:grid; gap:var(--osx-gap); align-items:stretch; }
@media (min-width:1024px){ .osx-proof{ grid-template-columns:minmax(0, 5fr) minmax(0, 7fr); } }
.osx-proof__quote{ display:grid; align-content:space-between; gap:28px; padding:clamp(24px, 3vw, 40px); }
.osx-proof__quote blockquote{ margin:0; }
.osx-proof__quote blockquote p{ font:500 clamp(18px, 1.7vw, 22px)/1.5 var(--font-sans); quotes:"\201C" "\201D"; }
.osx-proof__quote blockquote p::before{ content:open-quote; } .osx-proof__quote blockquote p::after{ content:close-quote; }
.osx-proof__logo{ display:block; height:28px; width:auto; filter:brightness(0) invert(1); opacity:.9; }
.osx-stats{ display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:clamp(12px, 1.6vw, 20px); margin:0; padding:0; list-style:none; }
.osx-stats li{ display:grid; align-content:space-between; gap:24px; min-height:170px; }
.osx-stats .k-stat__v{ font-size:clamp(2.25rem, 1.6rem + 2vw, 3.5rem); }
.osx-stats .k-stat__l{ font-size:15px; color:var(--ink-muted); }
/* the close: copy on the black anchor, the authored mark (outline, black) on the cyan side */
.osx-close{ --os-aim:115deg; }
@media (min-width:900px){ .osx-close.k-close__band{ grid-template-columns:minmax(0, 1fr) auto; } }
.osx-close .k-close__mark{ color:var(--black); }
@media (min-width:900px){ .osx-close .k-close__art .k-close__mark{ width:min(100%, 300px); } }
.osx-close .k-close__cap{ color:var(--black); }
.osx-close .k-close__art{ justify-items:center; }
.osx-close .k-close__copy .k-acts{ display:flex; flex-wrap:wrap; align-items:center; gap:12px 24px; }
.osx-closeqa{ margin-inline:auto; }
@media (max-width:899px){ .osx-close .k-close__art{ justify-items:start; } }
@media (max-width:767px){
  .osx-marks.ds-models--row{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .osx-marks.ds-models--row .ds-model{ grid-template-columns:32px minmax(0, 1fr); justify-items:stretch; gap:2px 12px; padding:12px; }
  .osx-marks.ds-models--row .ds-model svg{ grid-row:span 2; width:32px; height:32px; }
  /* a paper figure keeps its type legible: it scrolls sideways inside its island, the page never does */
  .osx-scroll .ds-island__canvas{ overflow-x:auto; overscroll-behavior-x:contain; place-items:start; }
  .osx-scroll .os-plate{ width:640px; max-width:none; }
}

/* ---------- 2. /agents ---------- */
/* the agent's icon tile, cut from its registered cover (assets/aw/RIVET-Cover-*-v41.webp: the tile sits at 586,148 · 92px) */
.osx-cov{ display:block; flex:none; width:48px; height:48px; border-radius:12px; background-color:var(--elev-2);
  background-repeat:no-repeat; background-size:521.7px auto; background-position:-305.7px -77.2px; box-shadow:inset 0 0 0 1px var(--elev-4); }
/* hero panel: the morning's runs (cyan = the agent's work done, gold = waiting for the person) */
.osx-runs{ width:100%; max-width:600px; justify-self:end; }
.osx-runs .os-panel__bar .k-status{ position:static; }
.osx-runs__list{ display:grid; list-style:none; }
.osx-runs__list li{ display:grid; grid-template-columns:48px minmax(0, 1fr) auto; gap:14px; align-items:center; padding:14px 0; box-shadow:inset 0 -1px 0 var(--elev-4); }
.osx-runs__list li:first-child{ padding-top:4px; }
.osx-runs__t{ display:grid; gap:2px; min-width:0; }
.osx-runs__t b{ font:600 15px/1.3 var(--font-sans); }
.osx-runs__t span{ font:400 13.5px/1.4 var(--font-sans); color:var(--ink-muted); }
.osx-pill{ display:inline-flex; align-items:center; gap:6px; height:26px; padding:0 10px; border-radius:var(--ds-pill, 999px); font:500 11px/1 var(--font-mono); letter-spacing:var(--track-label); text-transform:uppercase;
  color:var(--cyan); box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--cyan) 45%, transparent); white-space:nowrap; }
.osx-pill::before{ content:""; width:6px; height:6px; border-radius:50%; background:currentColor; }
.osx-pill--you{ color:var(--gold); box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--gold) 50%, transparent); }
.osx-runs__list li.is-you{ box-shadow:inset 0 -1px 0 var(--elev-4), inset 3px 0 0 var(--gold); padding-inline-start:14px; margin-inline-start:-14px; }
.osx-runs__you{ display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-top:16px; padding:14px 16px; border-radius:10px; background:var(--elev-2); }
.osx-runs__you p{ font:400 14px/1.45 var(--font-sans); color:var(--ink-muted); }
.osx-runs__you b{ color:var(--gold); font-weight:600; }
.osx-ui-btn{ display:inline-flex; align-items:center; height:36px; padding:0 14px; border-radius:var(--radius-button); background:var(--ui-primary); color:var(--on-ui-primary); font:600 14px/1 var(--font-sans); }
/* managed by people: the four gates */
.osx-gates{ display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:12px; list-style:none; }
.osx-gates li{ display:grid; gap:10px; align-content:start; min-height:150px; padding:20px; border-radius:var(--radius-card); background:var(--elev-2); box-shadow:inset 0 0 0 1px var(--elev-4); }
.osx-gates .os-ico{ width:24px; height:24px; color:var(--gold); }
.osx-gates__k{ font:500 11px/1.3 var(--font-mono); letter-spacing:var(--track-label); text-transform:uppercase; color:var(--gold); }
.osx-gates b{ font:600 18px/1.3 var(--font-sans); }
/* the levels: the ceiling tool beside the five-level ladder */
.osx-levels{ display:grid; gap:var(--osx-gap); align-items:start; }
@media (min-width:1024px){ .osx-levels{ grid-template-columns:minmax(0, 5fr) minmax(0, 7fr); } }
.osx-ceil{ display:grid; gap:18px; padding:clamp(20px, 2.6vw, 32px); border-radius:var(--radius-card); background:var(--elev-1); box-shadow:inset 0 0 0 1px var(--elev-4); }
.osx-ceil__row{ display:grid; gap:10px; }
.osx-ceil__top{ display:flex; justify-content:space-between; gap:12px; align-items:baseline; }
.osx-ceil__top label{ font:500 15px/1.3 var(--font-sans); }
.osx-ceil__top output{ font:500 12px/1.3 var(--font-mono); letter-spacing:var(--track-label); text-transform:uppercase; color:var(--ink-muted); }
.osx-ceil__row.is-bind .osx-ceil__top output{ color:var(--cyan); }
.osx-ceil input[type="range"]{ width:100%; height:28px; margin:0; accent-color:var(--cyan); cursor:pointer; }
.osx-ceil input[type="range"]:focus-visible{ outline:3px solid var(--focus-ring); outline-offset:2px; border-radius:6px; }
.osx-ceil__out{ display:grid; grid-template-columns:auto minmax(0, 1fr); gap:2px 18px; align-items:center; margin-top:6px; padding-top:20px; box-shadow:inset 0 1px 0 var(--elev-4); }
.osx-ceil__mark{ grid-row:span 3; --ds-level-w:88px; }
.osx-ceil__k{ font:500 11px/1.3 var(--font-mono); letter-spacing:var(--track-label); text-transform:uppercase; color:var(--ink-muted); }
.osx-ceil__v{ font:600 26px/1.15 var(--font-sans); letter-spacing:-0.01em; }
.osx-ceil__why{ font:400 14px/1.45 var(--font-sans); color:var(--ink-muted); }
.osx-ladder{ display:grid; list-style:none; }
.osx-ladder li{ display:grid; grid-template-columns:minmax(180px, 2fr) minmax(0, 3fr); gap:8px 24px; align-items:center; padding:18px 4px; box-shadow:inset 0 -1px 0 var(--elev-4); transition:background var(--dur-quick) var(--ease-standard); }
.osx-ladder li:first-child{ box-shadow:inset 0 1px 0 var(--elev-4), inset 0 -1px 0 var(--elev-4); }
.osx-ladder li p{ font:400 15px/1.5 var(--font-sans); color:var(--ink-muted); }
.osx-ladder li p b{ color:var(--ink); font-weight:600; }
.osx-ladder li[aria-current]{ background:var(--elev-1); border-radius:10px; padding-inline:16px; }
@media (max-width:640px){ .osx-ladder li{ grid-template-columns:minmax(0, 1fr); } }
/* roster */
.osx-tabs{ margin-bottom:24px; }
.osx-track{ display:grid; gap:20px; }
html.js .osx-track:not([data-os-first]):not([data-os-live]){ display:none; }
.osx-track__head{ display:flex; align-items:center; gap:20px; flex-wrap:wrap; padding:16px 20px; border-radius:var(--radius-card); background:var(--elev-2); }
.osx-track__head .ds-loc{ --ds-loc-w:150px; }
.osx-track__head > div{ display:grid; gap:4px; }
.osx-track__t{ font:600 18px/1.35 var(--font-sans); }
.osx-roster .os-agent{ background:var(--elev-2); }
.osx-roster .os-agent__top{ align-items:center; }
.osx-roster .ds-level{ --ds-level-w:40px; gap:10px; }
.osx-roster .ds-level__t b{ font-size:13px; }
.osx-roster .ds-level__t small{ font-size:10.5px; }
/* the eight models as links */
a.ds-model{ cursor:pointer; }
/* where they run */
.osx-where{ width:100%; }
.osx-ai{ display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:10px; list-style:none; }
.osx-ai li{ display:flex; align-items:center; gap:12px; padding:14px; border-radius:10px; background:var(--elev-2); }
.osx-ai img{ width:28px; height:28px; border-radius:6px; object-fit:contain; }
.osx-ai b{ font:600 15px/1.2 var(--font-sans); }
.osx-ai .osx-pill{ margin-inline-start:auto; }
.osx-where__k{ margin:22px 0 10px; }
.osx-mcp{ display:grid; grid-template-columns:auto minmax(0, 1fr) auto; gap:14px; align-items:center; margin-top:22px; padding:16px; border-radius:10px; box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--cyan) 35%, transparent); }
.osx-mcp .osx-mk{ color:var(--cyan); width:28px; height:28px; }
.osx-mcp p{ display:grid; gap:2px; }
.osx-mcp b{ font:600 15px/1.3 var(--font-sans); }
.osx-mcp p span{ font:400 13.5px/1.4 var(--font-sans); color:var(--ink-muted); }
@media (max-width:640px){ .osx-mcp{ grid-template-columns:auto minmax(0, 1fr); } .osx-mcp .os-dev{ grid-column:1 / -1; justify-self:start; } }
/* lessons */
.osx-lessons{ display:grid; gap:clamp(20px, 2.4vw, 32px); list-style:none; }
@media (min-width:768px){ .osx-lessons{ grid-template-columns:repeat(2, minmax(0, 1fr)); } }
.osx-lessons li{ display:grid; gap:14px; }
.osx-lessons .k-desk{ margin:0; }
.osx-lessons .k-desk img{ display:block; width:100%; height:auto; aspect-ratio:1300 / 621; object-fit:cover; object-position:top; }
.osx-lessons p{ display:grid; gap:2px; }
.osx-lessons b{ font:600 16px/1.3 var(--font-sans); }
.osx-lessons p span{ font:400 14px/1.45 var(--font-sans); color:var(--ink-muted); }
/* next in the library */
.osx-next .os-agent__top{ align-items:flex-start; }
/* the close's big level mark on the cyan side: black, no magenta */
.osx-bigmark{ --ds-level-w:min(260px, 60vw); --ds-level-at:var(--black); color:var(--black); }
.osx-bigmark .ds-level__arc, .osx-bigmark .ds-level__base{ stroke:var(--black); }
.osx-bigmark .ds-level__arc:not(.is-lit){ opacity:.25; }
.osx-track[hidden], [data-os-panel][hidden]{ display:none !important; }

/* ---------- 3. /superstar ---------- */
/* hero: one step read two ways (gold = the person, cyan = the agent) */
.osx-pair{ width:100%; max-width:640px; justify-self:end; }
.osx-pair .os-panel__bar .k-status{ position:static; }
.osx-pair__body{ display:grid; gap:12px; }
@media (min-width:640px){ .osx-pair__body{ grid-template-columns:repeat(2, minmax(0, 1fr)); } }
.osx-pair__lane{ display:grid; gap:8px; align-content:start; padding:18px; border-radius:10px; background:var(--elev-2); }
.osx-pair__lane .os-lane__k::before{ content:""; width:8px; height:8px; border-radius:50%; }
.osx-pair__lane--person .os-lane__k::before{ background:var(--gold); }
.osx-pair__lane--agent .os-lane__k::before{ background:var(--cyan); }
.osx-pair__t{ font:600 17px/1.3 var(--font-sans); }
.osx-pair__p{ font:400 14px/1.45 var(--font-sans); color:var(--ink-muted); }
.osx-checks, .osx-rubric{ display:grid; gap:8px; margin-top:8px; list-style:none; }
.osx-checks li{ display:grid; grid-template-columns:minmax(0, 1fr) auto; gap:4px 10px; align-items:center; font:500 12px/1.3 var(--font-mono); letter-spacing:.02em; color:var(--ink-muted); }
.osx-checks li i{ grid-column:1 / -1; height:6px; border-radius:3px; background:var(--elev-4); position:relative; overflow:hidden; }
.osx-checks li i::after{ content:""; position:absolute; inset:0 auto 0 0; width:var(--v); border-radius:inherit; background:var(--gold); }
[dir="rtl"] .osx-checks li i::after{ inset:0 0 0 auto; }
.osx-checks li.is-weak{ color:var(--ink); }
.osx-checks li.is-weak b{ grid-row:1; grid-column:2; font:500 10.5px/1 var(--font-mono); letter-spacing:var(--track-label); text-transform:uppercase; color:var(--gold); }
.osx-rubric li{ display:grid; grid-template-columns:18px minmax(0, 1fr); gap:10px; align-items:center; font:400 13.5px/1.4 var(--font-sans); }
.osx-rubric li::before{ content:""; width:14px; height:14px; border-radius:50%; box-shadow:inset 0 0 0 1.5px var(--cyan); }
.osx-rubric li.is-ok::before{ background:var(--cyan); box-shadow:none; }
.osx-rubric li.is-miss{ color:var(--ink); font-weight:600; }
/* the arc island */
.osx-star .ds-island__canvas{ padding:clamp(12px, 2vw, 28px); }
.osx-star .ds-island__canvas img{ border-radius:12px; max-width:1000px; }
.osx-duals{ display:grid; }
html.js .osx-duals > :not([data-os-first]):not([data-os-live]){ display:none; }
.osx-duals .os-lane__t{ font-size:20px; }
/* the two halves + the ascend glyph */
.osx-halves{ display:grid; gap:16px; }
@media (min-width:900px){ .osx-halves{ grid-template-columns:repeat(2, minmax(0, 1fr)); } }
.osx-half{ display:grid; gap:12px; align-content:start; padding:clamp(22px, 2.6vw, 32px); border-radius:var(--radius-card); background:var(--elev-2); }
.osx-half__k{ font:500 12px/1.3 var(--font-mono); letter-spacing:var(--track-label); text-transform:uppercase; color:var(--ink-muted); }
.osx-half__l{ font:500 clamp(36px, 4vw, 56px)/1 var(--font-mono); letter-spacing:.12em; color:var(--cyan); }
.osx-half + .osx-half .osx-half__l{ color:var(--purple-500, #7B87FF); }
.osx-half p:last-child{ font:400 16px/1.55 var(--font-sans); color:var(--ink-muted); max-width:44ch; }
.osx-climb{ grid-column:1 / -1; padding:clamp(20px, 2.4vw, 28px) 0 0; }
.osx-climb > .ds-shape{ --ds-shape-h:96px; color:var(--cyan); opacity:.85; }
.osx-climb p{ font:400 17px/1.55 var(--font-sans); color:var(--ink-muted); max-width:56ch; }
.osx-climb b{ color:var(--ink); font-weight:600; }
/* where you learn it */
.osx-learn .os-who__i{ grid-template-rows:auto auto 1fr auto; }
.osx-learn .k-link{ margin-top:6px; }
/* the close's ascend glyph on the cyan side */
.osx-bigshape{ --ds-shape-h:min(220px, 40vw); color:var(--black); }

/* ---------- 4. /license ---------- */
.osx-docs{ width:100%; max-width:560px; justify-self:end; }
.osx-docs .os-doc{ width:100%; }
.osx-doc__by{ font:500 10.5px/1.4 var(--font-mono); letter-spacing:var(--track-label); text-transform:uppercase; color:var(--slate); padding-top:12px; box-shadow:inset 0 1px 0 var(--silver); }
#deliver .os-doc{ justify-self:end; width:100%; }
.osx-figs{ display:grid; gap:var(--osx-gap); }
@media (min-width:1024px){ .osx-figs{ grid-template-columns:repeat(2, minmax(0, 1fr)); } }
.osx-figs .ds-island__canvas{ padding:clamp(12px, 1.6vw, 20px); min-height:0; }
.osx-figs .ds-island__canvas img{ border-radius:12px; }
.osx-steps .os-step__p a{ color:var(--cyan); text-underline-offset:3px; }
.osx-partner{ max-width:720px; justify-self:end; }
.osx-partner__logo{ display:block; height:32px; width:auto; filter:brightness(0) invert(1); }
/* the talk band: Command aimed down on phones; the form on elev-1, the copy on the anchor */
.osx-talkband{ --os-aim:105deg; --os-hold:44%; }
@media (max-width:1023px){ .osx-talkband{ --os-aim:180deg; --os-hold:62%; } }
.osx-talk__copy{ display:grid; gap:16px; align-content:start; }
.osx-talk__copy .k-qa{ margin-top:8px; }
.os-talk__form .rf.rfa__form{ --rf-ink:var(--white); --rf-muted:var(--slate-on-dark); --rf-line:var(--elev-4); --rf-line-strong:var(--slate); --rf-field:var(--elev-2); --rf-surface:var(--elev-2);
  --rf-focus:var(--focus-ring); margin:0; padding:0; }
.os-talk__form .rfa__title{ font:600 22px/1.25 var(--font-sans); }
.os-talk__form .rfa__k{ color:var(--slate-on-dark); }
main.osx .rf .btn{ display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:56px; padding:0 24px; border:0; border-radius:var(--radius-button);
  font:600 16px/1.1 var(--font-sans); text-decoration:none; cursor:pointer; transition:background-color var(--dur-instant) var(--ease-standard); }
main.osx .rf .btn--magenta{ background:var(--decision); color:var(--on-decision); }
main.osx .rf .btn--magenta:hover{ background:var(--magenta-600); }
main.osx .rf .btn .arr{ display:inline-block; }
[dir="rtl"] main.osx .rf .btn .arr{ scale:-1 1; }
main.osx .rfa__form .rf-consent a{ color:var(--white); }
@media (max-width:640px){
  .osx-runs__list li{ grid-template-columns:44px minmax(0, 1fr); gap:6px 12px; }
  .osx-runs__list .osx-cov{ grid-row:span 2; width:44px; height:44px; background-size:478.3px auto; background-position:-280.3px -70.8px; }
  .osx-runs__list .osx-pill{ grid-column:2; justify-self:start; }
}
/* phones: the close band's art would sit where the duo is still dark (aim 170deg), so the copy carries it alone */
@media (max-width:899px){ .osx-close .k-close__art{ display:none; } }