:root{
  /* grounds, darkest to lightest */
  --abyss:#071B12; --green-deep:#0E3524; --green:#124A31; --green-raised:#1A5C3E;
  --sand:#EDE6D6; --sand-d:#E2D9C6; --soft:#F7F5EF; --paper:#FFFFFF;

  /* accents */
  --brass:#B98A3E; --brass-lt:#D4A85C;
  --mint:#63D9A0; --mint-d:#2E9E68; --mint-lt:#63D9A0;
  --clay:#C2564A; --pos:#2E7D4F; --neg:#A8473B; --grey:#9AA096;

  /* ink, on light */
  --ink:#1C231D; --mut:#67705F;
  --line:#E0DACC; --line-2:#D8CFBB;

  /* ink, on dark */
  --on-green:#B9D3C3; --dim:#8FB3A0; --dim-2:#587F6B;
  --line-green:#2A6647; --line-dark:#2A6647;

  --r:16px; --u:1px;
  --fd:"Bricolage Grotesque"; --fb:"Public Sans"; --fm:"IBM Plex Mono";
}

/* value drift between sections, resolved by scope rather than by edit */
.why,.pr{--line:#D8CFBB}
.cov{--mint:#2E9E68}
.arch{--line-green:#22523A}
.start{--line-green:#25563D;--green-raised:#17573B}
.ft{--line-green:#1D4331}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--soft);color:var(--ink);font-family:var(--fb);
  font-variant-numeric:tabular-nums;overflow-x:hidden}
a{color:inherit}
.disp{font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;
  letter-spacing:-.03em;line-height:1.03;margin:0}
.wrap{max-width:1320px;margin:0 auto;padding:0 26px}
.g{display:grid;grid-template-columns:repeat(12,1fr);gap:20px}

.b{display:inline-flex;align-items:center;justify-content:center;font-weight:600;
  border:1px solid transparent;text-decoration:none;cursor:pointer;white-space:nowrap;
  font-family:inherit;border-radius:var(--r)}
.b-sm{height:34px;padding:0 14px;font-size:13px}
.b-md{height:44px;padding:0 22px;font-size:14.5px}
.b-lg{height:52px;padding:0 30px;font-size:16px}
.b-full{width:100%}
.b-brass{background:var(--brass);color:#20180A}
.b-brass:hover{background:var(--brass-lt)}
.b-ink{background:var(--green);color:#fff}
.b-ink:hover{background:var(--green-raised)}
.b-line{border-color:var(--green);color:var(--green)}
.b-line:hover{background:var(--green);color:#fff}
.b-ondark{border-color:#4C8468;color:#fff}
.b-ondark:hover{border-color:var(--brass);color:var(--brass-lt)}
:focus-visible{outline:2px solid var(--brass);outline-offset:3px}

@media(max-width:640px){ .wrap{padding:0 18px} }

/* ===== header ===== */
.top{background:var(--green);position:sticky;top:0;z-index:60}
.top-in{display:flex;align-items:center;gap:26px;height:70px}
.lock{display:flex;align-items:center;gap:11px;text-decoration:none;white-space:nowrap}
/* Wordmark. API reads as an acronym, the subject carries the weight, and the
   prefix sizes in em so the whole lockup scales from footer to OG card from one
   font-size. Lighter brass, because the base brass goes muddy on green at 16px. */
.lock .wm{font-family:var(--fd);font-variation-settings:"wdth" 92;letter-spacing:-.02em;
  font-size:19px;line-height:1;color:#fff;display:inline-flex;align-items:baseline}
.lock .wm i{font-style:normal}
.lock .wm .a{font-weight:600;font-size:.74em;letter-spacing:.10em;margin-right:.16em;color:var(--brass-lt)}
.lock .wm .b{font-weight:600}
.ft .lock .wm{font-size:17px}   /* the footer lockup sits a touch smaller */
.nav{display:flex;gap:22px}
.nav a{color:var(--on-green);text-decoration:none;font-size:14.5px;font-weight:500;white-space:nowrap;padding:7px 0}
.nav a:hover{color:#fff}
.nav a.on{color:#fff;box-shadow:inset 0 -2px 0 var(--brass)}
.right{margin-left:auto;display:flex;align-items:center;gap:12px}
.quiet{color:var(--on-green);text-decoration:none;font-size:14.5px;font-weight:500;white-space:nowrap}
.burger{display:none;margin-left:auto;background:none;border:1px solid #4C8468;border-radius:var(--r);width:42px;height:42px;cursor:pointer;align-items:center;justify-content:center}
.burger i{display:block;width:16px;height:2px;background:#fff;position:relative}
.burger i::before, .burger i::after{content:"";position:absolute;left:0;width:16px;height:2px;background:#fff}
.burger i::before{top:-5px}
.burger i::after{top:5px}
.mnav{display:none;background:var(--green-raised)}
.mnav.open{display:block}
.mnav a{display:block;padding:14px 28px;color:var(--on-green);text-decoration:none;font-size:16px;border-top:1px solid var(--line-green)}
.mnav .cta{padding:16px 28px;display:flex;gap:10px;border-top:1px solid var(--line-green)}
@media(max-width:1100px){
.quiet{display:none}
}
@media(max-width:860px){
.nav, .right{display:none}
.burger{display:flex}
}

/* ===== .hero ===== */
.hero{background:var(--green);padding:74px 0 92px;position:relative;overflow:hidden}
.hero::after{content:"";position:absolute;inset:auto 0 0 0;height:1px;background:var(--line-green)}
.hero .hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:60px;align-items:center}
.hero h1{font-size:clamp(34px,4.4vw,58px);color:#fff;max-width:15ch}
.hero .lead{margin:22px 0 0;color:var(--on-green);font-size:18px;line-height:1.6;max-width:52ch}
.hero .cta{display:flex;gap:12px;margin-top:32px;flex-wrap:wrap}
.hero .note{margin:20px 0 0;color:#8FB3A0;font-size:13.5px}
.hero .race{background:var(--green-raised);border:1px solid var(--line-green);border-radius:var(--r);overflow:hidden}
.hero .race-head{display:flex;align-items:baseline;gap:14px;padding:16px 20px;border-bottom:1px solid var(--line-green);flex-wrap:wrap}
.hero .race-head b{font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;font-size:19px;color:#fff}
.hero .race-head span{color:#8FB3A0;font-size:13.5px}
.hero .replay{display:inline-flex;align-items:center;gap:6px;font-family:inherit;font-size:12px;font-weight:600;
  color:#8FB3A0;background:none;border:1px solid var(--line-green);border-radius:var(--r);
  padding:6px 12px;cursor:pointer;margin-left:10px}
.hero .replay:hover{color:var(--brass-lt);border-color:#6F5A2E}
.hero .race-head .tagr{margin-left:auto;font-size:11.5px;font-weight:600;color:var(--brass-lt);border:1px solid #6F5A2E;border-radius:var(--r);padding:5px 11px}
.hero .stage{position:relative;height:112px;overflow:hidden;background:linear-gradient(180deg,#1B6042 0%,#154E36 62%,#123F2C 100%)}
.hero .pan{position:absolute;inset:0 -320% 0 0;
  background:repeating-linear-gradient(90deg,transparent 0 92px,rgba(60,132,95,.55) 92px 93px);
}
.hero .race.go .pan{animation:pan 3.30s cubic-bezier(.12,.55,.22,1) .30s forwards}
@keyframes pan{to{transform:translateX(-660px)}}
.hero .turf{position:absolute;left:0;right:-320%;bottom:0;height:30px;background:#0F3D2A;border-top:1px solid #2E7A55;
  background-image:repeating-linear-gradient(90deg,transparent 0 46px,rgba(255,255,255,.045) 46px 48px);
}
.hero .race.go .turf{animation:turf 3.30s cubic-bezier(.12,.55,.22,1) .30s forwards}
@keyframes turf{to{transform:translateX(-900px)}}
.hero .post-track{position:absolute;inset:0;transform:translateX(62%)}
.hero .race.go .post-track{animation:postin 3.30s cubic-bezier(.12,.55,.22,1) .30s forwards}
@keyframes postin{to{transform:translateX(0)}}
.hero .post{position:absolute;top:0;bottom:0;left:63%;width:3px;background:var(--brass);border-radius:2px}
.hero .post::after{content:"";position:absolute;top:6px;left:-4px;width:11px;height:11px;border-radius:4px;background:var(--brass)}
.hero .field{position:absolute;left:16px;right:16px;bottom:26px;height:60px}
.hero .cap{position:absolute;left:2%;transform:translateX(calc(var(--from) * var(--u)));will-change:transform}
.hero .race.go .cap{animation:run var(--dur) cubic-bezier(.16,.5,.28,1) .30s forwards}
@keyframes run{
  0%  {transform:translateX(calc(var(--from) * var(--u)))}
  55% {transform:translateX(calc(var(--mid)  * var(--u)))}
  100%{transform:translateX(calc(var(--end)  * var(--u)))}
}
.hero .bob{display:block;filter:drop-shadow(0 2px 3px rgba(0,0,0,.38))}
.hero .race.go .bob{animation:bob var(--bd) ease-in-out .30s 15 alternate both}
@keyframes bob{to{transform:translateY(-3.5px)}}
.hero .sh{position:absolute;bottom:-7px;left:1px;height:5px;border-radius:50%;
  background:rgba(0,0,0,.30);filter:blur(1px)}
.hero .race.go .sh{animation:sh var(--bd) ease-in-out .30s 15 alternate both}
@keyframes sh{to{transform:scaleX(.78);opacity:.55}}
.hero .field{transition:none}
.hero .race.go .field{animation:fieldout .6s ease 3.55s forwards}
@keyframes fieldout{to{opacity:0}}
.hero .mk-dim{position:absolute;inset:0;z-index:40;background:rgba(12,48,33,.72);opacity:0}
.hero .race.go .mk-dim{animation:fadein .7s ease 3.55s forwards}
.hero .market{position:absolute;inset:0;z-index:41;opacity:0}
.hero .race.go .market{animation:fadein .7s ease 3.55s forwards}
.hero .market svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.hero .fillp{fill:url(#mkg);opacity:0}
.hero .race.go .fillp{animation:fadein .9s ease 3.95s forwards}
.hero .spark{fill:none;stroke:var(--brass);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.hero .race.go .spark{animation:draw 1.2s cubic-bezier(.36,.1,.18,1) 3.75s forwards}
@keyframes draw{to{stroke-dashoffset:0}}
.hero .mk-end{position:absolute;right:2.2%;top:30.3%;width:9px;height:9px;margin:-4.5px -4.5px 0 0;
  border-radius:50%;background:var(--brass);box-shadow:0 0 0 4px rgba(185,138,62,.22);opacity:0}
.hero .race.go .mk-end{animation:fadein .4s ease 4.85s forwards}
.hero .mk-lab{position:absolute;font-size:11.5px;font-family:var(--fm);color:var(--brass-lt);
  white-space:nowrap;opacity:0}
.hero .race.go .mk-lab{animation:fadein .5s ease 4.5s forwards}
.hero .mk-lab.l{left:16px;top:50%;transform:translateY(-190%)}
.hero .mk-lab.r{right:22px;top:30.3%;transform:translateY(-190%)}
@keyframes fadein{to{opacity:1}}
.hero .res{border-top:1px solid var(--line-green)}
.hero .res-row{display:flex;align-items:center;gap:14px;padding:11px 20px;border-bottom:1px solid var(--line-green);
  opacity:0;transform:translateY(5px)}
.hero .race.go .res-row{animation:rowin .55s cubic-bezier(.2,.7,.3,1) forwards}
.hero .race.go .res-row:nth-child(1){animation-delay:3.05s}
.hero .race.go .res-row:nth-child(2){animation-delay:3.18s}
.hero .race.go .res-row:nth-child(3){animation-delay:3.30s}
.hero .race.go .res-row:nth-child(4){animation-delay:3.42s}
@keyframes rowin{to{opacity:1;transform:none}}
.hero .pos{width:26px;height:26px;border-radius:var(--r);background:#12452F;color:#8FB3A0;display:grid;place-items:center;font-size:13px;font-weight:600;flex:0 0 auto}
.hero .res-row.win .pos{background:var(--brass);color:#20180A}
.hero .res-row .horse{font-size:15.5px;font-weight:600;color:#fff;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hero .res-row.win .horse{font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;font-size:18px}
.hero .res-row .jk{color:#8FB3A0;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hero .res-row .sp{margin-left:auto;font-family:var(--fm);font-size:14px;color:#fff;flex:0 0 auto}
.hero .res-row .silk{width:14px;height:14px;border-radius:5px;flex:0 0 auto}
.hero .race-foot{display:flex;gap:26px;padding:15px 20px;flex-wrap:wrap;opacity:0}
.hero .race.go .race-foot{animation:fadein .55s ease 5.05s forwards}
.hero .race-foot div b{display:block;font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;font-size:19px;color:#fff;line-height:1}
.hero .race-foot div span{display:block;font-size:11.5px;color:#8FB3A0;margin-top:5px}
@media (prefers-reduced-motion:reduce){
.hero .race.go *{animation:none!important}
.hero .race.go .cap{transform:translateX(calc(var(--end) * var(--u)))}
.hero .race.go .post-track{transform:none}
.hero .race.go .field{opacity:0}
.hero .race.go .market, .hero .race.go .mk-dim, .hero .race.go .mk-lab, .hero .race.go .mk-end, .hero .race.go .fillp, .hero .race.go .res-row, .hero .race.go .race-foot{opacity:1}
.hero .race.go .res-row{transform:none}
.hero .race.go .spark{stroke-dashoffset:0!important}
}
@media(max-width:980px){
.hero .hero-grid{grid-template-columns:1fr;gap:38px}
.hero{padding:52px 0 62px}
}
@media(max-width:860px){
.hero .stage{height:96px}
.hero .race-head b{font-size:17px}
.hero .res-row .jk{display:none}
}

/* ===== .strip ===== */
.strip{background:var(--green-deep);border-bottom:1px solid var(--line-green);padding:24px 0}
.strip .strip-in{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:28px;align-items:center}
.strip h2{font-size:20px;color:#fff;white-space:nowrap}
.strip .sub{margin:5px 0 0;font-size:13px;color:#7FA995;white-space:nowrap}
.strip .cmd{display:flex;align-items:center;gap:10px;min-width:0;height:54px;
  background:#092116;border:1px solid var(--line-green);border-radius:var(--r);padding:0 8px 0 16px}
.strip .cmd .scroller{flex:1 1 auto;min-width:0;overflow-x:auto;scrollbar-width:thin;
  scrollbar-color:#2A6647 transparent}
.strip .cmd .scroller::-webkit-scrollbar{height:5px}
.strip .cmd .scroller::-webkit-scrollbar-thumb{background:#2A6647;border-radius:99px}
.strip .cmd code{font-family:var(--fm);font-size:13px;line-height:54px;color:#A9C7B8;white-space:nowrap;display:block}
.strip .cmd .t-cmd{color:#fff}
.strip .cmd .t-url{color:#DDEAE3}
.strip .cmd .t-key{color:var(--brass-lt)}
.strip .copy{flex:0 0 auto;display:inline-flex;align-items:center;gap:7px;height:38px;padding:0 14px;
  font-family:inherit;font-size:13px;font-weight:600;color:#8FB3A0;cursor:pointer;
  background:none;border:1px solid var(--line-green);border-radius:var(--r)}
.strip .copy:hover{color:var(--brass-lt);border-color:#6F5A2E}
.strip .copy.done{color:#20180A;background:var(--brass);border-color:var(--brass)}
@media(max-width:1180px){
.strip .strip-in{grid-template-columns:1fr auto;gap:18px 24px}
.strip .cmd{grid-column:1 / -1;order:3}
}
@media(max-width:700px){
.strip .strip-in{grid-template-columns:1fr}
.strip h2{white-space:normal}
.strip .sub{white-space:normal}
.strip .b{width:100%}
}

/* ===== .freekey ===== */
.freekey{padding:100px 0 92px;background:var(--soft)}
.freekey .fk-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.12fr);gap:64px;align-items:start}
.freekey h2{font-size:clamp(27px,2.7vw,37px);max-width:17ch}
.freekey .lead{margin:20px 0 0;font-size:17.5px;line-height:1.62;color:var(--mut);max-width:52ch}
.freekey .spec{margin:38px 0 0;border-top:1px solid var(--line)}
.freekey .spec-row{display:flex;align-items:baseline;gap:20px;padding:16px 0;border-bottom:1px solid var(--line)}
.freekey .spec-row .t{flex:1 1 auto;min-width:0}
.freekey .spec-row b{display:block;font-size:15.5px;font-weight:600}
.freekey .spec-row span{display:block;font-size:13.5px;color:var(--mut);margin-top:3px}
.freekey .spec-row .v{flex:0 0 auto;font-family:var(--fm);font-size:13.5px;color:var(--brass);font-weight:500;white-space:nowrap}
.freekey .fk-cta{display:flex;gap:12px;margin-top:32px;flex-wrap:wrap}
.freekey .fk-note{margin:18px 0 0;font-size:13.5px;color:var(--mut)}
.freekey .panel{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.freekey .p-req{display:flex;align-items:center;gap:12px;background:#092116;padding:0 10px 0 16px;height:56px}
.freekey .p-req .m{flex:0 0 auto;font-family:var(--fm);font-size:12px;font-weight:500;color:#20180A;background:var(--brass);
  border-radius:10px;padding:4px 9px}
.freekey .p-req .u{flex:1 1 auto;min-width:0;overflow-x:auto;white-space:nowrap;font-family:var(--fm);font-size:13px;color:#DDEAE3;
  scrollbar-width:thin;scrollbar-color:#2A6647 transparent}
.freekey .p-req .u::-webkit-scrollbar{height:5px}
.freekey .p-req .u::-webkit-scrollbar-thumb{background:#2A6647;border-radius:99px}
.freekey .copy{flex:0 0 auto;display:inline-flex;align-items:center;gap:7px;height:36px;padding:0 13px;
  font-family:inherit;font-size:12.5px;font-weight:600;color:#8FB3A0;cursor:pointer;
  background:none;border:1px solid var(--line-green);border-radius:var(--r)}
.freekey .copy:hover{color:var(--brass-lt);border-color:#6F5A2E}
.freekey .copy.done{color:#20180A;background:var(--brass);border-color:var(--brass)}
.freekey .p-status{display:flex;align-items:center;gap:12px;background:#0C2C1E;border-top:1px solid var(--line-green);
  padding:11px 16px;font-family:var(--fm);font-size:12px;color:#7FA995}
.freekey .p-status .ok{color:#8FE0B0;border:1px solid #2A6647;border-radius:10px;padding:3px 9px}
.freekey .p-status .ms{margin-left:auto}
.freekey .p-body{background:#0A2519;padding:20px 18px 22px;max-height:520px;overflow:auto;
  scrollbar-width:thin;scrollbar-color:#2A6647 transparent}
.freekey .p-body::-webkit-scrollbar{width:7px}
.freekey .p-body::-webkit-scrollbar-thumb{background:#2A6647;border-radius:99px}
.freekey .p-body pre{margin:0;font-family:var(--fm);font-size:12.5px;line-height:1.85;color:#A9C7B8}
.freekey .k{color:#8FB3A0}
.freekey .s{color:#E4C77E}
.freekey .n{color:#93D6AE}
.freekey .bo{color:#D4A85C}
.freekey .nu{color:#6E8C7D}
.freekey .hl{background:rgba(185,138,62,.14);border-left:2px solid var(--brass);
  display:block;margin:0 -18px;padding:0 18px 0 16px}
.freekey .p-foot{display:flex;gap:10px;flex-wrap:wrap;padding:14px 16px;background:#092116;border-top:1px solid var(--line-green)}
.freekey .p-foot span{font-size:11.5px;font-weight:600;color:var(--brass-lt);border:1px solid #6F5A2E;
  border-radius:var(--r);padding:5px 11px}
.freekey .nums{margin-top:72px;border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(6,1fr)}
.freekey .nums div{padding:26px 22px 4px;border-right:1px solid var(--line)}
.freekey .nums div:first-child{padding-left:0}
.freekey .nums div:last-child{border-right:0}
.freekey .nums b{display:block;font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;
  letter-spacing:-.028em;font-size:34px;color:var(--green);line-height:1}
.freekey .nums span{display:block;margin-top:8px;font-size:12.5px;color:var(--mut)}
@media(max-width:1080px){
.freekey .fk-grid{grid-template-columns:1fr;gap:44px}
.freekey .nums{grid-template-columns:repeat(3,1fr);margin-top:56px}
.freekey .nums div{padding-left:22px}
.freekey .nums div:nth-child(3){border-right:0}
.freekey .nums div:nth-child(1), .freekey .nums div:nth-child(4){padding-left:0}
}
@media(max-width:640px){
.freekey{padding:64px 0 62px}
.freekey .nums{grid-template-columns:repeat(2,1fr)}
.freekey .nums div:nth-child(2n){border-right:0}
.freekey .nums div:nth-child(2n+1){padding-left:0}
.freekey .nums b{font-size:28px}
.freekey .fk-cta .b{width:100%}
}

/* ===== .anatomy ===== */
.anatomy{background:var(--green);color:#fff;padding:100px 0 96px;position:relative;isolation:isolate;overflow:hidden}
.anatomy::before{
  content:"";position:absolute;inset:-40px 0;z-index:-1;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220' viewBox='0 0 220 220'%3E%3Cg fill='none' stroke-width='8' stroke-linecap='round'%3E%3Cpath d='M36 86 Q22 26 55 26 Q88 26 74 86' stroke='%23ffffff'/%3E%3Cpath d='M146 196 Q132 136 165 136 Q198 136 184 196' stroke='%23B98A3E' transform='rotate(16 165 166)'/%3E%3C/g%3E%3C/svg%3E");
  background-size:220px 220px;
  opacity:.062;
  -webkit-mask-image:linear-gradient(180deg,#000 0%,rgba(0,0,0,.6) 22%,rgba(0,0,0,.18) 40%,rgba(0,0,0,.18) 78%,rgba(0,0,0,.5) 100%);
  mask-image:linear-gradient(180deg,#000 0%,rgba(0,0,0,.6) 22%,rgba(0,0,0,.18) 40%,rgba(0,0,0,.18) 78%,rgba(0,0,0,.5) 100%);
}
.anatomy h2{font-size:clamp(27px,2.7vw,37px);max-width:20ch}
.anatomy .lead{margin:20px 0 0;font-size:17.5px;line-height:1.62;color:var(--on-green);max-width:70ch}
.anatomy .lead b{color:var(--brass-lt);font-weight:600}
.anatomy .race-strap{display:flex;align-items:baseline;gap:14px;margin:52px 0 0;flex-wrap:wrap}
.anatomy .race-strap b{font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;font-size:22px}
.anatomy .race-strap span{color:var(--dim);font-size:14px}
.anatomy .race-strap .chip{margin-left:auto;font-size:11.5px;font-weight:600;color:var(--brass-lt);
  border:1px solid #6F5A2E;border-radius:var(--r);padding:5px 11px;white-space:nowrap}
.anatomy .anat{margin-top:26px;border-top:1px solid rgba(185,138,62,.45);
  display:grid;grid-template-columns:repeat(5,1fr)}
.anatomy .col{position:relative;padding:30px 22px 0;border-right:1px solid var(--line-green)}
.anatomy .col:first-child{padding-left:0}
.anatomy .col:last-child{border-right:0;padding-right:0}
.anatomy .node{position:absolute;top:-5px;left:0;width:9px;height:9px;border-radius:50%;background:var(--brass)}
.anatomy .col:first-child .node{left:0}
.anatomy .stage{margin:0;font-size:12px;color:var(--dim)}
.anatomy .col h3{margin:8px 0 0;font-size:19px}
.anatomy .count{display:inline-block;margin-top:11px;font-family:var(--fm);font-size:11.5px;color:var(--brass-lt)}
.anatomy dl{margin:16px 0 0}
.anatomy .f{display:flex;justify-content:space-between;gap:14px;padding:9px 0;border-top:1px solid rgba(42,102,71,.6)}
.anatomy .f dt{font-size:13px;color:var(--dim);white-space:nowrap}
.anatomy .f dd{margin:0;font-size:13px;color:#fff;text-align:right;font-family:var(--fm);
  min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.anatomy .f.hi{background:rgba(185,138,62,.11);margin:0 -10px;padding:9px 10px;border-radius:var(--r);border-top-color:transparent}
.anatomy .f.hi dt{color:var(--brass-lt)}
.anatomy .f.hi dd{color:var(--brass-lt)}
.anatomy .f.wide dd{font-size:12px}
.anatomy .anat-foot{display:flex;align-items:center;gap:22px;margin-top:44px;padding-top:26px;
  border-top:1px solid var(--line-green);flex-wrap:wrap}
.anatomy .anat-foot p{margin:0;font-size:16px;color:var(--on-green);max-width:58ch}
.anatomy .anat-foot p b{color:#fff;font-weight:600}
.anatomy .anat-foot .b{margin-left:auto}
@media(max-width:1180px){
.anatomy .anat{grid-template-columns:repeat(3,1fr)}
.anatomy .col{padding-left:22px;border-bottom:1px solid var(--line-green);padding-bottom:22px}
.anatomy .col:nth-child(3n){border-right:0}
.anatomy .col:nth-child(3n+1){padding-left:0}
.anatomy .col:last-child{padding-right:22px}
.anatomy .node{display:none}
}
@media(max-width:760px){
.anatomy{padding:64px 0 62px}
.anatomy .anat{grid-template-columns:1fr}
.anatomy .col{padding:24px 0;border-right:0}
.anatomy .col:first-child{padding-top:26px}
.anatomy .anat-foot .b{margin-left:0;width:100%}
}

/* ===== .why ===== */
.why{padding:74px 0 72px}
.why .hd{grid-column:span 6}
.why .hd h2{font-size:clamp(27px,2.7vw,37px);max-width:16ch}
.why .hd .kick{margin:14px 0 0;font-family:var(--fm);font-size:12.5px;color:var(--brass)}
.why .ld{grid-column:span 6;align-self:end}
.why .ld p{margin:0;font-size:16px;line-height:1.58;color:#4C5548;max-width:60ch}
.why .ld p b{color:var(--ink);font-weight:600}
.why .cmp{grid-column:span 12;margin-top:10px;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.why .cmp-head{display:flex;align-items:center;gap:12px;padding:13px 20px;background:var(--green-deep);flex-wrap:wrap}
.why .cmp-head b{font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;font-size:17px;color:#fff}
.why .cmp-head span{color:#8FB3A0;font-size:13px}
.why .cmp-head .id{margin-left:auto;font-family:var(--fm);font-size:11.5px;color:var(--brass-lt);white-space:nowrap}
.why .pair{display:grid;grid-template-columns:1fr 1fr;position:relative}
.why .side{padding:22px 22px 24px;display:flex;flex-direction:column}
.why .side.win{background:var(--green);color:#fff}
.why .side.lose{background:var(--paper)}
.why .side-top{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:16px}
.why .side h3{margin:0;font-size:21px}
.why .side .runs{font-size:12.5px;color:var(--mut)}
.why .side.win .runs{color:#9DC7B0}
.why .figrow{display:flex;align-items:center;gap:22px}
.why .ae{flex:0 0 auto;line-height:1}
.why .ae b{display:block;font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;
  letter-spacing:-.045em;font-size:64px;line-height:.86}
.why .ae span{display:block;margin-top:8px;font-family:var(--fm);font-size:11.5px;letter-spacing:.02em}
.why .side.win .ae b{color:var(--mint)}
.why .side.win .ae span{color:#9DC7B0}
.why .side.lose .ae b{color:var(--clay)}
.why .side.lose .ae span{color:var(--mut)}
.why .mini{flex:1 1 auto;min-width:0}
.why .mini div{display:flex;justify-content:space-between;gap:12px;padding:7px 0;font-size:13.5px}
.why .mini div + div{border-top:1px solid rgba(0,0,0,.09)}
.why .side.win .mini div + div{border-top-color:rgba(255,255,255,.14)}
.why .mini dt{color:var(--mut)}
.why .side.win .mini dt{color:#9DC7B0}
.why .mini dd{margin:0;font-family:var(--fm);font-weight:500}
.why .side.lose .mini .bad{color:var(--clay)}
.why .side.win .mini .good{color:var(--mint)}
.why .gapline{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;
  padding:13px 22px;background:var(--sand);border-top:1px solid var(--line)}
.why .gapline span{font-size:13.5px;color:#4C5548}
.why .gapline b{font-size:14.5px;font-weight:700;color:var(--ink)}
.why .gapline b em{font-style:normal;color:var(--brass)}
.why .axis{padding:20px 22px 22px;background:var(--paper);border-top:1px solid var(--line)}
.why .rail{position:relative;height:34px}
.why .rail::before{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:var(--line)}
.why .tick{position:absolute;left:50%;top:4px;bottom:4px;width:2px;background:var(--ink);transform:translateX(-1px)}
.why .cap{position:absolute;top:50%;height:12px;transform:translateY(-50%);border-radius:6px}
.why .cap.p{background:var(--green)}
.why .cap.n{background:var(--clay)}
.why .dot{position:absolute;top:50%;width:12px;height:12px;border-radius:50%;transform:translate(-50%,-50%);
  box-shadow:0 0 0 3px var(--paper)}
.why .dot.p{background:var(--mint)}
.why .dot.n{background:var(--clay)}
.why .axl{display:flex;justify-content:space-between;margin-top:9px;font-family:var(--fm);font-size:11.5px;color:var(--mut)}
.why .axl b{color:var(--ink);font-weight:500}
.why .defs{grid-column:span 6;margin-top:10px}
.why .def{display:flex;gap:14px;padding:13px 0;border-top:1px solid var(--line)}
.why .def:last-child{border-bottom:1px solid var(--line)}
.why .def code{flex:0 0 96px;font-family:var(--fm);font-size:13px;color:var(--brass);font-weight:500}
.why .def p{margin:0;font-size:13.5px;line-height:1.55;color:#4C5548}
.why .def p b{color:var(--ink);font-weight:600}
.why .pay{grid-column:span 6;margin-top:10px;background:#0A2519;border-radius:var(--r);overflow:hidden}
.why .pay-head{display:flex;align-items:center;gap:9px;padding:11px 15px;border-bottom:1px solid var(--line-green);
  font-family:var(--fm);font-size:11.5px;color:#7FA995}
.why .pay-head .m{color:#20180A;background:var(--brass);border-radius:9px;padding:3px 8px;font-weight:500}
.why .pay pre{margin:0;padding:15px;font-family:var(--fm);font-size:12px;line-height:1.7;color:#A9C7B8;overflow-x:auto}
.why .k{color:#8FB3A0}
.why .s{color:#E4C77E}
.why .n{color:#93D6AE}
.why .hl2{color:var(--mint)}
.why .hl3{color:#E8938A}
.why .strip{grid-column:span 12;margin-top:12px;display:flex;align-items:center;gap:16px;flex-wrap:wrap;
  background:var(--green-deep);border-radius:var(--r);padding:16px 20px}
.why .strip .t{color:#B9D3C3;font-size:14px;flex:0 0 auto}
.why .strip .t b{color:#fff;font-weight:600}
.why .chips{display:flex;gap:6px;flex-wrap:wrap;flex:1 1 auto;min-width:0}
.why .chip{font-family:var(--fm);font-size:11.5px;color:#CFE3D8;background:rgba(255,255,255,.07);
  border-radius:10px;padding:5px 9px;white-space:nowrap}
.why .strip .b{flex:0 0 auto}
@media(max-width:1080px){
.why .hd, .why .ld, .why .defs, .why .pay{grid-column:span 12}
.why .ld{align-self:start}
}
@media(max-width:780px){
.why{padding:56px 0 54px}
.why .pair{grid-template-columns:1fr}
.why .side.win{border-bottom:1px solid var(--line)}
.why .ae b{font-size:52px}
.why .figrow{gap:16px}
.why .strip{flex-direction:column;align-items:stretch}
.why .strip .b{width:100%}
}

/* ===== .cov ===== */
.cov{padding:74px 0 72px}
.cov .hd{grid-column:span 6}
.cov .hd h2{font-size:clamp(27px,2.7vw,37px);max-width:16ch}
.cov .ld{grid-column:span 6;align-self:end}
.cov .ld p{margin:0;font-size:16px;line-height:1.58;color:#4C5548;max-width:60ch}
.cov .ld p b{color:var(--ink);font-weight:600}
.cov .split{grid-column:span 12;margin-top:8px}
.cov .sbar{display:flex;height:56px;border-radius:var(--r);overflow:hidden}
.cov .sbar div{display:flex;align-items:center;padding:0 20px;color:#fff;min-width:0}
.cov .sbar .a{background:var(--green)}   /* width is set inline, from the data */
.cov .sbar .bq{background:var(--clay);flex:1 1 auto}
.cov .sbar b{font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;font-size:21px;white-space:nowrap}
.cov .sbar span{margin-left:10px;font-size:13px;opacity:.85;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cov .skey{display:flex;gap:24px;margin-top:11px;flex-wrap:wrap;font-size:13px;color:var(--mut)}
.cov .skey i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:7px;vertical-align:0}
.cov .skey .k1 i{background:var(--green)}
.cov .skey .k2 i{background:var(--clay)}
.cov .regs{grid-column:span 12;display:grid;grid-template-columns:repeat(5,1fr);gap:16px;margin-top:14px}
.cov .reg{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:17px 17px 16px;
  display:flex;flex-direction:column}
.cov .reg-top{display:flex;align-items:center;gap:9px;margin-bottom:12px}
.cov .code{font-family:var(--fm);font-size:11px;font-weight:500;padding:4px 7px;border-radius:9px;
  background:var(--sand);color:var(--mut)}
.cov .reg.full .code{background:#DCF0E5;color:var(--mint)}
.cov .reg.part .code{background:#F7E3E0;color:var(--clay)}
.cov .reg h3{margin:0;font-size:16px;line-height:1.15}
.cov .races{margin:0;font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;
  letter-spacing:-.035em;font-size:27px;line-height:1}
.cov .races em{font-style:normal;font-family:var(--fb);font-weight:400;font-size:12.5px;color:var(--mut);
  letter-spacing:0;margin-left:6px}
.cov .meter{height:6px;border-radius:3px;margin:13px 0 8px;overflow:hidden}
.cov .reg.full .meter{background:#DCF0E5}
.cov .reg.part .meter{background:#F7E3E0}
.cov .reg.thin .meter{background:#E8E6DF}
.cov .meter span{display:block;height:100%;border-radius:3px}
.cov .reg.full .meter span{background:var(--mint)}
.cov .reg.part .meter span{background:var(--clay)}
.cov .reg.thin .meter span{background:var(--grey)}
.cov .pct{margin:0;font-size:12px;color:var(--mut);line-height:1.35;min-height:32px}
.cov .fl{display:flex;gap:5px;margin-top:12px;padding-top:12px;border-top:1px solid var(--line);flex-wrap:wrap}
.cov .fl span{font-size:10.5px;font-weight:600;padding:4px 7px;border-radius:9px}
.cov .fl .on{background:#DCF0E5;color:var(--mint)}
.cov .fl .off{background:#F2F0EA;color:#A7ADA2}
.cov .note{grid-column:span 12;margin-top:14px;display:flex;align-items:center;gap:18px;flex-wrap:wrap;
  background:var(--green-deep);border-radius:var(--r);padding:18px 22px}
.cov .note p{margin:0;color:#B9D3C3;font-size:14.5px;line-height:1.5;max-width:74ch;flex:1 1 340px}
.cov .note p b{color:#fff;font-weight:600}
.cov .note code{font-family:var(--fm);font-size:13px;color:var(--brass-lt)}
@media(max-width:1180px){
.cov .regs{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:900px){
.cov .hd, .cov .ld{grid-column:span 12}
.cov .ld{align-self:start}
.cov .sbar{height:auto;flex-direction:column}
.cov .sbar div{padding:14px 18px;flex:1 1 auto!important}
.cov .sbar span{margin-left:8px}
}
@media(max-width:640px){
.cov{padding:56px 0 54px}
.cov .regs{grid-template-columns:repeat(2,1fr);gap:12px}
.cov .races{font-size:23px}
.cov .pct{min-height:0}
.cov .note .b{width:100%}
}

/* ===== .arch ===== */
.arch{background:var(--abyss);color:#fff;padding:88px 0 0;overflow:hidden}
.arch .arch-head{display:grid;grid-template-columns:repeat(12,1fr);gap:20px;align-items:end}
.arch .arch-head h2{grid-column:span 7;font-size:clamp(30px,4vw,54px);max-width:14ch}
.arch .arch-head .ld{grid-column:span 5}
.arch .arch-head .ld p{margin:0;font-size:16.5px;line-height:1.6;color:var(--dim);max-width:46ch}
.arch .arch-head .ld p b{color:#fff;font-weight:600}
.arch .readout{display:flex;align-items:baseline;gap:14px;margin-top:46px;padding-bottom:14px;
  border-bottom:1px solid var(--line-green);flex-wrap:wrap;min-height:46px}
.arch .readout .when{font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;font-size:22px;color:#fff}
.arch .readout .what{font-size:14px;color:var(--dim)}
.arch .readout .hint{margin-left:auto;font-family:var(--fm);font-size:11.5px;color:#4E7862;white-space:nowrap}
.arch .chart{position:relative;height:230px;margin-top:20px;display:flex;align-items:flex-end;gap:1px;
  padding:0 26px;cursor:crosshair}
.arch .bar{flex:1 1 auto;min-width:0;height:0;border-radius:2px 2px 0 0;
  transition:height .62s cubic-bezier(.2,.75,.3,1),opacity .2s ease}
.arch .bar.dim{opacity:.34}
.arch .years{display:flex;padding:0 26px;margin-top:10px;border-top:1px solid var(--line-green)}
.arch .years span{flex:1 1 0;padding:11px 0 0;font-family:var(--fm);font-size:11.5px;color:#4E7862;
  border-left:1px solid var(--line-green);padding-left:9px;opacity:0;transition:opacity .5s ease}
.arch .years span:first-child{border-left:0;padding-left:0}
.arch .years.on span{opacity:1}
.arch .figs{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;padding:56px 0 84px}
.arch .fig{opacity:0;transform:translateY(10px);transition:opacity .6s ease,transform .6s cubic-bezier(.2,.75,.3,1)}
.arch .figs.on .fig{opacity:1;transform:none}
.arch .fig b{display:block;font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;
  letter-spacing:-.045em;font-size:clamp(38px,4.6vw,66px);line-height:.92;color:var(--mint)}
.arch .fig span{display:block;margin-top:12px;font-size:14px;color:var(--dim);max-width:26ch}
.arch .fig:nth-child(2) b{color:#fff}
.arch .fig:nth-child(4) b{color:#fff}
.arch .arch-foot{display:flex;align-items:center;gap:18px;flex-wrap:wrap;
  border-top:1px solid var(--line-green);padding:26px 0 78px}
.arch .arch-foot p{margin:0;flex:1 1 320px;color:var(--dim);font-size:15px;line-height:1.55;max-width:64ch}
.arch .arch-foot p b{color:#fff;font-weight:600}
@media(max-width:980px){
.arch .arch-head h2, .arch .arch-head .ld{grid-column:span 12}
.arch .figs{grid-template-columns:repeat(2,1fr);gap:28px 20px;padding:44px 0 60px}
.arch .chart{height:170px}
.arch .readout .hint{display:none}
}
@media(max-width:600px){
.arch{padding-top:60px}
.arch .chart, .arch .years{padding:0 18px}
.arch .chart{height:130px}
.arch .years span:nth-child(2n){display:none}
.arch .arch-foot .b{width:100%}
}
@media (prefers-reduced-motion:reduce){
.arch .bar, .arch .fig, .arch .years span{transition:none!important}
}

/* ===== .eps ===== */
.eps{padding:74px 0 72px}
.eps .hd{grid-column:span 6}
.eps .hd h2{font-size:clamp(27px,2.7vw,37px);max-width:15ch}
.eps .ld{grid-column:span 6;align-self:end}
.eps .ld p{margin:0;font-size:16px;line-height:1.58;color:#4C5548;max-width:60ch}
.eps .ld p b{color:var(--ink);font-weight:600}
.eps .tally{grid-column:span 12;display:grid;grid-template-columns:repeat(4,1fr);
  background:var(--green-deep);border-radius:var(--r);overflow:hidden;margin-top:8px}
.eps .tally div{padding:20px 22px;border-right:1px solid var(--line-green)}
.eps .tally div:last-child{border-right:0}
.eps .tally b{display:block;font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;
  letter-spacing:-.04em;font-size:36px;line-height:1;color:#fff}
.eps .tally b.m{color:var(--mint)}
.eps .tally span{display:block;margin-top:8px;font-size:12.5px;color:#8FB3A0}
.eps .grid{grid-column:span 12;display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:14px}
.eps .grp{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:18px 18px 16px;
  display:flex;flex-direction:column}
.eps .grp header{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.eps .grp h3{margin:0;font-size:17px}
.eps .grp .n{margin-left:auto;font-family:var(--fm);font-size:12px;font-weight:500;color:#20180A;
  background:var(--sand);border-radius:9px;padding:4px 9px}
.eps .tag{font-size:10.5px;font-weight:700;letter-spacing:.02em;background:var(--brass);color:#20180A;
  border-radius:9px;padding:4px 8px}
.eps .grp ul{list-style:none;margin:0;padding:0;flex:1 1 auto}
.eps .grp li{padding:6px 0;border-top:1px solid var(--line)}
.eps .grp li:first-child{border-top:0;padding-top:0}
.eps .grp code{font-family:var(--fm);font-size:12.5px;color:#4C5548;white-space:nowrap;
  display:block;overflow:hidden;text-overflow:ellipsis}
.eps .grp code b{color:var(--ink);font-weight:600}
.eps .grp .more{margin:12px 0 0;padding-top:11px;border-top:1px solid var(--line);
  font-size:12.5px;color:var(--brass);font-weight:600}
.eps .grp.an{background:var(--green);border-color:var(--green)}
.eps .grp.an h3{color:#fff}
.eps .grp.an .n{background:rgba(255,255,255,.13);color:#CFE3D8}
.eps .grp.an li{border-top-color:rgba(255,255,255,.13)}
.eps .grp.an code{color:#B9D3C3}
.eps .grp.an code b{color:#fff}
.eps .grp.an code b{color:var(--mint)}
.eps .grp.an .more{border-top-color:rgba(255,255,255,.13);color:var(--brass-lt)}
.eps .foot{grid-column:span 12;margin-top:14px;display:flex;align-items:center;gap:18px;flex-wrap:wrap;
  border-top:1px solid var(--line);padding-top:24px}
.eps .foot p{margin:0;flex:1 1 340px;font-size:15px;line-height:1.55;color:#4C5548;max-width:70ch}
.eps .foot p b{color:var(--ink);font-weight:600}
@media(max-width:1080px){
.eps .grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:860px){
.eps .hd, .eps .ld{grid-column:span 12}
.eps .ld{align-self:start}
.eps .tally{grid-template-columns:repeat(2,1fr)}
.eps .tally div:nth-child(2){border-right:0}
.eps .tally div:nth-child(-n+2){border-bottom:1px solid var(--line-green)}
}
@media(max-width:620px){
.eps{padding:56px 0 54px}
.eps .grid{grid-template-columns:1fr}
.eps .tally b{font-size:29px}
.eps .foot .b{width:100%}
}

/* ===== .pr ===== */
.pr{padding:74px 0 72px}
.pr .hd{grid-column:span 6}
.pr .hd h2{font-size:clamp(27px,2.7vw,37px);max-width:16ch}
.pr .ld{grid-column:span 6;align-self:end}
.pr .ld p{margin:0;font-size:16px;line-height:1.58;color:#4C5548;max-width:60ch}
.pr .ld p b{color:var(--ink);font-weight:600}
.pr .tbar{grid-column:span 12;display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:6px}
.pr .tbar .say{font-size:14px;color:var(--mut)}
.pr .tbar .say b{color:var(--ink);font-weight:600}
.pr .toggle{margin-left:auto;display:inline-flex;background:var(--sand-d);border-radius:var(--r);padding:4px}
.pr .toggle button{font-family:inherit;font-size:13.5px;font-weight:600;border:0;background:none;color:var(--mut);
  padding:9px 18px;border-radius:12px;cursor:pointer;white-space:nowrap}
.pr .toggle button.on{background:var(--green);color:#fff}
.pr .plans{grid-column:span 12;display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin-top:6px}
.pr .plan{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:17px 16px 16px;
  display:flex;flex-direction:column;position:relative}
.pr .plan.pick{border-color:var(--brass);box-shadow:0 0 0 2px var(--brass)}
.pr .plan.an{background:var(--green);border-color:var(--green)}
.pr .ptop{display:flex;align-items:center;gap:10px}
.pr .silk{flex:0 0 auto;display:block}
.pr .plan h3{margin:0;font-size:17px}
.pr .plan.an h3{color:#fff}
.pr .tag{position:absolute;top:-9px;right:14px;font-size:10.5px;font-weight:700;background:var(--brass);
  color:#20180A;border-radius:9px;padding:4px 9px;white-space:nowrap}
.pr .pfor{margin:10px 0 0;font-size:12.5px;line-height:1.45;color:var(--mut);min-height:36px}
.pr .plan.an .pfor{color:#9DC7B0}
.pr .price{display:flex;align-items:baseline;gap:5px;margin-top:14px}
.pr .price b{font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;letter-spacing:-.04em;
  font-size:33px;line-height:1}
.pr .plan.an .price b{color:var(--mint)}
.pr .price i{font-style:normal;font-size:12.5px;color:var(--mut)}
.pr .plan.an .price i{color:#9DC7B0}
.pr .psub{margin:6px 0 0;font-size:11.5px;font-weight:600;color:var(--mint-d);min-height:17px}
.pr .plan.an .psub{color:var(--brass-lt)}
.pr .rows{margin:15px 0 0;border-top:1px solid var(--line)}
.pr .plan.an .rows{border-top-color:rgba(255,255,255,.15)}
.pr .rows div{display:flex;justify-content:space-between;gap:8px;padding:9px 0;border-bottom:1px solid var(--line);
  font-size:12px}
.pr .plan.an .rows div{border-bottom-color:rgba(255,255,255,.15)}
.pr .rows dt{color:var(--mut);flex:0 0 auto}
.pr .plan.an .rows dt{color:#9DC7B0}
.pr .rows dd{margin:0;text-align:right;font-family:var(--fm);font-size:11.5px;color:var(--ink);min-width:0}
.pr .plan.an .rows dd{color:#fff}
.pr .rows .no{color:#B3B8AE}
.pr .rows .yes{color:var(--mint-d);font-weight:500}
.pr .plan.an .rows .yes{color:var(--mint)}
.pr .plan .b{margin-top:16px}
.pr .foot{grid-column:span 12;margin-top:14px;display:flex;align-items:center;gap:18px;flex-wrap:wrap;
  background:var(--green-deep);border-radius:var(--r);padding:18px 22px}
.pr .foot p{margin:0;flex:1 1 340px;color:#B9D3C3;font-size:14.5px;line-height:1.55;max-width:74ch}
.pr .foot p b{color:#fff;font-weight:600}
@media(max-width:1180px){
.pr .plans{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:860px){
.pr .hd, .pr .ld{grid-column:span 12}
.pr .ld{align-self:start}
.pr .toggle{margin-left:0}
}
@media(max-width:640px){
.pr{padding:56px 0 54px}
.pr .plans{grid-template-columns:1fr}
.pr .pfor{min-height:0}
.pr .foot .b{width:100%}
}

/* ===== .start ===== */
.start{background:var(--green-deep);color:#fff;padding:76px 0 78px;border-top:2px solid var(--brass)}
.start .hd{grid-column:span 6}
.start .hd h2{font-size:clamp(27px,2.7vw,37px);max-width:15ch}
.start .ld{grid-column:span 6;align-self:end}
.start .ld p{margin:0;font-size:16.5px;line-height:1.6;color:var(--dim);max-width:56ch}
.start .ld p b{color:#fff;font-weight:600}
.start .steps{grid-column:span 12;display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:10px}
.start .step{background:var(--green);border:1px solid var(--line-green);border-radius:var(--r);
  padding:0;display:flex;flex-direction:column;text-decoration:none;transition:border-color .16s ease}
.start .step:hover{border-color:var(--brass)}
.start .step .req{display:flex;align-items:center;gap:9px;padding:12px 15px;border-bottom:1px solid var(--line-green);
  background:var(--abyss);border-radius:15px 15px 0 0}
.start .step .no{font-family:var(--fm);font-size:11.5px;font-weight:500;color:var(--brass);flex:0 0 auto}
.start .step .m{font-family:var(--fm);font-size:10.5px;font-weight:500;color:#20180A;background:var(--brass);
  border-radius:8px;padding:3px 7px;flex:0 0 auto}
.start .step .path{font-family:var(--fm);font-size:12px;color:#CFE3D8;white-space:nowrap;overflow:hidden;
  text-overflow:ellipsis;min-width:0}
.start .step .body{padding:16px 15px 17px;flex:1 1 auto;display:flex;flex-direction:column}
.start .step h3{margin:0;font-size:17px;color:#fff}
.start .step p{margin:8px 0 0;font-size:13.5px;line-height:1.5;color:var(--dim);flex:1 1 auto}
.start .step .go{margin-top:14px;font-size:13px;font-weight:600;color:var(--brass-lt)}
.start .step:hover .go{color:#fff}
.start .close{grid-column:span 12;margin-top:16px;display:flex;align-items:center;gap:22px;flex-wrap:wrap;
  border-top:1px solid var(--line-green);padding-top:30px}
.start .close .t{flex:1 1 380px}
.start .close .t b{display:block;font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;
  letter-spacing:-.03em;font-size:clamp(24px,2.4vw,33px);color:#fff}
.start .close .t span{display:block;margin-top:10px;font-size:15px;color:var(--dim);max-width:56ch}
.start .acts{display:flex;gap:12px;flex-wrap:wrap}
@media(max-width:1080px){
.start .steps{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:860px){
.start .hd, .start .ld{grid-column:span 12}
.start .ld{align-self:start}
}
@media(max-width:620px){
.start{padding:56px 0 58px}
.start .steps{grid-template-columns:1fr}
.start .acts{width:100%}
.start .acts .b{width:100%}
}

/* ===== .ft ===== */
.ft{background:var(--abyss);color:#fff;padding:56px 0 0}
.ft .ft-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:26px 20px}
.ft .brand{grid-column:span 4}
.ft .brand p{margin:16px 0 0;font-size:14px;line-height:1.6;color:var(--dim);max-width:36ch}
.ft .live{display:inline-flex;align-items:center;gap:9px;margin-top:20px;text-decoration:none;
  border:1px solid var(--line-green);border-radius:var(--r);padding:9px 14px;font-size:13px;color:#fff}
.ft .live:hover{border-color:var(--mint)}
.ft .pip{position:relative;width:8px;height:8px;border-radius:50%;background:var(--mint);flex:0 0 auto}
.ft .pip::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:1px solid var(--mint);
  opacity:.5;animation:ping 2.6s ease-out infinite}
@keyframes ping{0%{transform:scale(.6);opacity:.6}70%,100%{transform:scale(1.5);opacity:0}}
.ft .fresh{margin:14px 0 0;font-family:var(--fm);font-size:12px;color:var(--dim-2)}
.ft .fresh b{color:var(--brass-lt);font-weight:500}
.ft .col{grid-column:span 2}
.ft .col h4{margin:0 0 14px;font-size:13px;font-weight:600;color:#fff}
.ft .col a{display:block;font-size:13.5px;color:var(--dim);text-decoration:none;padding:5px 0;white-space:nowrap}
.ft .col a:hover{color:var(--brass-lt)}
.ft .regions{grid-column:span 12;margin-top:12px;padding-top:24px;border-top:1px solid var(--line-green);
  display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ft .regions .lab{font-size:13px;color:var(--dim);margin-right:4px}
.ft .regions span.r{font-family:var(--fm);font-size:11.5px;color:#CFE3D8;background:rgba(255,255,255,.06);
  border-radius:10px;padding:5px 9px}
.ft .regions span.r.thin{color:var(--dim-2)}
.ft .base{margin-top:30px;border-top:1px solid var(--line-green);padding:22px 0 34px;
  display:flex;gap:20px;flex-wrap:wrap;align-items:baseline}
.ft .base p{margin:0;font-size:12.5px;color:var(--dim-2);line-height:1.6;max-width:62ch}
.ft .base p b{color:var(--dim);font-weight:500}
.ft .base .legal{margin-left:auto;display:flex;gap:18px;flex-wrap:wrap}
.ft .base .legal a{font-size:12.5px;color:var(--dim-2);text-decoration:none;white-space:nowrap}
.ft .base .legal a:hover{color:var(--brass-lt)}
@media(max-width:1000px){
.ft .brand{grid-column:span 12}
.ft .col{grid-column:span 3}
}
@media(max-width:640px){
.ft{padding-top:44px}
.ft .col{grid-column:span 6}
.ft .base .legal{margin-left:0}
}
@media (prefers-reduced-motion:reduce){
.ft .pip::after{animation:none}
}

/* ===== 404 ===== */
.miss{background:var(--green);color:#fff;padding:120px 0 130px}
.miss h1{font-size:clamp(30px,3.4vw,44px);max-width:16ch}
.miss p{margin:18px 0 28px;color:var(--on-green);font-size:17px;max-width:52ch}

/* ============ inner pages ============ */
.phead{background:var(--green-deep);color:#fff;padding:58px 0 54px}
.phead .eyebrow{margin:0 0 14px;font-family:var(--fm);font-size:12px;letter-spacing:.08em;
  text-transform:uppercase;color:var(--brass-lt)}
.phead h1{font-size:clamp(30px,3.6vw,46px);max-width:18ch}
.phead .lead{margin:20px 0 0;font-size:17.5px;line-height:1.6;color:var(--on-green);max-width:64ch}
.phead .lead b{color:#fff;font-weight:600}
.phead .sub{margin:14px 0 0;font-family:var(--fm);font-size:13px;color:#7FA995}
.pbody{padding:56px 0 78px}
.pbody + .pbody{padding-top:0}
.band-sand{background:var(--sand)}
.band-soft{background:var(--soft)}
.band-deep{background:var(--green-deep);color:#fff}

.prose{max-width:72ch}
.prose h2{font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;
  letter-spacing:-.025em;font-size:24px;margin:44px 0 14px}
.prose h2:first-child{margin-top:0}
.prose h3{font-size:17px;margin:28px 0 8px}
.prose p{margin:0 0 15px;font-size:16px;line-height:1.65;color:#4C5548}
.prose p b,.prose strong{color:var(--ink);font-weight:600}
.prose ul{margin:0 0 18px;padding-left:20px}
.prose li{font-size:16px;line-height:1.65;color:#4C5548;margin-bottom:7px}
.prose :not(pre) > code{font-family:var(--fm);font-size:14px;background:var(--sand);border-radius:8px;padding:2px 6px}
.prose a{color:var(--green);text-decoration:underline;text-underline-offset:3px}
.prose .note{background:var(--sand);border-radius:var(--r);padding:18px 20px;margin:0 0 20px}
.prose .note p:last-child{margin-bottom:0}


/* ============ pricing ============ */
/* ---- hero: gradient and abstract geometry, no illustration ---- */
/**
 * The gradient hero, shared by pricing, free key, Labs and each Labs item.
 *
 * It used to carry padding:56px 0 0. That zero is only right on PRICING, where
 * the price strip is meant to sit flush against the bottom edge of the band.
 * Every other page that borrowed the gradient inherited a hero whose content
 * touched the edge.
 *
 * So the shared class behaves normally and the one special case overrides it,
 * rather than three pages each patching their way back to normal.
 */
.phead.grad{position:relative;overflow:hidden;padding:56px 0 54px;color:#fff;
  background:
    radial-gradient(900px 520px at 82% -16%, #1B6042 0%, rgba(27,96,66,0) 62%),
    radial-gradient(700px 460px at 8% 110%, #12563A 0%, rgba(18,86,58,0) 58%),
    linear-gradient(158deg, #0E3524 0%, #0A2719 100%)}
.p-pricing .phead.grad{padding-bottom:0}   /* the price strip sits flush */
.phead.grad .deco{position:absolute;inset:0;pointer-events:none;
  background-image:
    repeating-linear-gradient(115deg, rgba(255,255,255,.045) 0 1px, transparent 1px 26px),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='620' height='620' viewBox='0 0 620 620'%3E%3Cg fill='none' stroke='%23ffffff' stroke-width='1.2' opacity='.16'%3E%3Ccircle cx='430' cy='150' r='90'/%3E%3Ccircle cx='430' cy='150' r='150'/%3E%3Ccircle cx='430' cy='150' r='218'/%3E%3Ccircle cx='430' cy='150' r='292'/%3E%3C/g%3E%3Cg fill='none' stroke='%23B98A3E' stroke-width='1.6' opacity='.34'%3E%3Ccircle cx='430' cy='150' r='150'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat:repeat, no-repeat;
  background-position:0 0, right -120px top -170px;
  -webkit-mask-image:linear-gradient(180deg,#000 0%,rgba(0,0,0,.45) 70%,transparent 100%);
  mask-image:linear-gradient(180deg,#000 0%,rgba(0,0,0,.45) 70%,transparent 100%)}
.phead.grad-in{position:relative}
.eyebrow{margin:0 0 14px;font-family:var(--fm);font-size:12px;letter-spacing:.08em;
  text-transform:uppercase;color:var(--brass-lt)}
.phead.grad h1{font-size:clamp(31px,4vw,52px);max-width:16ch}
.phead.grad .lead{margin:20px 0 0;font-size:17.5px;line-height:1.6;color:var(--on-green);max-width:64ch}
.phead.grad .lead b{color:#fff;font-weight:600}

.ptoggle{display:flex;align-items:center;gap:14px;margin:34px 0 16px;flex-wrap:wrap}
.toggle{display:inline-flex;background:rgba(0,0,0,.26);border-radius:var(--r);padding:4px}
.toggle button{font-family:inherit;font-size:13.5px;font-weight:600;border:0;background:none;
  color:var(--on-green);padding:9px 18px;border-radius:12px;cursor:pointer}
.toggle button.on{background:var(--brass);color:#20180A}
.tnote{font-size:13.5px;color:#7FA995}

/* prices, up front */
.pstrip{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.pz{display:block;text-decoration:none;padding:18px 18px 16px;border-radius:var(--r);
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.10);
  transition:border-color .15s ease,background .15s ease}
.pz:hover{background:rgba(255,255,255,.10);border-color:rgba(255,255,255,.24)}
.pz.an{border-color:rgba(185,138,62,.55);background:rgba(185,138,62,.10)}
.pn{display:block;font-size:12.5px;color:var(--on-green);margin-bottom:10px}
.pv{display:flex;align-items:baseline;gap:5px}
.pv b{font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;
  letter-spacing:-.045em;font-size:34px;line-height:1;color:#fff}
.pz.an .pv b{color:var(--brass-lt)}
.pv i{font-style:normal;font-size:12px;color:#7FA995}
.pd{display:block;margin-top:10px;font-family:var(--fm);font-size:11px;color:#7FA995}

.hstat{display:grid;grid-template-columns:repeat(4,1fr);margin-top:40px;
  border-top:1px solid rgba(255,255,255,.14)}
.hstat div{padding:20px 22px 28px;border-right:1px solid rgba(255,255,255,.14)}
.hstat div:first-child{padding-left:0}
.hstat div:last-child{border-right:0}
.hstat b{display:block;font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;
  letter-spacing:-.04em;font-size:32px;line-height:1;color:#fff}
.hstat b.m{color:var(--mint)}
.hstat span{display:block;margin-top:8px;font-size:12.5px;color:#7FA995}

/* the free band, and its upsell */
.freeband{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:0;
  margin-top:32px;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);
  overflow:hidden}
.fb-l{padding:28px 30px}
.fb-tag{display:inline-block;font-family:var(--fm);font-size:11.5px;font-weight:500;
  background:#DCF0E5;color:var(--mint-d);border-radius:9px;padding:5px 10px}
.fb-l h3{margin:14px 0 12px;font-size:clamp(22px,2vw,29px)}
.fb-l p{margin:0;font-size:15.5px;line-height:1.62;color:#4C5548;max-width:56ch}
.fb-l p b{color:var(--ink);font-weight:600}
.fb-r{padding:28px 30px;background:var(--sand);border-left:1px solid var(--line)}
.fb-h{margin:0 0 12px;font-size:12.5px;font-weight:600;color:var(--clay);
  text-transform:uppercase;letter-spacing:.05em}
.fb-r ul{margin:0 0 18px;padding-left:18px}
.fb-r li{font-size:14px;line-height:1.55;color:#4C5548;margin-bottom:7px}

/* ---- sections ---- */
.sect{padding:64px 0}
.sect.sand{background:var(--sand)} .sect.soft{background:var(--soft)}
.sect.mid{background:var(--green);color:#fff}
.sect.deep{background:var(--green-deep);color:#fff}
.sect h2{font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;
  letter-spacing:-.028em;font-size:clamp(24px,2.4vw,33px);margin:0;max-width:22ch}
.sect.mid h2,.sect.deep h2{color:#fff}
.sect .say{margin:16px 0 0;font-size:16.5px;line-height:1.62;color:#4C5548;max-width:66ch}
.sect.mid .say,.sect.deep .say{color:var(--on-green)}
.sect .say b{color:var(--ink);font-weight:600}
.sect.mid .say b,.sect.deep .say b{color:#fff}

/* the two dials: one continuous track per plan, so an excluded zone reads as
   excluded rather than as empty space. One accent per dial, never mixed. */
.dials{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:32px}
.dial{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);
  padding:24px 26px 22px;position:relative;overflow:hidden}
.dial::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--mint-d)}
.dial.two::before{background:var(--brass)}
.dn{font-family:var(--fm);font-size:11.5px;letter-spacing:.07em;color:var(--brass)}
.dial h3{margin:9px 0 18px;font-size:21px}

.zh,.zr{display:grid;grid-template-columns:88px minmax(0,1fr) 92px;gap:12px;align-items:center}
.zh{grid-template-columns:88px repeat(3,1fr) 92px;gap:0}
.zh span{font-size:10.5px;line-height:1.25;color:var(--mut);text-align:center;padding:0 4px 10px}
.zh span:first-child,.zh span:last-child{padding:0}
.zh span em{display:block;font-style:normal;color:#A7ADA2;font-size:9.5px;margin-top:2px}
.zr{margin-bottom:8px}
.zn{font-size:13.5px;color:var(--ink);white-space:nowrap}
.zw{font-family:var(--fm);font-size:11px;color:var(--mut);text-align:right;white-space:nowrap}
.track{display:flex;height:30px;border-radius:9px;overflow:hidden}
.track i{flex:1;display:block}
.track i.on{background:var(--mint-d)}
.track i.off{background:repeating-linear-gradient(135deg,#EFECE4 0 5px,#E5E1D7 5px 10px)}
.track i + i{border-left:1px solid rgba(255,255,255,.55)}

.sh,.sr{display:grid;grid-template-columns:88px minmax(0,1fr);gap:12px;align-items:center}
.sh span{font-size:10.5px;color:var(--mut);padding-bottom:10px}
.sr{margin-bottom:8px}
.sv{display:block;height:30px;line-height:30px;border-radius:9px;
  background:repeating-linear-gradient(135deg,#EFECE4 0 5px,#E5E1D7 5px 10px);
  font-family:var(--fm);font-size:11.5px;color:#A7ADA2;text-align:center}
.sr.yes .sv{background:var(--brass);color:#20180A;font-weight:500}
.dfoot{margin:18px 0 0;font-size:13.5px;line-height:1.6;color:var(--mut)}

.saybar{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-top:16px}
.saybar .say{flex:1 1 420px}
.toggle.dark{margin-left:auto;background:var(--sand-d)}
.toggle.dark button{color:var(--mut)}
.toggle.dark button.on{background:var(--green);color:#fff}

/* icons: line work, one weight, never filled */
.ic{width:24px;height:24px;display:block}
.ic.sm{width:15px;height:15px;display:inline-block;vertical-align:-3px;margin-right:6px}
.pic{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;
  border-radius:12px;background:var(--sand);color:var(--green);margin-bottom:14px}
.plan.pick .pic{background:#F6EBD8;color:#8A6522}
.plan.an .pic{background:rgba(255,255,255,.10);color:var(--mint)}
.fic{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;
  border-radius:11px;background:var(--sand);color:var(--green);margin-bottom:13px}
.faq .ask{background:var(--green-deep);border-color:var(--green-deep)}
.faq .ask h3{color:#fff}
.faq .ask p{color:var(--on-green)}
.faq .ask .fic{background:rgba(255,255,255,.10);color:var(--brass-lt)}
.faq .ask .b{margin-top:6px}

/* plan cards: four across, and readable */
.plans{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:16px}
.plan{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);
  padding:24px 22px 22px;display:flex;flex-direction:column;position:relative}
.plan.pick{border-color:var(--brass);box-shadow:0 0 0 1px var(--brass)}
.plan.an{background:var(--green-deep);border-color:var(--green-deep)}
.plan.an h3{color:#fff}
.tag{position:absolute;top:-10px;left:22px;font-size:10.5px;font-weight:700;
  background:var(--brass);color:#20180A;border-radius:9px;padding:5px 10px;white-space:nowrap}
.plan h3{margin:0;font-size:23px}
.pfor{margin:10px 0 0;font-size:13.5px;line-height:1.5;color:var(--mut);min-height:42px}
.plan.an .pfor{color:#9DC7B0}
.price{display:flex;align-items:baseline;gap:6px;margin-top:18px}
.price b{font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;
  letter-spacing:-.045em;font-size:40px;line-height:1;color:var(--ink)}
.plan.an .price b{color:var(--mint)}
.price i{font-style:normal;font-size:13px;color:var(--mut)}
.plan.an .price i{color:#9DC7B0}
.psub{margin:8px 0 0;font-size:12px;font-weight:600;color:var(--mint-d);min-height:18px}
.plan.an .psub{color:var(--brass-lt)}
.rows{margin:18px 0 0;border-top:1px solid var(--line)}
.plan.an .rows{border-top-color:rgba(255,255,255,.16)}
.rows div{display:flex;justify-content:space-between;gap:10px;padding:11px 0;
  border-bottom:1px solid var(--line);font-size:13px}
.plan.an .rows div{border-bottom-color:rgba(255,255,255,.16)}
.rows dt{color:var(--mut)} .plan.an .rows dt{color:#9DC7B0}
.rows dd{margin:0;text-align:right;font-family:var(--fm);font-size:12.5px;color:var(--ink)}
.plan.an .rows dd{color:#fff}
.rows .no{color:#B3B8AE} .rows .yes{color:var(--mint-d);font-weight:500}
.plan.an .rows .yes{color:var(--mint)}
.plan .b{margin-top:20px}

/* included on every plan */
.inc{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:30px}
.inc article{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:20px}
.inc h3{margin:0 0 8px;font-size:16px}
.inc p{margin:0;font-size:14px;line-height:1.6;color:#4C5548}

/* the matrix */
.mx-tools{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:28px 0 14px}
.mx-tools input{flex:1 1 280px;height:46px;border:1px solid var(--line);border-radius:var(--r);
  padding:0 16px;font-family:inherit;font-size:14.5px;background:var(--paper);color:var(--ink)}
.mx-tools .cnt{font-family:var(--fm);font-size:13px;color:var(--mut)}
.mx-wrap{border:1px solid var(--line);border-radius:var(--r);background:var(--paper);overflow:hidden}
.mx-scroll{overflow-x:auto;max-height:620px;overflow-y:auto}
table.mx{border-collapse:collapse;width:100%;min-width:900px}
table.mx th,table.mx td{text-align:left;padding:10px 14px;font-size:13px;border-bottom:1px solid var(--line)}
table.mx thead th{position:sticky;top:0;background:var(--green-deep);color:#fff;font-weight:600;
  font-size:12.5px;white-space:nowrap;z-index:3}
table.mx thead th.pl{text-align:center}
table.mx tbody th{font-family:var(--fm);font-size:12.5px;font-weight:400;color:var(--mut);white-space:nowrap}
table.mx tbody th b{color:var(--ink);font-weight:600}
table.mx td.pl{text-align:center;font-family:var(--fm);font-size:11.5px;white-space:nowrap}
table.mx td.yes{color:var(--mint-d);background:#F2FAF6}
table.mx td.no{color:#C3C8BF}
table.mx tr.grp th{background:var(--sand);position:sticky;top:38px;z-index:2;
  font-family:var(--fb);font-weight:700;font-size:13.5px;color:var(--ink)}
table.mx tr.grp .n{float:right;font-family:var(--fm);font-weight:400;color:var(--mut)}
table.mx tr.an td.yes{background:#FBF4E6;color:#8A6522}
table.mx tr.hide{display:none}
.mx-key{display:flex;gap:22px;flex-wrap:wrap;margin-top:14px;font-size:13px;color:var(--mut)}
.mx-key i{display:inline-block;width:12px;height:12px;border-radius:4px;margin-right:8px;vertical-align:-1px}

/* faq */
.faq{display:grid;grid-template-columns:1fr 1fr;gap:16px 34px;margin-top:30px}
.faq article{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:20px}
.faq h3{margin:0 0 9px;font-size:16px}
.faq p{margin:0 0 10px;font-size:14.5px;line-height:1.62;color:#4C5548}
.faq p:last-child{margin:0}
.faq b{color:var(--ink);font-weight:600}

.close{display:flex;gap:22px;align-items:center;flex-wrap:wrap;margin-top:26px}
.close .t{flex:1 1 360px}
.acts{display:flex;gap:12px;flex-wrap:wrap}
@media(max-width:1180px){ .plans{grid-template-columns:repeat(2,1fr)} .pstrip{grid-template-columns:repeat(3,1fr)} }
@media(max-width:1040px){ .dials,.faq{grid-template-columns:1fr} .inc{grid-template-columns:1fr 1fr} }
@media(max-width:860px){ .freeband{grid-template-columns:1fr} .fb-r{border-left:0;border-top:1px solid var(--line)} }
@media(max-width:720px){
  .plans{grid-template-columns:1fr} .pstrip{grid-template-columns:repeat(2,1fr)}
  .inc{grid-template-columns:1fr} .toggle.dark{margin-left:0}
  .zh,.zr{grid-template-columns:74px minmax(0,1fr)} .zw{display:none}
  .zh{grid-template-columns:74px repeat(3,1fr)}
}

/* the endpoint matrix */
.mx-tools{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:16px}
.mx-tools input{flex:1 1 260px;height:44px;border:1px solid var(--line);border-radius:var(--r);
  padding:0 15px;font-family:inherit;font-size:14.5px;background:var(--paper);color:var(--ink)}
.mx-tools .cnt{font-family:var(--fm);font-size:13px;color:var(--mut)}
.mx-wrap{border:1px solid var(--line);border-radius:var(--r);background:var(--paper);overflow:hidden}
.mx-scroll{overflow-x:auto}
table.mx{border-collapse:collapse;width:100%;min-width:820px}
table.mx th,table.mx td{text-align:left;padding:10px 14px;font-size:13px;border-bottom:1px solid var(--line)}
table.mx thead th{position:sticky;top:0;background:var(--green-deep);color:#fff;font-weight:600;
  font-size:12.5px;white-space:nowrap;z-index:2}
table.mx thead th.pl{text-align:center}
table.mx tbody th{font-weight:500;font-family:var(--fm);font-size:12.5px;color:var(--ink)}
table.mx tbody th b{color:var(--green);font-weight:600}
table.mx td.pl{text-align:center;font-family:var(--fm);font-size:11.5px;white-space:nowrap}
table.mx td.yes{color:var(--mint-d);background:#F1FAF5}
table.mx td.no{color:#B3B8AE}
table.mx tr.grp th{background:var(--sand);font-family:var(--fb);font-weight:700;font-size:13.5px}
table.mx tr.grp .n{float:right;font-family:var(--fm);font-weight:400;color:var(--mut)}
table.mx tr.an td.yes{background:#EDF7F2}
.mx-key{display:flex;gap:20px;flex-wrap:wrap;margin-top:14px;font-size:12.5px;color:var(--mut)}
.mx-key i{display:inline-block;width:11px;height:11px;border-radius:3px;margin-right:6px;vertical-align:-1px}

/* feature rows above the matrix */
.feat{width:100%;border-collapse:collapse;background:var(--paper);
  border:1px solid var(--line);border-radius:var(--r);overflow:hidden;margin-bottom:22px}
.feat th,.feat td{padding:12px 16px;font-size:13.5px;border-bottom:1px solid var(--line);text-align:left}
.feat thead th{background:var(--green-deep);color:#fff;font-size:12.5px;white-space:nowrap}
.feat thead th:not(:first-child),.feat td:not(:first-child){text-align:center}
.feat tbody th{font-weight:500;color:var(--ink)}
.feat td{font-family:var(--fm);font-size:12.5px}

/* ============ data coverage ============ */
/* hero: a unit chart, one dot per thousand races, filling in on load */
.phead-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,420px);gap:48px;align-items:start}
/* min-width:0 because a grid child defaults to min-width:auto, which lets it
   size to its contents and push past its own track */
.unit{margin:6px 0 0;background:rgba(255,255,255,.05);border:1px solid var(--line-green);
  border-radius:var(--r);padding:18px;min-width:0;overflow:hidden}
.unit figcaption{display:flex;align-items:baseline;gap:10px;margin-bottom:14px;flex-wrap:wrap}
.unit .ttl{font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;
  font-size:16px;color:#fff}
.unit .sub{font-size:12px;color:#7FA995}
/* minmax(0,1fr), NOT 1fr.
   `1fr` is shorthand for `minmax(auto, 1fr)`, and the auto minimum of an item
   carrying aspect-ratio can resolve WIDER than the track — so twenty columns of
   dots grew past the panel and spilled out of its right edge. minmax(0,1fr)
   lets the track shrink to fit, which is what a dot grid needs. */
.dots{display:grid;grid-template-columns:repeat(20,minmax(0,1fr));gap:5px;
  min-width:0;width:100%}
.dots i{display:block;aspect-ratio:1/1;border-radius:50%;opacity:0;transform:scale(.4);
  animation:pop .5s cubic-bezier(.2,.8,.3,1) forwards;animation-delay:var(--d)}
.dots i.g{background:var(--mint)}
.dots i.c{background:#E0796C}
@keyframes pop{to{opacity:1;transform:none}}
.ukey{display:flex;gap:18px;flex-wrap:wrap;margin-top:16px;font-size:12.5px;color:#B9D3C3}
.ukey i{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:7px}
.ukey i.g{background:var(--mint)} .ukey i.c{background:#E0796C}

/* jurisdictions, as cards on the green so nothing sits bare on the ground */
.sect.mid{background:var(--green);color:#fff}
.sect.mid h2{color:#fff}
.sect.mid .say{color:#B9D3C3}
.sect.mid .say b{color:#fff}

.jgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:34px}
.jc{background:var(--paper);border-radius:var(--r);padding:18px 18px 16px;position:relative;
  overflow:hidden;display:flex;flex-direction:column}
.jc::before{content:"";position:absolute;left:0;right:0;top:0;height:4px}
.jc.full::before{background:var(--mint-d)}
.jc.part::before{background:var(--clay)}
.jc.thin::before{background:#9AA096}
.jc-top{display:flex;align-items:center;gap:9px;margin-bottom:11px}
.jc .code{font-family:var(--fm);font-size:11px;font-weight:500;padding:4px 8px;border-radius:9px;
  background:var(--sand);color:var(--mut)}
.jc.full .code{background:#DCF0E5;color:var(--mint-d)}
.jc.part .code{background:#F7E3E0;color:var(--clay)}
.jc .grade{margin-left:auto;font-size:11.5px;font-weight:600}
.jc.full .grade{color:var(--mint-d)}
.jc.part .grade{color:var(--clay)}
.jc.thin .grade{color:#9AA096}
.jc h3{margin:0;font-size:19px;line-height:1.15;min-height:44px}
.jc .big{margin:12px 0 0;font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;
  letter-spacing:-.035em;font-size:30px;line-height:1;color:var(--green)}
.jc.part .big{color:var(--clay)}
.jc .big em{font-style:normal;font-family:var(--fb);font-weight:400;font-size:12px;
  letter-spacing:0;color:var(--mut);margin-left:7px}
.jc .sm{margin:7px 0 0;font-size:12.5px;color:var(--mut)}
.jc .meter{height:6px;border-radius:3px;background:#EDEAE2;overflow:hidden;margin:14px 0 8px}
.jc .meter i{display:block;height:100%;border-radius:3px;background:var(--mint-d)}
.jc.part .meter i{background:var(--clay)}
.jc.thin .meter i{background:#9AA096}
.jc .pct{margin:0;font-size:11.5px;color:var(--mut);line-height:1.4;min-height:32px}
.jc .fl{display:flex;gap:5px;margin-top:auto;padding-top:12px;border-top:1px solid var(--line)}
.jc .fl span{font-size:10.5px;font-weight:600;padding:4px 8px;border-radius:9px}
.jc .fl .on{background:#DCF0E5;color:var(--mint-d)}
.jc .fl .off{background:#F2F0EA;color:#A7ADA2}

.mapkey{display:flex;gap:24px;flex-wrap:wrap;margin-top:20px;font-size:13.5px;color:#B9D3C3}
.mapkey i{display:inline-block;width:11px;height:11px;border-radius:3px;margin-right:8px;vertical-align:-1px}
.mapkey .k1 i{background:var(--mint-d)} .mapkey .k2 i{background:var(--clay)} .mapkey .k3 i{background:#9AA096}

/* the field grid — the point of the page */
.grid-wrap{margin-top:32px;background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r);overflow:hidden}
.grid-scroll{overflow-x:auto}
table.fx{border-collapse:collapse;width:100%;min-width:760px}
table.fx th,table.fx td{padding:11px 14px;font-size:13.5px;text-align:left;border-bottom:1px solid var(--line)}
table.fx thead th{background:var(--green-deep);color:#fff;font-size:12.5px;white-space:nowrap;
  position:sticky;top:0}
table.fx thead th:not(:first-child){text-align:center;font-family:var(--fm);font-size:12px}
table.fx tbody th{font-weight:500}
table.fx tbody th em{display:block;font-style:normal;font-size:12px;color:var(--mut);margin-top:2px}
table.fx td{text-align:center}
table.fx tr:hover td{background:#FBFAF6}
/* the cell carries the measured figure: a symbol would hide the one thing
   that makes this table worth publishing */
table.fx .cell{display:inline-block;min-width:52px;padding:5px 9px;border-radius:10px;
  font-family:var(--fm);font-size:12px;font-weight:500;text-align:center}
.cell{display:inline-block;min-width:52px;padding:5px 9px;border-radius:10px;
  font-family:var(--fm);font-size:12px;font-weight:500;text-align:center}
.cell.y{background:#DCF0E5;color:var(--mint-d)}
.cell.p{background:#FAEFDC;color:#8A6522}
.cell.n{background:#F2F0EA;color:#A7ADA2}
.fxkey{display:flex;gap:22px;flex-wrap:wrap;align-items:center;margin-top:16px;
  font-size:13px;color:var(--ink)}
.fxkey .cell{margin-right:9px}

/* absent */
.gone{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:32px}
.gone article{border:1px solid var(--line-green);border-radius:var(--r);padding:22px;background:var(--green)}
.gone h3{margin:0 0 10px;font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;
  font-size:18px;color:#fff}
.gone p{margin:0;font-size:14px;line-height:1.6;color:#B9D3C3}

/* caveats */
.cav{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:30px}
.cav article{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:20px}
.cav h3{margin:0 0 9px;font-size:16px}
.cav p{margin:0;font-size:14px;line-height:1.62;color:#4C5548}

/* close */
.close{display:flex;gap:22px;align-items:center;flex-wrap:wrap;margin-top:28px}
.close .t{flex:1 1 340px}
.acts{display:flex;gap:12px;flex-wrap:wrap}
.codebox{background:#0A2519;border-radius:var(--r);padding:16px 18px;margin-top:24px;
  font-family:var(--fm);font-size:13px;color:#A9C7B8;overflow-x:auto;white-space:nowrap}
.codebox b{color:var(--brass-lt);font-weight:500}

@media(max-width:1000px){
  .hstat{grid-template-columns:repeat(2,1fr)}
  .gone{grid-template-columns:1fr}
  .cav{grid-template-columns:1fr}
  .nav{display:none}
}

.sect{padding:64px 0}
.sect.sand{background:var(--sand)} .sect.soft{background:var(--soft)}
.sect.deep{background:var(--green-deep);color:#fff}
.sect h2{font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;
  letter-spacing:-.028em;font-size:clamp(24px,2.4vw,33px);margin:0;max-width:20ch}
.sect .say{margin:16px 0 0;font-size:16.5px;line-height:1.62;color:#4C5548;max-width:66ch}
.sect.deep .say{color:#B9D3C3}
.sect .say b{color:var(--ink);font-weight:600}
.sect.deep .say b{color:#fff}

/* the split */
.sbar{display:flex;height:62px;border-radius:var(--r);overflow:hidden;margin-top:30px}
.sbar div{display:flex;align-items:center;padding:0 22px;color:#fff;min-width:0}
.sbar .a{background:var(--green);flex:0 0 47.4%}
.sbar .b2{background:var(--clay);flex:1 1 auto}
.sbar b{font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;font-size:22px;white-space:nowrap}
.sbar span{margin-left:11px;font-size:13px;opacity:.85;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.skey{display:flex;gap:26px;margin-top:12px;flex-wrap:wrap;font-size:13.5px;color:var(--mut)}
.skey i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:8px}
.skey .k1 i{background:var(--green)} .skey .k2 i{background:var(--clay)}

.hstat{display:grid;grid-template-columns:repeat(4,1fr);margin-top:40px;border-top:1px solid var(--line-green)}
.hstat div{padding:20px 22px 26px;border-right:1px solid var(--line-green)}
.hstat div:first-child{padding-left:0}
.hstat div:last-child{border-right:0}
.hstat b{display:block;font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;
  letter-spacing:-.04em;font-size:32px;line-height:1;color:#fff}
.hstat b.m{color:var(--mint)}
.hstat span{display:block;margin-top:8px;font-size:12.5px;color:#7FA995}

.eyebrow{margin:0 0 14px;font-family:var(--fm);font-size:12px;letter-spacing:.08em;
  text-transform:uppercase;color:var(--brass-lt)}
.phead h1{font-size:clamp(30px,3.6vw,46px);max-width:17ch}
.phead .lead{margin:20px 0 0;font-size:17.5px;line-height:1.6;color:#B9D3C3;max-width:62ch}
.phead .lead b{color:#fff;font-weight:600}

@media(max-width:1100px){ .jgrid{grid-template-columns:repeat(3,1fr)} }
@media(max-width:1040px){ .phead-grid{grid-template-columns:1fr;gap:34px} .unit{max-width:460px} }
@media(max-width:820px){ .jgrid{grid-template-columns:repeat(2,1fr)} }
@media(max-width:720px){ .dots{grid-template-columns:repeat(16,minmax(0,1fr))} }
@media(max-width:480px){ .jgrid{grid-template-columns:1fr} .jc h3{min-height:0} .jc .pct{min-height:0} }
@media (prefers-reduced-motion:reduce){ .dots i{animation:none;opacity:1;transform:none} }




@media(max-width:900px){
  .cav{grid-template-columns:1fr}
  .st-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:600px){
  .phead{padding:44px 0 40px}
  .st-grid{grid-template-columns:1fr}
  .st-log time{flex-basis:auto}
}

/* ============ sign in and account ============ */
/* ---------- sign in ---------- */
.signin{min-height:560px;display:grid;place-items:center;padding:64px 26px;position:relative;
  overflow:hidden;color:#fff;
  background:
    radial-gradient(900px 520px at 80% -14%, #1B6042 0%, rgba(27,96,66,0) 62%),
    linear-gradient(158deg, #0E3524 0%, #0A2719 100%)}
.signin .deco{position:absolute;inset:0;pointer-events:none;
  background-image:
    repeating-linear-gradient(115deg, rgba(255,255,255,.04) 0 1px, transparent 1px 26px),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='620' height='620'%3E%3Cg fill='none' stroke='%23ffffff' stroke-width='1.2' opacity='.14'%3E%3Ccircle cx='430' cy='150' r='96'/%3E%3Ccircle cx='430' cy='150' r='162'/%3E%3Ccircle cx='430' cy='150' r='236'/%3E%3C/g%3E%3Cg fill='none' stroke='%23B98A3E' stroke-width='1.6' opacity='.3'%3E%3Ccircle cx='430' cy='150' r='162'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat:repeat,no-repeat;background-position:0 0,right -140px top -150px}
.sicard{position:relative;width:100%;max-width:440px;background:var(--paper);color:var(--ink);
  border-radius:var(--r);padding:34px 32px 28px}
.sicard .mark{margin-bottom:20px}
.sicard h1{font-size:27px;margin:0 0 10px}
.sicard .note{margin:0 0 20px;font-size:12.5px;color:var(--mut);background:var(--sand);
  border-radius:var(--r);padding:11px 14px;line-height:1.5}
.sicard .sub{margin:0 0 24px;font-size:15px;line-height:1.6;color:var(--mut)}
.sicard .b-white{height:52px;font-size:15.5px}
.after{margin-top:24px;padding-top:20px;border-top:1px solid var(--line)}
.after p{margin:0 0 10px;font-size:13px;color:var(--mut);line-height:1.55}
.after ol{margin:0;padding-left:18px}
.after li{font-size:13.5px;line-height:1.6;color:#4C5548;margin-bottom:5px}
.fineprint{margin:20px 0 0;font-size:12px;line-height:1.55;color:var(--mut)}
.fineprint a{text-decoration:underline;text-underline-offset:2px}

/* ---------- dashboard ---------- */
.dhead{background:var(--green-deep);color:#fff;padding:30px 0}
.dhead-in{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.dhead h1{font-size:26px}
.dhead .em{font-size:13.5px;color:#7FA995;font-family:var(--fm)}
.sout{color:var(--brass-lt);text-decoration:underline;text-underline-offset:3px}
.sout:hover{color:#fff}
.chips{margin-left:auto;display:flex;gap:9px;flex-wrap:wrap}
.chip{font-family:var(--fm);font-size:11.5px;padding:6px 11px;border-radius:var(--r);
  background:rgba(255,255,255,.09);color:var(--on-green);white-space:nowrap}
.chip.hi{background:var(--brass);color:#20180A;font-weight:500}

.dbody{padding:30px 0 70px}
.grid{display:grid;grid-template-columns:minmax(0,1fr) 372px;gap:22px;align-items:start}

.card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);
  padding:22px 24px;margin-bottom:20px}
.card:last-child{margin-bottom:0}
.card > h2{font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;
  letter-spacing:-.02em;font-size:18px;margin:0 0 4px}
.card > .hint{margin:0 0 18px;font-size:13.5px;color:var(--mut);line-height:1.55}

/* the key */
.keycard{border-color:var(--green);box-shadow:0 0 0 1px var(--green)}
.keyrow{display:flex;gap:10px;align-items:stretch;margin-bottom:12px}
.keyval{flex:1 1 auto;min-width:0;display:flex;align-items:center;height:52px;padding:0 16px;
  background:#0A2519;border-radius:var(--r);font-family:var(--fm);font-size:14px;color:#CFE3D8;
  overflow:hidden;white-space:nowrap;text-overflow:ellipsis;letter-spacing:.02em}
.keyval.masked{color:#6E8C7D}
.keymeta{display:flex;gap:20px;flex-wrap:wrap;font-size:12.5px;color:var(--mut)}
.keymeta b{color:var(--ink);font-weight:500;font-family:var(--fm);font-size:12px}

/* the things waiting */
.acts{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:20px}
.act{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:22px 24px;
  position:relative;overflow:hidden}
.act::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--mint-d)}
.act.warn::before{background:var(--brass)}
.act.bad::before{background:var(--clay)}
.act .ico{display:inline-flex;width:38px;height:38px;border-radius:11px;background:var(--sand);
  color:var(--green);align-items:center;justify-content:center;margin-bottom:13px}
.act.warn .ico{background:#F6EBD8;color:#8A6522}
.act.bad .ico{background:#F7E3E0;color:var(--clay)}
.act h3{font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;
  letter-spacing:-.02em;font-size:19px;margin:0 0 8px}
.act p{margin:0 0 16px;font-size:14px;line-height:1.6;color:#4C5548}
.act p b{color:var(--ink);font-weight:600}
.act code{font-family:var(--fm);font-size:12.5px;background:var(--sand);border-radius:8px;padding:2px 6px}

/* usage log */
.usebar{display:flex;align-items:flex-end;gap:3px;height:64px;margin:4px 0 16px}
.usebar i{flex:1;background:var(--green);border-radius:3px 3px 0 0;min-height:2px;position:relative}
.usebar i.today{background:var(--brass)}
.usedays{display:flex;justify-content:space-between;font-family:var(--fm);font-size:11px;
  color:var(--mut);margin-bottom:20px}

.log{border-top:1px solid var(--line)}
.day{padding:14px 0 4px;font-family:var(--fm);font-size:11.5px;color:var(--mut);
  letter-spacing:.04em;text-transform:uppercase}
.lrow{display:flex;align-items:center;gap:14px;padding:10px 0;border-bottom:1px solid var(--line)}
.lrow .ep{flex:1 1 auto;min-width:0;font-family:var(--fm);font-size:13px;color:var(--ink);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lrow .n{font-family:var(--fm);font-size:12.5px;color:var(--mut);flex:0 0 auto}
.lrow .tagx{font-size:11px;font-weight:600;padding:4px 9px;border-radius:10px;flex:0 0 auto}
.lrow .tagx.ok{background:#DCF0E5;color:var(--mint-d)}
.lrow .tagx.err{background:#F7E3E0;color:var(--clay)}
.lrow .tagx.up{background:#F6EBD8;color:#8A6522}

/* right rail */
.meter{height:8px;border-radius:4px;background:#EDEAE2;overflow:hidden;margin:14px 0 8px}
.meter i{display:block;height:100%;border-radius:4px;background:var(--mint-d)}
.meter i.hot{background:var(--brass)}
.big{font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;
  letter-spacing:-.04em;font-size:34px;line-height:1;margin:0}
.bigsub{margin:8px 0 0;font-size:13px;color:var(--mut)}
.kv{display:flex;justify-content:space-between;gap:12px;padding:11px 0;
  border-bottom:1px solid var(--line);font-size:13.5px}
.kv:last-of-type{border-bottom:0}
.kv dt{color:var(--mut)} .kv dd{margin:0;font-family:var(--fm);font-size:12.5px;text-align:right}
.planhead{display:flex;align-items:center;gap:11px;margin-bottom:6px}
.planhead .ico{display:inline-flex;width:36px;height:36px;border-radius:11px;background:var(--sand);
  color:var(--green);align-items:center;justify-content:center}
.planhead h2{margin:0}

/* modal */
.mask{position:fixed;inset:0;background:rgba(7,27,18,.62);display:none;place-items:center;
  padding:24px;z-index:90}
.mask.open{display:grid}
.modal{width:100%;max-width:520px;background:var(--paper);border-radius:var(--r);padding:28px 30px}
.modal h2{font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;
  font-size:22px;margin:0 0 10px}
.modal p{margin:0 0 14px;font-size:14.5px;line-height:1.62;color:#4C5548}
.modal .sum{background:var(--sand);border-radius:var(--r);padding:16px 18px;margin-bottom:16px}
.modal .sum .kv{border-color:var(--sand-d)}
.agree{display:flex;gap:11px;align-items:flex-start;padding:14px 0 18px}
.agree input{width:19px;height:19px;margin:1px 0 0;accent-color:var(--green);flex:0 0 auto}
.agree label{font-size:13.5px;line-height:1.55;color:#4C5548}
.agree a{text-decoration:underline;text-underline-offset:2px}
.mrow{display:flex;gap:11px;justify-content:flex-end;flex-wrap:wrap}
.b[disabled]{opacity:.42;cursor:not-allowed}
.av{width:36px;height:36px;border-radius:50%;background:var(--brass);color:#20180A;
  display:grid;place-items:center;font-weight:700;font-size:13.5px;letter-spacing:.02em;
  text-decoration:none;transition:background .15s ease}
a.av:hover{background:var(--brass-lt)}
.b-line-dark{border-color:#4C8468;color:#fff}
.b-line-dark:hover{border-color:var(--brass-lt);color:var(--brass-lt)}
.b-white{background:#fff;color:#1C231D;border-color:#DADCE0}
.b-sm{height:36px;padding:0 14px;font-size:13px}
.b[disabled]{opacity:.42;cursor:not-allowed}
.signin-err{margin:0 0 20px;font-size:13.5px;line-height:1.55;background:#F7E3E0;
  color:#8C3A31;border-radius:var(--r);padding:12px 15px}
.sicard .note{margin:0 0 20px;font-size:12.5px;color:var(--mut);background:var(--sand);
  border-radius:var(--r);padding:11px 14px;line-height:1.5}
.sout{color:var(--brass-lt);text-decoration:underline;text-underline-offset:3px}
.sout:hover{color:#fff}

@media(max-width:1080px){ .grid{grid-template-columns:1fr} .acts{grid-template-columns:1fr} }
@media(max-width:640px){ .chips{margin-left:0;width:100%} .keyrow{flex-direction:column} }

.keywarn{margin:0 0 14px;font-size:13.5px;line-height:1.6;color:#8C3A31;background:#F7E3E0;
  border-radius:var(--r);padding:13px 16px}
.keywarn b{color:#6E2B24;font-weight:600}

/* ============ documentation ============ */
/* the two column shell */
/* padding-block only. The shorthand here wiped .wrap's side padding, because
   the element carries both classes and this rule comes later. */
.dgrid{display:grid;grid-template-columns:260px minmax(0,1fr);gap:44px;align-items:start;
  padding-top:26px;padding-bottom:80px}

/* ---- sidebar: every guide and every endpoint, filterable ---- */
.side{position:sticky;top:82px;max-height:calc(100vh - 104px);display:flex;flex-direction:column;
  gap:12px;padding-right:4px}
.dsearch{display:flex;align-items:center;gap:6px;background:var(--paper);
  border:1px solid var(--line);border-radius:var(--r);padding:0 6px 0 13px;height:42px;flex:0 0 auto}
.dsearch input{flex:1;min-width:0;border:0;outline:0;background:none;font-family:inherit;
  font-size:14px;color:var(--ink)}
.dsearch button{border:0;background:none;cursor:pointer;color:var(--mut);padding:6px;display:grid;
  place-items:center}
.dsearch button svg{width:17px;height:17px}
.dsearch button:hover{color:var(--green)}
.dsearch:focus-within{border-color:var(--green)}

.docs-nav-scroll{overflow-y:auto;min-height:0;padding-right:6px;
  scrollbar-width:thin;scrollbar-color:var(--sand-d) transparent}
.docs-nav-scroll::-webkit-scrollbar{width:7px}
.docs-nav-scroll::-webkit-scrollbar-thumb{background:var(--sand-d);border-radius:99px}

/* The menu is simply the menu on a wide screen. The disclosure exists only
   where a hundred and sixty links would otherwise bury the page. */
.menu-toggle{display:none;width:100%;align-items:center;gap:9px;cursor:pointer;
  font-family:inherit;text-align:left;background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r);padding:12px 14px;color:var(--ink)}
.mf-t{font-size:13.5px;font-weight:600}
.mf-n{margin-left:auto;font-family:var(--fm);font-size:11px;color:var(--mut)}
.mf-c{width:17px;height:17px;color:var(--mut);transition:transform .16s ease}
.menu-toggle[aria-expanded="true"] .mf-c{transform:rotate(180deg)}

/* Three equal thirds. Sized to their content they sat at three different
   widths, which made the row read as an accident rather than a control. */
.menu-filter{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-bottom:18px}
.menu-filter button{font-family:inherit;font-size:11.5px;font-weight:600;border:1px solid var(--line);
  background:var(--paper);color:var(--mut);border-radius:11px;padding:8px 4px;cursor:pointer;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;
  line-height:1.15;min-width:0}
.menu-filter button span{font-family:var(--fm);font-size:10px;font-weight:400;color:#A7ADA2}
.menu-filter button.on{background:var(--green);border-color:var(--green);color:#fff}
.menu-filter button.on span{color:var(--on-green)}
.menu-filter button[data-f="an"].on{background:var(--brass);border-color:var(--brass);color:#20180A}
.menu-filter button[data-f="an"].on span{color:#5C4515}

.menu-head{display:flex;align-items:center;gap:7px;margin:20px 0 7px;font-family:var(--fm);
  font-size:10.5px;letter-spacing:.07em;text-transform:uppercase;color:var(--brass)}
.mh-i{width:14px;height:14px;flex:0 0 auto}
.dmenu-eps{list-style:none;margin:0;padding:0}
.dmenu-eps li{display:flex;align-items:center;gap:8px}
.dmenu-eps li.hide{display:none}
.dmenu-eps a{display:block;flex:1;min-width:0;padding:5px 0 5px 11px;font-size:13px;color:#4C5548;
  border-left:2px solid var(--line);
  text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dmenu-eps a:hover{color:var(--green);border-left-color:var(--mint-d)}
.dmenu-eps a.on{color:var(--green);font-weight:600;border-left-color:var(--green)}
.mt-an{font-family:var(--fm);font-size:9.5px;font-weight:500;color:#8A6522;background:#F6EBD8;
  border-radius:6px;padding:2px 5px;flex:0 0 auto}
.dmenu-top{padding-bottom:8px;margin-bottom:4px;border-bottom:1px solid var(--line)}
.menu-head.hide,.dmenu-eps.hide{display:none}

.main{min-width:0}
.eyebrow{margin:0 0 12px;font-family:var(--fm);font-size:12px;letter-spacing:.08em;
  text-transform:uppercase;color:var(--brass)}
.main h1{font-size:clamp(28px,3vw,40px);max-width:18ch}
.lead{margin:18px 0 0;font-size:17px;line-height:1.62;color:#4C5548;max-width:70ch}
.lead b{color:var(--ink);font-weight:600}

/* counters */
.dstats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:30px 0 22px}
.dstat{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:17px 18px}
.dstat b{display:block;font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;
  letter-spacing:-.04em;font-size:30px;line-height:1;color:var(--green)}
.dstat.a b{color:var(--brass)}
.dstat span{display:block;margin-top:7px;font-size:12.5px;color:var(--mut)}

.keynote{background:var(--sand);border-radius:var(--r);padding:15px 18px;font-size:14px;
  line-height:1.6;color:#4C5548;margin-bottom:34px}
.keynote a{color:var(--green);text-decoration:underline;text-underline-offset:3px}
.keynote b{color:var(--ink)}

.block{margin-bottom:40px}
.block h2{font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;
  letter-spacing:-.025em;font-size:22px;margin:0 0 10px}
.block p{margin:0 0 14px;font-size:15.5px;line-height:1.62;color:#4C5548;max-width:72ch}
/**
 * A bare element selector must only carry what is true of EVERY <code> on the
 * site, which is the typeface and nothing else.
 *
 * This rule used to set a sand background, a radius and padding, so every
 * terminal panel, endpoint row and dark card inherited a pale pill it did not
 * want, and each one had to fight back with its own override. Several rules
 * existed for no other reason.
 *
 * The pill is a PROSE treatment, so it is scoped to prose. A <code> inside a
 * component now gets whatever that component says, and nothing by default.
 */
code{font-family:var(--fm);font-size:13.5px}

/**
 * The inline code pill, for PROSE only.
 *
 * :not(.eps *) keeps it out of the endpoint lists on the homepage. Those cards
 * style their own code — a full-width path, ellipsised, on the card's own
 * background — and the pill was landing on top of them: a sand chip inside a
 * white card, and a sand chip on green inside the Analyst one. The list rule
 * set a colour that the pill then left washed out, because at equal specificity
 * whichever came last in the file won.
 *
 * One radius, var(--r), like everything else.
 */
p code, li code, dd code, dt code, td code, th code,
.say code, .lead code, .sub code, .wnote code{
  background:var(--sand);border-radius:var(--r);padding:2px 6px;font-size:.94em}

/* the endpoint cards paint their own, so the pill stands down inside them */
.eps .grp code,
.eps .grp li code{
  background:none;padding:0;font-size:12.5px;border-radius:0}

/* code panel */
.code{background:#0A2519;border-radius:var(--r);overflow:hidden;margin:0 0 16px}
.tabs{display:flex;gap:2px;background:#071B12;padding:0 6px;overflow-x:auto}
.tabs button{background:none;border:0;color:#7FA995;font-family:var(--fm);font-size:12.5px;
  padding:12px 13px;cursor:pointer;border-bottom:2px solid transparent;white-space:nowrap}
.tabs button.on{color:#fff;border-bottom-color:var(--brass)}
.tabs .cp{margin-left:auto;color:#7FA995;border-bottom:0}
.code pre{margin:0;padding:17px 18px;font-family:var(--fm);font-size:13px;line-height:1.75;
  color:#A9C7B8;overflow-x:auto}
.code .k{color:#8FB3A0}.code .s{color:#E4C77E}.code .n{color:#93D6AE}.code .c{color:#4E7862}
.code .m{color:var(--brass-lt)}
.res-head{display:flex;align-items:center;gap:11px;padding:11px 16px;background:#0C2C1E;
  border-bottom:1px solid var(--line-green);font-family:var(--fm);font-size:12px;color:#7FA995}
.res-head .ok{color:#8FE0B0;border:1px solid var(--line-green);border-radius:10px;padding:3px 9px}
.res-head .ms{margin-left:auto}

/* guides */
.ggroup{margin-bottom:26px}
.glabel{display:flex;align-items:center;gap:10px;margin:0 0 12px;font-size:13px;font-weight:600;
  color:var(--ink)}
.glabel span{font-family:var(--fm);font-size:11px;font-weight:400;color:var(--mut);
  background:var(--sand);border-radius:8px;padding:3px 8px}
.glabel::before{content:"";width:22px;height:3px;border-radius:2px;background:var(--mint-d)}
.glabel.g-b::before{background:var(--brass)}
.glabel.g-c::before{background:var(--green)}
.glabel.g-d::before{background:var(--clay)}
.glabel.g-e::before{background:#7FA995}
.ggrid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.gcard{display:block;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);
  padding:16px 17px;text-decoration:none;transition:border-color .14s ease}
.gcard:hover{border-color:var(--green)}
.gnum{display:block;font-family:var(--fm);font-size:11px;color:var(--brass);margin-bottom:8px}
.gt{display:block;font-size:15px;font-weight:600;margin-bottom:6px}
.gd{display:block;font-size:13px;line-height:1.55;color:var(--mut);margin-bottom:11px}
.ggo{display:block;font-size:12.5px;font-weight:600;color:var(--green)}

.chg{display:flex;align-items:center;gap:18px;flex-wrap:wrap;background:var(--green-deep);
  border-radius:var(--r);padding:18px 22px;text-decoration:none;margin-bottom:34px}
.chg-l{font-family:var(--fm);font-size:11.5px;letter-spacing:.07em;color:var(--brass-lt)}
.chg-m b{display:block;font-size:15px;color:#fff;margin-bottom:4px}
.chg-m em{font-style:normal;font-size:12.5px;color:#7FA995}
.chg-go{margin-left:auto;font-size:13.5px;font-weight:600;color:var(--brass-lt)}

/* filter bar */
.dbar{position:sticky;top:70px;z-index:20;background:var(--soft);padding:14px 0 10px;
  margin-bottom:6px;border-bottom:1px solid var(--line)}
.dbar-row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.dfilter{flex:1 1 260px;display:flex;align-items:center;gap:9px;height:44px;padding:0 14px;
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r)}
.dfilter input{flex:1;border:0;outline:0;background:none;font-family:inherit;font-size:14.5px;color:var(--ink)}
.dfilter kbd{font-family:var(--fm);font-size:11px;color:var(--mut);background:var(--sand);
  border-radius:6px;padding:2px 6px}
.dtoggles{display:flex;gap:7px}
.dtog{font-family:inherit;font-size:12.5px;font-weight:600;height:36px;padding:0 13px;
  border-radius:var(--r);border:1px solid var(--line);background:var(--paper);color:var(--mut);cursor:pointer}
.dtog[aria-pressed="true"]{background:var(--green);border-color:var(--green);color:#fff}
.dtog.a[aria-pressed="true"]{background:var(--brass);border-color:var(--brass);color:#20180A}
.dcount{font-family:var(--fm);font-size:12.5px;color:var(--mut)}
.jchips{display:flex;gap:7px;flex-wrap:wrap;margin-top:10px}
.jchip{font-size:12px;color:#4C5548;text-decoration:none;background:var(--paper);
  border:1px solid var(--line);border-radius:var(--r);padding:6px 10px;white-space:nowrap}
.jchip b{font-family:var(--fm);font-size:10.5px;color:#A7ADA2;font-weight:400}
.jchip:hover{border-color:var(--green)}

/* endpoint cards */
.dsec{padding-top:30px}
.dsec-h{display:flex;align-items:baseline;gap:11px;flex-wrap:wrap;margin-bottom:14px}
.dsec-h h2{font-size:21px}
.dsec-n{font-family:var(--fm);font-size:11.5px;color:var(--mut);background:var(--sand);
  border-radius:8px;padding:3px 8px}
.dsec-h p{flex:1 1 100%;margin:2px 0 0;font-size:14px;color:var(--mut)}
.epgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.epc{display:block;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);
  padding:15px 17px;text-decoration:none;position:relative;overflow:hidden;transition:border-color .14s ease}
.epc:hover{border-color:var(--green)}
.epc::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--mint-d)}
.epc.t-an::before{background:var(--brass)}
.epc.t-live::before{background:var(--green)}
.epc-top{display:flex;align-items:center;gap:9px;margin-bottom:9px}
.mth{font-family:var(--fm);font-size:10.5px;font-weight:500;background:var(--green);color:#fff;
  border-radius:7px;padding:3px 7px}
.epc.t-an .mth{background:var(--brass);color:#20180A}
.epp{background:none;padding:0;font-size:12.5px;color:var(--mut);overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
.epc-t{display:block;font-size:15px;font-weight:600;margin-bottom:5px}
.epc-s{display:block;font-size:13px;line-height:1.5;color:var(--mut)}
.epc-b{display:flex;gap:6px;margin-top:11px;flex-wrap:wrap}
.eb{font-size:10.5px;font-weight:600;border-radius:8px;padding:3px 8px}
.eb.an{background:#F6EBD8;color:#8A6522}
.eb.live{background:#DCF0E5;color:var(--mint-d)}
.eb.pg{background:var(--sand);color:var(--mut)}
.hide{display:none}
.dempty{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);
  padding:24px;font-size:15px;color:var(--mut);margin-top:20px}
@media(max-width:1080px){
  .dgrid{grid-template-columns:1fr;gap:0;padding-top:22px;padding-bottom:60px}
  .side{position:static;max-height:none;margin-bottom:26px;padding-bottom:0}
  .menu-toggle{display:flex}
  .menu-body{display:none;padding-top:14px;padding-left:2px}
  .menu-body.open{display:block}
  .docs-nav-scroll{max-height:none;overflow:visible;padding-right:0}
  .epgrid,.ggrid{grid-template-columns:1fr}
  .dstats{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:640px){
  .main h1{font-size:26px}
  .dstats{gap:10px}
  .dbar{padding:12px 0 8px}
  .code pre{padding:15px 14px;font-size:12.5px}
}

/* ============ endpoint page ============ */
/* endpoint page */
.crumbs{margin:0 0 12px;font-size:13px;color:var(--mut)}
.crumbs a{color:var(--green);text-decoration:none}
.sig{display:flex;align-items:center;gap:11px;flex-wrap:wrap;margin:16px 0 20px}
.sig .mth{font-size:12px;padding:6px 11px}
.sig code{font-size:15px;background:var(--sand);padding:6px 12px;border-radius:10px}
.avail{display:grid;grid-template-columns:repeat(5,1fr);gap:9px;margin:0 0 22px}
.av5{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:12px 13px}
.av5.no{background:repeating-linear-gradient(135deg,#F4F2EC 0 5px,#EDEAE2 5px 10px)}
.av5 .pn{display:block;font-size:12px;color:var(--mut);margin-bottom:6px}
.av5 .pw{display:block;font-family:var(--fm);font-size:12px;color:var(--mint-d);font-weight:500}
.av5.no .pw{color:#A7ADA2}
.av5.an{border-color:var(--brass)}
.av5.an .pw{color:#8A6522}

table.tbl{width:100%;border-collapse:collapse;background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r);overflow:hidden;margin:0 0 16px}
table.tbl th,table.tbl td{text-align:left;padding:11px 14px;font-size:13.5px;border-bottom:1px solid var(--line)}
table.tbl thead th{background:var(--green-deep);color:#fff;font-size:12.5px;white-space:nowrap}
table.tbl tbody td:first-child{font-family:var(--fm);font-size:12.5px;white-space:nowrap}
table.tbl .ty{font-family:var(--fm);font-size:12px;color:var(--mut)}
table.tbl .req{color:var(--clay);font-weight:600}
.tblwrap{overflow-x:auto}

.cav{background:#FBF4E6;border-left:4px solid var(--brass);border-radius:var(--r);
  padding:16px 18px;margin:0 0 12px}
.cav h4{margin:0 0 6px;font-size:14.5px}
.cav p{margin:0;font-size:13.5px;line-height:1.6;color:#6B5A35}

.console{background:var(--paper);border:1px solid var(--green);border-radius:var(--r);padding:20px 22px}
.field{margin-bottom:14px}
.field label{display:block;font-size:13px;font-weight:600;margin-bottom:7px}
.field input{width:100%;height:44px;border:1px solid var(--line);border-radius:var(--r);
  padding:0 14px;font-family:var(--fm);font-size:13px;background:var(--soft)}
.hintline{margin:0 0 14px;font-size:12.5px;color:var(--mut)}
.authsw{display:inline-flex;background:var(--sand);border-radius:var(--r);padding:4px;margin-bottom:12px}
.authsw button{border:0;background:none;font-family:inherit;font-size:12.5px;font-weight:600;
  color:var(--mut);padding:8px 14px;border-radius:11px;cursor:pointer}
.authsw button.on{background:var(--green);color:#fff}

.related{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.related a{display:flex;justify-content:space-between;gap:12px;background:var(--paper);
  border:1px solid var(--line);border-radius:var(--r);padding:12px 15px;text-decoration:none;font-size:14px}
.related a code{font-size:11.5px;color:var(--mut)}
.sub-h{font-size:16px;margin:26px 0 10px}
.uses{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.uses article{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:18px 20px}
.uses h3{margin:0 0 8px;font-size:15.5px}
.uses p{margin:0;font-size:14px;line-height:1.62;color:#4C5548}
.cout{margin:16px 0 0;background:#0A2519;border-radius:var(--r);padding:16px 18px;
  font-family:var(--fm);font-size:12.5px;line-height:1.7;color:#A9C7B8;overflow:auto;max-height:420px}
.cout.err{color:#E8938A}
@media(max-width:1080px){ .uses,.related,.avail{grid-template-columns:1fr} }

/* ============ guides and changelog ============ */
.guide-body{max-width:74ch}
.guide-body h2{font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;
  letter-spacing:-.025em;font-size:23px;margin:38px 0 12px}
.guide-body h3{font-size:16.5px;margin:26px 0 9px}
.guide-body p{margin:0 0 15px;font-size:16px;line-height:1.66;color:#4C5548}
.guide-body strong{color:var(--ink);font-weight:600}
.guide-body ul,.guide-body ol{margin:0 0 18px;padding-left:20px}
.guide-body li{font-size:16px;line-height:1.66;color:#4C5548;margin-bottom:8px}
.guide-body a{color:var(--green);text-decoration:underline;text-underline-offset:3px}
/**
 * INLINE code only.
 *
 * As `.guide-body code` this also painted a cream pill onto every <code> inside
 * a <pre>, which is a dark panel — pale text on a pale sand band. The child
 * combinator scopes the pill to inline code.
 *
 * The block rule below ALSO declares its own transparent background. That is
 * deliberate, not a duplicate: this bug came back once already when an older
 * stylesheet went live with the unscoped selector, and a code block should say
 * what it looks like itself rather than depend on every other rule behaving.
 */
.guide-body :not(pre) > code{font-family:var(--fm);font-size:13.5px;background:var(--sand);
  border-radius:7px;padding:2px 6px}
.guide-body pre{background:#0A2519;border-radius:var(--r);padding:17px 18px;margin:0 0 18px;
  overflow-x:auto}
.guide-body pre code{padding:0;background:none;border-radius:0;color:#A9C7B8;
  font-size:13px;line-height:1.75;display:block;white-space:pre}
.guide-body .tblwrap{margin-bottom:18px}
.notyet{background:var(--sand);border-radius:var(--r);padding:18px 20px;font-size:15px;
  line-height:1.62;color:#4C5548}

.chlog{list-style:none;margin:30px 0 0;padding:0}
.chlog li{display:grid;grid-template-columns:150px minmax(0,1fr);gap:22px;padding:22px 0;
  border-top:1px solid var(--line)}
.chlog time{font-family:var(--fm);font-size:12.5px;color:var(--mut);padding-top:3px}
.chlog h2{font-size:19px;margin:0 0 8px}
.chlog p{margin:0;font-size:15.5px;line-height:1.64;color:#4C5548;max-width:70ch}
@media(max-width:720px){ .chlog li{grid-template-columns:1fr;gap:8px} }

/* the console key line and its plan badge */
.keyline{display:flex;gap:10px;align-items:center}
.keyline input{flex:1 1 auto;min-width:0}
.tierbadge{flex:0 0 auto;font-family:var(--fm);font-size:11.5px;font-weight:500;
  padding:7px 11px;border-radius:var(--r);white-space:nowrap}
.tierbadge.ok{background:#DCF0E5;color:var(--mint-d)}
.tierbadge.top{background:var(--brass);color:#20180A}
.tierbadge.bad{background:#F7E3E0;color:var(--clay)}
.tierbadge.wait{background:var(--sand);color:var(--mut)}
.keyhint{margin:9px 0 0;font-size:12.5px;color:var(--mut)}
.keyhint a{color:var(--clay);text-decoration:underline;text-underline-offset:3px}

/* ============ documentation search ============ */
.dsearch-lg{height:54px;padding:0 8px 0 18px;margin:22px 0 8px;max-width:640px}
.dsearch-lg input{font-size:16px}
.dsearch-lg button{height:40px;padding:0 18px;border-radius:12px;background:var(--green);
  color:#fff;font-family:inherit;font-size:14px;font-weight:600}
.dsearch-lg button:hover{background:var(--green-raised)}

.dresults{list-style:none;margin:26px 0 0;padding:0}
.dresults li{margin-bottom:10px}
.dresults a{display:block;background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r);padding:15px 18px;text-decoration:none;transition:border-color .14s ease}
.dresults a:hover{border-color:var(--green)}
.dr-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.dr-kind{font-family:var(--fm);font-size:10.5px;font-weight:500;border-radius:8px;padding:3px 8px;
  background:var(--sand);color:var(--mut);white-space:nowrap}
.dr-guide .dr-kind,.dresults .dr-guide{background:#DCF0E5;color:var(--mint-d)}
.dr-title{font-size:16px;font-weight:600;color:var(--ink)}
.dr-path{display:block;margin-top:7px;font-family:var(--fm);font-size:12.5px;color:var(--mut);
  background:none;padding:0}
.dr-blurb{display:block;margin-top:7px;font-size:13.5px;line-height:1.55;color:#4C5548}

.dnone{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);
  padding:24px 26px;margin-top:26px;max-width:70ch}
.dnone p{margin:0 0 12px;font-size:15.5px;line-height:1.64;color:#4C5548}
.dnone p:last-child{margin:0}
.dnone b{color:var(--ink)}
.dnone a{color:var(--green);text-decoration:underline;text-underline-offset:3px}
.dnone-links{display:flex;gap:16px;flex-wrap:wrap;padding-top:6px}
.dnone-links a{font-size:14px;font-weight:600}

/* ============ support ============ */
/* tabs */
/**
 * The tab strip is flush with the bottom of the dark head, so the active tab's
 * light fill runs straight into the pane below it and the two read as one
 * surface. .phead carries 54px of bottom padding for every other page, which
 * left the strip floating in the middle of the dark band.
 */
.p-support .phead.sup-head{padding:52px 0 0}
.p-support .tabs-bar{display:flex;gap:5px;margin-top:40px;border-bottom:0}
.p-support .tabs-bar button{position:relative;border:0;font-family:inherit;font-size:15px;font-weight:600;
  color:var(--on-green);padding:16px 24px;cursor:pointer;border-radius:14px 14px 0 0;
  background:rgba(255,255,255,.06);transition:background .14s ease,color .14s ease}
.p-support .tabs-bar button:hover{background:rgba(255,255,255,.12);color:#fff}
.p-support .tabs-bar button.on{background:var(--soft);color:var(--ink)}
.p-support .tabs-bar button.on:hover{background:var(--soft)}
.p-support .tabs-bar .n{font-family:var(--fm);font-size:11px;font-weight:400;margin-left:8px}
.p-support .tabs-bar button.on .n{color:var(--mut)}
.p-support .tabs-bar button:not(.on) .n{color:#7FA995}

.p-support .pane{display:none;padding:38px 0 78px}
.p-support .pane.on{display:block}
.p-support .pane h2{font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;letter-spacing:-.025em;font-size:24px;margin:0 0 10px}
.p-support .pane .say{margin:0 0 24px;font-size:16px;line-height:1.62;color:#4C5548;max-width:68ch}
.p-support .grid2{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:36px;align-items:start}

/* faq */
.p-support .fsearch{display:flex;align-items:center;gap:10px;background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r);height:54px;padding:0 8px 0 18px;margin-bottom:16px}
.p-support .fsearch input{flex:1;border:0;outline:0;background:none;font-family:inherit;font-size:16px;color:var(--ink)}
.p-support .fsearch svg{width:19px;height:19px;color:var(--mut);flex:0 0 auto}
.p-support .chips{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:20px}
.p-support .chip{font-family:inherit;font-size:12.5px;font-weight:600;border:1px solid var(--line);background:var(--paper);
  color:var(--mut);border-radius:var(--r);padding:8px 13px;cursor:pointer}
.p-support .chip.on{background:var(--green);border-color:var(--green);color:#fff}
.p-support .fq{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);margin-bottom:9px;overflow:hidden}
.p-support .fq[hidden]{display:none}
.p-support .fq summary{display:flex;align-items:center;gap:14px;cursor:pointer;list-style:none;padding:17px 20px;
  font-size:16px;font-weight:600}
.p-support .fq summary::-webkit-details-marker{display:none}
.p-support .fq summary span{flex:1}
.p-support .fq summary svg{width:19px;height:19px;color:var(--mut);flex:0 0 auto;transition:transform .16s ease}
.p-support .fq[open] summary svg{transform:rotate(180deg)}
.p-support .fq[open] summary{border-bottom:1px solid var(--line)}
.p-support .fq-a{padding:17px 20px}
.p-support .fq-a p{margin:0;font-size:15.5px;line-height:1.66;color:#4C5548}
.p-support .fq-a code{font-family:var(--fm);font-size:13.5px;background:var(--sand);border-radius:7px;padding:2px 6px}
.p-support .fq-a a{color:var(--green);text-decoration:underline;text-underline-offset:3px}
.p-support .fnone{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:26px;margin-top:6px}
.p-support .fnone[hidden]{display:none}
.p-support .fnone h3{margin:0 0 9px;font-size:17px}
.p-support .fnone p{margin:0 0 16px;font-size:15px;line-height:1.62;color:#4C5548}

/* aside */
.p-support .aside{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:22px 24px}
.p-support .aside + .aside{margin-top:16px}
.p-support .aside h3{margin:0 0 10px;font-size:16px}
.p-support .aside p{margin:0 0 12px;font-size:14px;line-height:1.6;color:#4C5548}
.p-support .aside p:last-child{margin:0}
.p-support .aside ul{margin:0;padding-left:18px}
.p-support .aside li{font-size:14px;line-height:1.6;color:#4C5548;margin-bottom:7px}
.p-support .aside a{color:var(--green);text-decoration:underline;text-underline-offset:3px}
.p-support .aside.dark{background:var(--green-deep);border-color:var(--green-deep)}
.p-support .aside.dark h3{color:#fff} .aside.dark p{color:var(--on-green)}

/* form */
.p-support .field{margin-bottom:18px}
.p-support .field label{display:block;font-size:14px;font-weight:600;margin-bottom:8px}
.p-support .field .hint{font-weight:400;color:var(--mut);font-size:13px;margin-left:8px}
.p-support .field input, .p-support .field select, .p-support .field textarea{width:100%;border:1px solid var(--line);border-radius:var(--r);
  padding:13px 15px;font-family:inherit;font-size:15px;background:var(--paper);color:var(--ink)}
.p-support .field textarea{min-height:170px;resize:vertical;line-height:1.6}
.p-support .field input:focus, .p-support .field select:focus, .p-support .field textarea:focus{outline:0;border-color:var(--green)}
.p-support .hp{position:absolute;left:-9999px}
.p-support .signin-wall{background:var(--sand);border-radius:var(--r);padding:22px 24px;margin-bottom:20px}
.p-support .signin-wall p{margin:0 0 14px;font-size:15px;line-height:1.62;color:#4C5548}
.p-support .signin-wall b{color:var(--ink)}
.p-support .sent{background:#DCF0E5;border-radius:var(--r);padding:24px 26px}
.p-support .sent[hidden]{display:none}
.p-support .sent h3{margin:0 0 9px;font-size:18px;color:var(--mint-d)}
.p-support .sent p{margin:0 0 10px;font-size:15px;line-height:1.62;color:#2A5C42}
.p-support .sent code{font-family:var(--fm);font-size:14px;background:#fff;border-radius:7px;padding:3px 8px}

/* tickets */
.p-support .tk{display:block;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);
  padding:18px 20px;text-decoration:none;margin-bottom:10px;position:relative;overflow:hidden}
.p-support .tk::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px}
.p-support .tk.open::before{background:var(--mint-d)} .tk.wait::before{background:var(--brass)} .tk.closed::before{background:#B3B8AE}
.p-support .tk:hover{border-color:var(--green)}
.p-support .tk-top{display:flex;align-items:center;gap:12px;margin-bottom:9px}
.p-support .tk-top code{font-family:var(--fm);font-size:12.5px;color:var(--mut)}
.p-support .tk-state{font-size:11px;font-weight:700;border-radius:9px;padding:4px 9px}
.p-support .tk-state.open{background:#DCF0E5;color:var(--mint-d)}
.p-support .tk-state.wait{background:#F6EBD8;color:#8A6522}
.p-support .tk-state.closed{background:var(--sand);color:var(--mut)}
.p-support .tk-sub{display:block;font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;
  letter-spacing:-.02em;font-size:19px;margin-bottom:7px}
.p-support .tk-when{display:block;font-size:13px;color:var(--mut)}
.p-support .empty{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:30px 28px;text-align:center}
.p-support .empty h3{margin:0 0 9px;font-size:17px}
.p-support .empty p{margin:0 0 18px;font-size:15px;line-height:1.6;color:var(--mut)}
/* the thread */
.p-support .crumbs{margin:0 0 12px;font-size:13px;color:var(--mut)}
.p-support .crumbs a{color:var(--green);text-decoration:none}
.p-support .thmeta{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:12px 0 24px;
  font-size:13px;color:var(--mut)}
.p-support .thmeta code{font-family:var(--fm);font-size:12.5px;background:var(--sand);border-radius:8px;padding:4px 9px}
.p-support .thread{margin-bottom:26px}
.p-support .msg{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);
  padding:18px 20px;margin-bottom:12px}
.p-support .msg.staff{background:#F2FAF6;border-color:#CFE7DA}
.p-support .msg header{display:flex;align-items:baseline;gap:12px;margin-bottom:10px}
.p-support .msg header b{font-size:14px}
.p-support .msg.staff header b{color:var(--mint-d)}
.p-support .msg header time{font-family:var(--fm);font-size:11.5px;color:var(--mut);margin-left:auto}
.p-support .msg p{margin:0;font-size:15.5px;line-height:1.66;color:#4C5548}
.p-support .reply{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:20px 22px}
.p-support .ferr{background:#F7E3E0;color:#8C3A31;border-radius:var(--r);padding:14px 17px;margin-bottom:20px;
  font-size:14.5px;line-height:1.55}

@media(max-width:1000px){
.p-support .grid2{grid-template-columns:1fr}
}
@media(max-width:760px){
  /* the strip scrolls rather than wraps, and keeps its flush bottom edge */
.p-support .tabs-bar{overflow-x:auto;scrollbar-width:none;margin-top:30px}
.p-support .tabs-bar::-webkit-scrollbar{display:none}
.p-support .tabs-bar button{padding:14px 17px;font-size:14px;white-space:nowrap;flex:0 0 auto}
}

/* ============ labs ============ */
/* cards */
.p-labs .labs{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:32px}
.p-labs .labcard{display:flex;flex-direction:column;background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r);padding:22px 24px;text-decoration:none;position:relative;overflow:hidden;
  transition:border-color .15s ease,transform .15s ease}
.p-labs .labcard:hover{border-color:var(--green);transform:translateY(-3px)}
.p-labs .labcard::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--mint-d)}
.p-labs .labcard.build::before{background:#B3B8AE}
.p-labs .lab-top{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.p-labs .lang{font-family:var(--fm);font-size:11px;color:var(--mut);background:var(--sand);border-radius:9px;padding:4px 9px}
.p-labs .state{margin-left:auto;font-size:10.5px;font-weight:700;border-radius:9px;padding:4px 9px}
.p-labs .state.published{background:#DCF0E5;color:var(--mint-d)}
.p-labs .state.build{background:var(--sand);color:var(--mut)}
.p-labs .labcard h3{font-size:21px;margin:0 0 10px}
.p-labs .lab-l{margin:0 0 18px;font-size:14.5px;line-height:1.6;color:#4C5548;flex:1}
.p-labs .lab-go{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;font-weight:600;color:var(--green)}
.p-labs .labcard.build .lab-go{color:var(--mut)}
/* emitted by ahr_gh_mark(), which any page may call, so never page-scoped */
.gh{width:17px;height:17px;fill:currentColor}

/* standing rule */
.p-labs .rule{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:30px}
.p-labs .rule article{background:var(--green);border:1px solid var(--line-green);border-radius:var(--r);padding:22px 24px}
.p-labs .rule h3{margin:0 0 9px;font-size:16.5px;color:#fff}
.p-labs .rule p{margin:0;font-size:14.5px;line-height:1.62;color:var(--on-green)}
.p-labs .rule code{font-family:var(--fm);font-size:13px;background:rgba(255,255,255,.10);border-radius:7px;padding:2px 6px;color:var(--brass-lt)}

/* item page */
.p-labs .crumbs{margin:0 0 14px;font-size:13px;color:#7FA995}
.p-labs .crumbs a{color:var(--brass-lt);text-decoration:none}
.p-labs .ihero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,460px);gap:48px;align-items:center}
.p-labs .chips{display:flex;gap:8px;flex-wrap:wrap;margin:22px 0 0}
.p-labs .chips span{font-family:var(--fm);font-size:11.5px;background:rgba(255,255,255,.08);color:var(--on-green);
  border-radius:10px;padding:6px 11px}
.p-labs .iacts{display:flex;gap:11px;flex-wrap:wrap;margin-top:26px}

/* the animated figure */
.p-labs .fig{background:rgba(0,0,0,.20);border:1px solid var(--line-green);border-radius:var(--r);padding:20px 22px}
.p-labs .fig h4{margin:0 0 4px;font-size:14px;color:#fff}
.p-labs .fig p{margin:0 0 18px;font-size:12px;color:#7FA995}
.p-labs .trio{display:flex;flex-direction:column;gap:14px}
.p-labs .trio div{display:grid;grid-template-columns:56px minmax(0,1fr) 62px;gap:12px;align-items:center}
.p-labs .trio .l{font-size:12.5px;color:var(--on-green)}
.p-labs .trio .t{height:22px;border-radius:7px;background:rgba(255,255,255,.08);overflow:hidden;position:relative}
.p-labs .trio .t i{position:absolute;left:50%;top:0;bottom:0;border-radius:7px;background:var(--mint-d);
  width:0;animation:grow 1.5s cubic-bezier(.2,.8,.3,1) forwards}
.p-labs .trio .t i.neg{background:var(--clay)}
.p-labs .trio .v{font-family:var(--fm);font-size:12px;color:#fff;text-align:right}
@keyframes grow{to{width:var(--w);left:var(--x)}}
.p-labs .trio .mid{position:absolute;left:50%;top:0;bottom:0;width:1px;background:rgba(255,255,255,.28)}
.p-labs .fig .x{display:flex;justify-content:space-between;margin-top:12px;font-family:var(--fm);font-size:10.5px;color:#4E7862}

.p-labs .block{margin-bottom:36px}
.p-labs .block h2{font-size:23px;margin:0 0 12px}
.p-labs .block p{margin:0 0 14px;font-size:16px;line-height:1.66;color:#4C5548;max-width:72ch}
.p-labs .block b{color:var(--ink)}
.p-labs .block ul{margin:0 0 16px;padding-left:20px}
.p-labs .block li{font-size:16px;line-height:1.66;color:#4C5548;margin-bottom:8px}
.p-labs .code{background:#0A2519;border-radius:var(--r);padding:18px 20px;margin:0 0 18px;overflow-x:auto}
.p-labs .code pre{margin:0;font-family:var(--fm);font-size:13px;line-height:1.8;color:#A9C7B8;white-space:pre}
.p-labs .code .c{color:#4E7862} .code .s{color:#E4C77E}
table.tbl{width:100%;border-collapse:collapse;background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r);overflow:hidden;margin:0 0 18px}
table.tbl th,table.tbl td{text-align:left;padding:11px 15px;font-size:13.5px;border-bottom:1px solid var(--line)}
table.tbl thead th{background:var(--green-deep);color:#fff;font-size:12.5px}
table.tbl td:not(:first-child){font-family:var(--fm);font-size:12.5px}
.p-labs .win{color:var(--mint-d);font-weight:600} .lose{color:var(--clay)}
.p-labs .notyet-pill{display:inline-flex;align-items:center;height:46px;padding:0 20px;border-radius:var(--r);
  background:rgba(255,255,255,.08);color:var(--on-green);font-size:14.5px;font-weight:600}
.p-labs .prov{background:#FBF4E6;border-left:4px solid var(--brass);border-radius:var(--r);
  padding:14px 17px;margin:0 0 16px;font-size:14.5px;line-height:1.6;color:#6B5A35}
.p-labs .prov b{color:#4A3D1F}

@media(max-width:1080px){ .labs,.rule{grid-template-columns:1fr} .ihero{grid-template-columns:1fr;gap:32px} }
@media (prefers-reduced-motion:reduce){ .trio .t i{animation:none;width:var(--w);left:var(--x)} }

/**
 * The plan chooser inside the billing modal.
 *
 * NOT a page section. This was appended to the end of the stylesheet during the
 * billing build, and a later pass that scoped whole blocks by prefixing every
 * selector between two markers swallowed it into the Labs block — so the modal
 * was styled on /labs and nowhere else, and the account page rendered bare form
 * elements.
 *
 * A component used by one page still belongs with that page's block, or
 * unscoped like this one. Appending to the end of a file is what made it
 * ambiguous.
 */
.billnote{margin:14px 0 0;font-size:13px;line-height:1.55;border-radius:var(--r);padding:11px 14px}
.billnote.ok{background:#DCF0E5;color:#2A5C42}
.billnote.err{background:#F7E3E0;color:#8C3A31}
.billnote b{font-weight:600}
.period{display:flex;gap:8px;margin:18px 0 14px;flex-wrap:wrap}
.period label{flex:1 1 auto;display:flex;align-items:center;gap:8px;border:1px solid var(--line);
  border-radius:var(--r);padding:11px 14px;cursor:pointer;font-size:13.5px}
.period input{accent-color:var(--green)}
.period label:has(input:checked){border-color:var(--green);background:#F2FAF6}
.picks{display:flex;flex-direction:column;gap:9px}
.pick{display:flex;gap:11px;align-items:flex-start;border:1px solid var(--line);
  border-radius:var(--r);padding:14px 16px;cursor:pointer}
.pick:has(input:checked){border-color:var(--brass);background:#FBF6EC}
.pick.now{opacity:.55;cursor:default}
.pick input{margin-top:3px;accent-color:var(--green)}
.pk-b{display:block;flex:1;min-width:0}
.pk-n{display:block;font-size:15px;font-weight:600}
.pk-n em{font-style:normal;font-size:11px;font-weight:600;color:var(--mut);
  background:var(--sand);border-radius:8px;padding:3px 7px;margin-left:8px}
.pk-p{display:block;font-family:var(--fm);font-size:13px;color:var(--green);margin-top:4px}
.pk-d{display:block;font-size:12.5px;color:var(--mut);margin-top:4px}

/* ============ free key ============ */
.p-free-key .hgrid{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,530px);
  gap:52px;align-items:center}
.p-free-key .eyebrow{margin:0 0 13px;font-family:var(--fm);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--brass-lt)}
.p-free-key .phead h1{font-size:clamp(32px,4vw,52px);max-width:15ch}
.p-free-key .phead .lead{margin:20px 0 0;font-size:17.5px;line-height:1.6;color:var(--on-green);max-width:52ch}
.p-free-key .phead .lead b{color:#fff;font-weight:600}
.p-free-key .acts{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.p-free-key .tiny{margin:16px 0 0;font-size:13px;color:#7FA995}

/* terminal */
.p-free-key .term{background:#071B12;border:1px solid var(--line-green);border-radius:var(--r);overflow:hidden}
.p-free-key .term-h{display:flex;align-items:center;gap:8px;padding:11px 15px;background:#0A2519;
  border-bottom:1px solid var(--line-green)}
.p-free-key .term-h i{width:9px;height:9px;border-radius:50%;background:#25543C}
.p-free-key .term-h span{margin-left:auto;font-family:var(--fm);font-size:11px;color:#4E7862}
.p-free-key .term pre{margin:0;padding:18px 20px;font-family:var(--fm);font-size:12.5px;line-height:1.85;
  color:#A9C7B8;white-space:pre-wrap;min-height:322px}
.p-free-key .term .p{color:var(--mint)} .term .s{color:#E4C77E} .term .c{color:#4E7862}
.p-free-key .term .k{color:#8FB3A0} .term .m{color:var(--brass-lt)}
.p-free-key .cur{display:inline-block;width:8px;height:15px;background:var(--mint);vertical-align:-2px;
  animation:bl 1.1s steps(2) infinite}
@keyframes bl{50%{opacity:0}}

.p-free-key .sect{padding:60px 0}
.p-free-key .sect.sand{background:var(--sand)} .sect.soft{background:var(--soft)} .sect.deep{background:var(--green-deep);color:#fff}
.p-free-key .sect h2{font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;letter-spacing:-.028em;
  font-size:clamp(24px,2.4vw,33px);margin:0;max-width:22ch}
.p-free-key .sect .say{margin:15px 0 0;font-size:16.5px;line-height:1.62;color:#4C5548;max-width:68ch}
.p-free-key .sect.deep .say{color:var(--on-green)} .sect .say b{color:var(--ink)} .sect.deep .say b{color:#fff}

.p-free-key .stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:30px}
.p-free-key .stat{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:20px 22px}
.p-free-key .stat b{display:block;font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;
  letter-spacing:-.04em;font-size:34px;line-height:1;color:var(--green)}
.p-free-key .stat span{display:block;margin-top:8px;font-size:12.5px;color:var(--mut)}

/* the window */
.p-free-key .win{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:26px 28px;margin-top:30px}
.p-free-key .wbar{display:flex;height:44px;border-radius:11px;overflow:hidden;margin:20px 0 10px}
.p-free-key .wbar i{display:block}
.p-free-key .wbar .off{flex:5;background:repeating-linear-gradient(135deg,#EFECE4 0 6px,#E5E1D7 6px 12px)}
.p-free-key .wbar .on{flex:3;background:var(--mint-d)}
.p-free-key .wbar .off2{flex:1.2;background:repeating-linear-gradient(135deg,#EFECE4 0 6px,#E5E1D7 6px 12px)}
.p-free-key .wx{display:flex;font-family:var(--fm);font-size:11.5px;color:var(--mut)}
.p-free-key .wx span{text-align:center}
.p-free-key .wx .a{flex:5} .wx .b2{flex:3;color:var(--mint-d);font-weight:500} .wx .c{flex:1.2}
.p-free-key .wnote{margin:18px 0 0;font-size:15px;line-height:1.64;color:#4C5548}
.p-free-key .wnote b{color:var(--ink)}

.p-free-key .two{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:30px}
.p-free-key .two article{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:24px 26px;
  position:relative;overflow:hidden}
.p-free-key .two article::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--mint-d)}
.p-free-key .two article.no::before{background:var(--clay)}
.p-free-key .two h3{margin:0 0 12px;font-size:18px}
.p-free-key .two ul{margin:0;padding-left:19px}
.p-free-key .two li{font-size:15px;line-height:1.62;color:#4C5548;margin-bottom:9px}
.p-free-key .two li b{color:var(--ink)}

.p-free-key .steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:30px}
.p-free-key .step{background:var(--green);border:1px solid var(--line-green);border-radius:var(--r);padding:22px 24px}
.p-free-key .step .n{font-family:var(--fm);font-size:11.5px;color:var(--brass-lt)}
.p-free-key .step h3{margin:9px 0 8px;font-size:17px;color:#fff}
.p-free-key .step p{margin:0 0 14px;font-size:14px;line-height:1.6;color:var(--on-green)}
.p-free-key .step code{display:block;font-family:var(--fm);font-size:12px;line-height:1.7;color:#A9C7B8;
  background:rgba(0,0,0,.24);border-radius:11px;padding:12px 14px;overflow-x:auto;white-space:pre}

.p-free-key .faq{display:grid;grid-template-columns:1fr 1fr;gap:16px 34px;margin-top:30px}
.p-free-key .faq article{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:22px 24px}
.p-free-key .faq h3{margin:0 0 9px;font-size:16.5px}
.p-free-key .faq p{margin:0;font-size:14.5px;line-height:1.62;color:#4C5548}
.p-free-key .faq a{color:var(--green);text-decoration:underline;text-underline-offset:3px}

.p-free-key .close{display:flex;gap:24px;align-items:center;flex-wrap:wrap;margin-top:26px}
.p-free-key .close .t{flex:1 1 380px}
@media(max-width:1080px){
.p-free-key .hgrid{grid-template-columns:1fr;gap:34px}
.p-free-key .stats{grid-template-columns:repeat(2,1fr)}
.p-free-key .two, .p-free-key .faq, .p-free-key .steps{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){ .cur{animation:none} }

/* ============ data status ============ */
.p-status .phead.st2-head{background:var(--green-deep);color:#fff;padding:52px 0 44px}
.p-status .eyebrow{margin:0 0 12px;font-family:var(--fm);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--brass-lt)}
.p-status .phead h1{font-size:clamp(30px,3.6vw,46px)}
.p-status .phead .lead{margin:18px 0 0;font-size:17px;line-height:1.6;color:var(--on-green);max-width:64ch}
.p-status .phead .lead b{color:#fff;font-weight:600}
.p-status .stamp{display:flex;gap:22px;flex-wrap:wrap;margin-top:22px;font-family:var(--fm);font-size:12.5px;color:#7FA995}

.p-status .cards{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:32px}
.p-status .nowc{background:rgba(255,255,255,.06);border:1px solid var(--line-green);border-radius:var(--r);padding:18px 20px}
.p-status .nowc .l{font-size:12.5px;color:var(--on-green)}
.p-status .nowc b{display:block;font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;
  letter-spacing:-.04em;font-size:38px;line-height:1;margin:10px 0 8px;color:#fff}
.p-status .nowc .s{font-size:12px;color:#7FA995;line-height:1.5}

.p-status .sect{padding:52px 0}
.p-status .sect.soft{background:var(--soft)}.sect.sand{background:var(--sand)}.sect.deep{background:var(--green-deep);color:#fff}
.p-status .sect h2{font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;letter-spacing:-.028em;
  font-size:clamp(23px,2.3vw,31px);margin:0}
.p-status .sect .say{margin:14px 0 0;font-size:16px;line-height:1.62;color:#4C5548;max-width:70ch}
.p-status .sect.deep .say{color:var(--on-green)}.sect .say b{color:var(--ink)}.sect.deep .say b{color:#fff}

.p-status .banner{display:flex;align-items:center;gap:14px;background:#F7E3E0;border-left:4px solid var(--clay);
  border-radius:var(--r);padding:15px 20px;margin-top:26px}
.p-status .banner b{color:#8C3A31;font-size:15px}
.p-status .banner span{margin-left:auto;font-family:var(--fm);font-size:12px;color:#8C3A31;opacity:.8}

.p-status .cmp{display:grid;grid-template-columns:minmax(0,1fr) 300px 140px;gap:20px;align-items:center;
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:17px 22px;margin-bottom:10px}
.p-status .cmp h3{margin:0;font-size:16px}
.p-status .cmp-l p{margin:4px 0 0;font-size:13px;color:var(--mut)}
.p-status .cmp-m{min-width:0}
.p-status .cmp-s{text-align:right}
.p-status .det{font-family:var(--fm);font-size:12.5px;color:var(--mut)}
.p-status .state{display:inline-flex;font-size:12px;font-weight:700;border-radius:10px;padding:6px 12px}
.p-status .state.op{background:#DCF0E5;color:var(--mint-d)}
.p-status .state.down{background:#F7E3E0;color:var(--clay)}
.p-status .state.dl{background:#FAEFDC;color:#8A6522}

.p-status .strip{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:16px 20px;margin-bottom:10px}
.p-status .strip-h{display:flex;align-items:baseline;gap:12px;margin-bottom:11px}
.p-status .strip-h h3{margin:0;font-size:14.5px}
.p-status .up{margin-left:auto;font-family:var(--fm);font-size:12px;color:var(--mint-d);font-weight:500}
.p-status .bars{display:flex;gap:2.5px;height:34px}
.p-status .bars i{flex:1;border-radius:2.5px;min-width:2px;background:#3FBF83}
.p-status .bars i.dl{background:var(--brass)}.bars i.down{background:var(--clay)}
.p-status .bars i.none{background:#E5E1D7}
.p-status .bars i:hover{filter:brightness(1.15)}
.p-status .bars-x{display:flex;justify-content:space-between;margin-top:7px;font-family:var(--fm);font-size:10.5px;color:var(--mut)}
.p-status .legend{display:flex;gap:20px;flex-wrap:wrap;margin-top:16px;font-size:12.5px;color:var(--mut)}
.p-status .legend i{display:inline-block;width:11px;height:11px;border-radius:3px;margin-right:7px;vertical-align:-1px}
.p-status .jsonline{margin-top:16px;font-size:13.5px;color:var(--mut)}
.p-status .jsonline code{font-family:var(--fm);font-size:13px;background:var(--sand);border-radius:8px;padding:3px 9px}

.p-status .wgrid{display:grid;grid-template-columns:repeat(5,1fr);gap:0;margin-top:28px;
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.p-status .wcell{padding:20px 22px;border-right:1px solid var(--line)}
.p-status .wcell:last-child{border-right:0}
.p-status .wl{display:block;font-size:12.5px;color:var(--mut)}
.p-status .ws{display:block;margin-top:5px;font-family:var(--fm);font-size:10.5px;letter-spacing:.05em;
  text-transform:uppercase;color:var(--brass)}
.p-status .wn{display:block;margin:9px 0 3px;font-family:var(--fd);font-weight:700;
  font-variation-settings:"wdth" 92;letter-spacing:-.04em;font-size:30px;line-height:1;color:var(--green)}
.p-status .wu{display:block;font-size:12px;color:var(--mut)}

.p-status .three{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:14px}
.p-status .three article{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:20px 22px}
.p-status .three b{display:block;font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;
  letter-spacing:-.035em;font-size:26px;line-height:1;color:var(--green)}
.p-status .three h4{margin:0 0 9px;font-size:13px;font-weight:600;color:var(--mut)}
.p-status .three p{margin:8px 0 0;font-size:12.5px;line-height:1.55;color:var(--mut)}

.p-status .runs{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;margin-top:22px}
.p-status .runs-h{display:flex;align-items:flex-end;gap:16px;padding:18px 22px 10px;flex-wrap:wrap}
.p-status .runs-h h3{margin:0;font-size:14.5px}
.p-status .runs-h span{font-size:12.5px;color:var(--mut)}
.p-status .spark{display:flex;align-items:flex-end;gap:2px;height:44px;flex:1 1 240px;min-width:200px}
.p-status .spark i{flex:1;background:var(--green);border-radius:2px 2px 0 0;min-height:3px;opacity:.85}
table.t{width:100%;border-collapse:collapse}
table.t th,table.t td{text-align:left;padding:11px 22px;font-size:13px;border-top:1px solid var(--line)}
table.t thead th{background:var(--soft);color:var(--mut);font-size:11.5px;text-transform:uppercase;letter-spacing:.05em}
.p-status .num{font-family:var(--fm);font-size:12.5px;text-align:right}
.p-status .mut{color:var(--mut)}

.p-status .regs{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:26px}
.p-status .reg{display:flex;align-items:baseline;gap:10px;background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r);padding:14px 16px}
.p-status .reg.off{background:var(--sand);border-color:var(--sand-d)}
.p-status .rn{font-size:13.5px}
.p-status .rv{margin-left:auto;font-family:var(--fm);font-size:12px;color:var(--mint-d)}
.p-status .reg.off .rv{color:var(--mut)}
.p-status .why{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:22px 24px;margin-top:20px;max-width:74ch}
.p-status .why h3{margin:0 0 10px;font-size:16.5px}
.p-status .why p{margin:0 0 12px;font-size:15px;line-height:1.64;color:#4C5548}
.p-status .why p:last-child{margin:0}
.p-status .why b{color:var(--ink)}

.p-status .calls{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:26px}
.p-status .calls article{background:var(--green);border:1px solid var(--line-green);border-radius:var(--r);padding:20px 22px}
.p-status .calls h4{margin:0 0 8px;font-size:14.5px;color:#fff}
.p-status .calls p{margin:0 0 12px;font-size:13px;line-height:1.55;color:var(--on-green)}
.p-status .calls code{display:block;font-family:var(--fm);font-size:12px;color:#A9C7B8;background:rgba(0,0,0,.24);
  border-radius:11px;padding:11px 13px;overflow-x:auto;white-space:pre}
.p-status .qual{font-family:var(--fb);font-size:15px;font-weight:400;color:var(--mut)}
.p-status .cmp-m{min-width:0} .cmp-s{text-align:right}
.p-status .jsonline code a{text-decoration:none;color:var(--green)}

@media(max-width:1080px){
.p-status .cards{grid-template-columns:repeat(2,1fr)}
.p-status .cmp{grid-template-columns:1fr;gap:12px}
.p-status .cmp-s{text-align:left}
.p-status .wgrid{grid-template-columns:repeat(2,1fr)}
.p-status .wcell{border-bottom:1px solid var(--line)}
.p-status .three, .p-status .calls{grid-template-columns:1fr}
.p-status .regs{grid-template-columns:repeat(2,1fr)}
}
.console .field label .opt{font-size:11px;font-weight:400;color:var(--mut);margin-left:7px}

/* ============ mcp server ============ */
/* NOT .hero — site.css defines that globally as the homepage two-column grid,
   and any section using the name inherits it and sits in a half-width column. */
.mhead{position:relative;overflow:hidden;padding:58px 0 54px;color:#fff;
  background:radial-gradient(880px 500px at 82% -18%,#1B6042 0%,rgba(27,96,66,0) 62%),
             linear-gradient(158deg,#0E3524 0%,#0A2719 100%)}
.mhead .deco{position:absolute;inset:0;pointer-events:none;
  background-image:repeating-linear-gradient(115deg,rgba(255,255,255,.045) 0 1px,transparent 1px 26px)}
.mgrid{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,470px);gap:48px;align-items:center}
.eyebrow{margin:0 0 13px;font-family:var(--fm);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--brass-lt)}
.mhead h1{font-size:clamp(31px,3.9vw,50px);max-width:16ch}
.mhead .lead{margin:20px 0 0;font-size:17.5px;line-height:1.6;color:var(--on-green);max-width:54ch}
.mhead .lead b{color:#fff;font-weight:600}
.acts{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.tiny{margin:16px 0 0;font-size:13px;color:#7FA995}


/* ---- the flow panel ----
   Shows what MCP actually is: a question goes down, the server picks a tool,
   the archive answers. A static chat mock showed the payoff but not the
   mechanism, which is the thing people do not understand yet. */
.flow{position:relative;display:flex;flex-direction:column;align-items:stretch;gap:0}
.node{background:rgba(0,0,0,.24);border:1px solid var(--line-green);border-radius:14px;
  padding:14px 16px;position:relative}
.who{display:flex;align-items:center;gap:8px;font-family:var(--fm);font-size:10.5px;
  letter-spacing:.06em;text-transform:uppercase;color:#7FA995}
.who svg{width:15px;height:15px;border-radius:4px;flex:0 0 auto}
.node.ask p{margin:9px 0 0;font-size:15px;line-height:1.5;color:#fff}
.node.pick{padding-bottom:30px}

/* the wires, with pulses that never stop rather than a timed sequence:
   a strict animation loop reads as a video, a continuous one reads as live */
.wire{height:34px;position:relative;margin:0 auto;width:2px;
  background:linear-gradient(180deg,rgba(255,255,255,.18),rgba(255,255,255,.06))}
.wire i{position:absolute;left:-3px;width:8px;height:8px;border-radius:50%;
  background:var(--mint);box-shadow:0 0 12px var(--mint);animation:drop 2.4s linear infinite}
.wire i.d2{animation-delay:1.2s}
.wire i.up{animation-name:rise;background:var(--brass-lt);box-shadow:0 0 12px var(--brass-lt)}
@keyframes drop{0%{top:-8px;opacity:0}12%{opacity:1}88%{opacity:1}100%{top:34px;opacity:0}}
@keyframes rise{0%{top:34px;opacity:0}12%{opacity:1}88%{opacity:1}100%{top:-8px;opacity:0}}

/* the tool chips cycle, so you SEE a choice being made */
.chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:11px}
.c{font-family:var(--fm);font-size:11.5px;border-radius:9px;padding:5px 9px;
  background:rgba(255,255,255,.06);color:#7FA995;
  border:1px solid transparent;animation:dim 8s ease-in-out infinite}
.c1{animation-delay:0s}.c2{animation-delay:2s}.c3{animation-delay:4s}.c4{animation-delay:6s}
@keyframes dim{
  0%,4%   {background:rgba(99,217,160,.16);color:#CFF3E0;border-color:rgba(99,217,160,.5)}
  22%,100%{background:rgba(255,255,255,.06);color:#7FA995;border-color:transparent}
}
/* the chosen one stays lit, because the answer below came from it */
.c2{animation:chosen 8s ease-in-out infinite}
@keyframes chosen{
  0%,18%  {background:rgba(255,255,255,.06);color:#7FA995;border-color:transparent}
  26%,92% {background:rgba(99,217,160,.18);color:#CFF3E0;border-color:rgba(99,217,160,.55)}
  100%    {background:rgba(255,255,255,.06);color:#7FA995;border-color:transparent}
}

/* a pointer that travels to the chosen tool */
.ptr{position:absolute;left:14px;bottom:11px;width:13px;height:13px;
  border-left:2px solid var(--brass-lt);border-bottom:2px solid var(--brass-lt);
  transform:rotate(-45deg);opacity:0;animation:point 8s ease-in-out infinite}
@keyframes point{
  0%,10%  {opacity:0;transform:translateX(0) rotate(-45deg)}
  20%     {opacity:1;transform:translateX(4px) rotate(-45deg)}
  26%,88% {opacity:1;transform:translateX(96px) rotate(-45deg)}
  96%,100%{opacity:0;transform:translateX(96px) rotate(-45deg)}
}

/* the answer, drawn rather than described */
.node.data .bars{margin-top:12px;display:flex;flex-direction:column;gap:9px}
.node.data .bars div{display:grid;grid-template-columns:38px minmax(0,1fr) 38px;
  gap:10px;align-items:center}
.node.data b{font-size:12px;font-weight:500;color:var(--on-green)}
.bar{position:relative;height:16px;border-radius:6px;background:rgba(255,255,255,.07)}
.bar::before{content:"";position:absolute;left:50%;top:0;bottom:0;width:1px;background:rgba(255,255,255,.3)}
.bar i{position:absolute;top:0;bottom:0;border-radius:6px;width:0;
  animation:grow 8s ease-in-out infinite}
.bar i.pos{left:50%;background:var(--mint-d)}
.bar i.neg{right:50%;background:var(--clay)}
@keyframes grow{0%,30%{width:0}44%,90%{width:var(--w)}100%{width:0}}
.node.data em{font-style:normal;font-family:var(--fm);font-size:12px;color:#fff;text-align:right}

@media (prefers-reduced-motion:reduce){
  .wire i,.c,.ptr,.bar i{animation:none}
  .ptr{opacity:0}
  .bar i{width:var(--w)}
  .c2{background:rgba(99,217,160,.18);color:#CFF3E0;border-color:rgba(99,217,160,.55)}
}

/* superseded */

.sect{padding:58px 0}
.sect.sand{background:var(--sand)}.sect.soft{background:var(--soft)}.sect.deep{background:var(--green-deep);color:#fff}
.sect h2{font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;letter-spacing:-.028em;font-size:clamp(23px,2.3vw,31px);margin:0}
.sect .say{margin:14px 0 0;font-size:16.5px;line-height:1.62;color:#4C5548;max-width:70ch}
.sect.deep .say{color:var(--on-green)}.sect .say b{color:var(--ink)}.sect.deep .say b{color:#fff}

/* setup */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:30px}
.step{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:22px 24px}
.step .n{font-family:var(--fm);font-size:11.5px;color:var(--brass)}
.step h3{margin:9px 0 8px;font-size:17px}
.step p{margin:0;font-size:14.5px;line-height:1.6;color:#4C5548}
.step a{color:var(--green);text-decoration:underline;text-underline-offset:3px}
.cfg{background:#0A2519;border-radius:var(--r);margin-top:18px;overflow:hidden}
.cfg-h{display:flex;align-items:center;gap:10px;padding:12px 18px;border-bottom:1px solid var(--line-green)}
.cfg-h span{font-family:var(--fm);font-size:12px;color:#7FA995}
.cfg-h button{margin-left:auto;background:none;border:1px solid var(--line-green);color:#A9C7B8;
  border-radius:10px;padding:6px 12px;font-family:inherit;font-size:12px;cursor:pointer}
.cfg pre{margin:0;padding:18px 20px;font-family:var(--fm);font-size:12.5px;line-height:1.8;color:#A9C7B8;overflow-x:auto}
.cfg .k{color:#8FB3A0}.cfg .s{color:#E4C77E}.cfg .c{color:#4E7862}

/* tools */
.tools{margin-top:28px;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.tool{display:grid;grid-template-columns:210px minmax(0,1fr) 130px;gap:18px;align-items:center;
  padding:13px 20px;border-bottom:1px solid var(--line)}
.tool:last-child{border-bottom:0}
.tool code{font-family:var(--fm);font-size:13px;color:var(--green)}
.td{font-size:14px;color:#4C5548}
.tt{font-family:var(--fm);font-size:11px;border-radius:9px;padding:4px 9px;text-align:center}
.tt.free{background:#DCF0E5;color:var(--mint-d)}
.tt.paid{background:var(--sand);color:var(--mut)}
.tt.analyst{background:#F6EBD8;color:#8A6522}

.two{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:28px}
.two article{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:24px 26px;position:relative;overflow:hidden}
.two article::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--mint-d)}
.two article.no::before{background:var(--clay)}
.two h3{margin:0 0 12px;font-size:18px}
.two ul{margin:0;padding-left:19px}
.two li{font-size:15px;line-height:1.62;color:#4C5548;margin-bottom:9px}
.two li b{color:var(--ink)}

.qs{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:26px}
.q{background:var(--green);border:1px solid var(--line-green);border-radius:var(--r);padding:16px 20px;
  font-size:15px;line-height:1.5;color:#fff}
.q span{display:block;margin-top:7px;font-family:var(--fm);font-size:11.5px;color:var(--brass-lt)}
.cfg-copy.done{border-color:var(--mint-d);color:var(--mint)}

@media(max-width:1080px){
  .mgrid{grid-template-columns:1fr;gap:32px}
  .steps,.two,.qs{grid-template-columns:1fr}
  .tool{grid-template-columns:1fr;gap:6px}
  .tt{justify-self:start}
}


/* JSON in a response sample, coloured by type.
   Scoped to .p-documentation, NOT .p-endpoint: ahr_page_class uses only the
   first path segment, so /documentation/races is p-documentation. A p-endpoint
   selector matches nothing and the sample stays flat.
   Flat green made a forty-line payload unreadable: the shape of the response is
   what the page is for, so a key must look different from a string. */
.p-documentation pre .j-key{color:#8FD4FF}
.p-documentation pre .j-str{color:#E4C77E}
.p-documentation pre .j-num{color:#7FE3B0}
.p-documentation pre .j-bool{color:#C9A6F5}
.p-documentation pre .j-null{color:#7E9A8C;font-style:italic}
.p-documentation pre .j-brace{color:#CBD9D1}
.p-documentation pre .j-punc{color:#6E8C7D}

/* pricing: the terms gate sits with the button rather than behind a modal.
   They chose by pressing the button, so the only decision left is agreeing. */
.pbuy{margin-top:auto}
.pagree{display:flex;gap:9px;align-items:flex-start;margin:0 0 12px;cursor:pointer}
.pagree input{margin-top:3px;flex:0 0 auto}
.pagree span{font-size:12.5px;line-height:1.5;color:var(--mut)}
.pagree a{color:var(--green);text-decoration:underline;text-underline-offset:2px}


/* ================= pricing =================
   RENAMED, not just scoped.
   Scoping my rules stops them leaking OUT. It does nothing to stop the
   stylesheet's existing global rules leaking IN — a bare .phead elsewhere in
   this file paints a green background and 58px of padding, and it matched my
   header regardless of my scope. Five names were colliding: phead, lead, pfor,
   toggle and c. They carry a pr- prefix here so nothing upstream can reach them.

   .disp, .wrap, .sect and .eyebrow are shared ON PURPOSE — they are the site's
   own type and layout system and this page should inherit them.
   SCOPED TO .p-pricing, every rule.
   This page reuses short names — .pc, .go, .note, .flag, .dot — that other
   pages also use, and an unscoped .go or .note would reach across the whole
   site. The page class comes from ahr_page_class('/pricing').

   One radius throughout: var(--r). The only round things are the avatar and
   the "Most taken" pill, which are circles on purpose rather than a second
   corner size. */
/* ---------- the hero IS the plan picker ---------- */
.p-pricing .phero{position:relative;overflow:hidden;padding:54px 0 64px;color:#fff;
  background:radial-gradient(1100px 560px at 78% -22%,#1B6042 0%,rgba(27,96,66,0) 62%),
             linear-gradient(160deg,#0E3524 0%,#0A2719 100%)}
.p-pricing .phero .deco{position:absolute;inset:0;pointer-events:none;
  background-image:repeating-linear-gradient(115deg,rgba(255,255,255,.045) 0 1px,transparent 1px 26px)}
.p-pricing .prhead{position:relative;text-align:center;max-width:760px;margin:0 auto 34px}
.p-pricing .eyebrow{margin:0 0 13px;font-family:var(--fm);font-size:12px;letter-spacing:.08em;
  text-transform:uppercase;color:var(--brass-lt)}
.p-pricing .phero h1{font-size:clamp(32px,4vw,52px)}
.p-pricing .phero .prlead{margin:18px 0 0;font-size:17.5px;line-height:1.6;color:var(--on-green)}
.p-pricing .phero .prlead b{color:#fff;font-weight:600}

.p-pricing .prtog{display:inline-flex;gap:4px;margin-top:26px;padding:4px;border-radius:var(--r);
  background:rgba(0,0,0,.28);border:1px solid var(--line-green)}
.p-pricing .prtog button{appearance:none;border:0;background:none;color:var(--on-green);
  font:600 13.5px var(--fb);padding:9px 20px;border-radius:calc(var(--r) - 4px);cursor:pointer}
.p-pricing .prtog button.on{background:var(--brass);color:#20180A}
.p-pricing .prtog span{display:block;font:500 11.5px var(--fm);color:var(--brass-lt);margin-top:9px}

/* THE GRID. Every card shares one row track set, so the name, the blurb, the
   price, the list and the button each start on the same line across all five
   and the buttons finish flush. */
.p-pricing .pgrid{position:relative;display:grid;grid-template-columns:repeat(5,1fr);gap:14px;
  align-items:stretch;
  /* name, blurb, price, note, list, button. The list takes the slack so the
     buttons finish flush; subgrid inherits THESE tracks, and without them
     declared here the cards stretch and gap under the price. */
  grid-template-rows:auto auto auto auto 1fr auto}
.p-pricing .pc{display:grid;grid-template-rows:subgrid;grid-row:1 / span 6;
  border-radius:var(--r);padding:22px 20px 20px;position:relative;
  border:1px solid transparent;margin:0}
@supports not (grid-template-rows:subgrid){
  .pc{display:flex;flex-direction:column}
  .pl{flex:1}
}

/* the intensity ramp: paler at the cheap end, deepest at the top */
.p-pricing .pc.t0{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.16)}
.p-pricing .pc.t1{background:#E9F1EC;color:var(--ink)}
.p-pricing .pc.t2{background:#CFE3D8;color:var(--ink)}
.p-pricing .pc.t3{background:#124A31;color:#fff;border-color:var(--brass)}
.p-pricing .pc.t4{background:linear-gradient(165deg,#0B3A26 0%,#07281A 100%);color:#fff;
  border-color:var(--brass-lt)}

.p-pricing .flag{position:absolute;top:-10px;left:50%;transform:translateX(-50%);
  background:var(--brass);color:#20180A;font:700 11px var(--fb);letter-spacing:.04em;
  text-transform:uppercase;padding:4px 12px;border-radius:999px;white-space:nowrap}
.p-pricing .pname{font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;
  font-size:20px;letter-spacing:-.02em}
.p-pricing .pc.t0 .pname,
.p-pricing .pc.t3 .pname,
.p-pricing .pc.t4 .pname{color:#fff}
.p-pricing .prfor{margin:8px 0 0;font-size:13.5px;line-height:1.55;min-height:42px}
.p-pricing .pc.t1 .prfor,
.p-pricing .pc.t2 .prfor{color:#4C5548}
.p-pricing .pc.t0 .prfor,
.p-pricing .pc.t3 .prfor,
.p-pricing .pc.t4 .prfor{color:var(--on-green)}

.p-pricing .ppr{display:flex;align-items:baseline;gap:6px;margin-top:16px}
.p-pricing .ppr b{font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;
  font-size:38px;letter-spacing:-.03em}
.p-pricing .ppr i{font-style:normal;font-size:13.5px;opacity:.72}
.p-pricing .note{display:block;margin-top:5px;font:500 12px var(--fm)}
.p-pricing .pc.t3 .note,
.p-pricing .pc.t4 .note{color:var(--brass-lt)}
.p-pricing .pc.t1 .note,
.p-pricing .pc.t2 .note{color:var(--mint-d)}
.p-pricing .pc.t0 .note{color:var(--on-green)}

.p-pricing .pl{margin:18px 0 0;padding:0}
.p-pricing .pl div{display:flex;justify-content:space-between;gap:10px;padding:8px 0;
  border-top:1px solid rgba(0,0,0,.08)}
.p-pricing .pc.t0 .pl div,
.p-pricing .pc.t3 .pl div,
.p-pricing .pc.t4 .pl div{border-top-color:rgba(255,255,255,.14)}
.p-pricing .pl dt{font-size:12.5px;opacity:.72;margin:0}
.p-pricing .pl dd{margin:0;font-size:12.5px;font-weight:600;text-align:right}
.p-pricing .pl dd.no{opacity:.5;font-weight:500}
.p-pricing .pl dd.yes{color:var(--mint-d)}
.p-pricing .pc.t3 .pl dd.yes,
.p-pricing .pc.t4 .pl dd.yes{color:var(--mint)}

/* Every card now ends the same way: list, then button. Nothing sits between
   them on one card and not another, so the buttons line up without being
   forced to. */
.p-pricing .pact{margin-top:18px;align-self:end}
.p-pricing .go{display:flex;align-items:center;justify-content:center;width:100%;height:46px;
  border:0;border-radius:var(--r);font:600 14.5px var(--fb);cursor:pointer;
  text-decoration:none}
.p-pricing .pc.t0 .go{background:transparent;border:1px solid rgba(255,255,255,.4);color:#fff}
.p-pricing .pc.t1 .go{background:var(--green);color:#fff}
.p-pricing .pc.t2 .go{background:var(--green);color:#fff}
.p-pricing .pc.t3 .go{background:var(--brass);color:#20180A}
.p-pricing .pc.t4 .go{background:var(--brass-lt);color:#20180A}

.p-pricing .under{position:relative;text-align:center;margin-top:26px;font-size:13.5px;color:#7FA995}
.p-pricing .under b{color:#fff}
.p-pricing .under a{color:var(--brass-lt);text-decoration:underline;text-underline-offset:3px}

@media(max-width:1180px){
  .pgrid{grid-template-columns:repeat(2,1fr)}
  .pc{grid-row:auto;display:flex;flex-direction:column}
  .pl{flex:1}
}
@media(max-width:640px){ .pgrid{grid-template-columns:1fr} }

/* ---------- 2. the window, drawn ----------
   ONE radius on everything, var(--r). The bars, the track and the cards all use
   it; the only round things on the page are the avatar and the "Most taken"
   pill, which are circles on purpose rather than a second corner size. */
.p-pricing .sect{padding:60px 0}
.p-pricing .sect.soft{background:var(--soft)}
.p-pricing .sect.sand{background:var(--sand)}
.p-pricing .sect h2{font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;
  letter-spacing:-.028em;font-size:clamp(24px,2.4vw,33px);margin:0}
.p-pricing .sect .say{margin:14px 0 0;font-size:16.5px;line-height:1.62;color:#4C5548;max-width:72ch}
.p-pricing .sect .say b{color:var(--ink)}

.p-pricing .winwrap{margin-top:34px;background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r);padding:26px 28px 22px}

/* the scale: 2017 on the left, today and the days ahead on the right */
.p-pricing .winscale{display:grid;grid-template-columns:170px minmax(0,1fr);gap:18px;
  align-items:center;margin-bottom:6px}
.p-pricing .winscale .ticks{display:flex;justify-content:space-between;
  font:500 11.5px var(--fm);color:var(--mut)}
.p-pricing .winscale .ticks i{font-style:normal}
.p-pricing .winscale .ticks i.now{color:var(--green);font-weight:600}

.p-pricing .winrow{display:grid;grid-template-columns:170px minmax(0,1fr);gap:18px;
  align-items:center;padding:11px 0;border-top:1px solid var(--line)}
.p-pricing .winrow:first-of-type{border-top:0}
.p-pricing .winrow .wn{display:flex;align-items:center;gap:9px;font-size:14px;font-weight:600}
.p-pricing .winrow .dot{width:10px;height:10px;border-radius:50%;flex:0 0 auto}
.p-pricing .winrow .wt{position:relative;height:26px;border-radius:var(--r);
  background:repeating-linear-gradient(135deg,#F2F0EA 0 6px,#EAE7DE 6px 12px)}

/* the bar: where the plan can actually read */
.p-pricing .winrow .wb{position:absolute;top:0;bottom:0;border-radius:var(--r);display:flex;
  align-items:center;padding:0 10px;font:500 11.5px var(--fm);white-space:nowrap;
  overflow:hidden}
.p-pricing .winrow .wb span{opacity:.9}

/* the same ramp as the cards, so a colour means the same thing twice */
.p-pricing .t0 .dot,
.p-pricing .wb.t0{background:#9FB6A8}
.p-pricing .t1 .dot,
.p-pricing .wb.t1{background:#7FC9A4}
.p-pricing .t2 .dot,
.p-pricing .wb.t2{background:#3E9E72}
.p-pricing .t3 .dot,
.p-pricing .wb.t3{background:#124A31}
.p-pricing .t4 .dot,
.p-pricing .wb.t4{background:linear-gradient(90deg,#0B3A26,#07281A)}
.p-pricing .wb.t0,
.p-pricing .wb.t1{color:#0E3524}
.p-pricing .wb.t2,
.p-pricing .wb.t3,
.p-pricing .wb.t4{color:#fff}

/* the line marking today, which is the thing the free key cannot cross */
.p-pricing .nowline{position:absolute;top:-6px;bottom:-6px;width:2px;background:var(--brass);z-index:2}
.p-pricing .nowline::after{content:"today";position:absolute;top:-17px;left:50%;
  transform:translateX(-50%);font:600 10px var(--fm);color:var(--brass);
  letter-spacing:.04em;text-transform:uppercase}

.p-pricing .winnote{display:flex;gap:26px;flex-wrap:wrap;margin-top:20px;padding-top:18px;
  border-top:1px solid var(--line)}
.p-pricing .winnote div{flex:1 1 240px}
.p-pricing .winnote b{display:block;font-size:14px;margin-bottom:5px}
.p-pricing .winnote p{margin:0;font-size:13.5px;line-height:1.6;color:#4C5548}

@media(max-width:760px){
  .winscale,.winrow{grid-template-columns:1fr}
  .winscale{display:none}
}

/* ---------- 3. what Analyst adds ---------- */
.p-pricing .sect.deep{background:var(--green-deep);color:#fff}
.p-pricing .sect.deep h2{color:#fff}
.p-pricing .sect.deep .say{color:var(--on-green)}
.p-pricing .sect.deep .say b{color:#fff}

.p-pricing .vs{display:grid;grid-template-columns:1fr auto 1fr;gap:22px;align-items:stretch;
  margin-top:34px}
.p-pricing .vs-col{background:rgba(0,0,0,.24);border:1px solid var(--line-green);
  border-radius:var(--r);padding:20px 22px;display:flex;flex-direction:column}
.p-pricing .vs-col.win{background:linear-gradient(165deg,rgba(185,138,62,.14),rgba(0,0,0,.28));
  border-color:var(--brass)}
.p-pricing .vs-h{display:flex;align-items:center;justify-content:space-between;gap:12px;
  margin-bottom:4px}
.p-pricing .vs-h b{font-size:15px}
.p-pricing .vs-h span{font:500 11px var(--fm);letter-spacing:.06em;text-transform:uppercase;
  color:var(--on-green)}
.p-pricing .vs-col.win .vs-h span{color:var(--brass-lt)}
.p-pricing .vs-sub{margin:0 0 14px;font-size:13px;color:#7FA995}

.p-pricing .vs-code{background:rgba(0,0,0,.32);border-radius:var(--r);padding:13px 15px;
  font-family:var(--fm);font-size:12px;line-height:1.75;color:#A9C7B8;
  overflow-x:auto;margin:0}
.p-pricing .vs-code .k{color:#8FB3A0}.vs-code .s{color:#E4C77E}.vs-code .n{color:#7FE3B0}
.p-pricing .vs-code .prc{color:#4E7862}

.p-pricing .vs-steps{margin:0;padding:0;list-style:none;flex:1}
.p-pricing .vs-steps li{display:flex;gap:10px;padding:8px 0;font-size:13.5px;line-height:1.55;
  color:var(--on-green);border-top:1px solid rgba(255,255,255,.09)}
.p-pricing .vs-steps li:first-child{border-top:0}
.p-pricing .vs-steps i{font-style:normal;flex:0 0 auto;width:18px;font-family:var(--fm);
  font-size:11.5px;color:#5E8672}
.p-pricing .vs-col.win .vs-steps i{color:var(--brass-lt)}

.p-pricing .vs-mid{display:flex;align-items:center;justify-content:center}
.p-pricing .vs-mid span{font:600 12px var(--fm);letter-spacing:.08em;text-transform:uppercase;
  color:#5E8672;writing-mode:vertical-rl;transform:rotate(180deg)}

.p-pricing .vs-foot{margin-top:16px;padding-top:14px;border-top:1px solid rgba(255,255,255,.12);
  font-size:13px;color:#7FA995}
.p-pricing .vs-col.win .vs-foot{color:var(--brass-lt)}

.p-pricing .statgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:26px}
.p-pricing .statgrid div{background:rgba(0,0,0,.2);border:1px solid var(--line-green);
  border-radius:var(--r);padding:16px 18px}
.p-pricing .statgrid b{display:block;font-family:var(--fm);font-size:12.5px;color:var(--brass-lt);
  margin-bottom:6px}
.p-pricing .statgrid p{margin:0;font-size:13px;line-height:1.55;color:var(--on-green)}

@media(max-width:980px){
  .vs{grid-template-columns:1fr}
  .vs-mid{display:none}
  .statgrid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:560px){ .statgrid{grid-template-columns:1fr} }

/* ---------- 4. every endpoint against every plan ---------- */
.p-pricing .mwrap{margin-top:32px;background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r);overflow:hidden}
.p-pricing .mtab{width:100%;border-collapse:collapse}
.p-pricing .mtab thead th{background:var(--sand);font:600 12.5px var(--fb);color:#4C5548;
  text-align:center;padding:13px 8px;border-bottom:1px solid var(--line);
  white-space:nowrap}
.p-pricing .mtab thead th:first-child{text-align:left;padding-left:22px}
.p-pricing .mtab thead th em{display:block;font-style:normal;font:500 11px var(--fm);
  color:var(--mut);margin-top:3px}
.p-pricing .mtab tbody th{text-align:left;padding:14px 22px;border-bottom:1px solid var(--line);
  font-weight:400}
.p-pricing .mtab tbody th b{display:block;font-size:14.5px;font-weight:600;color:var(--ink)}
.p-pricing .mtab tbody th span{display:block;font-size:12.5px;color:var(--mut);margin-top:3px}
.p-pricing .mtab tbody td{text-align:center;border-bottom:1px solid var(--line);padding:14px 8px}
.p-pricing .mtab tbody tr:last-child th,
.p-pricing .mtab tbody tr:last-child td{border-bottom:0}
.p-pricing .mtab td.n{font-family:var(--fm);font-size:12.5px;color:var(--mut)}

/* a mark, not a word: the column header says which plan, so the cell only has
   to say whether */
.p-pricing .prc i{display:inline-block;width:18px;height:18px;border-radius:50%;position:relative}
.p-pricing .prc.yes i{background:#DCF0E5}
.p-pricing .prc.yes i::after{content:"";position:absolute;left:5px;top:4px;width:5px;height:9px;
  border:solid var(--mint-d);border-width:0 2px 2px 0;transform:rotate(42deg)}
.p-pricing .prc.win i{background:#F6EBD8}
.p-pricing .prc.win i::after{content:"";position:absolute;left:7px;top:7px;width:4px;height:4px;
  border-radius:50%;background:#8A6522}
.p-pricing .prc.no i{background:#F1EFE9}
.p-pricing .prc.no i::after{content:"";position:absolute;left:5px;top:8px;width:8px;height:2px;
  background:#B9B4A8}

.p-pricing .mkey{display:flex;gap:24px;flex-wrap:wrap;margin-top:18px;font-size:13px;
  color:#4C5548}
.p-pricing .mkey span{display:flex;align-items:center;gap:8px}
.p-pricing .mkey i{display:inline-block;width:16px;height:16px;border-radius:50%}
.p-pricing .mkey i.yes{background:#DCF0E5}.mkey i.win{background:#F6EBD8}.mkey i.no{background:#F1EFE9}

@media(max-width:900px){
  .mwrap{overflow-x:auto}
  .mtab{min-width:760px}
}

/* ---------- 5. which one am I ---------- */
.p-pricing .wgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:34px}
.p-pricing .wc{position:relative;border-radius:var(--r);padding:26px 28px;
  border:1px solid var(--line);background:var(--paper);display:flex;
  flex-direction:column}

/* the same ramp again: a reader who learned it at the top reads it here free */
.p-pricing .wc.t1{border-left:4px solid #7FC9A4}
.p-pricing .wc.t2{border-left:4px solid #3E9E72}
.p-pricing .wc.t3{border-left:4px solid #124A31;background:#FBFAF6}
.p-pricing .wc.t4{border-left:4px solid var(--brass)}

.p-pricing .wf{position:absolute;top:20px;right:24px;background:var(--brass);color:#20180A;
  font:700 10.5px var(--fb);letter-spacing:.05em;text-transform:uppercase;
  padding:4px 11px;border-radius:999px}
.p-pricing .wwho{margin:0;font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;
  letter-spacing:-.02em;font-size:20px;line-height:1.25;color:var(--ink);max-width:24ch}
.p-pricing .wplan{display:inline-flex;align-items:baseline;gap:7px;margin-top:12px;
  font:600 13px var(--fm);color:var(--green)}
.p-pricing .wplan i{font-style:normal;color:var(--mut);font-weight:500}
.p-pricing .wbody{margin:14px 0 0;font-size:15px;line-height:1.62;color:#4C5548}

.p-pricing .wneeds{margin:16px 0 0;padding:0;list-style:none;flex:1}
.p-pricing .wneeds li{position:relative;padding:6px 0 6px 22px;font-size:13.5px;color:#4C5548}
.p-pricing .wneeds li::before{content:"";position:absolute;left:0;top:12px;width:9px;height:2px;
  background:var(--brass)}

.p-pricing .wtell{margin:16px 0 0;padding-top:14px;border-top:1px solid var(--line);
  font-size:13.5px;line-height:1.6;color:var(--mut)}

@media(max-width:900px){ .wgrid{grid-template-columns:1fr} }

/* ---------- 6. the limits, moving ----------
   The gap between 60 and 240 a minute is a thing you should be able to SEE.
   Each meter fills at its own plan's pace, so five bars racing at five speeds
   says it faster than five numbers in a table. */
.p-pricing .rwrap{margin-top:34px;background:rgba(0,0,0,.24);border:1px solid var(--line-green);
  border-radius:var(--r);padding:24px 26px}
.p-pricing .rhead{display:grid;grid-template-columns:180px minmax(0,1fr) minmax(0,1fr);gap:20px;
  padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,.12);
  font:500 11px var(--fm);letter-spacing:.06em;text-transform:uppercase;color:#5E8672}

.p-pricing .rrow{display:grid;grid-template-columns:180px minmax(0,1fr) minmax(0,1fr);gap:20px;
  align-items:center;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.08)}
.p-pricing .rrow:last-child{border-bottom:0}
.p-pricing .rn{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:600;color:#fff}
.p-pricing .rn .dot{width:10px;height:10px;border-radius:50%;flex:0 0 auto}

/* the per-minute meter: fills, holds, empties, at the plan's own speed */
.p-pricing .rmeter,
.p-pricing .rquota{position:relative;display:flex;align-items:center;gap:12px}
.p-pricing .rmeter>i,
.p-pricing .rquota>i{display:block;height:22px;border-radius:var(--r);flex:1}
.p-pricing .rmeter>i{background:rgba(255,255,255,.07);position:relative;overflow:hidden}
.p-pricing .rmeter>i::after{content:"";position:absolute;left:0;top:0;bottom:0;width:0;
  border-radius:var(--r);background:inherit;filter:brightness(1.6)}

.p-pricing .rfill{position:relative}
.p-pricing .rfill::before{content:"";position:absolute;left:0;top:0;bottom:0;width:0;
  border-radius:var(--r);animation-name:fillup;animation-timing-function:linear;
  animation-iteration-count:infinite}
@keyframes fillup{
  0%{width:0;opacity:1}
  72%{width:100%;opacity:1}
  86%{width:100%;opacity:.35}
  100%{width:0;opacity:0}
}
.p-pricing .rfill.t0::before{background:#9FB6A8}
.p-pricing .rfill.t1::before{background:#7FC9A4}
.p-pricing .rfill.t2::before{background:#3E9E72}
.p-pricing .rfill.t3::before{background:#2E9E68}
.p-pricing .rfill.t4::before{background:linear-gradient(90deg,#D4A85C,#B98A3E)}

/* the monthly bar: static, because a month is not a thing you watch tick */
.p-pricing .rbar{position:relative;background:rgba(255,255,255,.07)}
.p-pricing .rbar::after{content:"";position:absolute;left:0;top:0;bottom:0;width:var(--w);
  border-radius:var(--r);animation:pricebar 2.2s cubic-bezier(.22,1,.36,1) both}
@keyframes pricebar{from{width:0}to{width:var(--w)}}
.p-pricing .rbar.t0::after{background:#9FB6A8}
.p-pricing .rbar.t1::after{background:#7FC9A4}
.p-pricing .rbar.t2::after{background:#3E9E72}
.p-pricing .rbar.t3::after{background:#2E9E68}
.p-pricing .rbar.t4::after{background:linear-gradient(90deg,#D4A85C,#B98A3E)}

.p-pricing .rmeter em,
.p-pricing .rquota em{font-style:normal;font:600 13px var(--fm);color:#fff;
  white-space:nowrap;min-width:92px;text-align:right}
.p-pricing .rmeter em small,
.p-pricing .rquota em small{font-weight:500;color:#7FA995;font-size:11px}

.p-pricing .t0 .dot{background:#9FB6A8}.t1 .dot{background:#7FC9A4}
.p-pricing .t2 .dot{background:#3E9E72}.t3 .dot{background:#124A31;box-shadow:0 0 0 1px #2E9E68}
.p-pricing .t4 .dot{background:var(--brass)}

.p-pricing .rnote{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:26px}
.p-pricing .rnote div{background:rgba(0,0,0,.2);border:1px solid var(--line-green);
  border-radius:var(--r);padding:18px 20px}
.p-pricing .rnote b{display:block;font-family:var(--fm);font-size:12.5px;color:var(--brass-lt);
  margin-bottom:6px}
.p-pricing .rnote p{margin:0;font-size:13.5px;line-height:1.6;color:var(--on-green)}
.p-pricing .rnote code{font-family:var(--fm);font-size:12px;color:#fff}

@media(prefers-reduced-motion:reduce){
  .rfill::before{animation:none;width:100%}
  .rbar::after{animation:none;width:var(--w)}
}
@media(max-width:860px){
  .rhead{display:none}
  .rrow{grid-template-columns:1fr;gap:10px}
}

/* ---------- 7. what is not here ----------
   On a page asking for money, the things a dataset does NOT contain are worth
   more than another feature block. Anyone who finds out after paying asks for
   a refund; anyone who reads it here either walks away or trusts the rest. */
.p-pricing .ngrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:34px}
.p-pricing .nc{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);
  padding:24px 26px;position:relative}
.p-pricing .nc::before{content:"";position:absolute;left:0;top:22px;bottom:22px;width:3px;
  border-radius:var(--r);background:var(--clay)}
.p-pricing .nc.soft::before{background:var(--brass)}
.p-pricing .nc b{display:block;font-family:var(--fd);font-weight:700;
  font-variation-settings:"wdth" 92;letter-spacing:-.02em;font-size:18px;
  margin-bottom:9px}
.p-pricing .nc p{margin:0;font-size:14.5px;line-height:1.62;color:#4C5548}
.p-pricing .nc p + p{margin-top:10px}
.p-pricing .nc code{font-family:var(--fm);font-size:12.5px;background:var(--sand);
  border-radius:var(--r);padding:2px 7px}

.p-pricing .nband{margin-top:26px;background:var(--green-deep);border-radius:var(--r);
  padding:26px 30px;display:grid;grid-template-columns:minmax(0,1fr) auto;
  gap:24px;align-items:center}
.p-pricing .nband p{margin:0;color:var(--on-green);font-size:15.5px;line-height:1.62;max-width:78ch}
.p-pricing .nband b{color:#fff}
.p-pricing .nband a{display:inline-flex;align-items:center;justify-content:center;height:46px;
  padding:0 24px;border-radius:var(--r);background:var(--brass);color:#20180A;
  font:600 14.5px var(--fb);text-decoration:none;white-space:nowrap}

@media(max-width:980px){ .ngrid{grid-template-columns:1fr} .nband{grid-template-columns:1fr} }

/* ---------- 8. last questions, then back to the plans ----------
   Somebody who has read the whole page should not have to scroll back up to
   act, so the close carries the decision as well as the reassurance. */
.p-pricing .fqwrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,380px);gap:38px;
  margin-top:34px;align-items:start}
.p-pricing .fq{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);
  margin-bottom:10px;overflow:hidden}
.p-pricing .fq summary{list-style:none;cursor:pointer;padding:17px 20px;font-size:15.5px;
  font-weight:600;color:var(--ink);display:flex;align-items:center;
  justify-content:space-between;gap:16px}
.p-pricing .fq summary::-webkit-details-marker{display:none}
.p-pricing .fq summary i{flex:0 0 auto;width:18px;height:18px;position:relative;
  transition:transform .18s ease}
.p-pricing .fq summary i::before,
.p-pricing .fq summary i::after{content:"";position:absolute;
  background:var(--brass);border-radius:var(--r)}
.p-pricing .fq summary i::before{left:0;top:8px;width:18px;height:2px}
.p-pricing .fq summary i::after{left:8px;top:0;width:2px;height:18px}
.p-pricing .fq[open] summary i{transform:rotate(45deg)}
.p-pricing .fq p{margin:0;padding:0 20px 19px;font-size:14.5px;line-height:1.65;color:#4C5548}

.p-pricing .fqside{background:var(--green-deep);border-radius:var(--r);padding:28px 30px;
  position:sticky;top:24px;color:#fff}
.p-pricing .fqside h3{font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;
  letter-spacing:-.02em;font-size:23px;margin:0 0 10px}
.p-pricing .fqside p{margin:0 0 20px;font-size:14.5px;line-height:1.62;color:var(--on-green)}
.p-pricing .fqpick{display:flex;flex-direction:column;gap:8px}
.p-pricing .fqpick a{display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding:13px 16px;border-radius:var(--r);text-decoration:none;font-size:14.5px;
  font-weight:600;border:1px solid rgba(255,255,255,.16);color:#fff;
  background:rgba(255,255,255,.05)}
.p-pricing .fqpick a b{font-family:var(--fm);font-size:13px;font-weight:500;color:var(--on-green)}
.p-pricing .fqpick a.prlead{background:var(--brass);color:#20180A;border-color:var(--brass)}
.p-pricing .fqpick a.prlead b{color:#3D2E12}
.p-pricing .fqfoot{margin:18px 0 0;font-size:12.5px;line-height:1.6;color:#7FA995}
.p-pricing .fqfoot a{color:var(--brass-lt);text-decoration:underline;text-underline-offset:3px}

@media(max-width:980px){
  .fqwrap{grid-template-columns:1fr}
  .fqside{position:static}
}

/* ================= refunds =================
   The header is .phead.grad, the site's own — see the note in the page. Nothing
   here restyles it.
   Scoped to .p-refunds. Reuses the pricing hero shell (.phero, .prhead,
   .prlead) deliberately — the two pages are read one after the other and a
   different header on each would read as two different sites. */

.p-refunds .rfsteps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:32px}
.p-refunds .rfsteps article{background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r);padding:24px 26px}
.p-refunds .rfsteps .n{font-family:var(--fm);font-size:11.5px;color:var(--brass)}
.p-refunds .rfsteps h3{margin:9px 0 8px;font-size:17px}
.p-refunds .rfsteps p{margin:0;font-size:14.5px;line-height:1.6;color:#4C5548}
.p-refunds .rfsteps a{color:var(--green);text-decoration:underline;text-underline-offset:3px}

/* the policy itself, set apart because it is the sentence that governs */
.p-refunds .rfpolicy{margin-top:22px;background:var(--green-deep);border-radius:var(--r);
  padding:28px 32px;color:#fff}
.p-refunds .rfp-eyebrow{margin:0 0 10px;font-family:var(--fm);font-size:11.5px;
  letter-spacing:.08em;text-transform:uppercase;color:var(--brass-lt)}
.p-refunds .rfp-text{margin:0;font-size:17px;line-height:1.6;color:#fff;max-width:82ch}
.p-refunds .rfp-foot{margin:14px 0 0;font-size:13.5px;line-height:1.6;color:#7FA995;
  max-width:82ch}

.p-refunds .rfwhy{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:32px}
.p-refunds .rfwhy article{background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r);padding:24px 26px;border-left:3px solid var(--brass)}
.p-refunds .rfwhy h3{margin:0 0 10px;font-size:17.5px}
.p-refunds .rfwhy p{margin:0 0 10px;font-size:14.5px;line-height:1.62;color:#4C5548}
.p-refunds .rfwhy p:last-child{margin-bottom:0}
.p-refunds .rfwhy code{font-family:var(--fm);font-size:12.5px;background:var(--sand);
  border-radius:var(--r);padding:2px 7px}

.p-refunds .rfgrid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,380px);
  gap:34px;margin-top:32px;align-items:start}
.p-refunds .rfform{background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r);padding:28px 30px}
.p-refunds .rf .field{margin-bottom:16px}
.p-refunds .rf label{display:block;font-size:13.5px;font-weight:600;margin-bottom:6px}
.p-refunds .rf .opt{font-weight:400;color:var(--mut)}
.p-refunds .rf input,.p-refunds .rf select,.p-refunds .rf textarea{width:100%;
  font:400 14.5px var(--fb);color:var(--ink);background:var(--soft);
  border:1px solid var(--line);border-radius:var(--r);padding:11px 13px}
.p-refunds .rf textarea{min-height:132px;resize:vertical;line-height:1.6}
.p-refunds .rf input:focus,.p-refunds .rf select:focus,.p-refunds .rf textarea:focus{
  outline:none;border-color:var(--green);background:var(--paper)}
.p-refunds .rf .hint{margin:7px 0 0;font-size:12.5px;line-height:1.55;color:var(--mut)}
.p-refunds .rf .hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}

.p-refunds .rfsubmit{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:6px}
.p-refunds .rfnote{font-size:12.5px;color:var(--mut)}

.p-refunds .rfflash{margin:0 0 20px;padding:14px 16px;border-radius:var(--r);
  font-size:14.5px;line-height:1.6}
.p-refunds .rfflash.ok{background:#DCF0E5;color:#1C5C3C;border:1px solid #9FD4B8}
.p-refunds .rfflash.bad{background:var(--red-bg);color:#8C3A31;border:1px solid var(--red-line)}
.p-refunds .rfflash a{color:inherit;text-decoration:underline;text-underline-offset:3px}

.p-refunds .rfside{position:sticky;top:24px}
.p-refunds .rfside h3{font-family:var(--fd);font-weight:700;
  font-variation-settings:"wdth" 92;letter-spacing:-.02em;font-size:20px;margin:0 0 16px}
.p-refunds .rfnext{margin:0;padding:0;list-style:none}
.p-refunds .rfnext li{display:flex;gap:13px;padding:0 0 18px}
.p-refunds .rfnext .n{flex:0 0 26px;height:26px;border-radius:50%;background:var(--sand);
  color:var(--green);display:grid;place-items:center;font:600 12.5px var(--fm)}
.p-refunds .rfnext b{display:block;font-size:14.5px;margin-bottom:3px}
.p-refunds .rfnext p{margin:0;font-size:13.5px;line-height:1.6;color:#4C5548}

.p-refunds .rfchargeback{background:var(--sand);border-radius:var(--r);padding:20px 22px}
.p-refunds .rfchargeback b{display:block;font-size:14.5px;margin-bottom:8px}
.p-refunds .rfchargeback p{margin:0 0 9px;font-size:13.5px;line-height:1.6;color:#4C5548}
.p-refunds .rfchargeback p:last-child{margin-bottom:0}

.p-refunds .rfjust{margin-top:18px;font-size:13.5px;color:var(--mut)}
.p-refunds .rfjust a{color:var(--green);text-decoration:underline;text-underline-offset:3px}

@media(max-width:980px){
  .p-refunds .rfsteps,.p-refunds .rfwhy{grid-template-columns:1fr}
  .p-refunds .rfgrid{grid-template-columns:1fr}
  .p-refunds .rfside{position:static}
}

/* the manual: the file is the product, so the actions sit above the prose */
.mnbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:22px 0 8px;
  padding:18px 20px;background:var(--sand);border-radius:var(--r)}
.mnsize{font:500 12.5px var(--fm);color:var(--mut)}
.mncopy.done{border-color:var(--mint-d);color:var(--mint-d)}

/* documentation hub: the machine-readable formats.
   The manual spans two columns because it is the one that matters; the other
   three are equals below it. */
.mrgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:20px}
.mrc{display:flex;flex-direction:column;background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r);padding:22px 24px;text-decoration:none;
  transition:border-color .15s ease,transform .15s ease}
.mrc:hover{border-color:var(--green);transform:translateY(-2px)}
.mrc.lead{grid-column:span 3;border-left:3px solid var(--brass);background:#FBFAF6}
.mrc-k{font:500 11.5px var(--fm);color:var(--brass);letter-spacing:.03em}
.mrc b{display:block;font-family:var(--fd);font-weight:700;
  font-variation-settings:"wdth" 92;letter-spacing:-.02em;font-size:18px;
  color:var(--ink);margin:7px 0 8px}
.mrc p{margin:0;font-size:14px;line-height:1.6;color:#4C5548}
.mrc .mrc-why{margin-top:10px;padding-top:10px;border-top:1px solid var(--line);
  font-size:13.5px;color:var(--mut)}
.mrc .mrc-why b{display:inline;font-family:inherit;font-size:inherit;color:var(--ink)}
.mrc code{font-family:var(--fm);font-size:12.5px;background:var(--sand);
  border-radius:var(--r);padding:2px 6px}
.mrc-go{margin-top:14px;font-size:13.5px;font-weight:600;color:var(--green)}
.mrfoot{margin:18px 0 0;font-size:14px;line-height:1.6;color:#4C5548}
.mrfoot a{color:var(--green);text-decoration:underline;text-underline-offset:3px}

@media(max-width:900px){
  .mrgrid{grid-template-columns:1fr}
  .mrc.lead{grid-column:auto}
}

/* ---------- the SDK page ---------- */
.p-labs .sdkcta,.sdkcta{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:22px}
.sdkcta-n{font:500 12.5px var(--fm);color:var(--on-green)}

.sdkwho{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:30px}
.sdkwho article{background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r);padding:24px 26px}
.sdkwho article:first-child{border-left:3px solid var(--mint-d)}
.sdkwho article:last-child{border-left:3px solid var(--brass)}
.sdkwho b{display:block;font-family:var(--fd);font-weight:700;
  font-variation-settings:"wdth" 92;font-size:17px;margin-bottom:12px}
.sdkwho ul{margin:0;padding-left:18px}
.sdkwho li{font-size:14.5px;line-height:1.6;color:#4C5548;margin-bottom:8px}

.sdklangs{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:30px}
.sdkl{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);
  padding:22px 24px}
.sdkl-h{display:flex;align-items:baseline;justify-content:space-between;gap:12px;
  margin-bottom:14px}
.sdkl-h b{font-family:var(--fd);font-weight:700;font-variation-settings:"wdth" 92;
  font-size:18px}
.sdkl-h span{font:500 12px var(--fm);color:var(--mut)}
.sdkl-i{background:var(--sand)!important;margin-bottom:12px!important}
.sdkl-r{margin:12px 0 0;font-size:12.5px;color:var(--mut)}

.sdkkeys{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:30px}
.sdkkeys article{background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r);padding:24px 26px}
.sdkkeys .n{font:500 11.5px var(--fm);color:var(--brass)}
.sdkkeys b{display:block;font-family:var(--fd);font-weight:700;
  font-variation-settings:"wdth" 92;font-size:17px;margin:8px 0 9px}
.sdkkeys p{margin:0 0 9px;font-size:14px;line-height:1.6;color:#4C5548}
.sdkkeys p:last-child{margin-bottom:0}
.sdkkeys a{color:var(--green);text-decoration:underline;text-underline-offset:3px}

.sdknote{margin-top:20px;background:var(--sand);border-radius:var(--r);padding:24px 28px}
.sdknote b{display:block;font-size:15.5px;margin-bottom:8px}
.sdknote p{margin:0;font-size:14.5px;line-height:1.62;color:#4C5548;max-width:88ch}

.sdkenv{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,400px);gap:26px;
  margin-top:30px;align-items:start}
.sdkenv-x div{padding:0 0 18px}
.sdkenv-x b{display:block;font-size:15px;color:#fff;margin-bottom:6px}
.sdkenv-x p{margin:0;font-size:14px;line-height:1.6;color:var(--on-green)}
.sdkenv-x code{font-family:var(--fm);font-size:12.5px;color:var(--brass-lt)}

.sdkfoot{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}

@media(max-width:980px){
  .sdkb,.sdkenv{grid-template-columns:1fr}
  .sdkwho,.sdklangs,.sdkkeys{grid-template-columns:1fr}
}

/* The homepage H1 carries two sentences: the keyword, then the line that sells.
   The second is set lighter so the eye reads them as one statement rather than
   two competing headlines. */
.p-home .hero h1 .h1-sub{color:#B9D3C3;font-weight:600}

/* ---------------- account sandbox ----------------
   A real table with a DARK header row. The first version printed the field name
   beside every value, so each row carried its own legend and the whole thing
   read as compressed. One header, then data. */
.sbxcard{grid-column:1 / -1}
.sbxcard h2{margin:0 0 6px}

.sbx{margin-top:16px;border:1px solid var(--line);border-radius:var(--r);
  overflow:hidden;background:var(--paper)}
.sbx-tabs{display:flex;gap:4px;padding:10px 12px 0;background:var(--sand);flex-wrap:wrap}
.sbx-tab{appearance:none;border:0;background:none;cursor:pointer;
  font:600 13.5px var(--fb);color:#4C5548;padding:9px 15px;
  border-radius:var(--r) var(--r) 0 0}
.sbx-tab.on{background:var(--paper);color:var(--ink)}

/* the explanation and the request line belong together, not floating apart */
.sbx-head{padding:15px 16px;border-bottom:1px solid var(--line)}
.sbx-tell{margin:0 0 12px;font-size:13.5px;line-height:1.55;color:var(--mut)}
.sbx-bar{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.sbx-req{flex:1;min-width:0;font-family:var(--fm);font-size:12.5px;color:var(--mut);
  background:var(--soft);border:1px solid var(--line);border-radius:var(--r);
  padding:9px 13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sbx-req b{color:var(--ink);font-weight:500}
.sbx-run{appearance:none;border:0;cursor:pointer;background:var(--brass);color:#20180A;
  font:600 14px var(--fb);padding:11px 30px;border-radius:var(--r);flex:0 0 auto}
.sbx-run:disabled{opacity:.6;cursor:default}

/* height reserved, so pressing Run never shifts the page under the reader */
.sbx-out{min-height:250px}
.sbx-msg{padding:48px 20px;text-align:center;font-size:14px;color:var(--mut)}
.sbx-msg b{color:var(--ink)}

/* The idle panel teaches rather than sitting blank. Nothing here changes size,
   so the layout is identical before and after the first Run. */
.sbx-idle{padding:26px 20px;text-align:center}
.sbx-flow{display:flex;align-items:flex-start;justify-content:center;gap:0;
  margin-bottom:20px;flex-wrap:nowrap}
.fnode{display:flex;flex-direction:column;align-items:center;gap:5px;width:150px;
  flex:0 0 auto}
.fic{display:grid;place-items:center;width:38px;height:38px;border-radius:var(--r);
  background:var(--sand);color:var(--green)}
.fic svg{width:19px;height:19px}
.fnode b{font-size:13.5px}
.fnode span{font-size:11.5px;line-height:1.4;color:var(--mut);max-width:130px}

/* the pulse travels the line; it never moves anything */
.fline{position:relative;flex:1 1 auto;max-width:90px;height:2px;margin-top:18px;
  background:var(--line);border-radius:999px;overflow:hidden}
.fline i{position:absolute;top:0;bottom:0;width:34%;border-radius:999px;
  background:linear-gradient(90deg,transparent,var(--brass),transparent);
  animation:sbxpulse 2.6s ease-in-out infinite}
.fline:last-of-type i{animation-delay:.5s}
@keyframes sbxpulse{
  0%{transform:translateX(-120%)}
  60%{transform:translateX(300%)}
  100%{transform:translateX(300%)}
}

.sbx-idle-t{margin:0 auto 14px;max-width:62ch;font-size:14px;line-height:1.6;
  color:var(--mut)}
.sbx-idle-t b{color:var(--ink)}
/* Two buttons rather than a row of links. Enough colour to be found, not
   enough to compete with Run — which is still the thing to press. */
.sbx-idle-l{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin:0}
.sbxb{display:inline-flex;align-items:center;gap:8px;padding:9px 16px;
  border-radius:var(--r);font:600 13px var(--fb);text-decoration:none;
  border:1px solid transparent;transition:transform .12s ease}
.sbxb i{display:grid;place-items:center;width:17px;height:17px;flex:0 0 auto}
.sbxb i svg{width:15px;height:15px}
.sbxb:hover{transform:translateY(-1px)}
.sbxb.go{background:#E4EFE8;color:#14573A;border-color:#BFDCCC}
.sbxb.go:hover{border-color:#14573A}
.sbxb.key{background:#F7EEDC;color:#7A5A22;border-color:#E6D2AA}
.sbxb.key:hover{border-color:#7A5A22}

@media(prefers-reduced-motion:reduce){ .fline i{animation:none;opacity:.5} }
@media(max-width:620px){
  .sbx-flow{flex-wrap:wrap;gap:14px}
  .fline{display:none}
}

.sbx-sum{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:12px 16px;
  background:var(--soft);border-bottom:1px solid var(--line);font-size:13px}
.sbx-sum b{font-size:14.5px}
.sbx-sum span{color:var(--mut)}
.sbx-sum .sbx-when{font-weight:600;color:var(--green)}
.sbx-sum span i{font-style:normal;font-family:var(--fm);font-size:12px;color:var(--ink);
  margin-left:5px}
.sbx-sum .sbx-st{margin-left:auto;font:600 11.5px var(--fm);background:#DCF0E5;
  color:#1C5C3C;padding:3px 9px;border-radius:999px}
.sbx-sum .sbx-st.bad{background:#F6E3E0;color:#8C3A31}

/* the table scrolls sideways on a narrow screen rather than wrapping its rows */
.sbx-scroll{overflow-x:auto}
.sbx-t{width:100%;border-collapse:collapse;table-layout:fixed;min-width:560px}
.sbx-t thead th{background:var(--green-deep);color:#B9D3C3;text-align:left;
  font:600 11px var(--fm);letter-spacing:.07em;text-transform:uppercase;
  padding:10px 14px;white-space:nowrap}
.sbx-t tbody td{padding:10px 14px;border-bottom:1px solid var(--line);font-size:13.5px;
  vertical-align:middle}
.sbx-t tbody tr:last-child td{border-bottom:0}

/* every cell truncates rather than wrapping — a long race name must not push
   the id onto a second line and double the row height */
.sbx-t td span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sbx-t .w{width:auto}
.sbx-t .s{width:110px}
.sbx-t .m{width:130px;font-family:var(--fm);font-size:12px;color:var(--mut)}
.sbx-t .n{width:80px;text-align:right;font-family:var(--fm);font-size:12.5px}
.sbx-t th.n{text-align:right}

.sbx-more{margin:0;padding:11px 16px;font-size:12.5px;color:var(--mut);
  border-bottom:1px solid var(--line)}

.sbx-err{padding:22px 18px}
.sbx-err b{display:block;font-family:var(--fm);font-size:13px;color:#8C3A31;margin-bottom:6px}
.sbx-err p{margin:0;font-size:14px;line-height:1.6;color:#4C5548}

.sbx-raw{border-top:1px solid var(--line)}
.sbx-raw summary{cursor:pointer;padding:12px 16px;font-size:13px;font-weight:600;
  color:var(--green)}
.sbx-raw pre{margin:0;padding:0 16px 16px;font-family:var(--fm);font-size:11.5px;
  line-height:1.7;color:#4C5548;max-height:360px;overflow:auto;white-space:pre-wrap;
  word-break:break-word}

/* ---------------- coverage hero: the market ----------------
   This replaced a grid of dots, half of them red, captioned "placings only" —
   the largest thing on the page said the archive was mostly the weaker kind.
   That is still said below, with its own heading. Up here belongs the part
   nobody else publishes. */
.unit.mkt{min-width:0}

.mkt-move{padding:4px 0 18px;border-bottom:1px solid var(--line-green);margin-bottom:16px}
.mm-row{display:flex;align-items:center;gap:10px}
.mm-lab{font-style:normal;font:500 10.5px var(--fm);letter-spacing:.06em;
  text-transform:uppercase;color:#5E8672;flex:0 0 auto}
.mm-a,.mm-b{font-family:var(--fm);font-size:15px;font-weight:500;flex:0 0 auto}
.mm-a{color:#7FA995}
.mm-b{color:var(--brass-lt)}

/* fixed height; only the marker moves, so nothing reflows while it runs */
.mm-track{position:relative;flex:1 1 auto;height:3px;border-radius:999px;
  background:linear-gradient(90deg,rgba(255,255,255,.14),var(--brass))}
.mm-dot{position:absolute;top:50%;width:11px;height:11px;margin-top:-5.5px;
  border-radius:50%;background:var(--brass-lt);
  box-shadow:0 0 0 4px rgba(185,138,62,.22);
  animation:mmslide 4.2s cubic-bezier(.5,0,.2,1) infinite}
@keyframes mmslide{
  0%,8%{left:0;transform:translateX(0)}
  55%,92%{left:100%;transform:translateX(-100%)}
  100%{left:0;transform:translateX(0)}
}

.mm-imp{display:flex;align-items:center;gap:9px;margin-top:12px;font-size:12.5px;
  color:#7FA995}
.mm-imp i{width:7px;height:7px;border-radius:50%;background:var(--mint);flex:0 0 auto}
.mm-imp b{font-family:var(--fm);font-weight:500;color:#fff}
.mm-p{color:#7FA995!important}
.mm-q{color:var(--mint)!important}

.mkt-bars{display:grid;gap:13px}
.mb{min-width:0}
.mb-h{display:block;font-size:12.5px;color:#B9D3C3;margin-bottom:6px}
.mb-h b{font-family:var(--fm);font-size:14px;color:#fff;margin-right:4px}
.mb-t{display:block;height:7px;border-radius:999px;background:rgba(255,255,255,.09);
  overflow:hidden}
.mb-t i{display:block;height:100%;width:var(--w);border-radius:999px;
  background:var(--mint);transform-origin:left;animation:mbgrow 1.1s cubic-bezier(.22,1,.36,1) both}
.mb-t i.two{background:#6FC9A3;animation-delay:.12s}
.mb-t i.three{background:var(--brass-lt);animation-delay:.24s}
@keyframes mbgrow{from{transform:scaleX(0)}to{transform:scaleX(1)}}

.mkt-foot{margin:16px 0 0;padding-top:14px;border-top:1px solid var(--line-green);
  font-size:12.5px;line-height:1.6;color:#7FA995}

@media(prefers-reduced-motion:reduce){
  .mm-dot{animation:none;left:100%;transform:translateX(-100%)}
  .mb-t i{animation:none}
}

/* ---------------- coverage hero: the moving ground ----------------
   Scoped to .p-coverage, not .phead — legal.php shares that header and a
   terms page does not want a drifting background behind it.

   Built from pseudo-elements so no markup changes: ::before carries slow
   diagonal streaks, ::after a pair of soft glows that breathe. Both are low
   opacity and both are BEHIND the content, which keeps its own z-index. */
/* The hero was leaving a band of dead space under the copy because the right
   panel is taller than the left column. Aligning the two and trimming the
   bottom padding closes it without shortening the section. */
.p-data-coverage .phead{position:relative;overflow:hidden;padding-bottom:44px}
.p-data-coverage .phead-grid{align-items:stretch}
.p-data-coverage .pcopy{display:flex;flex-direction:column}
.p-data-coverage .phead > *{position:relative;z-index:1}

.p-data-coverage .phead::before{
  content:"";position:absolute;inset:-40% -20%;pointer-events:none;z-index:0;
  background-image:
    repeating-linear-gradient(112deg,
      rgba(255,255,255,.05) 0 1px, transparent 1px 30px),
    repeating-linear-gradient(112deg,
      rgba(185,138,62,.09) 0 2px, transparent 2px 190px);
  animation:covdrift 34s linear infinite;
  -webkit-mask-image:radial-gradient(120% 90% at 70% 10%, #000 20%, transparent 78%);
  mask-image:radial-gradient(120% 90% at 70% 10%, #000 20%, transparent 78%)}

@keyframes covdrift{
  from{transform:translate3d(0,0,0)}
  to{transform:translate3d(-190px,80px,0)}
}

/* two soft pools of light, out of phase so the ground never looks like it is
   pulsing to a beat */
.p-data-coverage .phead::after{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  background:
    radial-gradient(560px 380px at 18% 88%, rgba(99,217,160,.10), transparent 62%),
    radial-gradient(680px 420px at 88% 6%, rgba(185,138,62,.11), transparent 60%);
  animation:covbreathe 17s ease-in-out infinite}

@keyframes covbreathe{
  0%,100%{opacity:.55;transform:scale(1)}
  50%{opacity:1;transform:scale(1.06)}
}

/* the added paragraph: quieter than the lead, so the hero still has a hierarchy */
.p-data-coverage .phead .sub{margin:22px 0 0;max-width:66ch;
  font-family:var(--fb);font-size:14.5px;line-height:1.66;font-weight:400;
  color:#8FB3A0;padding-top:18px;border-top:1px solid var(--line-green)}
.p-data-coverage .phead .sub b{color:#D6E7DC;font-weight:600}

@media(prefers-reduced-motion:reduce){
  .p-data-coverage .phead::before,
  .p-data-coverage .phead::after{animation:none}
}
@media(max-width:1040px){
  .p-data-coverage .phead .sub{max-width:none}
}