:root{--radius:16px;--radius-sm:10px;--maxw:1120px;--font-display:"SF Pro Display",-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;--font-body:-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;--font-mono:ui-monospace,"SF Mono","SFMono-Regular","Cascadia Code","Roboto Mono",Menlo,Consolas,monospace;--bg:#090E16;--bg-2:#0B111C;--panel:#111927;--panel-2:#141E2E;--panel-hi:#1A2537;--line:rgba(255,255,255,.075);--line-2:rgba(255,255,255,.15);--ink:#E9EEF5;--ink-2:#A7B4C4;--ink-3:#69788C;--brand:#39B8AC;--brand-soft:rgba(57,184,172,.14);--beacon:#63E6D9;--own:#39B8AC;--own-soft:rgba(57,184,172,.14);--own-line:rgba(63,195,182,.4);--green:#48C08B;--green-soft:rgba(72,192,139,.16);--amber:#E5AA3D;--amber-soft:rgba(229,170,61,.16);--indep:#39B8AC;--indep-soft:rgba(57,184,172,.14);--value:#E2A24C;--value-soft:rgba(226,162,76,.14);--shadow:0 1px 0 rgba(255,255,255,.03) inset, 0 24px 50px -30px rgba(0,0,0,.85);}
html[data-theme="cap-light"]{--bg:#ECE7DC;--bg-2:#F2EEE4;--panel:#FFFFFF;--panel-2:#F7F4EC;--panel-hi:#FFFFFF;--line:rgba(24,32,28,.10);--line-2:rgba(24,32,28,.18);--ink:#1C2620;--ink-2:#4C5A52;--ink-3:#7C8880;--brand:#177F76;--brand-soft:rgba(23,127,118,.12);--beacon:#177F76;--own:#177F76;--own-soft:rgba(23,127,118,.12);--own-line:rgba(18,119,110,.32);--green:#1E9A66;--green-soft:rgba(30,154,102,.13);--amber:#9A6410;--amber-soft:rgba(154,100,16,.14);--indep:#177F76;--indep-soft:rgba(23,127,118,.12);--value:#9A6410;--value-soft:rgba(154,100,16,.12);--shadow:0 1px 2px rgba(24,32,28,.04), 0 16px 34px -26px rgba(24,32,28,.4);}
@media print{html[data-theme]{--bg:#ECE7DC;--bg-2:#F2EEE4;--panel:#FFFFFF;--panel-2:#F7F4EC;--panel-hi:#FFFFFF;--line:rgba(24,32,28,.10);--line-2:rgba(24,32,28,.18);--ink:#1C2620;--ink-2:#4C5A52;--ink-3:#7C8880;--brand:#177F76;--brand-soft:rgba(23,127,118,.12);--beacon:#177F76;--own:#177F76;--own-soft:rgba(23,127,118,.12);--own-line:rgba(18,119,110,.32);--green:#1E9A66;--green-soft:rgba(30,154,102,.13);--amber:#9A6410;--amber-soft:rgba(154,100,16,.14);--indep:#177F76;--indep-soft:rgba(23,127,118,.12);--value:#9A6410;--value-soft:rgba(154,100,16,.12);--shadow:0 1px 2px rgba(24,32,28,.04), 0 16px 34px -26px rgba(24,32,28,.4);}}

/* capability.ai, look B ("the desk"). No colour is written here: every colour is a token. */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{font-family:var(--font-body);color:var(--ink);background-color:var(--bg);line-height:1.55;
  -webkit-font-smoothing:antialiased;letter-spacing:.005em;position:relative;min-height:100vh}
/* The system's page wash, held to the first screen. */
body::before{content:"";position:absolute;inset:0 0 auto 0;height:min(100vh,900px);z-index:0;pointer-events:none;
  background:radial-gradient(120% 70% at 50% -8%,var(--value-soft),transparent 58%),
    linear-gradient(180deg,var(--bg-2),var(--bg) 42%)}
body>*{position:relative;z-index:1}
/* Small accent text. On the light ground the teal and the gold are under 4.5:1, so there the words take ink and
   the accent moves to the rule beside them. Text of 24px and over keeps the accent. */
:root{--accent-text:var(--brand);--mark-text:var(--value)}
html[data-theme="cap-light"]{--accent-text:var(--ink);--mark-text:var(--ink-2)}
@media print{html[data-theme]{--accent-text:var(--ink);--mark-text:var(--ink-2)}}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:none;cursor:pointer}
svg{display:block}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 clamp(16px,4vw,40px)}
/* The skip link stands above the page until a keyboard reaches it. */
.skip{position:absolute;left:16px;top:12px;z-index:5;transform:translateY(-300%);background:var(--panel);
  color:var(--ink);padding:8px 14px;border:1px solid var(--line-2);border-radius:999px}
.skip:focus{transform:none}
a:focus-visible,button:focus-visible{outline:2px solid var(--brand);outline-offset:3px}

/* The bar and the footer: site furniture */
.bar{border-bottom:1px solid var(--line)}
.bar .wrap{display:flex;align-items:center;gap:26px;min-height:64px;flex-wrap:wrap;position:relative}
.wordmark{font-family:var(--font-display);font-weight:660;font-size:19px;letter-spacing:-.02em}
.wordmark span{color:var(--brand)}
.bar nav{margin-left:auto;display:flex;gap:26px;font-size:14.5px;color:var(--ink-2)}
.bar nav a:hover{color:var(--ink)}
.theme{width:36px;height:36px;border:1px solid var(--line-2);border-radius:999px;display:flex;
  align-items:center;justify-content:center;color:var(--ink-2)}
footer{border-top:1px solid var(--line);padding:40px 0 56px}
footer .wrap{display:flex;gap:26px;align-items:baseline;flex-wrap:wrap}
footer nav{display:flex;gap:22px;font-size:14px;color:var(--ink-2);flex-wrap:wrap}

/* Sections */
main>section{padding:clamp(52px,7vw,92px) 0;border-top:1px solid var(--line)}
main>section.hero,main>section.page{border-top:none}
main>section.hero{padding:0}
h1,h2{font-family:var(--font-display)}
main p a{text-decoration:underline;text-decoration-color:var(--brand);text-decoration-thickness:1px;
  text-underline-offset:4px}
main p a:hover{text-decoration-thickness:2px}

/* A link that stands on a line of its own, and the arrow drawn after it: three lines, and no character. */
.go{margin-top:8px;text-wrap:balance}
main p a.link{font-weight:600;font-size:17px;line-height:1.5;color:var(--accent-text);text-underline-offset:6px}
main p a.btn{display:inline-flex;align-items:center;gap:10px;background:var(--brand);color:var(--bg);
  border-radius:999px;padding:15px 26px;font-weight:600;font-size:16px;line-height:1.3;text-decoration:none}
html[data-theme="cap-light"] main p a.btn{color:var(--panel)}
.btn::after,.link::after,.door-name::after,.piece-title a::after{content:"";display:inline-block;flex:none;width:15px;height:11px;
  vertical-align:middle;
  background:linear-gradient(currentColor,currentColor) 0 50%/100% 1.6px no-repeat,
    linear-gradient(45deg,transparent calc(50% - .8px),currentColor calc(50% - .8px),currentColor calc(50% + .8px),transparent calc(50% + .8px)) 100% 0/5.5px 5.5px no-repeat,
    linear-gradient(135deg,transparent calc(50% - .8px),currentColor calc(50% - .8px),currentColor calc(50% + .8px),transparent calc(50% + .8px)) 100% 100%/5.5px 5.5px no-repeat}
.link::after,.door-name::after,.piece-title a::after{margin-left:9px;color:var(--brand)}

/* C1: the first screen. The thing she is handed lies open beside the words. */
.hero-b .wrap{min-height:clamp(560px,54vw,676px);display:grid;grid-template-columns:minmax(0,1.17fr) minmax(0,1fr);
  gap:clamp(24px,4vw,52px);align-items:center;padding-top:36px;padding-bottom:36px}
.hero-b h1{font-weight:600;font-size:clamp(17px,2vw,23px);line-height:1.32;letter-spacing:-.01em;
  color:var(--accent-text);display:flex;align-items:center;gap:12px}
.hero-b h1::before{content:"";width:26px;height:2px;background:var(--brand);flex:none}
.hero-b .thought{font-family:var(--font-display);font-weight:640;font-size:clamp(28px,2.82vw,36px);line-height:1.1;
  letter-spacing:-.024em;text-wrap:balance;margin-top:16px}
.hero-b .support{font-size:17.5px;line-height:1.5;color:var(--ink-2);max-width:34em;margin-top:22px}
.hero-b .go{margin-top:30px}
/* The picture: the standard's six domains as the standard's table, not as a contents list (the re-aim's Q3 fix).
   Two columns of three, run down the first column; heavy rules above and below; hairlines between cells; no fill, no
   box, no hover. The standard's numbers are drawn here, so no figure stands in the page's words. The week's mark is a
   note under the name: the name keeps its weight, and there is no bar at the edge. */
.desk{align-self:center}
.six-head{font-size:15.5px;line-height:1.4;font-weight:600;color:var(--ink);margin-bottom:10px;text-wrap:balance}
.six{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(3,auto);
  grid-auto-flow:column;border-top:2px solid var(--ink);border-bottom:2px solid var(--ink);counter-reset:domain}
.six li{counter-increment:domain;padding:13px 16px 15px 0;border-top:1px solid var(--line-2);font-size:18px;
  line-height:1.3;letter-spacing:-.008em}
.six li::before{content:counter(domain);display:block;font-family:var(--font-mono);font-size:12.5px;color:var(--ink-2);
  margin-bottom:5px;font-variant-numeric:tabular-nums}
.six li:nth-child(3n+1){border-top:0}
.six li:nth-child(-n+3){border-right:1px solid var(--line-2)}
.six li:nth-child(n+4){padding-left:16px;padding-right:0}
.six .mark{display:block;margin-top:7px;padding-left:14px;font-size:13.5px;line-height:1.35;color:var(--ink-2);
  letter-spacing:0;position:relative;text-wrap:balance}
.six .mark::before{content:"";position:absolute;left:0;top:.42em;width:8px;height:8px;border-radius:50%;background:var(--value)}

/* C2 and C4 to C7: a heading and what stands under it */
.blk-body{display:grid;gap:18px;max-width:46rem}
.blk h2,.doors h2{font-weight:640;font-size:clamp(24px,3vw,34px);line-height:1.14;letter-spacing:-.022em;
  text-wrap:balance;margin-bottom:6px}
.blk p,.blk li,.doors .lede{font-size:17px;line-height:1.6}
.list{list-style:none;display:grid;gap:10px}
.list li{position:relative;padding-left:24px}
.list li::before{content:"";position:absolute;left:0;top:.74em;width:12px;height:2px;background:var(--brand)}

/* C3: the three doors. One block; nothing outside it links to a door. */
.doors .wrap{display:grid;gap:14px}
.doors .lede{max-width:46rem}
.door-cards{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:14px}
.door-cards li{position:relative;display:flex;flex-direction:column;gap:12px;background:var(--panel);
  border:1px solid var(--line);border-top:3px solid var(--brand);border-radius:var(--radius-sm);
  padding:24px 22px 26px;box-shadow:var(--shadow)}
.door-cards li:hover{border-color:var(--brand)}
.door-name{font-family:var(--font-display);font-weight:640;font-size:21px;line-height:1.25;letter-spacing:-.015em}
main .door-name a{text-decoration:none}
.door-name a::after{content:"";position:absolute;inset:0}
.door-line{color:var(--ink-2);font-size:15.5px;line-height:1.5}

/* C8: this week. Gold marks what is current (the system's rule for capability.ai). */
.eyebrow{font-family:var(--font-mono);font-size:11px;letter-spacing:.24em;text-transform:uppercase;
  color:var(--mark-text);display:flex;align-items:center;gap:10px;margin-bottom:18px}
.eyebrow::before{content:"";width:22px;height:2px;background:var(--value);flex:none}
.piece{display:grid;gap:12px;max-width:54rem}
.piece .meta{font-family:var(--font-mono);font-size:12.5px;letter-spacing:.06em;color:var(--ink-2);
  font-variant-numeric:tabular-nums}
.piece-title{font-family:var(--font-display);font-weight:640;font-size:clamp(20px,2.5vw,27px);line-height:1.2;
  letter-spacing:-.015em}
/* The headline is the block's one link, and is drawn as one: underlined, with the arrow after its last word. */
main .piece-title a{text-decoration:underline;text-decoration-color:var(--brand);text-decoration-thickness:1px;
  text-underline-offset:5px}
main .piece-title a:hover{text-decoration-thickness:2px}

/* C9: the notice sign-up. A marked place, until its words are written. */
.slot-mark{font-family:var(--font-mono);font-size:12px;letter-spacing:.06em;color:var(--ink-2);
  border:1px dashed var(--line-2);border-radius:var(--radius-sm);padding:14px 16px;max-width:46rem}

/* C10 and every page's close: the association line, then (home and guide) the pointer, last */
.close .wrap,.page-close{display:grid;gap:12px}
.assoc,.credit{color:var(--ink-2);font-size:15.5px;line-height:1.55}
.pointer{font-size:17px;line-height:1.6;max-width:46rem}

/* Inner pages: a door, the guide, About, and the page for an address that is not found */
.page{padding:clamp(40px,6vw,72px) 0 clamp(52px,7vw,92px)}
.page .wrap{display:grid;gap:clamp(16px,2vw,22px)}
.page .wrap>*{max-width:46rem}
.page h1{font-weight:660;letter-spacing:-.028em;line-height:1.04;font-size:clamp(30px,4.6vw,52px);text-wrap:balance}
.page h2{font-weight:640;font-size:clamp(22px,2.6vw,30px);line-height:1.16;letter-spacing:-.02em;text-wrap:balance}
.page p,.page li{font-size:17px;line-height:1.6}
.page .part,.page-head{display:grid;gap:clamp(14px,1.8vw,18px)}
.page .part{padding-top:clamp(18px,2.6vw,30px)}
.door h1+p{font-size:clamp(18px,1.9vw,21px);line-height:1.5;color:var(--ink-2)}
.door h1+p+p{font-family:var(--font-display);font-weight:600;font-size:clamp(20px,2.3vw,25px);line-height:1.25;
  letter-spacing:-.012em}
.page .assoc,.page .credit{font-size:15.5px;line-height:1.55}
.page .assoc{padding-top:clamp(10px,1.6vw,18px)}
.page-head p:first-of-type{font-size:clamp(18px,1.9vw,21px);line-height:1.5}

/* The guide: the test's steps, the worked example, and the one-page case */
.steps{display:grid;padding-left:2.1em}
.steps li{padding:18px 0 18px 8px;border-top:1px solid var(--line)}
.steps li::marker{font-family:var(--font-mono);font-size:14px;color:var(--accent-text);font-variant-numeric:tabular-nums}
.steps li>p+p{margin-top:8px}
.page .steps .step-line{font-size:18px;line-height:1.45}
.steps .note{color:var(--ink-2)}
/* The table moves sideways in its own frame where it cannot fit. A shade at an edge shows there is more that way:
   it is drawn on the frame, and the table's own ground covers it at the end it has reached. No word says it. */
.table-wrap{overflow-x:auto;width:100%;
  background:linear-gradient(to right,var(--bg) 40%,transparent) 0 0/36px 100% no-repeat local,
    linear-gradient(to left,var(--bg) 40%,transparent) 100% 0/36px 100% no-repeat local,
    linear-gradient(to right,var(--line-2),transparent) 0 0/14px 100% no-repeat scroll,
    linear-gradient(to left,var(--line-2),transparent) 100% 0/14px 100% no-repeat scroll}
.worked-table{border-collapse:collapse;width:100%;min-width:600px;font-size:15px;line-height:1.35;
  font-variant-numeric:tabular-nums}
.worked-table th,.worked-table td{text-align:left;vertical-align:top;padding:10px 14px 10px 0;
  border-top:1px solid var(--line-2)}
.worked-table th{font-weight:600;color:var(--ink);background:var(--panel-2);padding-top:10px;padding-bottom:10px}
.worked-table th:first-child,.worked-table td:first-child{padding-left:10px}
.worked-table td:last-child,.worked-table th:last-child{font-weight:640;color:var(--ink);background:var(--amber-soft)}
.worked-table tr.total td{border-top:2px solid var(--ink-2);font-weight:640;color:var(--ink)}
.worked-table th:nth-child(n+3),.worked-table td:nth-child(n+3){text-align:right;padding-right:0;padding-left:14px}
.worked-table th:last-child,.worked-table td:last-child{padding-right:12px;padding-left:12px;white-space:nowrap}
.worked-table th:nth-last-child(2),.worked-table td:nth-last-child(2){padding-right:12px}
.page-head,.part,.page .wrap>*,.part>*,.page-head>*{min-width:0;max-width:100%}
@media (max-width:520px){figure.hours-chart{overflow-x:auto}figure.hours-chart svg{width:auto;min-width:560px}figure.hours-chart figcaption{position:sticky;left:0;max-width:calc(100vw - 32px)}}
.case{display:grid;gap:14px;padding-top:clamp(8px,1.4vw,14px)}
.case-head{display:flex;justify-content:flex-end}
.print{border:1px solid var(--line-2);border-radius:999px;padding:9px 18px;font-size:14px;font-weight:600}
.print:hover{border-color:var(--brand);color:var(--accent-text)}
.case-sheet{padding:clamp(22px,5%,44px);display:grid;gap:16px}
.case-title{font-family:var(--font-display);font-weight:640;line-height:1.25;letter-spacing:-.012em}
.page .case-title{font-size:clamp(18px,2vw,22px);line-height:1.25}
.case-parts{display:grid;gap:12px;padding-left:1.5em}
.page .case-parts li{font-size:16px;line-height:1.5}

@media (max-width:760px){
  .bar .wrap{gap:0 18px;padding-top:12px;padding-bottom:10px}
  .bar .theme{position:absolute;top:8px;right:clamp(16px,4vw,40px)}
  .bar nav{width:100%;margin-left:0;gap:20px;font-size:13.5px;padding-top:8px}
  .hero-b .wrap{grid-template-columns:1fr;align-items:start;padding-top:44px}
  .six li{font-size:16.5px}
  .door-cards{grid-template-columns:1fr}
  .steps{padding-left:1.7em}
  .worked-table{min-width:0;font-size:12px;line-height:1.3}
  .worked-table th,.worked-table td{padding:8px 8px 8px 0}
  .worked-table th:nth-child(n+3),.worked-table td:nth-child(n+3){padding-left:6px}
}
@media (max-width:380px){
  .worked-table{font-size:11px}
  .worked-table th,.worked-table td{padding:7px 5px 7px 0}
  .worked-table th:nth-child(n+3),.worked-table td:nth-child(n+3){padding-left:4px}
}
@media print{
  body::before,.bar,footer,.no-print,.skip{display:none!important}
  body{background:var(--panel)}
  main>section.page{padding:0;border:none}
  .page .wrap{max-width:none;padding:0}
  .page .wrap>*{max-width:none}
  .case-sheet{box-shadow:none;border:none;border-radius:0;padding:0}
  @page{size:A4;margin:16mm}
}

.domains{list-style:none;margin:28px 0 0;padding:0;counter-reset:domain}
.domains li{counter-increment:domain;padding:16px 0 18px;border-top:1px solid var(--line-2)}
.domains li:last-child{border-bottom:1px solid var(--line-2)}
.domains .dname{font-family:var(--font-display);font-size:20px;line-height:1.3;margin:0 0 6px}
.domains .dname::before{content:counter(domain) ".  ";font-family:var(--font-mono);font-size:13px;color:var(--ink-2)}
.domains .side{color:var(--ink-2);font-size:15.5px;margin:6px 0 0}
.domains .here{font-family:var(--font-mono);font-size:12.5px;margin:8px 0 0}
.editions{list-style:none;margin:14px 0 0;padding:0}
.editions li{padding:9px 0;border-top:1px solid var(--line-2)}
.series{font-family:var(--font-display);font-size:clamp(20px,2.2vw,23px);line-height:1.25;font-weight:640;letter-spacing:-.012em;margin:40px 0 6px;padding-top:14px;border-top:3px solid var(--brand)}
.editions .meta{display:block;font-family:var(--font-mono);font-size:12.5px;color:var(--ink-2)}

/* The MVP iteration (spec v1.27). Tokens only: no colour of its own. */
.hero-mvp .wrap{grid-template-columns:minmax(0,1fr);min-height:0;align-items:start;gap:clamp(20px,3vw,32px) clamp(24px,4vw,52px);
  padding-top:clamp(40px,6vw,76px);padding-bottom:clamp(36px,5vw,64px)}
.hero-mvp .crewline{margin:0;align-self:start}
@media (min-width:1024px){
  .hero-mvp .wrap{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);grid-template-areas:"words fig" "assoc fig";grid-template-rows:auto 1fr}
  .hero-mvp .words{grid-area:words}
  .hero-mvp .crewline{grid-area:fig;align-self:center}
  .hero-mvp .assoc{grid-area:assoc}
}
.hero-mvp .crewline-panels{grid-template-columns:1fr;gap:10px}
.hero-mvp .crewline svg{max-width:430px;margin-left:0}
.hero-mvp .assoc{align-self:start}
.hero-mvp .kicker{font-family:var(--font-mono);font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:var(--accent-text);
  display:flex;align-items:center;gap:12px}
.hero-mvp .kicker::before{content:"";width:26px;height:2px;background:var(--brand);flex:none}
.hero-mvp h1{display:block;font-family:var(--font-display);font-weight:640;font-size:clamp(30px,4vw,46px);line-height:1.08;
  letter-spacing:-.026em;text-wrap:balance;color:var(--ink);margin-top:16px}
.hero-mvp h1::before{content:none}
.hero-mvp .thought{font-size:clamp(19px,2vw,23px);font-weight:560;line-height:1.35;letter-spacing:-.012em;margin-top:18px}
.hero-mvp .go+.go{margin-top:14px}
.hero-mvp .assoc{margin-top:28px;max-width:40em}
.onsite .eyebrow{margin-bottom:14px}
.onsite-rows{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 36px;border-top:2px solid var(--ink)}
.onsite-rows li{padding:14px 0 16px;border-bottom:1px solid var(--line-2)}
.onsite-label{font-family:var(--font-display);font-weight:640;font-size:18px;line-height:1.3}
.onsite-label a{text-decoration:underline;text-decoration-color:var(--brand);text-underline-offset:5px}
.onsite-line{color:var(--ink-2);font-size:15.5px;line-height:1.5;margin-top:4px}
main>section.onsite{padding:clamp(28px,4vw,44px) 0}
main>section.blk-after-week{border-top:none;padding-top:0}
.week+.blk-after-week .blk-body{max-width:54rem}
.domain-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:28px 0 0}
.domain-cards li{border:1px solid var(--line);border-top:3px solid var(--brand);border-radius:var(--radius-sm);background:var(--panel);
  padding:20px 20px 22px;box-shadow:var(--shadow);display:grid;gap:8px;align-content:start}
.domain-cards li:last-child{border-bottom:1px solid var(--line)}
.domain-cards .dname::before{content:none}
.domain-cards .dname{font-size:19px;margin:0}
.domain-cards .side a,.domain-cards .here{color:var(--accent-text)}
.signup .wrap{display:grid;gap:14px}
.signup .wrap>*{max-width:46rem}
.signup-form{display:flex;flex-wrap:wrap;gap:10px 12px;align-items:center}
.signup-form label{flex:1 0 100%;font-weight:600;font-size:15.5px}
.signup-form input[type=email]{flex:1 1 16rem;font:inherit;padding:12px 16px;border:1px solid var(--line-2);border-radius:999px;
  background:var(--panel);color:var(--ink)}
.signup-form input:disabled{opacity:.7;cursor:not-allowed}
.signup-form button{background:var(--brand);color:var(--bg);border-radius:999px;padding:12px 24px;font-weight:600}
html[data-theme="cap-light"] .signup-form button{color:var(--panel)}
.signup-form .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

.pointer-label{font-family:var(--font-mono);font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--mark-text)}
.editions.picks{margin-bottom:6px}
.editions .domain{display:inline-block;margin-left:8px;font-family:var(--font-mono);font-size:12px;letter-spacing:.04em;color:var(--ink-2)}
.newsletter-page .eyebrow{margin-top:26px}
.record-page h2{margin-top:clamp(36px,5vw,56px)}
.record-page h2+.series{margin-top:16px}
.newsletter-page .signup{margin-top:10px}
@media (max-width:760px){.onsite-rows,.domain-cards{grid-template-columns:1fr}}

.crewline{margin:0;--cl-ink:var(--ink,#1c1a16);--cl-soft:var(--ink-2,#5a564e);--cl-line:var(--line,#c9c2b4);--cl-bg:var(--bg,#f2ead9);--cl-bg2:var(--bg-2,#ebe2cf);--cl-stay:var(--own,#14766f);--cl-crew:var(--ink-2,#5a564e)}
.crewline-panels{display:grid;grid-template-columns:1fr 1fr;gap:20px}
@media (max-width:719px){.crewline-panels{grid-template-columns:1fr;gap:16px}}
.crewline svg{display:block;width:100%;height:auto;max-width:560px;margin:0 auto}
.crewline svg text{font-family:var(--body,system-ui,-apple-system,"Segoe UI",sans-serif);fill:var(--cl-ink);font-size:12.5px}
.crewline .cl-title{font-size:15px;font-weight:650}
.crewline .cl-soft{fill:var(--cl-soft)}
.crewline .cl-small{font-size:11.5px}
.crewline .cl-halo{paint-order:stroke;stroke:var(--cl-bg);stroke-width:4px;stroke-linejoin:round}
.crewline .cl-axis{stroke:var(--cl-line);stroke-width:1.5;fill:none}
.crewline .cl-crew{fill:url(#cl-hatch);stroke:var(--cl-crew);stroke-width:1.25}
.crewline .cl-hump{fill:none;stroke:var(--cl-crew);stroke-width:2;stroke-dasharray:5 4;stroke-linejoin:round}
.crewline .cl-stay{fill:none;stroke:var(--cl-stay);stroke-width:5;stroke-linejoin:round;stroke-linecap:round}
.crewline .cl-flat{fill:none;stroke:var(--cl-soft);stroke-width:3;stroke-linejoin:round}
.crewline .cl-mark{fill:var(--cl-stay);stroke:var(--cl-bg);stroke-width:2}
.crewline .cl-marknum{fill:var(--cl-bg);font-size:11px;font-weight:700;text-anchor:middle}
.crewline .cl-tick{fill:var(--cl-crew)}
.crewline figcaption{margin-top:12px;font-size:14px;line-height:1.5;color:var(--cl-soft)}
.crewline .cl-alt{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.crewline figcaption a{color:var(--cl-ink);text-decoration-color:var(--cl-stay);text-underline-offset:3px}
.crewline--bgps{--cl-bg:var(--bg);}
.crewline--tcm{--cl-soft:var(--ink-soft);--cl-line:var(--rule);--cl-bg:var(--paper);--cl-bg2:var(--paper);--cl-stay:var(--own);--cl-crew:var(--ink-soft);margin:2rem 0}
.crewline--tcm .crewline-panels{grid-template-columns:1fr;gap:1rem}
.crewline--tcm svg text{font-family:var(--body)}

.crewline--capability{--cl-stay:var(--value);--cl-soft:var(--ink-2);--cl-line:var(--line-2);--cl-bg:var(--bg);--cl-bg2:var(--bg-2);--cl-crew:var(--ink-2);margin:26px 0 8px}
.crewline svg text{font-family:var(--font-body)}
/* The guide's two figures (style guide 6.2 and 7: C-S3 the hours chart, C-S4 the worksheet). Tokens only. */
.chip{display:inline-block;font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;border:1px solid var(--amber);border-radius:999px;padding:2px 10px;color:var(--ink);margin-right:8px}
figure.hours-chart,figure.worksheet{margin:26px 0 30px}
figure.hours-chart svg{display:block;width:100%;height:auto;max-width:720px}
figure.hours-chart svg text{font-family:var(--font-body);font-size:12px;fill:var(--ink-2)}
figure.hours-chart svg .hc-name{fill:var(--ink);font-size:12.5px}
figure.hours-chart svg .hc-total{font-weight:640}
figure.hours-chart svg .hc-val{font-family:var(--font-mono);font-size:11.5px;fill:var(--ink);font-variant-numeric:tabular-nums}
figure.hours-chart svg .hc-rel{fill:var(--brand)}
figure.hours-chart svg .hc-short{fill:url(#hc-hatch);stroke:var(--amber);stroke-width:1.25}
figure.hours-chart svg .hc-hatch-bg{fill:var(--panel)}
figure.hours-chart svg .hc-hatch-line{stroke:var(--amber);stroke-width:1.5}
figure.hours-chart svg .hc-notconf{fill:none;stroke:var(--brand);stroke-width:1.5;stroke-dasharray:3 2}
figure.hours-chart svg .hc-rule{stroke:var(--line-2);stroke-width:1.5;fill:none}
figure.hours-chart figcaption .source{display:block;margin-top:4px;font-size:13.5px}
figure.hours-chart figcaption,figure.worksheet figcaption{font-size:14px;line-height:1.5;color:var(--ink-2);margin-top:10px}
figure.worksheet .table-wrap{background:var(--panel);border:1px solid var(--line-2);border-radius:var(--radius-sm);padding:6px 4px}
.worksheet-table{border-collapse:collapse;width:100%;min-width:560px;font-size:14.5px;line-height:1.35;font-variant-numeric:tabular-nums}
.worksheet-table th,.worksheet-table td{text-align:left;vertical-align:top;padding:9px 12px;border-top:1px solid var(--line)}
.worksheet-table thead th{font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-weight:500;color:var(--ink-2);border-top:0}
.worksheet-table tbody th{font-weight:600;color:var(--ink)}
.worksheet-table td{color:var(--ink-2)}
.worksheet-table th:nth-child(n+4),.worksheet-table td:nth-child(n+4){text-align:right}

.glyph{display:block;width:32px;height:32px;color:var(--accent-text);flex:none}
.domain-cards li>.glyph{margin-bottom:2px}
.series .glyph{display:inline-block;vertical-align:-6px;margin-right:10px;width:24px;height:24px}
.onsite-label{display:flex;align-items:center;gap:10px}
.onsite-label .glyph{width:24px;height:24px}