/* Brihas site · trust blue: bright pages for reading, deep navy chapters for the big moments, one action blue,
   charts in one blue family (data only). Page rules live in assets/css/p/NAME.css, appended at build and prefixed
   with the page's body class. Final states are the default; "before" states only under .js:not(.rm).
   Contrast for every pair: data/contrast.json (scripts/contrast.py). */
@font-face{font-family:"Geist";src:url(../fonts/geist-latin-400-600.woff2) format("woff2");font-weight:400 600;font-display:swap}
@font-face{font-family:"Geist Mono";src:url(../fonts/geist-mono-latin-400-500.woff2) format("woff2");font-weight:400 500;font-display:swap}
@font-face{font-family:"Newsreader";src:url(../fonts/newsreader-latin-400-500.woff2) format("woff2");font-weight:400 500;font-display:swap}
@font-face{font-family:"Geist Fallback";src:local("Arial");size-adjust:104.76%;ascent-override:95.94%;descent-override:28.16%;line-gap-override:0%}
@font-face{font-family:"Geist Mono Fallback";src:local("Menlo"),local("Consolas"),local("Courier New");size-adjust:100%;ascent-override:92%;descent-override:26%;line-gap-override:0%}
@font-face{font-family:"Newsreader Fallback";src:local("Georgia");size-adjust:93%;ascent-override:96%;descent-override:28%;line-gap-override:0%}

:root{
  color-scheme:light;
  --sans:"Geist","Geist Fallback",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --mono:"Geist Mono","Geist Mono Fallback",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --serif:"Newsreader","Newsreader Fallback",Georgia,"Times New Roman",serif;
  --dur-instant:80ms;--dur-fast:120ms;--dur-base:200ms;--dur-slow:600ms;
  --ease-out:cubic-bezier(.16,1,.3,1);--ease-std:cubic-bezier(.4,0,.2,1);--ease-io:cubic-bezier(.65,0,.35,1);
  --r-sm:8px;--r-md:12px;--r-lg:18px;--r-xl:26px;
  --blur:18px;--gut:32px;--sec-pad:clamp(96px,14vh,168px);
  /* light: a canvas with a breath of blue, white cards */
  --bg:#FBFCFE;--bg-2:#F2F5FA;--surface:#FFFFFF;--surface-2:#F4F7FB;
  --ink:#0E1A2E;--ink-2:#3A4A63;--muted:#56647C;
  --line:rgba(14,26,46,.08);--line-2:rgba(14,26,46,.14);--line-strong:rgba(14,26,46,.36);
  /* the one action blue: buttons, links, focus, highlighted data */
  --blue:#0A64DC;--blue-hover:#0853BA;--on-blue:#FFFFFF;--link:#0A64DC;--sky:#E8F1FE;
  --blue-soft:rgba(10,100,220,.08);--tag-bg:rgba(10,100,220,.07);--tag-edge:rgba(10,100,220,.26);--dot-ring:rgba(10,100,220,.16);
  /* navy chapters */
  --navy:#081A33;--navy-2:#0E2647;--navy-ink:#A9BBD6;--azure:#5AA9FF;
  --ok:#0F7A45;
  /* charts: one blue family, darkest for the largest holder */
  --c-pro:#0E2A55;--c-fpi:#0A64DC;--c-mf:#5AA9FF;--c-ins:#A8CCF7;--c-ret:#D6E6FB;--c-oth:#E4E8EF;
  /* glass */
  --glass-tint:rgba(255,255,255,.72);--glass-solid:#FFFFFF;--glass-border:rgba(14,26,46,.08);
  --glass-hi:inset 0 1px 0 rgba(255,255,255,.8);
  --sh-glass:0 1px 2px rgba(14,26,46,.04),0 16px 40px -24px rgba(14,26,46,.24);
  --sh-card:0 1px 2px rgba(14,26,46,.04),0 24px 48px -32px rgba(14,26,46,.32);
  --sh-lift:0 2px 6px rgba(14,26,46,.05),0 44px 88px -44px rgba(8,26,51,.42);
  /* code */
  --con-bg:#FFFFFF;--con-line:rgba(14,26,46,.09);--c-key:#3A4A63;--c-str:#0E1A2E;--c-num:#0A64DC;--c-pun:#56647C;
  /* paper: the filing card, light everywhere, navy chapters included */
  --paper:#FFFFFF;--paper-ink:#0B1424;--paper-muted:#4A5872;--paper-line:rgba(11,20,36,.13);--paper-link:#0A64DC;
  --paper-hl:rgba(10,100,220,.12);--paper-ok:#0F7A45;
}

/* ---------- base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:96px;background:var(--bg)}
body{margin:0;background:var(--bg);color:var(--ink);font:400 1.0625rem/1.6 var(--sans);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:clip;font-feature-settings:"ss01" 0}
a{color:inherit}
p,h1,h2,h3,h4,dl,dd,figure{margin:0}
ul,ol{margin:0;padding:0}
h1,h2,h3,h4{font-weight:600;letter-spacing:-.02em;text-wrap:balance}
button,input,select{font:inherit;color:inherit}
code,pre,kbd{font-family:var(--mono)}
img,svg,iframe,canvas{display:block}
.wrap{max-width:1200px;margin:0 auto;padding:0 var(--gut)}
.narrow{max-width:820px}
.mono{font-family:var(--mono)}
.num{font-variant-numeric:tabular-nums}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:absolute;left:16px;top:-64px;z-index:100;background:var(--blue);color:var(--on-blue);padding:10px 14px;border-radius:999px;text-decoration:none;font-weight:500}
.skip:focus{top:12px}
:focus-visible{outline:2px solid var(--link);outline-offset:3px;border-radius:6px}
::selection{background:var(--blue);color:var(--on-blue)}
.muted{color:var(--muted)}
.center{text-align:center;margin-left:auto;margin-right:auto}
.tlink{color:var(--link);font-weight:500;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.tlink:hover{text-decoration-thickness:2px}
.go{display:inline-flex;align-items:center;gap:6px;color:var(--link);font-weight:500;text-decoration:none}
.go::after{content:"›";font-size:1.25em;line-height:1;transition:transform var(--dur-base) var(--ease-out)}
.go:hover{text-decoration:underline;text-underline-offset:4px}
.go:hover::after{transform:translateX(3px)}
main :is(p,li,dd,td,small) a:not([class]){color:var(--link);text-underline-offset:3px}
code{font-size:.92em}

/* a breath of blue behind the nav and the hero */
.mesh{position:absolute;inset:0 0 auto 0;height:900px;z-index:-1;pointer-events:none;
  background:radial-gradient(60% 55% at 50% -12%,rgba(10,100,220,.10),transparent 70%),radial-gradient(35% 40% at 100% 0%,rgba(90,169,255,.08),transparent 70%)}

/* ---------- glass: solid first, frosted where supported, solid again when asked ---------- */
.glass{position:relative;background:var(--glass-solid);border:1px solid var(--glass-border);box-shadow:var(--glass-hi),var(--sh-glass)}
@supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .glass{background:var(--glass-tint);-webkit-backdrop-filter:saturate(160%) blur(var(--blur));backdrop-filter:saturate(160%) blur(var(--blur))}
}
@media (prefers-reduced-transparency:reduce),(prefers-contrast:more),(forced-colors:active){
  .glass{background:var(--glass-solid);-webkit-backdrop-filter:none;backdrop-filter:none}
}
@media (prefers-contrast:more){.glass{border-color:var(--line-strong)}}
.lite .glass{background:var(--glass-solid);-webkit-backdrop-filter:none;backdrop-filter:none}

/* ---------- type ---------- */
.d1,.h3ro h1{font-size:clamp(3rem,8vw,6.5rem);line-height:.95;letter-spacing:-.045em;font-weight:600}
.d2,h2.d2{font-size:clamp(2.25rem,5.2vw,4.5rem);line-height:1;letter-spacing:-.04em;font-weight:600}
.d3{font-size:clamp(1.5rem,2.4vw,2rem);line-height:1.15;letter-spacing:-.025em;font-weight:600}
h2{font-size:clamp(1.85rem,1.3rem + 1.7vw,2.6rem);line-height:1.08;letter-spacing:-.03em}
.lede{font-size:clamp(1.125rem,1rem + .5vw,1.375rem);line-height:1.45;color:var(--ink-2);max-width:40rem;text-wrap:pretty}
.big-n{font-size:clamp(3rem,9vw,8rem);line-height:.9;letter-spacing:-.05em;font-weight:600;font-variant-numeric:tabular-nums}
.grad{background:linear-gradient(100deg,#0E2A55 0%,#0A64DC 55%,#5AA9FF 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.ch-navy .grad{background-image:linear-gradient(100deg,#FFFFFF 10%,#A8CCF7 55%,#5AA9FF 100%)}
.ch-head{text-align:center;max-width:960px;margin:0 auto}
.ch-head .lede{margin:22px auto 0}
.ch-head+*{margin-top:clamp(40px,7vh,72px)}

/* ---------- chapters: light, alternate light, navy ---------- */
.ch{position:relative;padding:var(--sec-pad) 0}
.ch-alt{background:var(--bg-2)}
.ch-navy{background:var(--navy);color:#fff;isolation:isolate;
  --ink:#FFFFFF;--ink-2:var(--navy-ink);--muted:var(--navy-ink);
  --line:rgba(169,187,214,.14);--line-2:rgba(169,187,214,.24);--line-strong:rgba(169,187,214,.5);
  --surface:var(--navy-2);--surface-2:#132D52;--link:var(--azure);
  --blue-soft:rgba(90,169,255,.12);--tag-bg:rgba(90,169,255,.1);--tag-edge:rgba(90,169,255,.35);--dot-ring:rgba(90,169,255,.22);
  --con-bg:var(--navy-2);--con-line:rgba(169,187,214,.18);--c-key:#C9D6EA;--c-str:#FFFFFF;--c-num:var(--azure);--c-pun:var(--navy-ink);
  --sh-card:0 1px 2px rgba(0,0,0,.25),0 28px 56px -30px rgba(0,0,0,.65);--ok:#4ADE9A}
.ch-navy::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(55% 45% at 50% 0%,rgba(10,100,220,.32),transparent 72%)}
.ch-navy ::selection{background:var(--azure);color:var(--navy)}
.ch-navy .btn-primary{box-shadow:0 10px 30px -12px rgba(90,169,255,.55)}

/* ---------- buttons, tags, chips ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 24px;border-radius:999px;border:1px solid transparent;font:500 1rem/1.25 var(--sans);letter-spacing:-.005em;text-decoration:none;text-align:center;cursor:pointer;
  transition:background-color var(--dur-base) var(--ease-std),border-color var(--dur-base) var(--ease-std),color var(--dur-base) var(--ease-std),transform var(--dur-fast) var(--ease-out)}
.btn:active{transform:scale(.97)}
.btn-primary{background:var(--blue);color:var(--on-blue);box-shadow:0 1px 2px rgba(8,26,51,.12),0 10px 24px -12px rgba(10,100,220,.6)}
.btn-primary:hover{background:var(--blue-hover)}
.btn-ghost{background:transparent;color:var(--ink);border-color:var(--line-strong)}
.btn-ghost:hover{background:var(--surface-2);border-color:var(--ink)}
.btn-sm{min-height:38px;padding:0 16px;font-size:.875rem}
.btn kbd{font:500 .6875rem/1 var(--mono);padding:3px 5px;border-radius:5px;border:1px solid currentColor;opacity:.8}
.tag{display:inline-flex;align-items:center;gap:6px;min-height:24px;padding:2px 10px;border-radius:999px;font:500 .6875rem/1.2 var(--mono);letter-spacing:.04em;text-transform:uppercase;white-space:nowrap;color:var(--ink-2);background:var(--surface-2);border:1px solid var(--line-2)}
.tag-live{color:var(--ink)}
.stag{display:inline-flex;align-items:center;gap:6px;font:500 .75rem/1.2 var(--mono);color:var(--link);background:var(--tag-bg);border:1px solid var(--tag-edge);padding:4px 8px;border-radius:999px;white-space:nowrap;text-decoration:none}
a.stag:hover{border-color:var(--link)}
.stag svg{flex:none}
.dot{width:8px;height:8px;border-radius:50%;background:var(--link);flex:none;box-shadow:0 0 0 3px var(--dot-ring)}
.code{display:inline-flex;align-items:center;white-space:nowrap;height:24px;padding:0 8px;border-radius:6px;font:500 .75rem/1 var(--mono);color:var(--ink-2);background:var(--surface-2);border:1px solid var(--line-2)}
.chips{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;max-width:900px;margin:32px auto 0;list-style:none}
.chip{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:8px 16px;border-radius:999px;font-size:.9375rem;border:1px solid var(--line-2);background:var(--surface);color:var(--ink)}
.chip-api{background:var(--blue);border-color:var(--blue);color:var(--on-blue)}
.ch-navy .chip-api{background:var(--azure);border-color:var(--azure);color:var(--navy)}
/* a line drawn through something we leave out */
.strike{position:relative}
.strike::after{content:"";position:absolute;left:-6%;right:-6%;top:50%;height:2px;border-radius:2px;background:currentColor;transform-origin:left center}
.js:not(.rm) .strike::after{transform:scaleX(0);transition:transform .7s var(--ease-out);transition-delay:calc(var(--i,0) * 120ms + .2s)}
.js:not(.rm) .strike.on::after,.js:not(.rm) .on .strike::after{transform:none}

/* ---------- nav: light glass, dark glass while a navy chapter is under it ---------- */
.nav-wrap{position:sticky;top:12px;z-index:50;padding:0 var(--gut);margin-top:12px}
.nav{max-width:1200px;margin:0 auto;min-height:56px;display:flex;align-items:center;gap:18px;padding:0 8px 0 12px;border-radius:999px;color:var(--ink);
  transition:background-color .35s var(--ease-std),border-color .35s var(--ease-std),color .35s var(--ease-std)}
html[data-nav="dark"] .nav{--ink:#FFFFFF;--ink-2:var(--navy-ink);--surface:var(--navy-2);--surface-2:#132D52;--line-2:rgba(169,187,214,.24);--line-strong:rgba(169,187,214,.5);--link:var(--azure);
  --glass-tint:rgba(8,26,51,.86);--glass-solid:var(--navy);--glass-border:rgba(169,187,214,.16);--glass-hi:inset 0 1px 0 rgba(255,255,255,.06)}
.brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font-weight:600;font-size:1.0625rem;letter-spacing:-.02em;flex:none}
/* the mark: a line drawn from its source dot (a lowercase b). Colours follow the surface it sits on. */
.mark{width:30px;height:30px;flex:none;overflow:visible}
.mark .mk-ln{fill:none;stroke:var(--mark-ln,#0A64DC);stroke-width:5.2;stroke-linecap:round;stroke-linejoin:round}
.mark .mk-dt{fill:var(--mark-dt,#0E2A55)}
.ch-navy,html[data-nav="dark"] .nav{--mark-ln:var(--azure);--mark-dt:#FFFFFF}
.nav-links{display:flex;gap:2px;list-style:none;flex:1}
.nav-links a{display:inline-flex;align-items:center;min-height:36px;padding:0 12px;border-radius:999px;text-decoration:none;color:var(--ink-2);font-size:.9rem;font-weight:500;transition:background-color var(--dur-fast) var(--ease-std),color var(--dur-fast)}
.nav-links a:hover{background:var(--surface-2);color:var(--ink)}
.nav-links a[aria-current="page"]{color:var(--ink);background:var(--surface-2)}
.nav-links .only-s{display:none}
.nav-end{display:flex;align-items:center;gap:8px;margin-left:auto}
.icon-btn{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:999px;border:1px solid var(--line-2);background:var(--surface);color:var(--ink-2);cursor:pointer}
.icon-btn:hover{background:var(--surface-2);color:var(--ink)}
.menu-btn{display:none}

/* ---------- heroes ---------- */
.h3ro{position:relative;padding:clamp(72px,13vh,136px) 0 clamp(40px,6vh,72px)}
.h3ro-in{display:flex;flex-direction:column;align-items:center;text-align:center}
.h3ro .lede,.h3ro-sub{margin-top:24px;font-size:clamp(1.125rem,1rem + .5vw,1.375rem);line-height:1.45;color:var(--ink-2);max-width:40rem;text-wrap:pretty}
.h3ro-cta{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:36px}
.stage{margin-top:clamp(48px,8vh,80px)}
.js:not(.rm) .h3ro h1{animation:heroIn 1s var(--ease-out) .05s both}
.js:not(.rm) .h3ro :is(.lede,.h3ro-sub){animation:heroIn 1s var(--ease-out) .18s both}
.js:not(.rm) .h3ro .h3ro-cta{animation:heroIn 1s var(--ease-out) .3s both}
.js:not(.rm) .h3ro .stage{animation:heroIn 1.2s var(--ease-out) .42s both}
@keyframes heroIn{from{opacity:0;transform:translateY(24px)}}
/* older page heads, until each page is rebuilt */
.page-head{padding:clamp(72px,12vh,128px) 0 48px}
.page-head h1{font-size:clamp(2.5rem,1.6rem + 3.4vw,4.5rem);line-height:1;letter-spacing:-.04em;max-width:16em}
.page-head .lede{margin-top:20px}
.page-head .cta{margin-top:28px}

/* ---------- reveal once: rise and fade, staggered by --i ---------- */
.js:not(.rm) .rv{opacity:0;transform:translateY(28px);transition:opacity .9s var(--ease-out),transform .9s var(--ease-out);transition-delay:calc(var(--i,0) * 70ms)}
.js .rv.on{opacity:1;transform:none}

/* ---------- scroll scenes: the pin holds the view while the section scrolls past (motion.js sets --p, --sp,
   data-step and .on/.now on [data-at]); without JS or under reduced motion a scene is a plain chapter ---------- */
.scene{position:relative}
.scene.ch{padding:0}
.scene-pin{position:relative;padding:var(--sec-pad) 0}
.js:not(.rm) .scene{--step-h:90vh;height:calc(100vh + var(--steps,3) * var(--step-h))}
.js:not(.rm) .scene-pin{position:sticky;top:0;height:100vh;padding:84px 0 28px;overflow:hidden;display:flex;flex-direction:column;justify-content:center}
@supports (height:100svh){
  .js:not(.rm) .scene{--step-h:90svh;height:calc(100svh + var(--steps,3) * var(--step-h))}
  .js:not(.rm) .scene-pin{height:100svh}
}
@media (max-width:640px){
  .js:not(.rm) .scene{--step-h:75vh}
  @supports (height:100svh){.js:not(.rm) .scene{--step-h:75svh}}
}
.scene-cap{list-style:none;display:grid;gap:14px}
.js:not(.rm) .scene-cap{grid-template-areas:"c";gap:0}
.js:not(.rm) .scene-cap>li{grid-area:c;opacity:0;transform:translateY(18px);transition:opacity .45s var(--ease-std),transform .7s var(--ease-out)}
.js:not(.rm) .scene-cap>li.now{opacity:1;transform:none}

/* ---------- folds: the long version, for whoever wants it ---------- */
details.more{max-width:820px;margin:56px auto 0;border-top:1px solid var(--line-2);border-bottom:1px solid var(--line-2)}
details.more+details.more{margin-top:0;border-top:0}
details.more>summary{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:64px;padding:14px 4px;cursor:pointer;list-style:none;font-weight:500;font-size:1.0625rem;color:var(--ink)}
details.more>summary::-webkit-details-marker{display:none}
details.more>summary::after{content:"+";flex:none;font:300 1.75rem/1 var(--sans);color:var(--muted);transition:transform .4s var(--ease-out)}
details.more[open]>summary::after{transform:rotate(45deg)}
details.more>summary:hover{color:var(--link)}
.more-body{padding:0 4px 32px;color:var(--ink-2)}
.more-body>*+*{margin-top:14px}
.more-body p strong{color:var(--ink)}
@supports (interpolate-size:allow-keywords){
  details.more{interpolate-size:allow-keywords}
  details.more::details-content{block-size:0;overflow-y:clip;transition:block-size .5s var(--ease-out),content-visibility .5s allow-discrete}
  details.more[open]::details-content{block-size:auto}
}

/* ---------- cards, tables, code ---------- */
.card{background:var(--surface);border:1px solid var(--line-2);border-radius:var(--r-lg)}
.next{display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px;margin-top:28px}
.next .muted{font-size:.875rem}
.split{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:48px;align-items:center}
.two{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:20px;align-items:start}
.sec{position:relative;padding:var(--sec-pad) 0}
.sec-tight{padding-top:24px}
.sec-head{max-width:680px;margin-bottom:36px}
.sec-p{margin-top:14px;font-size:1.0625rem;color:var(--ink-2);max-width:38rem}
.list-reset{list-style:none}
.list{display:grid;gap:10px;list-style:none}
.list li{padding-left:18px;position:relative;color:var(--ink-2)}
.list li::before{content:"";position:absolute;left:0;top:.7em;width:6px;height:6px;border-radius:50%;background:var(--blue)}
.scroll-x{overflow-x:auto}
.tbl-wrap{margin-top:28px;padding:6px 8px}
.ht{width:100%;border-collapse:collapse;font-size:.9375rem}
.ht caption{caption-side:top;text-align:left;padding:14px 12px 12px;font-size:.875rem;color:var(--ink-2)}
.ht th,.ht td{padding:11px 12px;text-align:left;border-top:1px solid var(--line);vertical-align:middle}
.ht thead th{font:500 .6875rem/1.2 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);border-top:0;padding-top:4px;padding-bottom:10px}
.ht .r{text-align:right;font-family:var(--mono);font-variant-numeric:tabular-nums slashed-zero;white-space:nowrap}
.ht tbody th{font-weight:500}
.ht .l2 th{font-weight:400;color:var(--ink-2);padding-left:32px}
.ht .l2 td{color:var(--ink-2)}
.ht .l2 th::before{content:"of which ";color:var(--muted);font-size:.8125rem}
.ht tr.sel{background:var(--blue-soft)}
.rowbtn{appearance:none;border:0;background:none;padding:0;margin:0;font:inherit;color:inherit;text-align:left;cursor:pointer;text-decoration:underline dotted var(--line-strong);text-underline-offset:4px}
.rowbtn:hover{text-decoration-style:solid}
.chg{color:var(--ink-2)}
.ht tfoot th,.ht tfoot td{font-weight:600;border-top:2px solid var(--ink)}
.okline{display:inline-flex;gap:6px;align-items:center;color:var(--ok);font:500 .8125rem/1.2 var(--sans)}
.notes{margin-top:12px;padding:0 12px 10px;display:grid;gap:6px;font-size:.8125rem;color:var(--muted);list-style:none}
.dt{width:100%;border-collapse:collapse;font-size:.9rem}
.dt th,.dt td{padding:11px 12px;text-align:left;border-top:1px solid var(--line);vertical-align:top}
.dt thead th{font:500 .6875rem/1.2 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);border-top:0}
.dt .r{text-align:right;font-family:var(--mono);font-variant-numeric:tabular-nums;white-space:nowrap}
.dt td small{display:block;color:var(--muted);font-size:.8125rem}
.k{color:var(--c-key)}.s{color:var(--c-str)}.n{color:var(--c-num)}.p{color:var(--c-pun)}.cm{color:var(--c-pun)}.pr{color:var(--link)}
.codeblock{position:relative;margin:12px 0}
.codeblock .lbl{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:8px 12px;border-radius:14px 14px 0 0;background:var(--surface-2);color:var(--ink-2);font:500 .75rem/1.2 var(--mono);border:1px solid var(--con-line);border-bottom:0}
.codeblock pre{margin:0;padding:14px 16px;border-radius:0 0 14px 14px;background:var(--con-bg);color:var(--ink);font:400 .8125rem/1.65 var(--mono);white-space:pre-wrap;overflow-wrap:anywhere;border:1px solid var(--con-line);border-top:0}
.copy{appearance:none;border:1px solid var(--line-2);background:var(--surface);color:var(--ink);border-radius:999px;min-height:30px;padding:0 12px;font:500 .75rem/1 var(--sans);cursor:pointer}
.copy:hover{background:var(--surface-2)}
.note{padding:14px 18px;border-radius:14px;border:1px solid var(--tag-edge);background:var(--blue-soft);color:var(--ink);font-size:.9375rem}
.note b{font-weight:600}
.kv{display:grid;grid-template-columns:max-content 1fr;gap:6px 18px;font-size:.9rem}
.kv dt{font-family:var(--mono);font-size:.8125rem;color:var(--ink)}
.kv dd{color:var(--ink-2)}
.mail{display:inline-flex;align-items:center;gap:10px;font:500 clamp(1.25rem,1rem + 1.2vw,1.75rem)/1.2 var(--mono);color:var(--link);text-underline-offset:6px;overflow-wrap:anywhere}
.embed-frame{width:100%;height:560px;border:1px solid var(--line-2);border-radius:var(--r-lg);background:var(--paper)}

/* ---------- paper: the filing card ---------- */
.paper{padding:26px 28px;border-radius:var(--r-lg);background:var(--paper);color:var(--paper-ink);border:1px solid var(--paper-line);box-shadow:var(--sh-card)}
.paper :focus-visible{outline-color:var(--paper-link)}
.paper-k{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font:500 .6875rem/1.3 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--paper-muted);padding-bottom:12px;border-bottom:1px solid var(--paper-line)}
.paper-t{margin:16px 0 8px;font:400 1.3rem/1.3 var(--serif);letter-spacing:-.005em}
.paper dl{font-family:var(--serif);font-size:1rem}
.paper dl div{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:8px 0;border-bottom:1px dashed var(--paper-line)}
.paper dt{color:var(--paper-muted);min-width:0}
.paper dt code{font-size:.75rem;color:var(--paper-muted);display:block;overflow-wrap:anywhere}
.paper dd{font-family:var(--mono);font-size:.875rem;font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
.hl{padding:1px 4px;border-radius:3px;background:var(--paper-hl);box-shadow:inset 0 -2px 0 var(--paper-link)}
.paper-ok{display:flex;gap:8px;align-items:center;margin-top:8px;font-size:.875rem;color:var(--paper-ok);font-weight:500}
.paper-open{display:inline-flex;margin-top:14px;color:var(--paper-link);font-weight:600;text-underline-offset:3px}

/* ---------- product tiles: each a small loop of the product in use (motion.js re-adds .play) ---------- */
.ways-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.way{display:flex;flex-direction:column;align-items:flex-start;padding:16px 16px 28px;border-radius:var(--r-xl);background:var(--surface);border:1px solid var(--line-2);box-shadow:var(--sh-card);transition:transform .5s var(--ease-out),box-shadow .5s var(--ease-out)}
@media (hover:hover) and (pointer:fine){.way:hover{transform:translateY(-4px);box-shadow:var(--sh-lift)}}
.way .dm{position:relative;align-self:stretch;height:220px;overflow:hidden;padding:16px;margin-bottom:22px;border-radius:16px;background:var(--bg-2);border:1px solid var(--line)}
.way-k{margin:0 10px 8px;font:500 .6875rem/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.way h3{margin:0 10px 18px;font-size:1.5rem;font-weight:600;letter-spacing:-.025em;line-height:1.2}
.way .btn{margin-left:10px}
.xl-bar{display:flex;align-items:center;gap:6px;margin-bottom:10px;font:500 .6875rem/1 var(--mono);color:var(--muted)}
.xl-bar i{width:8px;height:8px;border-radius:50%;background:var(--line-strong)}
.xl-bar span{margin-left:8px}
.xl-grid{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1.25fr) minmax(0,.55fr) minmax(0,.6fr);border:1px solid var(--line-2);border-radius:10px;overflow:hidden;background:var(--surface);font:400 .75rem/1.2 var(--mono)}
.xl-grid>*{padding:9px 8px;border-bottom:1px solid var(--line);border-right:1px solid var(--line);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ink)}
.xl-grid b{font-weight:500;color:var(--muted);background:var(--surface-2)}
.xl-grid .u{color:var(--link)}
.xl-grid .up{color:var(--link)}
.xl-grid .dn{color:var(--ink-2)}
.play .xl-grid span{animation:cellIn .9s var(--ease-out) both;animation-delay:calc(.2s + var(--d) * .14s)}
@keyframes inUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes growX{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes typeIn{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes cellIn{0%{opacity:0;background:var(--blue-soft)}40%{opacity:1;background:var(--blue-soft)}100%{opacity:1;background:transparent}}
@keyframes caret{50%{opacity:0}}

/* ---------- dot globe (globe.js reads these colours from the band) ---------- */
.globe-band{position:relative;overflow:hidden;--globe-ink:var(--ink);--globe-point:var(--blue);--globe-label:var(--ink);--globe-bg:var(--surface);--globe-line:var(--line-2);--globe-invert:1}
.ch-navy .globe-band,.ch-navy.globe-band{--globe-ink:#C9D6EA;--globe-point:var(--azure);--globe-label:#FFFFFF;--globe-bg:var(--navy);--globe-line:rgba(169,187,214,.3);--globe-invert:0}
.globe-cv{display:block;width:100%;height:clamp(420px,58vw,760px);touch-action:pan-y;cursor:grab;-webkit-user-select:none;user-select:none}
.globe-cv:active{cursor:grabbing}
.globe-legend{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 28px;margin:4px auto 0;max-width:62rem;list-style:none;font-size:.875rem;color:var(--ink-2)}
.globe-legend li{display:flex;align-items:baseline;gap:8px;max-width:100%}
.globe-legend .k{font:500 .6875rem/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink);white-space:nowrap}
.globe-legend .sw{flex:none;width:10px;height:10px;border-radius:3px;background:var(--blue);align-self:center}
.globe-legend .sw-built{background:var(--ink)}
.ch-navy .globe-legend .sw{background:var(--azure)}
.ch-navy .globe-legend .sw-built{background:rgba(255,255,255,.78)}
.globe-note{text-align:center;margin-top:12px;font:500 .75rem/1.4 var(--mono);color:var(--muted)}

/* ---------- the close, and the short call to action band ---------- */
.end{padding:clamp(120px,18vh,200px) 0;text-align:center}
.end h2{font-size:clamp(2.25rem,5.2vw,4.5rem);line-height:1;letter-spacing:-.04em}
.end h2 .l2{color:var(--blue)}
.end-fn{margin-top:22px;font:400 .875rem/1.5 var(--mono);color:var(--muted)}
.end-fn a{color:var(--link);text-underline-offset:3px}
.cta-band .h3ro-cta{margin-top:34px}

/* ---------- footer ---------- */
.foot{padding:64px 0 40px;background:var(--bg-2);border-top:1px solid var(--line)}
.foot-grid{display:grid;grid-template-columns:1.5fr repeat(3,minmax(0,1fr));gap:32px}
.foot h2{margin:0 0 12px;font:500 .6875rem/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.foot ul{list-style:none;display:grid;gap:9px}
.foot ul a{text-decoration:none;color:var(--ink-2);font-size:.875rem}
.foot ul a:hover{color:var(--ink);text-decoration:underline}
.foot-id p{margin-top:12px;font-size:.875rem;color:var(--muted);max-width:20rem}
.legal{margin-top:40px;padding-top:20px;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 24px;font-size:.8125rem;color:var(--muted)}
.legal p{max-width:48rem}
.badge{font:400 .75rem/1.5 var(--mono);color:var(--muted)}

/* ---------- responsive ---------- */
@media (max-width:1080px){.nav-links a{padding:0 9px}}
@media (max-width:960px){
  .split,.two{grid-template-columns:minmax(0,1fr);gap:32px}
  .ways-grid{grid-template-columns:minmax(0,1fr)}
  .foot-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .foot-id{grid-column:1 / -1}
}
@media (max-width:860px){
  .nav{position:relative;border-radius:22px}
  .nav-links{display:none;position:absolute;left:0;right:0;top:64px;flex-direction:column;padding:8px;border-radius:18px;background:var(--glass-solid);border:1px solid var(--glass-border);box-shadow:var(--sh-glass)}
  .nav.open .nav-links{display:flex}
  .nav-links a{min-height:44px;padding:0 14px}
  .nav-links .only-s{display:block}
  .menu-btn{display:inline-grid}
}
@media (max-width:640px){
  :root{--blur:10px;--gut:16px;--sec-pad:clamp(72px,11vh,112px)}
  .sec-head{margin-bottom:26px}
  .next .btn{flex:1 1 100%}
  .h3ro-cta .btn{flex:1 1 auto}
  .ht{font-size:.875rem}
  .ht th,.ht td{padding:9px 6px}
  .ht .l2 th{padding-left:14px}
  .ht .l2 th::before{content:none}
  .ht .shares,.ht .hide-s{display:none}
  .ht .src-c .sl,.okline .sl{display:none}
  .paper{padding:20px}
  .way .dm{height:204px}
  .foot-grid{gap:28px 16px}
  .dt th,.dt td{padding:9px 8px}
  .dt .hide-s{display:none}
  .embed-frame{height:640px}
}
@media (max-width:400px){.nav-end .btn{display:none}}
@media (hover:none) and (pointer:coarse){.btn kbd{display:none}}
@media (forced-colors:active){.mark .mk-ln{stroke:CanvasText}.mark .mk-dt{fill:CanvasText}.ht tr.sel th{text-decoration:underline}.dot{forced-color-adjust:none;background:CanvasText;box-shadow:none}.grad{color:CanvasText;background:none}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition-duration:0s!important;transition-delay:0s!important;animation:none!important}}
.rm *,.rm *::before,.rm *::after{transition-duration:0s!important;transition-delay:0s!important;animation:none!important}
@media print{.nav-wrap,.mesh{display:none}.glass{background:#fff;backdrop-filter:none}.ch-navy{background:#fff;color:#000}}

/* ---------- the intro: on landing only (not page to page, not on reload, not under reduced motion) the mark draws
   itself from its dot, the name follows, and the screen lifts. Click, key or scroll skips it. Without JS it still ends.
   The root carries .intro-on (set in the head); .intro is the overlay. */
.intro{display:none}
html.intro-on .intro{position:fixed;inset:0;z-index:300;display:grid;place-items:center;background:var(--bg);cursor:pointer;
  animation:introOut .6s var(--ease-io) 1.15s forwards}
html.intro-on .intro::before{content:"";position:absolute;inset:0;background:radial-gradient(50% 45% at 50% 50%,rgba(10,100,220,.10),transparent 70%);pointer-events:none}
html.intro-on .intro-in{--wm:clamp(2.25rem,1.6rem + 2.6vw,3.25rem);position:relative;display:flex;align-items:center;gap:16px;font-size:var(--wm);transform-origin:0 50%;animation:introUp .66s var(--ease-io) 1.15s forwards}
html.intro-on .intro .mark{width:1.4em;height:1.4em;animation:introMark .7s var(--ease-io) .5s both}
html.intro-on .intro .mk-dt{transform-box:fill-box;transform-origin:center;animation:introDot .5s var(--ease-out) .08s both}
html.intro-on .intro .mk-ln{stroke-dasharray:1;stroke-dashoffset:1;animation:introLine .62s var(--ease-io) .26s forwards}
html.intro-on .intro-wm{font:600 1em/1 var(--sans);letter-spacing:-.035em;color:var(--ink);animation:introWm .7s var(--ease-io) .5s both}
html.intro-on.intro-skip .intro{animation:introOut .22s var(--ease-std) forwards}
@keyframes introDot{0%{transform:scale(0)}70%{transform:scale(1.12)}100%{transform:scale(1)}}
@keyframes introLine{to{stroke-dashoffset:0}}
@keyframes introWm{from{clip-path:inset(0 0 0 100%);opacity:0}30%{opacity:1}to{clip-path:inset(0 0 0 0)}}
@keyframes introMark{from{transform:translateX(calc((2.67em + 16px) / 2))}}
@keyframes introUp{70%{opacity:1}to{transform:translateY(-18px) scale(.96);opacity:0}}
@keyframes introOut{to{opacity:0;visibility:hidden}}
html.intro-on.js:not(.rm) .h3ro h1{animation-delay:1.3s}
html.intro-on.js:not(.rm) .h3ro :is(.lede,.h3ro-sub){animation-delay:1.42s}
html.intro-on.js:not(.rm) .h3ro .h3ro-cta{animation-delay:1.54s}
html.intro-on.js:not(.rm) .h3ro .stage{animation-delay:1.66s}

/* ---------- page to page: the bar stays put, the page underneath crossfades ---------- */
@view-transition{navigation:auto}
.nav{view-transition-name:site-nav}
::view-transition-old(root){animation:vtOut .14s var(--ease-std) both}
::view-transition-new(root){animation:vtIn .3s var(--ease-out) both}
@keyframes vtOut{to{opacity:0}}
@keyframes vtIn{from{opacity:0;transform:translateY(10px)}}
@media (prefers-reduced-motion:reduce){@view-transition{navigation:none}}

/* 404: a filing card turns over once and shows "Not found". The not-found face is the default; the turn plays only
   under .js:not(.rm), from the filing face (rotateY -180deg) to rest. */
.pg-404 .nf{padding-top:clamp(56px,10vh,112px);padding-bottom:clamp(88px,14vh,160px)}
.pg-404 .nf-stage{perspective:1100px;margin-bottom:clamp(36px,6vh,60px)}
.pg-404 .nf-card{position:relative;width:min(264px,68vw);aspect-ratio:3/4;transform-style:preserve-3d}
.pg-404 .nf-face{position:absolute;inset:0;display:flex;flex-direction:column;text-align:left;-webkit-backface-visibility:hidden;backface-visibility:hidden}
.pg-404 .nf-doc{transform:rotateY(180deg)}
.pg-404 .nf-stamp{position:absolute;left:50%;top:42%;padding:12px 18px 11px;border:2px solid var(--paper-link);border-radius:10px;background:var(--paper);color:var(--paper-link);font:500 1.25rem/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;transform:translate(-50%,-50%) rotate(-7deg)}
.pg-404 .nf-miss .nf-rows li{height:33px}
.pg-404 .nf-t{display:grid;gap:8px;margin:18px 0 16px}
.pg-404 .nf-t i,.pg-404 .nf-rows i{display:block;height:10px;border-radius:5px;background:var(--paper-line)}
.pg-404 .nf-t i:first-child{width:86%;height:14px;border-radius:7px}
.pg-404 .nf-t i:last-child{width:54%;height:14px;border-radius:7px}
.pg-404 .nf-rows{list-style:none;margin-top:auto}
.pg-404 .nf-rows li{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:11px 0;border-top:1px dashed var(--paper-line)}
.pg-404 .nf-rows li i:first-child{width:46%}
.pg-404 .nf-rows li i:last-child{width:26%}
.pg-404 .nf-rows li:nth-child(2) i:first-child{width:34%}
.pg-404 .nf-rows li:nth-child(4) i:first-child{width:52%}
.pg-404 .nf-rows li:nth-child(5) i:last-child{width:20%}
.pg-404 .nf-hl i:last-child{background:var(--paper-hl);box-shadow:inset 0 -2px 0 var(--paper-link)}
.js:not(.rm) .pg-404 .nf-stage{animation:heroIn .9s var(--ease-out) both}
.js:not(.rm) .pg-404 .nf-card{animation:nfTurn .6s var(--ease-io) .55s both}
@keyframes nfTurn{from{transform:rotateY(-180deg)}}

/* About: one headline, a path that draws from the filing to your tools, five principles, the markets, and a way to
   write to us. Final frames are the default; "before" states only under .js:not(.rm). */
.pg-about .ab-hero{padding-bottom:clamp(72px,11vh,128px)}
.pg-about .ab-stage{margin-top:clamp(56px,9vh,96px)}

/* ---------- the path: four stations; a leg draws from each to the next, a square rides it ---------- */
.pg-about .ab-path{--b:88px;--g:24px;--d0:.5s;--st:.55s;--lead:.18s;--leg:.6s;
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:var(--g);max-width:1040px;margin:0 auto;list-style:none}
.pg-about .ab-n{position:relative;display:flex;flex-direction:column;align-items:center;gap:22px;text-align:center}
.pg-about .ab-b{position:relative;z-index:1;display:grid;place-items:center;flex:none;width:var(--b);height:var(--b);border-radius:26px;
  background:var(--surface);border:1px solid var(--line-2);box-shadow:var(--sh-card);color:var(--blue)}
.pg-about .ab-b svg{width:36px;height:36px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.pg-about .ab-n:last-child .ab-b{background:var(--blue);border-color:var(--blue);color:var(--on-blue);
  box-shadow:0 1px 2px rgba(8,26,51,.14),0 20px 40px -16px rgba(10,100,220,.65)}
.pg-about .ab-n:last-child .ab-b::after{content:"";position:absolute;inset:-1px;border-radius:inherit;box-shadow:0 0 0 2px var(--blue);opacity:0}
.pg-about .ab-t{display:flex;flex-direction:column;gap:6px}
.pg-about .ab-t b{font-size:1.375rem;line-height:1.2;font-weight:600;letter-spacing:-.022em;color:var(--ink)}
.pg-about .ab-t span{font:500 .8125rem/1.35 var(--mono);color:var(--muted)}
.pg-about .ab-leg{position:absolute;top:calc(var(--b) / 2 - 1px);left:calc(50% + var(--b) / 2 + 12px);width:calc(100% + var(--g) - var(--b) - 24px);height:2px}
.pg-about .ab-ln{position:absolute;inset:0;border-radius:2px;background:linear-gradient(90deg,rgba(10,100,220,.28),var(--blue));transform-origin:left center}
.pg-about .ab-hd{position:absolute;inset:0;opacity:0}
.pg-about .ab-hd::after{content:"";position:absolute;right:-5px;top:-4px;width:10px;height:10px;border-radius:3px;background:var(--blue);box-shadow:0 0 0 4px var(--dot-ring)}
.pg-about .ab-ck{stroke-dasharray:1}

.js:not(.rm) .pg-about .ab-path .ab-n{opacity:0;transform:translateY(18px)}
.js:not(.rm) .pg-about .ab-path .ab-ln{transform:scaleX(0)}
.js:not(.rm) .pg-about .ab-path .ab-ck{stroke-dashoffset:1}
.js:not(.rm) .pg-about .ab-path.on .ab-n{opacity:1;transform:none;transition:opacity .6s var(--ease-out),transform .9s var(--ease-out);transition-delay:calc(var(--d0) + var(--k) * var(--st))}
.js:not(.rm) .pg-about .ab-path.on .ab-ln{transform:none;transition:transform var(--leg) var(--ease-io) calc(var(--d0) + var(--k) * var(--st) + var(--lead))}
.js:not(.rm) .pg-about .ab-path.on .ab-hd{animation:abRunX var(--leg) var(--ease-io) calc(var(--d0) + var(--k) * var(--st) + var(--lead)) both}
.js:not(.rm) .pg-about .ab-path.on .ab-ck{stroke-dashoffset:0;transition:stroke-dashoffset .6s var(--ease-out) calc(var(--d0) + 2 * var(--st) + .42s)}
.js:not(.rm) .pg-about .ab-path.on .ab-n:last-child .ab-b::after{animation:abRing 1.1s var(--ease-out) calc(var(--d0) + 3 * var(--st) + .3s) forwards}
@keyframes abRunX{0%{opacity:0;transform:translateX(-100%)}18%{opacity:1}82%{opacity:1}100%{opacity:0;transform:none}}
@keyframes abRunY{0%{opacity:0;transform:translateY(-100%)}18%{opacity:1}82%{opacity:1}100%{opacity:0;transform:none}}
@keyframes abRing{0%{opacity:.6;transform:scale(1)}100%{opacity:0;transform:scale(1.4)}}

/* ---------- five principles: a rule draws over each, then its words rise ---------- */
.pg-about .ab-pr{padding:clamp(80px,12vh,128px) 0}
.pg-about .ab-prin{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:48px 32px;list-style:none}
/* each principle spans two rows of the list, so every line starts level even where a title wraps */
.pg-about .ab-prin li{position:relative;display:grid;grid-row:span 2;grid-template-rows:subgrid;row-gap:12px;align-content:start;padding-top:26px}
.pg-about .ab-prin li::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;border-radius:2px;background:var(--ink);transform-origin:left center}
.pg-about .ab-prin strong{font-size:clamp(1.3125rem,1.1rem + .5vw,1.5rem);line-height:1.15;font-weight:600;letter-spacing:-.024em;color:var(--ink);text-wrap:balance}
.pg-about .ab-prin span{font-size:1rem;line-height:1.5;color:var(--ink-2);text-wrap:pretty}
.js:not(.rm) .pg-about .ab-prin li::before{transform:scaleX(0)}
.js:not(.rm) .pg-about .ab-prin li>*{opacity:0;transform:translateY(14px)}
.js:not(.rm) .pg-about .ab-prin.on li::before{transform:none;transition:transform .9s var(--ease-out) calc(var(--i,0) * 70ms)}
.js:not(.rm) .pg-about .ab-prin.on li>*{opacity:1;transform:none;transition:opacity .7s var(--ease-out),transform .9s var(--ease-out);transition-delay:calc(var(--i,0) * 70ms + .16s)}
.js:not(.rm) .pg-about .ab-prin.on li>span{transition-delay:calc(var(--i,0) * 70ms + .26s)}

/* ---------- live and next ---------- */
.pg-about .ab-chips{margin-top:clamp(36px,6vh,56px)}
.js:not(.rm) .pg-about .ab-chips>li{opacity:0;transform:translateY(12px)}
.js:not(.rm) .pg-about .ab-chips.on>li{opacity:1;transform:none;transition:opacity .6s var(--ease-out),transform .8s var(--ease-out);transition-delay:calc(var(--i,0) * 70ms)}

/* ---------- write to us ---------- */
.pg-about .ab-end{padding:clamp(120px,18vh,200px) 0}
.pg-about .ab-mail{margin-top:28px}
.pg-about .ab-end .h3ro-cta{margin-top:34px}

/* ---------- tablets and phones ---------- */
@media (max-width:1024px){
  .pg-about .ab-prin{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:640px){
  .pg-about .ab-path{--b:58px;--g:40px;grid-template-columns:minmax(0,1fr);row-gap:var(--g);width:fit-content;max-width:100%}
  .pg-about .ab-n{flex-direction:row;gap:20px;text-align:left}
  .pg-about .ab-b{border-radius:18px}
  .pg-about .ab-b svg{width:26px;height:26px}
  .pg-about .ab-t b{font-size:1.125rem}
  .pg-about .ab-leg{top:calc(var(--b) + 8px);left:calc(var(--b) / 2 - 1px);width:2px;height:calc(100% + var(--g) - var(--b) - 16px)}
  .pg-about .ab-ln{background:linear-gradient(180deg,rgba(10,100,220,.28),var(--blue));transform-origin:center top}
  .pg-about .ab-hd::after{right:auto;top:auto;left:-4px;bottom:-5px}
  .js:not(.rm) .pg-about .ab-path .ab-ln{transform:scaleY(0)}
  .js:not(.rm) .pg-about .ab-path.on .ab-hd{animation-name:abRunY}
  .pg-about .ab-prin{grid-template-columns:minmax(0,1fr);gap:32px}
}

/* Coverage: a navy globe hero, then each dataset as a tile whose count runs up and whose dates draw on one
   2018 to 2026 axis, the markets still to open, and what is never shown. Final frames are the default;
   "before" states only under .js:not(.rm). */

/* ---------- hero: navy from the very top, under the glass nav ---------- */
.pg-coverage .cv-hero{margin-top:-96px;padding:calc(96px + clamp(44px,6.5vh,88px)) 0 clamp(56px,9vh,104px)}
.pg-coverage .cv-hero .lede{margin-top:20px}
.pg-coverage .cv-stage{margin-top:clamp(8px,2.4vh,28px)}
.pg-coverage .cv-hero .globe-cv{height:clamp(320px,35vw,500px)}
.pg-coverage .cv-legend{margin-top:clamp(12px,2.4vh,28px);gap:12px 32px}
.pg-coverage .cv-legend li{align-items:center}
.pg-coverage .globe-legend .sw-built{background:var(--ink)}  /* built is ink on the globe, so here too, navy included */
.js:not(.rm) .pg-coverage .cv-legend li{animation:heroIn .9s var(--ease-out) both;animation-delay:calc(.95s + var(--i,0) * 80ms)}

/* ---------- datasets ---------- */
.pg-coverage .cv-set{padding-bottom:0}
.pg-coverage .cv-set-us{padding:clamp(104px,15vh,176px) 0 var(--sec-pad)}
.pg-coverage .cv-gh{display:flex;flex-wrap:wrap;align-items:center;gap:10px 20px;font-size:clamp(2.25rem,5.2vw,4.5rem);line-height:1;letter-spacing:-.04em}
.pg-coverage .cv-st{display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 15px 0 13px;border-radius:999px;font:500 .9375rem/1 var(--sans);letter-spacing:0;color:var(--ink-2);background:var(--surface);border:1px solid var(--line-2);transform:translateY(.06em)}
.pg-coverage .cv-st::before{content:"";width:8px;height:8px;border-radius:2px;background:currentColor}
.pg-coverage .cv-live{color:var(--blue);background:var(--sky);border-color:var(--tag-edge)}

.pg-coverage .cv-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:clamp(32px,5vh,56px);list-style:none}
.pg-coverage .cv-t{display:flex;flex-direction:column;min-width:0;padding:clamp(24px,2.6vw,36px) clamp(24px,2.6vw,36px) 0;border-radius:var(--r-xl);background:var(--surface);border:1px solid var(--line);box-shadow:var(--sh-card)}
.pg-coverage .cv-wide{grid-column:1 / -1}
.pg-coverage .cv-fig,.pg-coverage .cv-in{display:flex;flex-direction:column;flex:1 1 auto;min-width:0}
.pg-coverage .cv-name{font-size:1.0625rem;line-height:1.3;font-weight:600;letter-spacing:-.015em;color:var(--ink);text-wrap:balance}
.pg-coverage .cv-n{margin-top:clamp(20px,3vh,32px);font-size:clamp(2.75rem,4.6vw,4.125rem);line-height:.95;font-weight:600;letter-spacing:-.045em;font-variant-numeric:tabular-nums;color:var(--ink)}
.pg-coverage .cv-cap{display:flex;flex-wrap:wrap;align-items:baseline;margin-top:12px;font-size:1rem;line-height:1.35;color:var(--ink-2)}
.pg-coverage .cv-unit{color:var(--ink);font-weight:500}
.pg-coverage .cv-dot{margin:0 8px;color:var(--muted)}
.pg-coverage .cv-time{margin-top:auto;padding-top:clamp(32px,5vh,48px)}
.pg-coverage .cv-when{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;margin-bottom:12px;font:500 .8125rem/1.2 var(--mono);color:var(--ink-2)}
.pg-coverage .cv-to{color:var(--muted)}
.pg-coverage .cv-est{margin-left:4px;padding:3px 8px;border-radius:999px;border:1px dashed var(--line-strong);font-size:.6875rem;letter-spacing:.02em;color:var(--ink-2)}
/* the track is nine years end to end, a tick at each new year; the blue span is the dataset */
.pg-coverage .cv-track{position:relative;height:8px;border-radius:999px;background:var(--bg-2);box-shadow:inset 0 0 0 1px var(--line)}
.pg-coverage .cv-track::before{content:"";position:absolute;inset:0;border-radius:inherit;background:repeating-linear-gradient(90deg,transparent 0 calc(100% / 9 - 1px),var(--line-2) calc(100% / 9 - 1px) calc(100% / 9))}
.pg-coverage .cv-span{position:absolute;top:0;bottom:0;min-width:6px;border-radius:999px;background:var(--blue);transform-origin:left center}
.pg-coverage .cv-axis{display:flex;justify-content:space-between;margin-top:9px;font:400 .6875rem/1 var(--mono);letter-spacing:.02em;color:var(--muted)}
.pg-coverage .cv-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:clamp(22px,3vh,30px);padding:14px 0 16px;border-top:1px solid var(--line)}
.pg-coverage .cv-src{display:inline-flex;align-items:center;gap:6px;min-height:36px;font:500 .8125rem/1.2 var(--mono);color:var(--link);text-decoration:none;text-underline-offset:4px}
.pg-coverage .cv-src:hover{text-decoration:underline}
.pg-coverage .cv-cta{display:flex;justify-content:center;margin-top:clamp(40px,6vh,64px)}
@media (min-width:900px){
  .pg-coverage .cv-wide .cv-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);column-gap:clamp(40px,5vw,72px);align-items:end}
  .pg-coverage .cv-wide .cv-time{padding:0 0 4px}
}
/* the count runs up (motion.js); the span draws from its first month to its last once the tile has risen */
.js:not(.rm) .pg-coverage .cv-span{transform:scaleX(0)}
.js:not(.rm) .pg-coverage .cv-t.on .cv-span{transform:none;transition:transform 1.2s var(--ease-out) calc(.2s + var(--i,0) * 70ms)}

/* details fold */
.pg-coverage .cv-dl{display:grid;gap:18px}
.pg-coverage .cv-dl dt{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-weight:600;color:var(--ink)}
.pg-coverage .cv-dl dd{margin-top:4px;font-size:.9375rem}

/* ---------- more markets ---------- */
.pg-coverage .cv-tier{margin-top:clamp(40px,6vh,64px);text-align:center}
.pg-coverage .cv-th{font-size:1.125rem;font-weight:600;letter-spacing:-.015em;color:var(--ink)}
.pg-coverage .cv-chips{max-width:none;margin-top:18px}
.pg-coverage .cv-sq{width:8px;height:8px;border-radius:2px;background:var(--ink);flex:none}

/* ---------- not public yet, never shown ---------- */
.pg-coverage .cv-pend-ch{padding-top:0}
.pg-coverage .cv-pend .chip{border-style:dashed;border-color:var(--line-strong);background:transparent}
.pg-coverage .cv-never{flex-direction:column;align-items:center;gap:14px;margin-top:clamp(36px,6vh,56px)}
.pg-coverage .cv-never .chip{min-height:54px;padding:10px 26px;font-size:1.125rem;letter-spacing:-.01em;white-space:nowrap}
.pg-coverage .cv-never .strike::after{left:-10px;right:-10px}
.js:not(.rm) .pg-coverage .cv-never .strike::after{transition:transform .7s var(--ease-out);transition-delay:calc(.7s + var(--i,0) * 420ms)}

/* chips rise one after another */
.js:not(.rm) .pg-coverage :is(.cv-chips,.cv-pend,.cv-never)>li{opacity:0;transform:translateY(14px)}
.js:not(.rm) .pg-coverage :is(.cv-chips,.cv-pend,.cv-never).on>li{opacity:1;transform:none;transition:opacity .7s var(--ease-out),transform .9s var(--ease-out);transition-delay:calc(var(--i,0) * 70ms)}

/* ---------- phones and tablets ---------- */
@media (max-width:760px){
  .pg-coverage .cv-grid{grid-template-columns:minmax(0,1fr);gap:16px}
}
@media (max-width:640px){
  .pg-coverage .cv-hero{padding-top:calc(96px + 40px)}
  .pg-coverage .cv-legend{gap:10px 22px;max-width:22rem}
  .pg-coverage .cv-st{height:30px;font-size:.875rem}
  .pg-coverage .cv-never .chip{font-size:1rem;min-height:50px;padding:10px 20px}
}

/* Beyond filings: the next sources, and the one we tested and left out */
.pg-coverage .cv-by-ch{text-align:center}
.pg-coverage .cv-by-ch .lede{margin-inline:auto}
.pg-coverage .cv-by{justify-content:center;margin-top:clamp(24px,4vh,36px)}
.pg-coverage .cv-tried{margin-top:clamp(20px,3vh,28px);text-wrap:balance;font:500 .9375rem/1.4 var(--mono);color:var(--muted)}
.pg-coverage .cv-by-ch details.more{text-align:left}
/* a card is the dataset, how often it is filed and its span; no counts */
.pg-coverage .cv-cap{margin-top:10px;font:500 .8125rem/1.3 var(--mono);letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}

/* For funds (desks). Every rule starts with the page class and every class with dk-. Final states are the default;
   "before" states only under .js:not(.rm). The workbook (frags/desks.py) is four real tables; desks.js marks the
   current sheet, its formula and its caption with .dk-cur. */

/* ---------- hero ---------- */
.pg-desks .dk-hero{padding-bottom:clamp(24px,5vh,56px)}
.pg-desks .dk-cite{color:var(--blue)}
@supports ((-webkit-background-clip:text) or (background-clip:text)){
  .pg-desks .dk-cite{background:linear-gradient(100deg,var(--c-pro) 0%,var(--blue) 62%);-webkit-background-clip:text;background-clip:text;color:transparent}
}
@media (forced-colors:active){.pg-desks .dk-cite{background:none;color:CanvasText}}

/* ---------- the scene: the sample workbook, one sheet per step ---------- */
/* with motion the workbook peeks up into the hero's last stretch; the overlap is empty and lets clicks through */
.js:not(.rm) .pg-desks .dk-hero{padding-bottom:0}
.js:not(.rm) .pg-desks .dk-scene{--step-h:68vh;margin-top:-64px;pointer-events:none}
@supports (height:100svh){.js:not(.rm) .pg-desks .dk-scene{--step-h:68svh}}
.pg-desks .dk-scene{isolation:isolate}
.pg-desks .dk-scene .scene-pin::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(46% 40% at 50% 54%,rgba(10,100,220,.09),transparent 72%)}
.pg-desks .dk-fig{width:100%;margin:0 auto;display:flex;flex-direction:column;align-items:center;pointer-events:auto}
.pg-desks .dk-book{width:100%;max-width:1040px;--rh:clamp(24px,3.7vh,34px);--fs:.8125rem;--pad:12px;--az:24px}
@supports (height:1svh){.pg-desks .dk-book{--rh:clamp(24px,3.7svh,34px)}}
.pg-desks .dk-win{position:relative;background:var(--surface);border:1px solid var(--line-2);border-radius:16px;overflow:hidden;box-shadow:var(--sh-lift)}

/* title bar and formula bar */
.pg-desks .dk-bar{display:flex;align-items:center;height:40px;padding:0 16px;background:var(--bg-2);border-bottom:1px solid var(--line)}
.pg-desks .dk-dots{display:flex;gap:7px;width:52px;flex:none}
.pg-desks .dk-dots i{width:11px;height:11px;border-radius:50%;background:rgba(14,26,46,.13)}
.pg-desks .dk-file{flex:1;padding-right:52px;text-align:center;font:500 .8125rem/1 var(--sans);letter-spacing:-.005em;color:var(--ink-2)}
.pg-desks .dk-fx{display:grid;height:36px;border-bottom:1px solid var(--line);background:var(--surface)}
.pg-desks .dk-fx-k{grid-area:1/1;display:flex;align-items:center;min-width:0;font:400 .75rem/1 var(--mono);color:var(--ink-2)}
.pg-desks .dk-fx-k:not(.dk-cur){visibility:hidden;opacity:0}
.pg-desks .dk-fx-k b{flex:none;display:grid;place-items:center;width:64px;height:100%;border-right:1px solid var(--line);font-weight:500;color:var(--ink)}
.pg-desks .dk-fx-k i{flex:none;padding:0 12px 0 14px;font:italic 500 .8125rem/1 var(--sans);color:var(--muted)}
.pg-desks .dk-url{display:flex;min-width:0;padding-right:14px;white-space:nowrap}
.pg-desks .dk-u1{min-width:0;overflow:hidden;text-overflow:ellipsis;color:var(--muted)}
.pg-desks .dk-u2{flex:none;color:var(--ink)}

/* the sheets: without JS all four show, one under the other; with JS they share one place */
.pg-desks .dk-grid{display:grid}
.js .pg-desks .dk-p{grid-area:1/1}
.js .pg-desks .dk-p:not(.dk-cur){visibility:hidden;opacity:0}
.pg-desks .dk-t{width:100%;table-layout:fixed;border-collapse:collapse;font:400 var(--fs)/1.2 var(--sans);color:var(--ink)}
.pg-desks .dk-t col{width:var(--w)}
.pg-desks .dk-t caption{caption-side:top;padding:16px 16px 10px;text-align:left;font:500 .875rem/1.4 var(--sans);color:var(--ink-2)}
.js .pg-desks .dk-t caption{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.pg-desks .dk-t :is(td,th){height:var(--rh);padding:0 var(--pad);border:1px solid var(--line);text-align:left;font-weight:400;white-space:nowrap}
.pg-desks .dk-t tr>:first-child{border-left:0}
.pg-desks .dk-t tr>:last-child{border-right:0}
.pg-desks .dk-t tbody tr:last-child>*{border-bottom:0}
.pg-desks .dk-v{display:block;overflow:hidden;text-overflow:ellipsis}
.pg-desks .dk-t .dk-r{text-align:right}
.pg-desks .dk-t .dk-r .dk-v{font-family:var(--mono);font-size:.94em;font-variant-numeric:tabular-nums}
.pg-desks .dk-t .mono{font-size:.94em}
.pg-desks .dk-t .dk-az td{height:var(--az);padding:0;text-align:center;font:400 .6875rem/1 var(--mono);color:var(--muted);background:var(--bg-2);border-top:0}
.pg-desks .dk-t .dk-n{padding:0;text-align:center;font:400 .6875rem/1 var(--mono);color:var(--muted);background:var(--bg-2)}
.pg-desks .dk-t .dk-hi{background:var(--sky);color:var(--blue);font-weight:500}
.pg-desks .dk-hd th{background:var(--surface-2);font-weight:500;color:var(--ink)}
.pg-desks .dk-hd th.dk-r .dk-v{font-family:var(--sans);font-size:1em}
.pg-desks .dk-sh{display:none}
.pg-desks .dk-t tbody th{font-weight:500}
.pg-desks .dk-u a{color:var(--link);font-weight:500;text-decoration:none}
.pg-desks .dk-u a:hover{text-decoration:underline;text-underline-offset:3px}
.pg-desks .dk-up{color:var(--blue)}
.pg-desks .dk-dn{color:var(--ink-2)}
/* the active cell: the first row's link, with the fill handle */
.pg-desks .dk-sel{position:relative}
.pg-desks .dk-sel::after{content:"";position:absolute;inset:-1px;border:2px solid var(--blue);pointer-events:none}
.pg-desks .dk-sel::before{content:"";position:absolute;right:-4px;bottom:-4px;z-index:1;width:7px;height:7px;background:var(--blue);border:1px solid var(--surface)}

/* sheet tabs: with JS only; each tab's bar fills as its sheet is scrolled through */
.pg-desks .dk-tabs{display:none}
.js .pg-desks .dk-tabs{display:flex;gap:2px;height:46px;padding:0 10px;background:var(--bg-2);border-top:1px solid var(--line-2);overflow-x:auto;scrollbar-width:none}
.pg-desks .dk-tabs::-webkit-scrollbar{display:none}
.pg-desks .dk-tab{position:relative;flex:none;appearance:none;margin:0;padding:0 14px 4px;border:0;background:none;font:500 .8125rem/1 var(--sans);letter-spacing:-.005em;color:var(--muted);cursor:pointer;white-space:nowrap}
.pg-desks .dk-tab:hover,.pg-desks .dk-tab[aria-selected="true"]{color:var(--ink)}
.pg-desks .dk-tab:focus-visible{outline-offset:-4px}
.pg-desks .dk-tb{position:absolute;left:14px;right:14px;bottom:9px;height:2px;border-radius:2px;background:var(--line-2);overflow:hidden}
.pg-desks .dk-tb i{display:block;height:100%;background:var(--blue);transform-origin:0 50%;transform:scaleX(0)}
.pg-desks .dk-tab[aria-selected="true"] .dk-tb i{transform:none}

/* captions under the sheet: one per sheet; without JS each table's own caption names it instead */
.pg-desks .dk-fig figcaption{width:100%}
.pg-desks .dk-cap{display:none;margin-top:30px;list-style:none;text-align:center;font:500 clamp(1.125rem,1rem + .55vw,1.5rem)/1.3 var(--sans);letter-spacing:-.018em;color:var(--ink)}
.js .pg-desks .dk-cap{display:grid}
.js .pg-desks .dk-cap>li{grid-area:1/1}
.js .pg-desks .dk-cap>li:not(.dk-cur){visibility:hidden;opacity:0}

/* motion: a sheet's values fill row by row as it appears; the active cell and its filing follow */
.js:not(.rm) .pg-desks .dk-p{transition:opacity .2s var(--ease-std),visibility 0s linear .2s}
.js:not(.rm) .pg-desks .dk-p.dk-cur{transition:opacity .2s var(--ease-std),visibility 0s}
.pg-desks .dk-t tr>:nth-child(3){--c:1}
.pg-desks .dk-t tr>:nth-child(4){--c:2}
.pg-desks .dk-t tr>:nth-child(5){--c:3}
.pg-desks .dk-t tr>:nth-child(6){--c:4}
.js:not(.rm) .pg-desks .dk-v{opacity:0;transform:translateY(7px);transition:opacity 0s .3s,transform 0s .3s}
.js:not(.rm) .pg-desks .dk-live .dk-cur .dk-v{opacity:1;transform:none;transition:opacity .6s var(--ease-out),transform .9s var(--ease-out);transition-delay:calc(.12s + var(--r,0) * 70ms + var(--c,0) * 30ms)}
.js:not(.rm) .pg-desks .dk-sel::after,.js:not(.rm) .pg-desks .dk-sel::before{opacity:0;transform:scale(1.12);transition:opacity 0s .3s,transform 0s .3s}
.js:not(.rm) .pg-desks .dk-live .dk-cur .dk-sel::after,.js:not(.rm) .pg-desks .dk-live .dk-cur .dk-sel::before{opacity:1;transform:none;transition:opacity .6s var(--ease-out) .62s,transform .8s var(--ease-out) .62s}
.js:not(.rm) .pg-desks .dk-fx-k{transition:opacity .2s var(--ease-std),visibility 0s linear .2s}
.js:not(.rm) .pg-desks .dk-book:not(.dk-live) .dk-fx-k{opacity:0}
.js:not(.rm) .pg-desks .dk-live .dk-fx-k.dk-cur{transition:opacity .6s var(--ease-out) .66s,visibility 0s}
.js:not(.rm) .pg-desks .dk-cap>li{transform:translateY(12px);transition:opacity .3s var(--ease-std),transform .6s var(--ease-out),visibility 0s linear .3s}
.js:not(.rm) .pg-desks .dk-cap>li.dk-cur{transform:none;transition:opacity .7s var(--ease-out) .1s,transform .9s var(--ease-out) .1s,visibility 0s}

/* ---------- what we build: three tiles, each a small loop of the product ---------- */
.pg-desks .dk-ways{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;list-style:none}
.pg-desks .dk-way{display:flex;flex-direction:column;padding:14px 14px 30px;border-radius:var(--r-xl);background:var(--surface);border:1px solid var(--line-2);box-shadow:var(--sh-card)}
.pg-desks .dk-way>h3{margin:0 14px;font-size:1.5rem;line-height:1.15;letter-spacing:-.025em}
.pg-desks .dk-way>p{margin:8px 14px 0;font-size:1.0625rem;color:var(--ink-2)}
.pg-desks .dk-dm{position:relative;display:flex;flex-direction:column;justify-content:center;height:236px;margin-bottom:26px;padding:24px;border-radius:18px;background:var(--bg-2);overflow:hidden}
/* backfills: one bar per quarter, oldest lightest */
.pg-desks .dk-q{display:grid;grid-template-columns:repeat(20,minmax(0,1fr));gap:4px;height:124px;align-items:end}
.pg-desks .dk-q i{display:block;height:100%;border-radius:3px;background:var(--blue);background:color-mix(in oklab,var(--blue) calc(28% + var(--d) * 3.7%),var(--sky));transform-origin:50% 100%}
.pg-desks .dk-ql{display:flex;justify-content:space-between;margin-top:14px;font:500 .75rem/1 var(--mono);color:var(--muted)}
/* extracts: the fields a desk asks for, picked */
.pg-desks .dk-chips{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px}
.pg-desks .dk-chip{position:relative;display:inline-flex;padding:9px 14px;border-radius:999px;background:var(--surface);border:1px solid var(--line-2);font-size:.875rem;line-height:1.2;color:var(--ink-2)}
.pg-desks .dk-on{position:absolute;inset:-1px;display:flex;align-items:center;justify-content:center;border-radius:inherit;background:var(--blue);color:var(--on-blue);box-shadow:0 8px 18px -10px rgba(10,100,220,.7)}
/* reconciliation: your file against the filing, line by line */
.pg-desks .dk-rh,.pg-desks .dk-rr{display:grid;grid-template-columns:1fr 40px 1fr;align-items:center}
.pg-desks .dk-rh{margin-bottom:4px;font:500 .6875rem/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.pg-desks .dk-rh span:last-child{grid-column:3}
.pg-desks .dk-rr{margin-top:9px}
.pg-desks .dk-rr i{position:relative;display:block;height:28px;border-radius:8px;background:var(--surface);border:1px solid var(--line-2)}
.pg-desks .dk-rr i::after{content:"";position:absolute;left:10px;top:50%;width:calc(var(--l,70%) - 20px);height:6px;margin-top:-3px;border-radius:3px;background:var(--line-2)}
.pg-desks .dk-rr b{text-align:center;font:600 1rem/1 var(--sans);color:var(--ok)}
.pg-desks .dk-rr.dk-bad b{color:var(--blue)}
.pg-desks .dk-rr.dk-bad i:last-child::before{content:"";position:absolute;inset:-1px;border-radius:inherit;border:1.5px solid var(--blue);background:var(--blue-soft)}

.js:not(.rm) .pg-desks .play .dk-q i{animation:dkOut .3s var(--ease-std) both,dkBar .7s var(--ease-out) calc(.35s + var(--d) * 32ms) forwards}
.js:not(.rm) .pg-desks .play .dk-chip{animation:dkOut .25s var(--ease-std) both,dkUp .6s var(--ease-out) calc(.3s + var(--d) * 70ms) forwards}
.js:not(.rm) .pg-desks .play .dk-on{animation:dkOut .2s var(--ease-std) both,dkPick .6s var(--ease-out) calc(1.1s + var(--d) * 210ms) forwards}
.js:not(.rm) .pg-desks .play .dk-rr{animation:dkOut .25s var(--ease-std) both,dkUp .6s var(--ease-out) calc(.3s + var(--d) * 240ms) forwards}
.js:not(.rm) .pg-desks .play .dk-rr b{animation:dkOut .2s var(--ease-std) both,dkPick .6s var(--ease-out) calc(.6s + var(--d) * 240ms) forwards}
.js:not(.rm) .pg-desks .play .dk-rr.dk-bad i:last-child::before{animation:dkOut .2s var(--ease-std) both,dkFade .6s var(--ease-out) 1.6s forwards}
@keyframes dkOut{to{opacity:0}}
@keyframes dkFade{from{opacity:0}to{opacity:1}}
@keyframes dkUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes dkBar{from{opacity:0;transform:scaleY(.12)}to{opacity:1;transform:none}}
@keyframes dkPick{from{opacity:0;transform:scale(.9)}to{opacity:1;transform:none}}

/* ---------- how it works: three steps on a line that draws ---------- */
.pg-desks .dk-steps{counter-reset:dk;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));max-width:1040px;margin-left:auto;margin-right:auto;list-style:none}
.pg-desks .dk-steps li{position:relative;counter-increment:dk;display:flex;flex-direction:column;align-items:center;padding:0 18px;text-align:center}
.pg-desks .dk-node{position:relative;z-index:1;display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:var(--blue);color:var(--on-blue);font:600 1.25rem/1 var(--sans);box-shadow:0 12px 26px -12px rgba(10,100,220,.65)}
.pg-desks .dk-node::before{content:counter(dk)}
.pg-desks .dk-steps li:not(:last-child)::after{content:"";position:absolute;top:27px;left:calc(50% + 40px);width:calc(100% - 80px);height:2px;border-radius:2px;background:var(--blue);transform-origin:0 50%}
.pg-desks .dk-steps p{max-width:13em;margin-top:26px;font:500 clamp(1.1875rem,1rem + .55vw,1.5rem)/1.3 var(--sans);letter-spacing:-.018em;color:var(--ink);text-wrap:balance}
.js:not(.rm) .pg-desks .dk-steps .dk-node{transition:opacity .6s var(--ease-out),transform .8s var(--ease-out);transition-delay:calc(var(--i) * 640ms)}
.js:not(.rm) .pg-desks .dk-steps li::after{transition:transform .62s var(--ease-io);transition-delay:calc(var(--i) * 640ms + 140ms)}
.js:not(.rm) .pg-desks .dk-steps p{transition:opacity .8s var(--ease-out),transform .9s var(--ease-out);transition-delay:calc(var(--i) * 640ms + 90ms)}
.js:not(.rm) .pg-desks .dk-steps:not(.on) .dk-node{opacity:0;transform:scale(.8)}
.js:not(.rm) .pg-desks .dk-steps:not(.on) li::after{transform:scaleX(0)}
.js:not(.rm) .pg-desks .dk-steps:not(.on) p{opacity:0;transform:translateY(16px)}

/* ---------- write to us ---------- */
.pg-desks .dk-end{padding:clamp(128px,20vh,220px) 0}
.pg-desks .dk-mail{margin-top:30px}
.pg-desks .dk-mail .mail{position:relative;text-decoration:none}
.pg-desks .dk-mail .mail::after{content:"";position:absolute;left:0;right:0;bottom:-5px;height:2px;border-radius:2px;background:currentColor;transform-origin:0 50%}
.js:not(.rm) .pg-desks .dk-mail .mail::after{transition:transform 1s var(--ease-out) .55s}
.js:not(.rm) .pg-desks .dk-mail:not(.on) .mail::after{transform:scaleX(0)}
.pg-desks .dk-end .h3ro-cta{margin-top:40px}

/* ---------- responsive ---------- */
@media (max-width:960px){
  .pg-desks .dk-book{--fs:.75rem;--pad:8px}
  .pg-desks .dk-t col{width:var(--t)}
  .pg-desks .dk-t .dk-ht{display:none}
  .pg-desks .dk-sel::after{inset:0 0 -1px -1px}
  .pg-desks .dk-sel::before{right:-1px;bottom:-4px}
  .pg-desks .dk-lg{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .pg-desks .dk-sh{display:inline}
  .pg-desks .dk-ways{grid-template-columns:minmax(0,1fr);max-width:560px;margin-left:auto;margin-right:auto}
}
@media (max-width:640px){
  .js:not(.rm) .pg-desks .dk-scene{--step-h:62vh}
  @supports (height:100svh){.js:not(.rm) .pg-desks .dk-scene{--step-h:62svh}}
  .pg-desks .dk-book{--fs:.71875rem;--pad:6px;--az:20px}
  .pg-desks .dk-win{border-radius:14px}
  .pg-desks .dk-bar{height:34px;padding:0 12px}
  .pg-desks .dk-dots{gap:6px;width:40px}
  .pg-desks .dk-dots i{width:9px;height:9px}
  .pg-desks .dk-file{padding-right:40px;font-size:.75rem}
  .pg-desks .dk-fx{height:32px}
  .pg-desks .dk-fx-k{font-size:.6875rem}
  .pg-desks .dk-fx-k b{width:44px}
  .pg-desks .dk-fx-k i{padding:0 8px 0 10px}
  .pg-desks .dk-url{padding-right:10px}
  .pg-desks .dk-t col{width:var(--s)}
  .pg-desks .dk-t .dk-hs{display:none}
  .pg-desks .dk-t .dk-az td,.pg-desks .dk-t .dk-n{font-size:.625rem}
  .js .pg-desks .dk-tabs{height:42px;padding:0 4px;gap:0}
  .pg-desks .dk-tab{padding:0 9px 4px;font-size:.75rem}
  .pg-desks .dk-tb{left:9px;right:9px;bottom:8px}
  .pg-desks .dk-cap{margin-top:22px}
  .pg-desks .dk-dm{height:216px;padding:20px}
  .pg-desks .dk-q{height:112px;gap:2px}
  .pg-desks .dk-steps{grid-template-columns:minmax(0,1fr);gap:40px;max-width:420px}
  .pg-desks .dk-steps li{flex-direction:row;align-items:flex-start;gap:20px;padding:0;text-align:left}
  .pg-desks .dk-node{flex:none;width:48px;height:48px;font-size:1.125rem}
  .pg-desks .dk-steps li:not(:last-child)::after{top:58px;left:23px;width:2px;height:calc(100% - 28px);transform-origin:50% 0}
  .pg-desks .dk-steps p{margin-top:11px;max-width:none}
  .js:not(.rm) .pg-desks .dk-steps:not(.on) li::after{transform:scaleY(0)}
  .pg-desks .dk-end .h3ro-cta{margin-top:32px}
}
@media (max-height:620px) and (min-width:641px){
  .pg-desks .dk-fx{display:none}
  .pg-desks .dk-book{--rh:22px;--az:20px}
}

/* the workbook moves a sheet per ~half screen of scroll, not a full one (review, 27 Oct) */
.js:not(.rm) .pg-desks .dk-scene{--step-h:55vh}
@supports (height:100svh){.js:not(.rm) .pg-desks .dk-scene{--step-h:55svh}}
@media (max-width:640px){.js:not(.rm) .pg-desks .dk-scene{--step-h:50vh}@supports (height:100svh){.js:not(.rm) .pg-desks .dk-scene{--step-h:50svh}}}

/* developers page: the console in the hero, the quickstart tabs, the response with its call-outs, the endpoints.
   Final states are the default; before-states only under .js:not(.rm). Only transform, opacity and stroke-dashoffset move. */
.pg-developers{--code-bg:#FFFFFF;--code-bar:#F7F9FC;--code-line:rgba(14,26,46,.09);
  /* code colours, one blue family: values carry the colour, structure steps back */
  --c-key:#3A4A63;--c-str:#0E2A55;--c-num:#0A64DC;--c-pun:#56647C}
.pg-developers .kw{color:#0853BA}
.pg-developers .fl{color:var(--c-key)}
.pg-developers pre code{font-size:inherit}

/* ---------- hero: the note, then a calm, well-lit console ---------- */
.pg-developers .dv-hero{padding-bottom:clamp(56px,9vh,104px)}
.pg-developers .dv-note{max-width:620px;margin:30px auto 0;padding:12px 20px 13px;border-radius:16px;border:1px solid var(--line-2);background:rgba(255,255,255,.78);box-shadow:var(--sh-glass);font-size:.875rem;line-height:1.55;color:var(--ink-2);text-align:center;text-wrap:balance}
.pg-developers .dv-note p{display:inline}
.pg-developers .dv-note p:first-child{display:flex;align-items:center;justify-content:center;gap:8px;margin-bottom:2px}
.pg-developers .dv-note p:first-child::before{content:"";flex:none;width:7px;height:7px;border-radius:50%;background:var(--blue);box-shadow:0 0 0 3px var(--dot-ring)}
.pg-developers .dv-note b{color:var(--ink);font-weight:600}
.js:not(.rm) .pg-developers .h3ro .dv-note{animation:heroIn 1s var(--ease-out) .3s both}

.pg-developers .dv-stage{position:relative;isolation:isolate}
.pg-developers .dv-stage::before{content:"";position:absolute;z-index:-1;left:50%;top:-6%;width:min(1240px,100%);height:96%;transform:translateX(-50%);pointer-events:none;
  background:radial-gradient(50% 50% at 50% 46%,rgba(90,169,255,.22),rgba(90,169,255,.07) 55%,rgba(90,169,255,0) 74%)}

.pg-developers .console.glass{max-width:1000px;margin:0 auto;padding:0;border:0;border-radius:22px;background:none;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}
.pg-developers .c-in{position:relative;overflow:hidden;color:var(--ink);background:var(--code-bg);border:1px solid rgba(14,26,46,.1);border-radius:22px;
  box-shadow:0 1px 1px rgba(14,26,46,.04),0 14px 34px -18px rgba(14,26,46,.2),0 56px 110px -54px rgba(10,80,180,.36)}
.pg-developers .c-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 10px 9px 10px;border-bottom:1px solid var(--code-line);background:var(--code-bar)}
.pg-developers .console .tabs{display:flex;gap:2px;min-width:0;overflow-x:auto;scrollbar-width:none}
.pg-developers .console .tabs::-webkit-scrollbar{display:none}
.pg-developers .console .tab{appearance:none;border:0;background:none;min-height:34px;padding:0 14px;border-radius:999px;font:500 .8125rem/1 var(--sans);color:var(--ink-2);cursor:pointer;white-space:nowrap;
  transition:color var(--dur-fast) var(--ease-std),background-color var(--dur-fast) var(--ease-std),box-shadow var(--dur-fast) var(--ease-std)}
.pg-developers .console .tab:hover{color:var(--ink)}
.pg-developers .console .tab[aria-selected="true"]{background:#fff;color:var(--ink);box-shadow:0 0 0 1px rgba(14,26,46,.08),0 1px 3px rgba(14,26,46,.1)}
.pg-developers .c-act{display:flex;gap:6px;flex:none}
.pg-developers .c-btn{display:inline-flex;align-items:center;gap:8px;min-height:34px;padding:0 14px;border-radius:999px;border:1px solid var(--line-2);background:#fff;color:var(--ink);font:500 .8125rem/1 var(--sans);cursor:pointer;
  transition:background-color var(--dur-fast) var(--ease-std),transform var(--dur-fast) var(--ease-out)}
.pg-developers .c-btn:hover{background:var(--surface-2)}
.pg-developers .c-btn:active{transform:scale(.97)}
.pg-developers .c-run{background:var(--blue);border-color:transparent;color:var(--on-blue);font-weight:600;padding:0 12px 0 14px;box-shadow:0 1px 2px rgba(8,26,51,.15),0 8px 18px -10px rgba(10,100,220,.75)}
.pg-developers .c-run:hover{background:var(--blue-hover)}
.pg-developers .c-run kbd{font:500 .6875rem/1 var(--mono);padding:3px 6px;border-radius:6px;border:0;background:rgba(8,26,51,.26);opacity:1}
.pg-developers .c-req{margin:0;padding:18px 22px;min-height:98px;font:400 .8125rem/1.7 var(--mono);white-space:pre-wrap;overflow-wrap:anywhere}
.pg-developers .c-meta{position:relative;display:flex;align-items:center;flex-wrap:wrap;gap:6px 12px;min-height:44px;padding:8px 22px;border-top:1px solid var(--code-line);border-bottom:1px solid var(--code-line);background:var(--code-bar);font:500 .75rem/1.3 var(--mono);color:var(--muted)}
.pg-developers .c-bar{position:absolute;left:0;right:0;top:-1px;display:block;height:2px;overflow:hidden;pointer-events:none}
.pg-developers .c-bar i{display:block;height:100%;background:var(--blue);transform:scaleX(0);transform-origin:left;opacity:0}
.pg-developers .c-bar.sweep i{animation:dvBar 260ms var(--ease-out) forwards}
@keyframes dvBar{0%{transform:scaleX(0);opacity:1}85%{opacity:1}100%{transform:scaleX(1);opacity:0}}
.pg-developers .c-st{display:inline-flex;align-items:center;gap:10px;opacity:0}
.pg-developers .c-st.on{opacity:1;transition:opacity var(--dur-base) var(--ease-std)}
.pg-developers .c-st .ok{display:inline-flex;align-items:center;gap:7px;color:var(--ok)}
.pg-developers .c-st .ok::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;box-shadow:0 0 0 3px rgba(15,122,69,.14)}
.pg-developers .c-st .t{color:var(--ink-2);font-variant-numeric:tabular-nums}
.pg-developers .c-tag{display:inline-flex;align-items:center;min-height:20px;padding:0 8px;border-radius:999px;border:0;background:var(--sky);color:#0853BA;font:600 .625rem/1 var(--sans);letter-spacing:.08em;text-transform:uppercase}
.pg-developers .c-hint{margin-left:auto;font:400 .75rem/1.3 var(--sans)}
.pg-developers .c-res{position:relative;margin:0;padding:18px 22px;height:calc(19 * 1.7em + 36px);overflow:auto;font:400 .8125rem/1.7 var(--mono);white-space:pre-wrap;overflow-wrap:anywhere}
.pg-developers .c-req .ln,.pg-developers .c-res .ln{display:block;min-height:1.7em}
.pg-developers .c-res.run .ln{opacity:0;transform:translateY(4px)}
.pg-developers .c-res.run.done .ln{opacity:1;transform:none;transition:opacity var(--dur-fast) var(--ease-std),transform var(--dur-fast) var(--ease-out);transition-delay:calc(var(--i,0) * 14ms)}
.pg-developers .c-wait{display:none}
.pg-developers .src{appearance:none;border:0;background:none;padding:0 2px;margin:0 -2px;font:inherit;color:var(--c-num);cursor:pointer;border-radius:4px;
  text-decoration:underline dotted rgba(10,100,220,.6);text-decoration-thickness:1px;text-underline-offset:4px;transition:background-color var(--dur-fast) var(--ease-std)}
.pg-developers .src:hover,.pg-developers .src[aria-expanded="true"]{background:var(--sky);text-decoration-style:solid}
.pg-developers .c-res .grid-x{display:grid;grid-template-columns:30px repeat(4,minmax(0,1fr));border-left:1px solid var(--code-line);border-top:1px solid var(--code-line);margin:0;opacity:1!important;transform:none!important}
.pg-developers .c-res .grid-x+.grid-x{border-top:0}
.pg-developers .c-res .grid-x+.ln:not(.grid-x){margin-top:14px}
.pg-developers .c-res .grid-x span{padding:3px 8px;border-right:1px solid var(--code-line);border-bottom:1px solid var(--code-line);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pg-developers .c-res .grid-x .h{color:var(--muted);background:var(--code-bar);text-align:center}
.pg-developers .c-foot{display:flex;align-items:flex-start;gap:12px;margin:0;padding:12px 22px 13px;border-top:1px solid var(--code-line);background:var(--code-bar);font:400 .75rem/1.55 var(--sans);color:var(--muted)}
.pg-developers .c-foot .c-tag{flex:none;margin-top:-1px}
.pg-developers .pop{position:absolute;left:0;top:0;z-index:5;width:330px;max-width:calc(100% - 24px);padding:16px 18px;border-radius:16px;background:#fff;border:1px solid var(--line-2);color:var(--ink);font-size:.8125rem;line-height:1.5;transform-origin:14px 0;
  box-shadow:0 2px 6px rgba(14,26,46,.06),0 28px 56px -20px rgba(14,26,46,.32)}
.pg-developers .pop:not([hidden]){animation:dvPop .16s var(--ease-out)}
@keyframes dvPop{from{opacity:0;scale:.97}}
.pg-developers .pop[hidden]{display:none}
.pg-developers .pop .pv{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 10px;margin:0 28px 10px 0}
.pg-developers .pop .pv b{font:500 1.25rem/1 var(--mono);color:var(--blue);font-variant-numeric:tabular-nums}
.pg-developers .pop dl{display:grid;gap:5px}
.pg-developers .pop dl div{display:grid;grid-template-columns:72px 1fr;gap:8px}
.pg-developers .pop dt{color:var(--muted)}
.pg-developers .pop dd{font-family:var(--mono);font-size:.75rem;overflow-wrap:anywhere}
.pg-developers .pop .okl{display:flex;gap:6px;align-items:center;margin-top:12px;color:var(--ok);font-weight:500}
.pg-developers .pop a{display:inline-block;margin-top:8px;color:var(--link);font-weight:500;text-underline-offset:3px}
.pg-developers .pop-x{position:absolute;right:8px;top:8px;width:30px;height:30px;border:0;border-radius:999px;background:none;color:var(--muted);cursor:pointer;font-size:1.1rem;line-height:1}
.pg-developers .pop-x:hover{background:var(--surface-2);color:var(--ink)}

/* ---------- quickstart: a segmented control over the panels (no JS: the panels stack) ---------- */
.pg-developers .dv-tabs{max-width:1080px;margin-left:auto;margin-right:auto}
.pg-developers .dv-bar{position:relative;display:flex;overflow-x:auto;scrollbar-width:none;margin:0 calc(var(--gut) * -1) 48px;padding:4px var(--gut)}
.pg-developers .dv-bar::-webkit-scrollbar{display:none}
.pg-developers .dv-tablist{position:relative;display:inline-flex;flex:none;margin:0 auto;padding:4px;border-radius:999px;background:rgba(14,26,46,.055);box-shadow:inset 0 1px 2px rgba(14,26,46,.05)}
.pg-developers .dv-tab{position:relative;z-index:1;appearance:none;border:0;background:none;min-height:40px;padding:0 20px;border-radius:999px;font:500 .9375rem/1 var(--sans);letter-spacing:-.005em;color:var(--ink-2);cursor:pointer;white-space:nowrap;
  transition:color var(--dur-base) var(--ease-std),transform var(--dur-fast) var(--ease-out)}
.pg-developers .dv-tab:hover,.pg-developers .dv-tab[aria-selected="true"]{color:var(--ink)}
.pg-developers .dv-tab:active{transform:scale(.97)}
.pg-developers .dv-tab:focus-visible{outline-offset:-2px;border-radius:999px}
.pg-developers .dv-pill{position:absolute;left:0;top:0;width:0;height:0;border-radius:999px;background:#fff;pointer-events:none;transform-origin:0 0;
  box-shadow:0 1px 2px rgba(14,26,46,.08),0 6px 16px -8px rgba(14,26,46,.24)}

.pg-developers .dv-panel{display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:24px 56px;align-items:start}
.pg-developers .dv-panel[hidden]{display:none}
.pg-developers .dv-panel+.dv-panel{margin-top:64px;padding-top:64px;border-top:1px solid var(--line-2)}
.pg-developers .dv-tabbed .dv-panel+.dv-panel{margin-top:0;padding-top:0;border-top:0}
.pg-developers .dv-tabbed .dv-panel{scroll-margin-top:88px}
.pg-developers .dv-say{padding-top:6px}
.pg-developers .dv-say h3{margin-bottom:12px;font-size:1.5rem;letter-spacing:-.025em}
.pg-developers .dv-tabbed .dv-say h3{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.pg-developers .dv-say p{font-size:1.0625rem;line-height:1.55;color:var(--ink-2);text-wrap:pretty}
.pg-developers .dv-say p+p{margin-top:12px}
.pg-developers .dv-say code,.pg-developers .more-body p code,.pg-developers .kv dd code{padding:1px 5px;border-radius:6px;background:rgba(14,26,46,.055);font-size:.85em;color:var(--ink);white-space:nowrap}
.pg-developers .nw{white-space:nowrap}
.pg-developers .dv-say .go{white-space:nowrap}
.pg-developers .dv-steps{list-style:none;counter-reset:st;display:grid;gap:12px;margin:18px 0 0}
.pg-developers .dv-steps li{counter-increment:st;position:relative;padding-left:36px;font-size:.9375rem;line-height:1.5;color:var(--ink-2)}
.pg-developers .dv-steps li::before{content:counter(st);position:absolute;left:0;top:-1px;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:#fff;border:1px solid var(--line-2);font:600 .6875rem/1 var(--mono);color:var(--blue)}
.pg-developers .dv-steps b{font-weight:600;color:var(--ink)}
.pg-developers .dv-say .dv-aside{margin-top:18px;font-size:.9375rem;color:var(--muted)}
.pg-developers .dv-run{display:grid;gap:14px;min-width:0}
.pg-developers .dv-tools{grid-column:1/-1;margin-top:12px;padding-top:28px;border-top:1px solid var(--line-2)}
.pg-developers .dv-tools h4{margin-bottom:14px;font-size:1rem;letter-spacing:-.01em}
.pg-developers .dv-chips{display:flex;flex-wrap:wrap;gap:6px;list-style:none}
.pg-developers .dv-chips code{display:inline-flex;align-items:center;min-height:32px;padding:0 10px;border-radius:999px;background:#fff;border:1px solid var(--line-2);font:500 .8125rem/1 var(--mono);color:var(--ink)}
.pg-developers .dv-tools details.more{max-width:none;margin:22px 0 0}

/* ---------- code blocks ---------- */
.pg-developers .codeblock{position:relative;margin:0;border:1px solid var(--code-line);border-radius:16px;background:var(--code-bg);overflow:hidden;box-shadow:0 1px 2px rgba(14,26,46,.04),0 14px 30px -20px rgba(14,26,46,.2)}
.pg-developers .codeblock .lbl{display:flex;align-items:center;gap:10px;min-height:42px;margin:0;padding:6px 7px 6px 16px;border:0;border-bottom:1px solid var(--code-line);border-radius:0;background:var(--code-bar);font:500 .75rem/1.3 var(--mono);color:var(--muted)}
.pg-developers .codeblock .lbl>span{flex:1;min-width:0;overflow-wrap:anywhere}
.pg-developers .codeblock .lbl h4{flex:none;margin:0;font:600 .8125rem/1.3 var(--sans);letter-spacing:-.005em;color:var(--ink)}
.pg-developers .codeblock pre{margin:0;padding:16px 18px;border:0;border-radius:0;background:none;font:400 .8125rem/1.7 var(--mono);color:var(--ink);white-space:pre-wrap;overflow-wrap:anywhere;tab-size:2}
.pg-developers .dv-out pre{color:var(--ink-2)}
.pg-developers .dv-app p{padding:14px 18px 16px;font-size:.9375rem;line-height:1.55;color:var(--ink-2)}
.pg-developers .dv-csv pre{white-space:pre;overflow-wrap:normal;overflow-x:auto}
.pg-developers .copy{display:inline-flex;align-items:center;gap:6px;flex:none;min-height:30px;padding:0 12px 0 10px;border-radius:999px;border:1px solid var(--line-2);background:#fff;color:var(--ink-2);font:500 .75rem/1 var(--sans);cursor:pointer;
  transition:background-color var(--dur-fast) var(--ease-std),color var(--dur-fast) var(--ease-std),transform var(--dur-fast) var(--ease-out)}
.pg-developers .copy:hover{background:var(--surface-2);color:var(--ink)}
.pg-developers .copy:active{transform:scale(.96)}
.pg-developers .copy svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}

/* ---------- the response, with three call-outs drawn to source.url, filed and check ---------- */
.pg-developers .dv-fig{position:relative;max-width:880px;margin-left:auto;margin-right:auto}
.pg-developers .dv-json{border:1px solid var(--code-line);border-radius:18px;background:var(--code-bg);overflow:hidden;box-shadow:var(--sh-card)}
.pg-developers .dv-json .lbl{display:flex;align-items:center;height:44px;margin:0;padding:0 18px;border-bottom:1px solid var(--code-line);background:var(--code-bar);font:500 .75rem/1 var(--mono);color:var(--muted)}
.pg-developers .dv-src{overflow-x:auto}
.pg-developers .dv-in{position:relative;width:max-content;min-width:100%;--lh:19px;--pt:16px}
.pg-developers .dv-in pre{position:relative;margin:0;padding:var(--pt) 18px;border:0;background:none;font:400 11.5px/var(--lh) var(--mono);color:var(--ink);white-space:pre}
.pg-developers .dv-band{position:absolute;left:0;right:0;top:calc(var(--pt) + var(--ln) * var(--lh) + 1px);height:calc(var(--lh) - 2px);background:rgba(10,100,220,.08);box-shadow:inset 2px 0 0 var(--blue);transform-origin:0 50%}
.pg-developers .dv-notes{list-style:none;display:grid;gap:10px;margin:16px 0 0}
.pg-developers .dv-notes li{display:flex;flex-direction:column;gap:3px;padding:14px 18px;border-radius:14px;border:1px solid var(--line-2);background:var(--surface)}
.pg-developers .dv-notes code{font:500 .75rem/1.3 var(--mono);color:var(--blue)}
.pg-developers .dv-notes span{font-size:1.0625rem;font-weight:500;letter-spacing:-.01em;line-height:1.3;color:var(--ink)}
.pg-developers .dv-wires{display:none}
.pg-developers .dv-wires path{fill:none;stroke:var(--blue);stroke-width:1.25;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:0}
.pg-developers .dv-wires circle{fill:var(--blue);stroke:var(--code-bg);stroke-width:2;transform-box:fill-box;transform-origin:center}
@media (min-width:640px){.pg-developers .dv-notes{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:1180px){  /* geometry shared with frags/developers.py (DV_*): 12.5px/20px code, 20px top, 22px left, 72px gutter */
  .pg-developers .dv-fig{--hd:45px;display:grid;grid-template-columns:236px 72px 820px;justify-content:center;max-width:none}
  .pg-developers .dv-json{grid-column:3;grid-row:1}
  .pg-developers .dv-in{--lh:20px;--pt:20px}
  .pg-developers .dv-band{box-shadow:none}
  .pg-developers .dv-in pre{padding:var(--pt) 22px;font-size:12.5px}
  .pg-developers .dv-notes{grid-column:1;grid-row:1;position:relative;display:block;margin:var(--hd) 0 0}
  .pg-developers .dv-notes li{position:absolute;right:0;top:var(--y);translate:0 -50%;width:max-content;max-width:236px;align-items:flex-end;padding:0;border:0;border-radius:0;background:none;text-align:right}
  .pg-developers .dv-wires{display:block;position:absolute;left:236px;top:var(--hd);overflow:visible;pointer-events:none}
}
/* the order on view: the note, then its wire to the key, then the dot, then the line lights up */
.js:not(.rm) .pg-developers .dv-notes li{opacity:0;transform:translateY(10px);transition:opacity .6s var(--ease-out),transform .8s var(--ease-out);transition-delay:calc(var(--i) * 70ms)}
.js:not(.rm) .pg-developers .dv-band{transform:scaleX(0);transition:transform .8s var(--ease-out) calc(.15s + var(--i) * 70ms)}
.js:not(.rm) .pg-developers .dv-fig.on :is(.dv-notes li,.dv-band){opacity:1;transform:none}
@media (min-width:1180px){
  .js:not(.rm) .pg-developers .dv-notes li{transform:translateX(-10px)}
  .js:not(.rm) .pg-developers .dv-wires path{stroke-dashoffset:1;transition:stroke-dashoffset .9s var(--ease-io) calc(.25s + var(--i) * 70ms)}
  .js:not(.rm) .pg-developers .dv-wires circle{opacity:0;transform:scale(.5);transition:opacity .3s var(--ease-out),transform .5s var(--ease-out);transition-delay:calc(1.05s + var(--i) * 70ms)}
  .js:not(.rm) .pg-developers .dv-band{transition-delay:calc(1.1s + var(--i) * 70ms)}
  .js:not(.rm) .pg-developers .dv-fig.on .dv-wires path{stroke-dashoffset:0}
  .js:not(.rm) .pg-developers .dv-fig.on .dv-wires circle{opacity:1;transform:none}
}

/* ---------- endpoints ---------- */
.pg-developers .dv-api{max-width:960px;margin-left:auto;margin-right:auto;overflow:hidden;border:1px solid var(--line-2);border-radius:20px;background:var(--surface);box-shadow:var(--sh-card)}
.pg-developers .dv-base{display:flex;align-items:center;flex-wrap:wrap;gap:8px 14px;padding:14px 14px 14px 24px;border-bottom:1px solid var(--line-2);background:var(--code-bar)}
.pg-developers .dv-bk{font-size:.875rem;color:var(--muted)}
.pg-developers .dv-base code{font:500 .9375rem/1.3 var(--mono);color:var(--ink);overflow-wrap:anywhere}
.pg-developers .dv-nokey{margin-left:auto;font-size:.875rem;color:var(--ink-2)}
.pg-developers .dv-eps{list-style:none}
.pg-developers .dv-eps li{display:grid;grid-template-columns:50px minmax(0,1.05fr) minmax(0,1fr);gap:4px 16px;align-items:baseline;padding:14px 24px;border-top:1px solid var(--line)}
.pg-developers .dv-eps li:first-child{border-top:0}
.pg-developers .dv-m{justify-self:start;padding:4px 7px;border-radius:6px;background:var(--sky);color:#0853BA;font:600 .6875rem/1 var(--mono);letter-spacing:.04em}
.pg-developers .dv-p{font:500 .875rem/1.45 var(--mono);color:var(--ink);overflow-wrap:anywhere}
.pg-developers .dv-p i{font-style:normal;color:var(--blue)}
.pg-developers .dv-eps span{font-size:.9375rem;line-height:1.45;color:var(--ink-2)}
.pg-developers .dv-resp details.more,.pg-developers .dv-ep details.more{max-width:960px}
@media (max-width:1179px){.pg-developers .dv-resp details.more{max-width:880px}}
.pg-developers .more-body .kv{grid-template-columns:max-content minmax(0,1fr);gap:8px 20px;font-size:.9375rem}
.pg-developers #versions .kv{grid-template-columns:5.5rem minmax(0,1fr)}
.pg-developers .more-body p{font-size:.9375rem}
.pg-developers .more-body h3{margin-top:26px;font-size:.9375rem;letter-spacing:-.005em;color:var(--ink)}
.pg-developers .more-body h3:first-child{margin-top:0}
.pg-developers .more-body h3+*{margin-top:10px}
.pg-developers .more-body .kv+p,.pg-developers .more-body p+.kv{margin-top:18px}
.pg-developers .more-body .codeblock{margin-top:14px}

/* ---------- smaller screens ---------- */
@media (max-width:900px){
  .pg-developers .dv-panel{grid-template-columns:minmax(0,1fr);gap:20px}
  .pg-developers .dv-say{padding-top:0}
}
@media (max-width:760px){
  .pg-developers .dv-eps li{grid-template-columns:44px minmax(0,1fr);padding:14px 18px}
  .pg-developers .dv-eps span{grid-column:2}
  .pg-developers .dv-base{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 12px;padding:14px 14px 14px 18px}
  .pg-developers .dv-bk{grid-area:1/1}
  .pg-developers .dv-base code{grid-area:2/1}
  .pg-developers .dv-base .copy{grid-area:1/2/3/3}
  .pg-developers .dv-nokey{grid-area:3/1/4/3;margin:8px 0 0}
}
@media (max-width:640px){
  .pg-developers .dv-note{text-align:left;padding:12px 16px}
  .pg-developers .dv-note p:first-child{justify-content:flex-start}
  .pg-developers .console.glass,.pg-developers .c-in{border-radius:18px}
  .pg-developers .c-head{padding:8px}
  .pg-developers .console .tab{padding:0 10px;font-size:.75rem}
  .pg-developers .c-btn[data-copy-req]{display:none}
  .pg-developers .c-req,.pg-developers .c-res{padding:14px 16px;font-size:.75rem}
  .pg-developers .c-res{height:calc(20 * 1.7em + 28px)}
  .pg-developers .c-meta{padding:8px 16px}
  .pg-developers .c-foot{padding:12px 16px}
  .pg-developers .c-hint,.pg-developers .c-run kbd{display:none}
  .pg-developers .console .tabs{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent)}
  .pg-developers .c-res .ln:not(.grid-x){padding-left:2ch;text-indent:-2ch}
  .pg-developers .dv-bar{margin-bottom:32px}
  .pg-developers .dv-tab{min-height:38px;padding:0 13px;font-size:.875rem}
  .pg-developers .codeblock pre{padding:14px 16px;font-size:.75rem}
  .pg-developers .dv-say p{font-size:1rem}
  .pg-developers .more-body .kv{grid-template-columns:minmax(0,1fr);gap:2px 0}
  .pg-developers .more-body .kv dd{margin-bottom:10px}
}
@media (max-width:520px){
  .pg-developers .dv-bar{margin:0 0 28px;padding:0;overflow:visible}
  .pg-developers .dv-tablist{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;border-radius:24px}
  .pg-developers .dv-tab{padding:0 6px}
}
@media (hover:none) and (pointer:coarse){.pg-developers .c-run kbd{display:none}}
@media (forced-colors:active){
  .pg-developers .console .tab[aria-selected="true"],.pg-developers .dv-tab[aria-selected="true"]{outline:2px solid CanvasText;outline-offset:-2px}
  .pg-developers .dv-pill{display:none}
}
@media print{.pg-developers .console .c-act,.pg-developers .dv-bar{display:none}.pg-developers .dv-panel[hidden]{display:grid}}

/* index page (pg-index): the home page as one scroll story. Final frames are the default; before-states only under
   .js:not(.rm), and home.js / history.js set the in-between frames inline while a scene is pinned.
   The unprefixed .trace / .tr-* block at the end belongs to film.html (standalone), which still renders <div class="trace lit" data-trace data-demo role="group" aria-label="One figure traced to its filing: Reliance Industries Limited"><div class="tr-co"><p class="tr-h"><span class="tr-sym">RELIANCE</span><span class="tr-q">Quarter ended 30 Jun 2026</span></p><p class="tr-name">Reliance Industries Limited</p><p class="tr-bar" aria-hidden="true"><i style="width:50.48%"></i><i style="width:17.06%"></i><i class=on style="width:10.11%"></i><i style="width:9.2%"></i><i style="width:7.16%"></i></p><ul class="tr-rows"><li><span>Promoters</span><b>50.48%</b></li><li><span>Foreign investors</span><b>17.06%</b></li><li class=on><span>Mutual funds</span><b>10.11%</b></li><li><span>Insurers</span><b>9.20%</b></li><li><span>Retail investors</span><b>7.16%</b></li></ul></div><svg class="tr-link" aria-hidden="true"><path pathLength="1"/><circle r="4"/></svg><p class="tr-down" aria-hidden="true">as filed</p><div class="tr-fl"><p class="tr-fk"><span>NSE · Shareholding pattern</span><span class="tr-filed">Filed 16 Jul 2026</span></p><p class="tr-fname">Reliance Industries Limited</p><dl class="tr-dl"><div><dt>Promoter and promoter group</dt><dd>6,71,54,96,096</dd></div><div><dt>Foreign portfolio investors (I + II)</dt><dd>2,27,01,49,185</dd></div><div class=on><dt>Mutual funds</dt><dd>1,34,44,30,220</dd></div><div><dt>Insurance companies</dt><dd>1,22,42,69,421</dd></div><div><dt>Resident individuals up to Rs. 2 lakh</dt><dd>95,29,58,091</dd></div></dl><p class="tr-file">SHP_1694620_16072026072434_WEB.xml</p><a class="tr-open" href="https://nsearchives.nseindia.com/corporate/xbrl/SHP_1694620_16072026072434_WEB.xml" rel="noopener">Open the filing <span aria-hidden="true">↗</span></a></div></div><script type="application/json" id="trace-data">[{"sym": "RELIANCE", "name": "Reliance Industries Limited", "q": "30 Jun 2026", "filed": "16 Jul 2026", "file": "SHP_1694620_16072026072434_WEB.xml", "url": "https://nsearchives.nseindia.com/corporate/xbrl/SHP_1694620_16072026072434_WEB.xml", "t": 2, "rows": [{"l": "Promoters", "lf": "Promoter and promoter group", "lfd": "Promoter and promoter group", "pct": 50.48, "sh": "6,71,54,96,096"}, {"l": "Foreign investors", "lf": "Foreign portfolio investors", "lfd": "Foreign portfolio investors (I + II)", "pct": 17.06, "sh": "2,27,01,49,185"}, {"l": "Mutual funds", "lf": "Mutual funds", "lfd": "Mutual funds", "pct": 10.11, "sh": "1,34,44,30,220"}, {"l": "Insurers", "lf": "Insurance companies", "lfd": "Insurance companies", "pct": 9.2, "sh": "1,22,42,69,421"}, {"l": "Retail investors", "lf": "Resident individuals up to Rs. 2 lakh", "lfd": "Resident individuals up to Rs. 2 lakh", "pct": 7.16, "sh": "95,29,58,091"}]}, {"sym": "TCS", "name": "Tata Consultancy Services Limited", "q": "30 Jun 2026", "filed": "21 Jul 2026", "file": "SHP_1698205_21072026034350_WEB.xml", "url": "https://nsearchives.nseindia.com/corporate/xbrl/SHP_1698205_21072026034350_WEB.xml", "t": 1, "rows": [{"l": "Promoters", "lf": "Promoter and promoter group", "lfd": "Promoter and promoter group", "pct": 71.77, "sh": "2,59,65,58,628"}, {"l": "Foreign investors", "lf": "Foreign portfolio investors", "lfd": "Foreign portfolio investors (I + II)", "pct": 9.06, "sh": "32,78,90,679"}, {"l": "Mutual funds", "lf": "Mutual funds", "lfd": "Mutual funds", "pct": 5.68, "sh": "20,54,54,535"}, {"l": "Insurers", "lf": "Insurance companies", "lfd": "Insurance companies", "pct": 6.71, "sh": "24,29,16,344"}, {"l": "Retail investors", "lf": "Resident individuals up to Rs. 2 lakh", "lfd": "Resident individuals up to Rs. 2 lakh", "pct": 4.7, "sh": "17,01,18,405"}]}, {"sym": "SBIN", "name": "State Bank of India", "q": "30 Jun 2026", "filed": "15 Jul 2026", "file": "SHP_1693592_15072026065623_WEB.xml", "url": "https://nsearchives.nseindia.com/corporate/xbrl/SHP_1693592_15072026065623_WEB.xml", "t": 3, "rows": [{"l": "Promoters", "lf": "Promoter and promoter group", "lfd": "Promoter and promoter group", "pct": 55.47, "sh": "5,07,97,75,288"}, {"l": "Foreign investors", "lf": "Foreign portfolio investors", "lfd": "Foreign portfolio investors (I + II)", "pct": 10.81, "sh": "98,99,96,652"}, {"l": "Mutual funds", "lf": "Mutual funds", "lfd": "Mutual funds", "pct": 13.61, "sh": "1,24,68,00,364"}, {"l": "Insurers", "lf": "Insurance companies", "lfd": "Insurance companies", "pct": 10.25, "sh": "93,84,23,337"}, {"l": "Retail investors", "lf": "Resident individuals up to Rs. 2 lakh", "lfd": "Resident individuals up to Rs. 2 lakh", "pct": 5.6, "sh": "51,29,13,153"}]}, {"sym": "HINDUNILVR", "name": "Hindustan Unilever Limited", "q": "30 Jun 2026", "filed": "21 Jul 2026", "file": "SHP_1697830_21072026121013_WEB.xml", "url": "https://nsearchives.nseindia.com/corporate/xbrl/SHP_1697830_21072026121013_WEB.xml", "t": 4, "rows": [{"l": "Promoters", "lf": "Promoter and promoter group", "lfd": "Promoter and promoter group", "pct": 61.9, "sh": "1,45,44,12,858"}, {"l": "Foreign investors", "lf": "Foreign portfolio investors", "lfd": "Foreign portfolio investors (I + II)", "pct": 9.5, "sh": "22,32,37,247"}, {"l": "Mutual funds", "lf": "Mutual funds", "lfd": "Mutual funds", "pct": 7.15, "sh": "16,80,32,815"}, {"l": "Insurers", "lf": "Insurance companies", "lfd": "Insurance companies", "pct": 8.7, "sh": "20,43,47,232"}, {"l": "Retail investors", "lf": "Resident individuals up to Rs. 2 lakh", "lfd": "Resident individuals up to Rs. 2 lakh", "pct": 9.71, "sh": "22,82,15,637"}]}, {"sym": "KOTAKBANK", "name": "Kotak Mahindra Bank Limited", "q": "30 Jun 2026", "filed": "14 Jul 2026", "file": "SHP_1692686_14072026081830_WEB.xml", "url": "https://nsearchives.nseindia.com/corporate/xbrl/SHP_1692686_14072026081830_WEB.xml", "t": 0, "rows": [{"l": "Promoters", "lf": "Promoter and promoter group", "lfd": "Promoter and promoter group", "pct": 25.87, "sh": "2,57,32,01,985"}, {"l": "Foreign investors", "lf": "Foreign portfolio investors", "lfd": "Foreign portfolio investors (I + II)", "pct": 25.2, "sh": "2,50,67,62,296"}, {"l": "Mutual funds", "lf": "Mutual funds", "lfd": "Mutual funds", "pct": 24.5, "sh": "2,43,64,81,373"}, {"l": "Insurers", "lf": "Insurance companies", "lfd": "Insurance companies", "pct": 10.01, "sh": "99,56,85,943"}, {"l": "Retail investors", "lf": "Resident individuals up to Rs. 2 lakh", "lfd": "Resident individuals up to Rs. 2 lakh", "pct": 4.36, "sh": "43,41,37,076"}]}]</script>. */

/* ---------- A. the hero, then "Every number has a source": one pinned scene ---------- */
.pg-index .a-in{display:flex;flex-direction:column;align-items:center}
.pg-index .a-hero.h3ro{padding:0;display:flex;flex-direction:column;align-items:center;text-align:center;will-change:transform,opacity}
.pg-index .a-hero.gone{visibility:hidden}
.pg-index .a-stage{position:relative;width:100%;max-width:1080px;margin:clamp(64px,10vh,112px) auto 0}
.pg-index .a-h{text-align:center;margin:0 auto 44px}
.pg-index .a-tr{position:relative;display:grid;grid-template-columns:minmax(0,1fr) clamp(72px,9vw,128px) minmax(0,1fr);align-items:center}

/* the company card: its surface is its own layer, so on a phone the card can dissolve and leave one row */
.pg-index .a-co{grid-column:1;grid-row:1;position:relative;isolation:isolate;padding:22px 18px 16px;border-radius:var(--r-lg)}
.pg-index .a-surf{position:absolute;inset:0;z-index:-1;border-radius:inherit;background:var(--surface);border:1px solid var(--line-2);box-shadow:var(--sh-card)}
.pg-index .a-co-h{display:flex;justify-content:space-between;gap:10px;padding:0 6px;font:500 .75rem/1 var(--mono);color:var(--muted)}
.pg-index .a-sym{color:var(--ink);letter-spacing:.04em}
.pg-index .a-co-n{margin:12px 6px 16px;font-weight:600;font-size:1.125rem;letter-spacing:-.015em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pg-index .a-bar{display:flex;gap:2px;height:10px;margin:0 6px 14px;border-radius:5px;overflow:hidden;background:var(--c-oth)}
.pg-index .a-bar i{display:block;flex:none;width:calc(var(--w) * 1%);height:100%;transform-origin:left center;transition:transform .9s var(--ease-out) calc(var(--k) * 70ms),opacity .6s var(--ease-out)}
.pg-index .s-pro{background:var(--c-pro)}
.pg-index .s-fpi{background:var(--c-fpi)}
.pg-index .s-mf{background:var(--c-mf)}
.pg-index .s-ins{background:var(--c-ins)}
.pg-index .s-ret{background:var(--c-ret)}
.pg-index .a-rows{list-style:none;display:grid;gap:2px}
.pg-index .a-rows li{position:relative;isolation:isolate;display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:9px 12px;border-radius:12px;font-size:.9375rem;color:var(--ink-2);transition:opacity .6s var(--ease-out),transform .7s var(--ease-out)}
.pg-index .a-rows b{font:500 .9375rem/1 var(--mono);font-variant-numeric:tabular-nums;color:var(--ink)}
/* the traced row: tinted when tapped, lifted when the story starts */
.pg-index .a-mf{color:var(--ink);transform:scale(1.04)}
.pg-index .a-mf b{color:var(--link)}
.pg-index .a-mf::before,.pg-index .a-mf::after{content:"";position:absolute;inset:0;border-radius:inherit;transition:opacity .5s var(--ease-out)}
.pg-index .a-mf::before{z-index:-1;background:var(--sky)}
.pg-index .a-mf::after{z-index:-2;background:var(--surface);box-shadow:0 0 0 1px var(--tag-edge),0 16px 32px -14px rgba(8,26,51,.38)}
.js:not(.rm) .pg-index .a-co.pre .a-bar i{transform:scaleX(0)}
.js:not(.rm) .pg-index .a-co:not(.lit) .a-mf{color:var(--ink-2)}
.js:not(.rm) .pg-index .a-co:not(.lit) .a-mf b{color:var(--ink)}
.js:not(.rm) .pg-index .a-co:not(.lit) .a-mf::before{opacity:0}
.js:not(.rm) .pg-index .a-co:not(.up) .a-mf{transform:none}
.js:not(.rm) .pg-index .a-co:not(.up) .a-mf::after{opacity:0}
.js:not(.rm) .pg-index .a-co.up .a-rows li:not(.a-mf){opacity:.4}
.js:not(.rm) .pg-index .a-co.up .a-bar i:not(.s-mf){opacity:.28}

/* the line from the row to the line it was filed on */
.pg-index .a-link{position:absolute;left:0;top:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:2}
.pg-index .a-link path{fill:none;stroke:var(--blue);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1}
.pg-index .a-link circle{fill:var(--blue)}
.js:not(.rm) .pg-index .a-link path{stroke-dashoffset:1}
.js:not(.rm) .pg-index .a-link circle{opacity:0}

/* the filing: light paper, the same on every chapter */
.pg-index .a-fl{grid-column:3;grid-row:1;position:relative;padding:22px 22px 18px;border-radius:var(--r-lg);background:var(--paper);color:var(--paper-ink);border:1px solid var(--paper-line);box-shadow:var(--sh-lift)}
.pg-index .a-fl-k{display:flex;justify-content:space-between;gap:6px 10px;flex-wrap:wrap;padding-bottom:10px;border-bottom:1px solid var(--paper-line);font:500 .6875rem/1.3 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--paper-muted)}
.pg-index .a-fl-n{margin:12px 0 6px;font:400 1.15rem/1.3 var(--serif);letter-spacing:-.005em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pg-index .a-dl div{position:relative;isolation:isolate;display:flex;justify-content:space-between;align-items:baseline;gap:14px;padding:7px 8px;border-bottom:1px dashed var(--paper-line);font:400 .9375rem/1.35 var(--serif)}
.pg-index .a-dl dt{color:var(--paper-muted);min-width:0}
.pg-index .a-dl dd{margin:0;font:500 .8125rem/1.4 var(--mono);font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--paper-ink)}
.pg-index .a-dl .a-tot{border-bottom:0;border-top:1px solid var(--paper-line);margin-top:-1px}
.pg-index .a-dl .a-tot dt{color:var(--paper-ink)}
.pg-index .a-hit dt{color:var(--paper-ink)}
.pg-index .a-hit::before,.pg-index .a-tot::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:4px;background:var(--paper-hl);box-shadow:inset 0 -2px 0 var(--paper-link);transition:opacity .5s var(--ease-out)}
.pg-index .a-tot::before{box-shadow:none}
.js:not(.rm) .pg-index .a-fl:not(.hit) .a-hit::before,.js:not(.rm) .pg-index .a-fl:not(.tot) .a-tot::before{opacity:0}
.js:not(.rm) .pg-index .a-fl:not(.hit) .a-hit dt{color:var(--paper-muted)}
.pg-index .a-file{margin-top:12px;font:400 .6875rem/1.4 var(--mono);color:var(--paper-muted);overflow-wrap:anywhere}
.pg-index .a-open{display:inline-flex;gap:4px;margin-top:6px;font-weight:600;font-size:.9375rem;color:var(--paper-link);text-underline-offset:3px}
.pg-index .a-open:focus-visible{outline-color:var(--paper-link)}

/* the working, one character at a time */
.pg-index .a-sum{grid-column:1 / -1;grid-row:2;margin-top:40px;text-align:center;font:500 clamp(1.0625rem,.55rem + 1.6vw,1.75rem)/1.35 var(--sans);letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:var(--ink)}
.pg-index .a-sum .tk{display:inline-block;white-space:nowrap}
.pg-index .a-sum .tk-o{color:var(--muted);font-weight:400}
.pg-index .a-sum .tk-r{color:var(--link);font-weight:600}

/* the pointer that taps the figure once */
.pg-index .a-ptr{position:absolute;left:0;top:0;z-index:3;width:22px;height:22px;pointer-events:none;opacity:0;transform:translate3d(var(--px,0),var(--py,0),0);transition:transform .75s var(--ease-out),opacity .2s var(--ease-std)}
.pg-index .a-ptr.jump{transition:none}
.pg-index .a-ptr.on{opacity:1}
.pg-index .a-ptr svg{display:block;width:22px;height:22px;transform-origin:4px 3px;transition:transform .12s var(--ease-out)}
.pg-index .a-ptr path{fill:var(--ink);stroke:var(--surface);stroke-width:1.4;stroke-linejoin:round}
.pg-index .a-ptr circle{fill:var(--ink);fill-opacity:.85;stroke:var(--surface);stroke-width:2}
.pg-index .a-ptr.press svg{transform:scale(.88)}
.pg-index .a-ptr::after{content:"";position:absolute;left:-7px;top:-8px;width:22px;height:22px;border-radius:50%;border:2px solid var(--blue);opacity:0;transform:scale(.4)}
.pg-index .a-ptr.tap::after{left:0;top:0}
.pg-index .a-ptr.press::after{animation:ptrRing .5s var(--ease-out) both}
@keyframes ptrRing{0%{opacity:.7;transform:scale(.4)}100%{opacity:0;transform:scale(1.8)}}

/* pinned: the page starts under the nav so the first frame is the pinned frame; h2 and working leave the flow */
.js:not(.rm) .pg-index .a-scene{margin-top:-68px}
.js:not(.rm) .pg-index .a-stage{will-change:transform}
.js:not(.rm) .pg-index .a-h{position:absolute;left:0;right:0;bottom:calc(100% + 44px);margin:0;opacity:0}
.js:not(.rm) .pg-index .a-tr{animation:heroIn 1.2s var(--ease-out) .42s both}
.js:not(.rm) .pg-index .a-co{transform:translateX(calc(50% + clamp(36px,4.5vw,64px)))}
.js:not(.rm) .pg-index .a-fl{opacity:0;visibility:hidden}
.js:not(.rm) .pg-index .a-sum{position:absolute;left:0;right:0;top:calc(100% + 40px);margin:0}
.js:not(.rm) .pg-index .a-sum .c{opacity:0}

/* ---------- B. watch ownership shift: the chart draws with the scroll, then two call-outs land ---------- */
.pg-index .b-in{display:flex;flex-direction:column;align-items:center}
.pg-index .b-h{text-align:center}
.pg-index .b-fig{width:100%;max-width:1000px;margin:clamp(28px,5vh,52px) auto 0}
.pg-index .b-read{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:10px 28px;margin-bottom:18px}
.pg-index .b-q{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;font-weight:600;letter-spacing:-.01em}
.pg-index .b-qd{font-weight:500;color:var(--ink-2);font-variant-numeric:tabular-nums}
.pg-index .b-q a{font-size:.875rem;font-weight:500;color:var(--link);text-underline-offset:3px}
.pg-index .b-legend{display:flex;flex-wrap:wrap;gap:6px 18px;list-style:none;font-size:.8125rem;color:var(--ink-2)}
.pg-index .b-legend li{display:flex;align-items:center;gap:7px;transition:opacity .5s var(--ease-out)}
.pg-index .b-legend i,.pg-index .b-pill i{display:block;flex:none;width:10px;height:10px;border-radius:3px}
.pg-index .b-legend b{font-weight:500;color:var(--ink);font-variant-numeric:tabular-nums}
.pg-index .hl-promoters i,.pg-index i.hl-promoters{background:var(--c-pro)}
.pg-index .hl-fpi i,.pg-index i.hl-fpi{background:var(--c-fpi)}
.pg-index .hl-mf i,.pg-index i.hl-mf{background:var(--c-mf)}
.pg-index .hl-ins i{background:var(--c-ins)}
.pg-index .hl-retail i{background:var(--c-ret)}
.pg-index .hl-others i{background:var(--c-oth);box-shadow:inset 0 0 0 1px var(--line-strong)}
.pg-index .b-plot{position:relative;border-radius:4px;background:linear-gradient(var(--line-2) 1px,transparent 1px) 0 0 / 100% 25%,var(--surface)}  /* the grid shows only where the bands have not drawn yet */
.pg-index .b-svg{display:block;width:100%;height:clamp(220px,44svh,420px);overflow:visible;touch-action:pan-y;cursor:ew-resize;border-radius:4px}
.pg-index .b-svg:focus-visible{outline:2px solid var(--link);outline-offset:6px}
.pg-index .b-base{fill:var(--surface)}  /* under the drawn bands, so a band that steps back pales instead of showing the grid */
.pg-index .hb{stroke:var(--bg-2);stroke-width:1;stroke-linejoin:round;vector-effect:non-scaling-stroke;transition:opacity .55s var(--ease-out)}
.pg-index .hb-promoters{fill:var(--c-pro)}
.pg-index .hb-fpi{fill:var(--c-fpi)}
.pg-index .hb-mf{fill:var(--c-mf)}
.pg-index .hb-ins{fill:var(--c-ins)}
.pg-index .hb-retail{fill:var(--c-ret)}
.pg-index .hb-others{fill:var(--c-oth)}
.pg-index .b-cur{stroke:var(--surface);stroke-width:2;vector-effect:non-scaling-stroke}
.pg-index .b-axis{display:flex;justify-content:space-between;margin-top:12px;font:500 .75rem/1 var(--mono);color:var(--muted)}
/* focus: one band at a time, the rest step back */
.pg-index .b-fig[data-focus] .hb{opacity:.55}
.pg-index .b-fig[data-focus="fpi"] .hb-fpi,.pg-index .b-fig[data-focus="mf"] .hb-mf{opacity:1}
.pg-index .b-fig[data-focus] .b-legend li{opacity:.45}
.pg-index .b-fig[data-focus="fpi"] .b-legend li[data-k="fpi"],.pg-index .b-fig[data-focus="mf"] .b-legend li[data-k="mf"]{opacity:1}
.pg-index .b-fig[data-focus="mf"] .b-co-fpi{opacity:.5}
/* call-outs: markers on the first and last quarter, and the pill */
.pg-index .b-co{position:absolute;inset:0;margin:0;pointer-events:none;transition:opacity .5s var(--ease-out)}
.pg-index .b-mk{position:absolute;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;border:2.5px solid var(--surface);box-shadow:0 1px 4px rgba(8,26,51,.3);transition:transform .6s var(--ease-out),opacity .4s var(--ease-out)}
.pg-index .b-mk-fpi{background:var(--c-fpi)}
.pg-index .b-mk-mf{background:var(--c-mf)}
.pg-index .b-mk+.b-mk{transition-delay:.12s}
.pg-index .b-pw{position:absolute;transform:translateY(-50%)}
.pg-index .b-pw-l{left:20px}
.pg-index .b-pw-r{right:20px}
.pg-index .b-pill{display:flex;align-items:center;gap:8px;padding:8px 14px 8px 12px;border-radius:999px;background:var(--surface);border:1px solid var(--line-2);box-shadow:var(--sh-card);font-size:.875rem;white-space:nowrap;color:var(--ink-2);transition:transform .7s var(--ease-out) .1s,opacity .5s var(--ease-out) .1s}
.pg-index .b-pill b{font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums}
.js:not(.rm) .pg-index .b-co:not(.on) .b-mk{opacity:0;transform:scale(.4)}
.js:not(.rm) .pg-index .b-co:not(.on) .b-pill{opacity:0;transform:translateY(10px)}

/* ---------- C. 15 markets, one format: the globe turns west, one company per market, as filed there ----------
   Without JS or under .rm: the globe, the legend, then all six cards in a grid. Pinned: the globe beside one card
   at a time (the scene's step), the legend under both. */
.pg-index .c-scene::before{display:none}
.pg-index .c-band{display:flex;flex-direction:column;align-items:center;width:100%;overflow:visible}
.pg-index .c-h{text-align:center;padding:0 var(--gut)}
.pg-index .c-stage{display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:"globe" "leg" "side";width:100%;margin-top:clamp(4px,1.5vh,20px)}
.pg-index .c-globe{grid-area:globe;position:relative;min-width:0;isolation:isolate}
.pg-index .c-globe::before{content:"";position:absolute;left:50%;top:50%;z-index:-1;width:min(64svh,620px,92vw);aspect-ratio:1;border-radius:50%;transform:translate(-50%,-50%);background:radial-gradient(closest-side,rgba(10,100,220,.34),rgba(10,100,220,.12) 62%,transparent);pointer-events:none}
.pg-index .c-cv{height:min(56svh,580px)}
.pg-index .c-leg{grid-area:leg;min-width:0}
.pg-index .c-leg .globe-legend{margin-top:clamp(4px,1vh,12px);gap:10px 30px;font-size:.9375rem}
.pg-index .c-leg .globe-legend .k{font-size:.75rem}
.pg-index .c-leg .globe-legend .sw{align-self:flex-start;margin-top:.45em;margin-top:calc((1lh - 10px) / 2)}
.pg-index .c-leg .sw-built{background:#FFFFFF}
/* the legend keeps pace with the turn: a row dims only while its markets are still ahead */
.js:not(.rm) .pg-index .c-leg li[data-at]{transition:opacity .5s var(--ease-out)}
.js:not(.rm) .pg-index .c-leg li[data-at]:not(.on){opacity:.4}

/* the cards: light paper, one market's filing each, in one shape */
.pg-index .w-side{grid-area:side;position:relative;z-index:1;min-width:0;margin-top:clamp(40px,7vh,72px)}  /* above the globe's glow */
.pg-index .w-deck{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;list-style:none}
.pg-index .w-card{display:flex;flex-direction:column;min-width:0;padding:20px 22px 8px;border-radius:var(--r-lg);background:var(--paper);color:var(--paper-ink);border:1px solid var(--paper-line);box-shadow:var(--sh-card)}
.pg-index .w-k{padding-bottom:10px;border-bottom:1px solid var(--paper-line);font:500 .6875rem/1.3 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--paper-muted)}
.pg-index .w-n{margin:16px 0 4px;font:400 1.625rem/1.12 var(--serif);letter-spacing:-.015em;color:var(--paper-ink);text-wrap:balance}
.pg-index .w-b{font-size:.8125rem;line-height:1.4;color:var(--paper-muted)}
.pg-index .w-rows{margin-top:14px;list-style:none}
.pg-index .w-rows li+li{border-top:1px dashed var(--paper-line)}
.pg-index .w-r{position:relative;isolation:isolate;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:baseline;gap:4px 18px;margin:0 -10px;padding:11px 10px 12px;border-radius:10px;color:inherit;text-decoration:none}
.pg-index .w-r::before{content:"";position:absolute;inset:2px 0;z-index:-1;border-radius:inherit;background:var(--paper-hl);opacity:0;transition:opacity .2s var(--ease-std)}
.pg-index .w-r:focus-visible{outline:2px solid var(--paper-link);outline-offset:-2px}
.pg-index .w-h{min-width:0;font:400 1.0625rem/1.28 var(--serif);color:var(--paper-ink);text-wrap:pretty}
.pg-index .w-p{font:500 1.0625rem/1.28 var(--mono);font-variant-numeric:tabular-nums;color:var(--paper-ink);text-align:right;white-space:nowrap}
.pg-index .w-d{grid-column:1 / -1;display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 7px;font:400 .75rem/1.35 var(--mono);color:var(--paper-muted)}
.pg-index .w-f{font:italic 400 .875rem/1.3 var(--serif)}
.pg-index .w-f::after{content:"·";margin-left:7px;font-style:normal}
.pg-index .w-x{margin-left:-2px;color:var(--paper-link)}
@media (hover:hover){
  .pg-index .w-r:hover::before{opacity:.8}
  .pg-index .w-r:hover time{color:var(--paper-link)}
}
.pg-index .w-rail{display:none}

/* pinned: the globe beside the card on wide screens, above it on narrow ones; one card at a time, the rail fills
   with the scroll, and each change is a crossfade with a short rise (down again when scrolling back) */
.js:not(.rm) .pg-index .c-scene{--step-h:62vh}
@supports (height:100svh){.js:not(.rm) .pg-index .c-scene{--step-h:62svh}}
.js:not(.rm) .pg-index .c-stage{grid-template-areas:"globe" "side" "leg"}
.js:not(.rm) .pg-index .w-side{width:100%;max-width:440px;margin:6px auto 0}
.js:not(.rm) .pg-index .w-rail{display:flex;gap:6px;margin:0 0 16px}
.pg-index .w-rail i{position:relative;width:26px;height:3px;border-radius:3px;background:rgba(169,187,214,.22);overflow:hidden}
.pg-index .w-rail i::after{content:"";position:absolute;inset:0;border-radius:inherit;background:var(--azure);transform:scaleX(0);transform-origin:0 50%}
.pg-index .w-rail i.on::after{transform:scaleX(1)}
.pg-index .w-rail i.now::after{transform:scaleX(var(--sp,0))}
.js:not(.rm) .pg-index .w-deck{grid-template-columns:minmax(0,1fr);grid-template-areas:"c";gap:0}
.js:not(.rm) .pg-index .w-card{grid-area:c;align-self:start;opacity:0;transform:translateY(14px);pointer-events:none;transition:opacity .2s var(--ease-std),transform .3s var(--ease-std)}
.js:not(.rm) .pg-index .w-card.on:not(.now){transform:translateY(-10px)}
.js:not(.rm) .pg-index .w-card.now{opacity:1;transform:none;pointer-events:auto;transition:opacity .38s var(--ease-out) .06s,transform .44s var(--ease-out)}
/* a keyboard focus inside another card shows that card instead */
.js:not(.rm) .pg-index .w-deck:focus-within .w-card.now:not(:focus-within){opacity:0}
.js:not(.rm) .pg-index .w-card:focus-within{opacity:1;transform:none;pointer-events:auto}
@media (min-width:961px){
  .js:not(.rm) .pg-index .c-stage{grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);grid-template-areas:"globe side" "leg leg";column-gap:clamp(24px,3vw,48px);align-items:center}
  .js:not(.rm) .pg-index .c-cv{height:min(60svh,580px)}
  .js:not(.rm) .pg-index .w-side{margin:0;justify-self:start}
}

/* ---------- D. use it anywhere: four tiles, each a small loop of the product in use ---------- */
.pg-index .d-ways .way{padding:14px 14px 30px}
.pg-index .d-ways .way .dm{height:236px;margin-bottom:26px}
.pg-index .d-ways .way h3{margin:0 12px 12px;font-size:clamp(1.375rem,1.1rem + .8vw,1.75rem);letter-spacing:-.03em;line-height:1.15}
.pg-index .d-ways .way .go{margin-left:12px}
.pg-index .dm-xl{display:flex;flex-direction:column;justify-content:center}
.pg-index .dm-term{display:flex;flex-direction:column;justify-content:center;background:var(--surface);font:400 .8125rem/1.8 var(--mono);color:var(--ink)}
/* typing, transform-only: a cover the colour of the field slides off the text, its left edge the caret */
.pg-index .tm-l1,.pg-index .fd-type{position:relative;overflow:hidden}
.pg-index .tm-l1::after,.pg-index .fd-type::after{content:"";position:absolute;top:0;bottom:0;left:0;width:100%;background:var(--surface);border-left:1.5px solid var(--blue);transform:translateX(100%);pointer-events:none}
.pg-index .play .tm-l1::after{animation:typeCover 1.4s steps(44,end) .2s both}
.pg-index .play .fd-type::after{animation:typeWord .9s steps(8,end) .2s both,fadeOut .3s 1.8s both}
@keyframes typeCover{from{transform:translateX(0)}to{transform:translateX(100%)}}
@keyframes typeWord{from{transform:translateX(0)}to{transform:translateX(calc(100% - 6px))}}
@keyframes fadeOut{to{opacity:0}}
.pg-index .tm-l1{display:block;white-space:nowrap;text-overflow:ellipsis;margin-bottom:8px;color:var(--ink-2)}
.pg-index .tm-o{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-left:2ch}
.pg-index .play .xl-grid span{animation-name:inUp}
.pg-index .play .tm-o{animation:inUp .4s var(--ease-out) both;animation-delay:calc(1.8s + var(--d) * .2s)}
.pg-index .dm-find{display:flex;flex-direction:column;justify-content:center;gap:12px}
.pg-index .fd-box{display:flex;align-items:center;gap:8px;height:44px;padding:0 14px;border-radius:12px;border:1px solid var(--line-strong);background:var(--surface);font-size:.9375rem;color:var(--ink)}
.pg-index .fd-box svg{color:var(--muted);flex:none}
.pg-index .fd-type{display:inline-block;padding-right:6px;line-height:1.4}
.pg-index .fd-res{list-style:none;border:1px solid var(--line-2);border-radius:12px;background:var(--surface);box-shadow:var(--sh-card)}
.pg-index .fd-res li{display:flex;justify-content:space-between;align-items:baseline;gap:10px;padding:12px 14px;font-size:.9375rem}
.pg-index .fd-res span{font:500 .6875rem/1.5 var(--mono);color:var(--muted)}
.pg-index .play .fd-res{animation:inUp .4s var(--ease-out) 1.2s both}
.pg-index .fd-bar{display:flex;gap:2px;height:12px;border-radius:6px;overflow:hidden;background:var(--c-oth)}
.pg-index .fd-bar i{display:block;flex:none;transform-origin:left center}
.pg-index .play .fd-bar i{animation:growX .7s var(--ease-out) both;animation-delay:calc(1.6s + var(--k) * 70ms)}
.pg-index .dm-news{display:flex;flex-direction:column;justify-content:center;gap:9px}
.pg-index .dm-news>i{display:block;height:8px;border-radius:4px;background:var(--line-2)}
.pg-index .dm-news .nw-h{height:12px;width:68%;background:var(--line-strong)}
.pg-index .dm-news .nw-l.s{width:84%}
.pg-index .nw-card{padding:11px 14px;border-radius:12px;border:1px solid var(--paper-line);background:var(--paper);box-shadow:var(--sh-card)}
.pg-index .nw-t{margin-bottom:6px;font:400 .9375rem/1.3 var(--serif);color:var(--paper-ink)}
.pg-index .nw-r{display:flex;justify-content:space-between;padding:4px 0;border-top:1px dashed var(--paper-line);font-size:.8125rem;color:var(--paper-muted)}
.pg-index .nw-r b{font:500 .8125rem/1.3 var(--mono);color:var(--paper-ink)}
.pg-index .nw-src{margin-top:7px;font:500 .6875rem/1.3 var(--mono);color:var(--paper-link)}
.pg-index .play .nw-card{animation:inUp .6s var(--ease-out) .4s both}
.pg-index .play .nw-r{animation:fadeIn .4s var(--ease-out) both}
.pg-index .play .nw-r:nth-of-type(2){animation-delay:.8s}
.pg-index .play .nw-r:nth-of-type(3){animation-delay:.95s}
.pg-index .play .nw-r:nth-of-type(4){animation-delay:1.1s}
.pg-index .play .nw-src{animation:fadeIn .4s 1.4s both}

/* ---------- E. checked, then checked again: three counters, each with a check that draws ---------- */
.pg-index .e-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;list-style:none;margin-top:clamp(48px,8vh,80px)}
.pg-index .e-list li{display:flex;flex-direction:column;gap:18px;padding-top:28px;border-top:1px solid var(--line-2)}
.pg-index .e-n{font-size:clamp(2.5rem,1rem + 3.9vw,4.5rem);line-height:.95;letter-spacing:-.05em;font-weight:600;font-variant-numeric:tabular-nums;color:var(--ink)}
.pg-index .e-l{display:flex;align-items:flex-start;gap:10px;font-size:1.0625rem;line-height:1.45;color:var(--ink-2);text-wrap:pretty}
.pg-index .e-ok{flex:none;width:20px;height:20px;margin-top:.1em}
.pg-index .e-ok path{fill:none;stroke:var(--ok);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;transition:stroke-dashoffset .6s var(--ease-out) calc(1.5s + var(--i,0) * 70ms)}
.js:not(.rm) .pg-index .e-list li:not(.on) .e-ok path{stroke-dashoffset:1}
.pg-index .e-go{margin-top:clamp(40px,6vh,64px);text-align:center}

/* ---------- F. the close ---------- */
.pg-index .f-end .end-fn a{white-space:nowrap}

/* ---------- phones and tablets: one column; the first scene keeps only the traced row ---------- */
@media (max-width:960px){
  .pg-index .a-tr{grid-template-columns:minmax(0,1fr);max-width:560px;margin:0 auto}
  .pg-index .a-co,.pg-index .a-fl{grid-column:1}
  .pg-index .a-fl{grid-row:2;margin-top:20px}
  .pg-index .a-sum{grid-row:3}
  .pg-index .a-link{display:none}
  .js:not(.rm) .pg-index .a-co{transform:none}
  .js:not(.rm) .pg-index .a-co.up .a-mf{transform:none}
  .js:not(.rm) .pg-index .a-fl{position:absolute;left:0;right:28px;top:0;margin:0}
  .js:not(.rm) .pg-index .a-link{display:block}
  .js:not(.rm) .pg-index .a-co-h,.js:not(.rm) .pg-index .a-co-n,.js:not(.rm) .pg-index .a-bar,.js:not(.rm) .pg-index .a-surf{will-change:opacity}
  .pg-index .e-list{grid-template-columns:minmax(0,1fr);gap:0;max-width:560px;margin-left:auto;margin-right:auto}
  .pg-index .e-list li{padding:24px 0 28px}
  .pg-index .w-deck{grid-template-columns:repeat(2,minmax(0,1fr))}
  .js:not(.rm) .pg-index .c-cv{height:clamp(170px,32svh,360px)}
}
@media (max-width:640px){
  .pg-index .a-hero .h3ro-cta{gap:10px;width:100%}
  .pg-index .a-hero .btn{padding:0 16px;font-size:.9375rem}
  .pg-index .a-stage{margin-top:44px}
  .pg-index .a-h{margin-bottom:24px}
  .js:not(.rm) .pg-index .a-h{bottom:calc(100% + 24px)}
  .pg-index .a-co{padding:18px 14px 12px}
  .pg-index .a-rows li{padding:8px 10px}
  .pg-index .a-fl{padding:18px 16px 16px}
  .pg-index .a-dl div{gap:10px;padding:6px 4px;font-size:.875rem}
  .pg-index .a-dl dd{font-size:.75rem}
  .pg-index .a-sum{margin-top:28px}
  .js:not(.rm) .pg-index .a-sum{top:calc(100% + 28px)}
  .pg-index .b-legend{gap:4px 14px;font-size:.75rem}
  .pg-index .b-pill{flex-wrap:wrap;gap:2px 8px;max-width:150px;padding:7px 12px 8px;border-radius:14px;white-space:normal;font-size:.75rem;line-height:1.3}
  .pg-index .b-pill b{flex-basis:100%}
  .pg-index .b-pw-l{left:12px}
  .pg-index .b-pw-r{right:12px}
  .pg-index .c-cv{height:min(46svh,400px)}
  .pg-index .c-leg .globe-legend{gap:8px 20px;font-size:.8125rem}
  .pg-index .w-deck{grid-template-columns:minmax(0,1fr);gap:16px}
  .pg-index .w-card{padding:16px 16px 4px}
  .pg-index .w-n{margin-top:12px;font-size:1.375rem}
  .pg-index .w-rows{margin-top:10px}
  .pg-index .w-r{gap:3px 14px;margin:0 -8px;padding:9px 8px 10px}
  .pg-index .w-h,.pg-index .w-p{font-size:.9375rem}
  .js:not(.rm) .pg-index .c-cv{height:clamp(150px,27svh,260px)}
  .js:not(.rm) .pg-index .w-side{margin-top:-6px}
  .js:not(.rm) .pg-index .w-rail{margin-bottom:12px}
  .js:not(.rm) .pg-index .w-card{padding-top:14px}
  .js:not(.rm) .pg-index .w-n{margin-top:10px;font-size:1.3125rem}
  .js:not(.rm) .pg-index .w-rows{margin-top:6px}
  .js:not(.rm) .pg-index .w-r{padding-top:8px;padding-bottom:9px}
  .js:not(.rm) .pg-index .c-leg .globe-legend{gap:2px 14px;margin-top:14px;font-size:.75rem;line-height:1.45}
  .js:not(.rm) .pg-index .c-leg .globe-legend .k{font-size:.6875rem}
  .pg-index .d-ways .way .dm{height:212px}
  .pg-index .dm-xl .xl-grid{grid-template-columns:minmax(0,1.25fr) minmax(0,1.4fr) minmax(0,.6fr)}
  .pg-index .dm-xl .xl-grid>:nth-child(4n+3){display:none}
}
/* short screens: the pinned frames shrink to fit under the nav; if one still overflows it keeps its top */
.js:not(.rm) .pg-index .scene-pin{justify-content:safe center}
@media (max-height:820px) and (min-width:961px){
  .pg-index .a-hero h1{font-size:clamp(3rem,min(8vw,12vh),6.5rem)}
  .pg-index .a-hero .lede{margin-top:18px}
  .pg-index .a-hero .h3ro-cta{margin-top:26px}
  .pg-index .a-stage{margin-top:40px}
  .pg-index .a-h{margin-bottom:32px}
  .js:not(.rm) .pg-index .a-h{bottom:calc(100% + 32px)}
  .pg-index .a-rows li{padding-top:7px;padding-bottom:7px}
  .pg-index .a-dl div{padding-top:6px;padding-bottom:6px}
  .pg-index .a-sum{margin-top:28px}
  .js:not(.rm) .pg-index .a-sum{top:calc(100% + 28px)}
  .pg-index .c-cv{height:min(52svh,580px)}
  .js:not(.rm) .pg-index .c-cv{height:min(58svh,580px)}
}
@media (max-width:640px) and (max-height:740px){
  .pg-index .a-hero h1{font-size:2.5rem}
  .pg-index .a-hero .lede{margin-top:14px;font-size:1rem}
  .pg-index .a-hero .h3ro-cta{margin-top:20px}
  .pg-index .a-stage{margin-top:28px}
  .pg-index .a-co{padding-top:14px}
  .pg-index .a-co-n{margin:8px 6px 10px}
  .pg-index .a-rows li{padding-top:6px;padding-bottom:6px}
  .pg-index .a-fl{padding-top:14px;padding-bottom:12px}
  .pg-index .a-dl div{padding-top:4px;padding-bottom:4px}
  .pg-index .a-file{margin-top:8px}
  .pg-index .a-h{font-size:2rem}
  .pg-index .a-fl-n{margin:8px 0 4px}
  .pg-index .a-dl div{padding-top:3px;padding-bottom:3px;font-size:.8125rem;line-height:1.3}
  .pg-index .a-open{margin-top:4px}
  .js:not(.rm) .pg-index .c-h{font-size:1.875rem}
  .js:not(.rm) .pg-index .c-cv{height:clamp(120px,21svh,200px)}
  .js:not(.rm) .pg-index .w-rail{margin-bottom:8px}
  .js:not(.rm) .pg-index .w-k{padding-bottom:8px}
  .js:not(.rm) .pg-index .w-n{margin-top:8px;font-size:1.1875rem}
  .js:not(.rm) .pg-index .w-r{padding-top:6px;padding-bottom:7px}
  .js:not(.rm) .pg-index .c-leg .globe-legend{margin-top:10px;font-size:.6875rem;line-height:1.4}
}

/* ---------- the film's trace (film.html renders <div class="trace lit" data-trace data-demo role="group" aria-label="One figure traced to its filing: Reliance Industries Limited"><div class="tr-co"><p class="tr-h"><span class="tr-sym">RELIANCE</span><span class="tr-q">Quarter ended 30 Jun 2026</span></p><p class="tr-name">Reliance Industries Limited</p><p class="tr-bar" aria-hidden="true"><i style="width:50.48%"></i><i style="width:17.06%"></i><i class=on style="width:10.11%"></i><i style="width:9.2%"></i><i style="width:7.16%"></i></p><ul class="tr-rows"><li><span>Promoters</span><b>50.48%</b></li><li><span>Foreign investors</span><b>17.06%</b></li><li class=on><span>Mutual funds</span><b>10.11%</b></li><li><span>Insurers</span><b>9.20%</b></li><li><span>Retail investors</span><b>7.16%</b></li></ul></div><svg class="tr-link" aria-hidden="true"><path pathLength="1"/><circle r="4"/></svg><p class="tr-down" aria-hidden="true">as filed</p><div class="tr-fl"><p class="tr-fk"><span>NSE · Shareholding pattern</span><span class="tr-filed">Filed 16 Jul 2026</span></p><p class="tr-fname">Reliance Industries Limited</p><dl class="tr-dl"><div><dt>Promoter and promoter group</dt><dd>6,71,54,96,096</dd></div><div><dt>Foreign portfolio investors (I + II)</dt><dd>2,27,01,49,185</dd></div><div class=on><dt>Mutual funds</dt><dd>1,34,44,30,220</dd></div><div><dt>Insurance companies</dt><dd>1,22,42,69,421</dd></div><div><dt>Resident individuals up to Rs. 2 lakh</dt><dd>95,29,58,091</dd></div></dl><p class="tr-file">SHP_1694620_16072026072434_WEB.xml</p><a class="tr-open" href="https://nsearchives.nseindia.com/corporate/xbrl/SHP_1694620_16072026072434_WEB.xml" rel="noopener">Open the filing <span aria-hidden="true">↗</span></a></div></div><script type="application/json" id="trace-data">[{"sym": "RELIANCE", "name": "Reliance Industries Limited", "q": "30 Jun 2026", "filed": "16 Jul 2026", "file": "SHP_1694620_16072026072434_WEB.xml", "url": "https://nsearchives.nseindia.com/corporate/xbrl/SHP_1694620_16072026072434_WEB.xml", "t": 2, "rows": [{"l": "Promoters", "lf": "Promoter and promoter group", "lfd": "Promoter and promoter group", "pct": 50.48, "sh": "6,71,54,96,096"}, {"l": "Foreign investors", "lf": "Foreign portfolio investors", "lfd": "Foreign portfolio investors (I + II)", "pct": 17.06, "sh": "2,27,01,49,185"}, {"l": "Mutual funds", "lf": "Mutual funds", "lfd": "Mutual funds", "pct": 10.11, "sh": "1,34,44,30,220"}, {"l": "Insurers", "lf": "Insurance companies", "lfd": "Insurance companies", "pct": 9.2, "sh": "1,22,42,69,421"}, {"l": "Retail investors", "lf": "Resident individuals up to Rs. 2 lakh", "lfd": "Resident individuals up to Rs. 2 lakh", "pct": 7.16, "sh": "95,29,58,091"}]}, {"sym": "TCS", "name": "Tata Consultancy Services Limited", "q": "30 Jun 2026", "filed": "21 Jul 2026", "file": "SHP_1698205_21072026034350_WEB.xml", "url": "https://nsearchives.nseindia.com/corporate/xbrl/SHP_1698205_21072026034350_WEB.xml", "t": 1, "rows": [{"l": "Promoters", "lf": "Promoter and promoter group", "lfd": "Promoter and promoter group", "pct": 71.77, "sh": "2,59,65,58,628"}, {"l": "Foreign investors", "lf": "Foreign portfolio investors", "lfd": "Foreign portfolio investors (I + II)", "pct": 9.06, "sh": "32,78,90,679"}, {"l": "Mutual funds", "lf": "Mutual funds", "lfd": "Mutual funds", "pct": 5.68, "sh": "20,54,54,535"}, {"l": "Insurers", "lf": "Insurance companies", "lfd": "Insurance companies", "pct": 6.71, "sh": "24,29,16,344"}, {"l": "Retail investors", "lf": "Resident individuals up to Rs. 2 lakh", "lfd": "Resident individuals up to Rs. 2 lakh", "pct": 4.7, "sh": "17,01,18,405"}]}, {"sym": "SBIN", "name": "State Bank of India", "q": "30 Jun 2026", "filed": "15 Jul 2026", "file": "SHP_1693592_15072026065623_WEB.xml", "url": "https://nsearchives.nseindia.com/corporate/xbrl/SHP_1693592_15072026065623_WEB.xml", "t": 3, "rows": [{"l": "Promoters", "lf": "Promoter and promoter group", "lfd": "Promoter and promoter group", "pct": 55.47, "sh": "5,07,97,75,288"}, {"l": "Foreign investors", "lf": "Foreign portfolio investors", "lfd": "Foreign portfolio investors (I + II)", "pct": 10.81, "sh": "98,99,96,652"}, {"l": "Mutual funds", "lf": "Mutual funds", "lfd": "Mutual funds", "pct": 13.61, "sh": "1,24,68,00,364"}, {"l": "Insurers", "lf": "Insurance companies", "lfd": "Insurance companies", "pct": 10.25, "sh": "93,84,23,337"}, {"l": "Retail investors", "lf": "Resident individuals up to Rs. 2 lakh", "lfd": "Resident individuals up to Rs. 2 lakh", "pct": 5.6, "sh": "51,29,13,153"}]}, {"sym": "HINDUNILVR", "name": "Hindustan Unilever Limited", "q": "30 Jun 2026", "filed": "21 Jul 2026", "file": "SHP_1697830_21072026121013_WEB.xml", "url": "https://nsearchives.nseindia.com/corporate/xbrl/SHP_1697830_21072026121013_WEB.xml", "t": 4, "rows": [{"l": "Promoters", "lf": "Promoter and promoter group", "lfd": "Promoter and promoter group", "pct": 61.9, "sh": "1,45,44,12,858"}, {"l": "Foreign investors", "lf": "Foreign portfolio investors", "lfd": "Foreign portfolio investors (I + II)", "pct": 9.5, "sh": "22,32,37,247"}, {"l": "Mutual funds", "lf": "Mutual funds", "lfd": "Mutual funds", "pct": 7.15, "sh": "16,80,32,815"}, {"l": "Insurers", "lf": "Insurance companies", "lfd": "Insurance companies", "pct": 8.7, "sh": "20,43,47,232"}, {"l": "Retail investors", "lf": "Resident individuals up to Rs. 2 lakh", "lfd": "Resident individuals up to Rs. 2 lakh", "pct": 9.71, "sh": "22,82,15,637"}]}, {"sym": "KOTAKBANK", "name": "Kotak Mahindra Bank Limited", "q": "30 Jun 2026", "filed": "14 Jul 2026", "file": "SHP_1692686_14072026081830_WEB.xml", "url": "https://nsearchives.nseindia.com/corporate/xbrl/SHP_1692686_14072026081830_WEB.xml", "t": 0, "rows": [{"l": "Promoters", "lf": "Promoter and promoter group", "lfd": "Promoter and promoter group", "pct": 25.87, "sh": "2,57,32,01,985"}, {"l": "Foreign investors", "lf": "Foreign portfolio investors", "lfd": "Foreign portfolio investors (I + II)", "pct": 25.2, "sh": "2,50,67,62,296"}, {"l": "Mutual funds", "lf": "Mutual funds", "lfd": "Mutual funds", "pct": 24.5, "sh": "2,43,64,81,373"}, {"l": "Insurers", "lf": "Insurance companies", "lfd": "Insurance companies", "pct": 10.01, "sh": "99,56,85,943"}, {"l": "Retail investors", "lf": "Resident individuals up to Rs. 2 lakh", "lfd": "Resident individuals up to Rs. 2 lakh", "pct": 4.36, "sh": "43,41,37,076"}]}]</script> with these unprefixed rules) ---------- */
.trace{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 112px minmax(0,1fr);align-items:center;max-width:1060px;margin:0 auto;padding:36px 32px}
.trace::before{content:"";position:absolute;inset:0;z-index:0;border-radius:28px;background-image:radial-gradient(rgba(14,26,46,.13) 1px,transparent 1.4px);background-size:14px 14px;-webkit-mask-image:radial-gradient(ellipse at center,#000 30%,transparent 75%);mask-image:radial-gradient(ellipse at center,#000 30%,transparent 75%)}
.tr-co,.tr-fl{position:relative;z-index:1;padding:22px 24px;border-radius:18px;border:1px solid var(--line-2);box-shadow:var(--sh-card);transition:opacity .45s var(--ease-out),transform .45s var(--ease-out)}
.tr-co{grid-column:1;background:var(--surface)}
.tr-fl{grid-column:3;background:var(--paper);color:var(--paper-ink)}
.trace.swap .tr-co{opacity:0;transform:translateY(10px)}
.trace.swap .tr-fl{opacity:0;transform:translateX(14px)}
.tr-h{display:flex;justify-content:space-between;gap:10px;font:500 .75rem/1 var(--mono);color:var(--muted)}
.tr-sym{color:var(--ink);letter-spacing:.04em}
.tr-name{margin:10px 0 14px;font-weight:600;font-size:1.0625rem;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tr-bar{display:flex;gap:2px;height:10px;border-radius:5px;overflow:hidden;background:var(--surface-2);margin-bottom:12px}
.tr-bar i{display:block;height:100%;background:var(--ink);transition:width .8s var(--ease-out),background-color .3s}
.tr-bar i:nth-child(1){opacity:.82}
.tr-bar i:nth-child(2){opacity:.5}
.tr-bar i:nth-child(3){opacity:.36}
.tr-bar i:nth-child(4){opacity:.24}
.tr-bar i:nth-child(5){opacity:.14}
.lit .tr-bar i.on{background:var(--blue);opacity:1}
.tr-rows{list-style:none;display:grid;gap:2px}
.tr-rows li{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:7px 10px;border-radius:8px;font-size:.9375rem;color:var(--ink-2);transition:background-color .3s,color .3s}
.tr-rows b{font:500 .9375rem/1 var(--mono);color:var(--ink);font-variant-numeric:tabular-nums}
.lit .tr-rows li.on{background:var(--blue-soft);color:var(--ink)}
.lit .tr-rows li.on b{color:var(--link)}
.tr-link{position:absolute;left:0;top:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:2}
.tr-link path{fill:none;stroke:var(--blue);stroke-width:1.5;stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset .6s var(--ease-out)}
.tr-link circle{fill:var(--blue);opacity:0;transition:opacity .2s}
.lit .tr-link path{stroke-dashoffset:0}
.lit .tr-link circle{opacity:1;transition-delay:.5s}
.tr-fk{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;font:500 .6875rem/1.3 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--paper-muted);padding-bottom:10px;border-bottom:1px solid var(--paper-line)}
.tr-fname{margin:12px 0 8px;font:400 1.15rem/1.3 var(--serif);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tr-dl div{display:flex;justify-content:space-between;align-items:baseline;gap:14px;padding:6px 8px;border-bottom:1px dashed var(--paper-line);font:400 .9375rem/1.35 var(--serif);border-radius:4px;transition:background-color .3s,box-shadow .3s}
.tr-dl dt{color:var(--paper-muted);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tr-dl dd{font:500 .8125rem/1.4 var(--mono);font-variant-numeric:tabular-nums;white-space:nowrap}
.lit .tr-dl div.on{background:var(--paper-hl);box-shadow:inset 0 -2px 0 var(--paper-link)}
.lit .tr-dl div.on dt{color:var(--paper-ink)}
.tr-file{margin-top:12px;font:400 .6875rem/1.4 var(--mono);color:var(--paper-muted);overflow-wrap:anywhere}
.tr-open{display:inline-flex;gap:4px;margin-top:6px;font-weight:600;font-size:.9375rem;color:var(--paper-link);text-underline-offset:3px}
.tr-down{display:none}

/* ---------- the terminal: a pinned scene over the real desk. Step 0 rings the command line, step 1 rings a figure and
   draws the thread to its Source panel (the one authored moment), step 2 crossfades to Taiwan, step 3 sweeps the night
   theme over the day one. Without JS or under reduced motion it is a plain chapter with the first screen. ---------- */
.pg-index .t-scene::before{background:radial-gradient(60% 40% at 50% 100%,rgba(10,100,220,.28),transparent 72%)}
.pg-index .t-stage{display:flex;flex-direction:column;align-items:center;text-align:center}
.pg-index .t-h{text-wrap:balance}
.pg-index .t-cap{margin:clamp(14px,2.2vh,24px) 0 clamp(20px,3.4vh,40px);font-size:clamp(1.0625rem,.95rem + .45vw,1.3125rem);line-height:1.4;color:var(--navy-ink)}
.pg-index .t-frame{position:relative;margin:0;width:min(100%,1120px,calc((100svh - 350px) * 1.64));border-radius:12px;overflow:hidden;
  background:#FAF8F3;box-shadow:0 0 0 1px rgba(255,255,255,.35),0 40px 90px -40px rgba(0,0,0,.85),0 18px 40px -24px rgba(10,100,220,.45)}
.pg-index .t-zoom{position:relative;transform-origin:0 0}
.pg-index .t-img{display:block}
.pg-index .t-img img{display:block;width:100%;height:auto}
.pg-index .t-s,.pg-index .t-b,.pg-index .t-c{position:absolute;inset:0;opacity:0}
.pg-index .t-s img,.pg-index .t-b img,.pg-index .t-c img{height:100%;object-fit:cover;object-position:top}
.pg-index .t-ov{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
.pg-index .t-ring{fill:rgba(10,100,220,.08);stroke:var(--blue);stroke-width:2.5;opacity:0;transform-box:fill-box;transform-origin:center;transform:scale(1.25)}
.pg-index .t-dock{fill:rgba(10,100,220,.06);stroke:var(--blue);stroke-width:2;opacity:0}
.pg-index .t-thread{fill:none;stroke:var(--blue);stroke-width:2.5;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1}
.pg-index .t-knot{fill:var(--blue);opacity:0}
.pg-index .t-go{display:flex;align-items:center;gap:16px;margin-top:clamp(18px,3vh,32px)}
.pg-index .t-beta{font:500 .8125rem/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--navy-ink)}
.js:not(.rm) .pg-index .t-scene{--step-h:70vh}
@supports (height:100svh){.js:not(.rm) .pg-index .t-scene{--step-h:70svh}}
.js:not(.rm) .pg-index .t-img{transition:opacity .7s var(--ease-std)}
/* the camera: close on the command line, then on the figure and its source, then the whole desk */
.js:not(.rm) .pg-index .t-zoom{transition:transform 1.1s var(--ease-io);will-change:transform}
.js:not(.rm) .pg-index .t-scene:not([data-step]) .t-zoom,.js:not(.rm) .pg-index .t-scene[data-step="0"] .t-zoom{transform:scale(1.7)}
.js:not(.rm) .pg-index .t-scene[data-step="1"] .t-zoom{transform:translate(-22%,-6%) scale(1.22)}
.js:not(.rm) .pg-index .t-ring{transition:opacity .35s var(--ease-std),transform .6s var(--ease-out)}
.js:not(.rm) .pg-index .t-dock{transition:opacity .45s var(--ease-std) .35s}
.js:not(.rm) .pg-index .t-thread{transition:stroke-dashoffset .8s var(--ease-out) .15s}
.js:not(.rm) .pg-index .t-knot{transition:opacity .2s var(--ease-std) .8s}
.js:not(.rm) .pg-index .t-scene[data-step="0"] .t-r0,
.js:not(.rm) .pg-index .t-scene[data-step="1"] .t-r1{opacity:1;transform:none}
.js:not(.rm) .pg-index .t-scene[data-step="1"] .t-dock,
.js:not(.rm) .pg-index .t-scene[data-step="1"] .t-knot{opacity:1}
.js:not(.rm) .pg-index .t-scene[data-step="1"] .t-thread{stroke-dashoffset:0}
.js:not(.rm) .pg-index .t-scene[data-step="2"] .t-b{opacity:1}
/* dusk: the night theme sweeps across the day one with the scroll, a soft edge moving corner to corner (--sp is the
   step's own progress); it is whole by two thirds of the step, so the full night holds before the scene lets go */
.js:not(.rm) .pg-index .t-scene[data-step="3"] .t-c{opacity:1;transition:none;
  --dawn:calc(var(--sp,1) * 190% - 20%);
  -webkit-mask-image:linear-gradient(115deg,#000 calc(var(--dawn) - 22%),transparent var(--dawn));
  mask-image:linear-gradient(115deg,#000 calc(var(--dawn) - 22%),transparent var(--dawn))}
.js:not(.rm) .pg-index .t-c{transition:none}  /* scrolled back: day returns at once, no flash of night */
.js:not(.rm) .pg-index .t-scene[data-step="3"] .t-frame{background:#05070B;box-shadow:0 0 0 1px rgba(169,187,214,.2),0 40px 90px -40px rgba(0,0,0,.85),0 18px 40px -24px rgba(90,169,255,.4)}
@media (min-width:700px){.pg-index .t-s{display:none}}
@media (max-width:699px){
  .js:not(.rm) .pg-index .t-scene[data-step="1"] .t-s{opacity:1}
  .js:not(.rm) .pg-index .t-zoom{transform:none!important}
  .pg-index .t-zoom{height:100%}
  .pg-index .t-frame{width:auto;height:min(600px,calc(100svh - 330px));aspect-ratio:780/1644;border-radius:16px}
  .pg-index .t-img,.pg-index .t-img img{height:100%;width:100%;object-fit:cover;object-position:top}
  .pg-index .t-ov{display:none}
  .pg-index .t-go{flex-direction:column;gap:10px}
}

/* ---------- the hero: one claim, and the noise cleaned into a table under it (dots.js) ---------- */
.pg-index .h-hero{padding-bottom:clamp(24px,4vh,48px)}
.pg-index .h-hero h1{font-size:clamp(2.75rem,6.2vw,5rem)}
.pg-index .h-hero h1 .l2{display:block;color:var(--blue)}
.pg-index .h-dots{margin:clamp(28px,5vh,56px) auto 0;width:min(100% - 2 * var(--gut),1180px);height:clamp(190px,30vh,340px)}
.pg-index .h-cv{display:block;width:100%;height:100%}
.js:not(.rm) .pg-index .h-dots{animation:heroIn 1.2s var(--ease-out) .42s both}
.pg-index .way-st{display:inline-block;margin-left:8px;padding:4px 8px;border:1px solid var(--line-2);border-radius:999px;font:500 .6875rem/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);vertical-align:middle}
.pg-index .dm-shot{padding:0;overflow:hidden;background:#FAF8F3}
.pg-index .dm-shot img{display:block;width:100%;height:100%;object-fit:cover;object-position:left top}

/* lookup: a big picker, the company panel (an ownership bar in the chart ramp above the filed lines), two tiles, folds.
   Final states are the default; "before" states only under .js:not(.rm). Only transform and opacity move. */
.pg-lookup .lk-hero{padding-top:clamp(56px,9vh,104px);padding-bottom:clamp(56px,8vh,88px)}  /* a tool page: the bar shows on a laptop's first screen */
.pg-lookup .lk-hero .stage{margin-top:clamp(40px,6vh,64px)}

/* ---------- the picker: a real select, made big ---------- */
.pg-lookup .lk-pick{position:relative;width:min(100%,38rem);margin-top:36px;text-align:left}
.pg-lookup .lk-pick label{position:absolute;left:30px;top:14px;z-index:1;font:500 .75rem/1 var(--sans);color:var(--muted);pointer-events:none}
.pg-lookup .lk-pick select{display:block;width:100%;height:76px;margin:0;padding:22px 80px 0 29px;border:1px solid var(--line-2);border-radius:999px;background:var(--surface);color:var(--ink);
  font:500 clamp(1.125rem,1rem + .45vw,1.3125rem)/1.2 var(--sans);letter-spacing:-.015em;text-overflow:ellipsis;white-space:nowrap;cursor:pointer;
  -webkit-appearance:none;appearance:none;box-shadow:var(--sh-card);transition:border-color var(--dur-base) var(--ease-std)}
.pg-lookup .lk-pick select:hover{border-color:var(--line-strong)}
.pg-lookup .lk-pick select:focus-visible{outline:2px solid var(--link);outline-offset:3px;border-radius:999px}
.pg-lookup .lk-chev{position:absolute;right:12px;top:12px;width:52px;height:52px;display:grid;place-items:center;border-radius:50%;background:var(--blue);color:var(--on-blue);pointer-events:none;
  box-shadow:0 8px 20px -10px rgba(10,100,220,.7);transition:background-color var(--dur-base) var(--ease-std),transform var(--dur-fast) var(--ease-out)}
.pg-lookup .lk-pick:hover .lk-chev{background:var(--blue-hover)}
.pg-lookup .lk-pick select:active~.lk-chev{transform:scale(.94)}
.pg-lookup .lk-msg{margin-top:18px;font-size:.9375rem;color:var(--ink-2)}
.pg-lookup .lk-msg:empty{margin:0}
.pg-lookup .lk-msg a{color:var(--link);font-weight:500;text-underline-offset:3px}
.js:not(.rm) .pg-lookup .lk-pick{animation:heroIn 1s var(--ease-out) .3s both}

/* ---------- the company panel ---------- */
.pg-lookup .lk-panel{position:relative;padding:clamp(22px,3.6vw,52px);border-radius:var(--r-xl);background:var(--surface);border:1px solid var(--line-2);box-shadow:var(--sh-lift);transition:opacity .3s var(--ease-out)}
html.lk-wait .pg-lookup .lk-panel{opacity:0}
.pg-lookup .lk-head{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:18px 24px}
.pg-lookup .lk-id{flex:1 1 30rem;min-width:0}
.pg-lookup .lk-id h2{font-size:clamp(1.75rem,1.15rem + 1.9vw,2.75rem);line-height:1.08;letter-spacing:-.035em}
.pg-lookup .lk-meta{display:flex;flex-wrap:wrap;gap:6px 22px;margin-top:12px;font-size:.9375rem;color:var(--muted)}
.pg-lookup .lk-meta b{font-weight:500;color:var(--ink)}
.pg-lookup .lk-meta b.mono{font-size:.875rem;letter-spacing:.01em}
.pg-lookup #co-open{flex:none}

/* the bar: segments are placed with translateX(x%) scaleX(w), so a switch slides them to the new shares; the track is
   everyone else; the wipe uncovers it once, left to right, the first time it is seen */
.pg-lookup .lk-own{margin-top:clamp(24px,4vh,36px)}
.pg-lookup .lk-bar{position:relative;height:clamp(40px,4vw,52px);border-radius:14px;overflow:hidden;background:var(--c-oth);isolation:isolate}
.pg-lookup .lk-seg,.pg-lookup .lk-div,.pg-lookup .lk-wipe{position:absolute;inset:0;transform-origin:0 50%}
.pg-lookup .lk-seg{background:var(--c);transform:translateX(calc(var(--x) * 1%)) scaleX(var(--w));transition:transform .3s var(--ease-out)}
.pg-lookup .lk-div{transform:translateX(calc(var(--x) * 1%));opacity:var(--o);transition:transform .3s var(--ease-out),opacity .2s var(--ease-out)}
.pg-lookup .lk-div::before{content:"";position:absolute;top:0;bottom:0;left:-1px;width:2px;background:var(--surface)}
.pg-lookup .lk-wipe{top:-2px;bottom:-2px;left:-48px;background:linear-gradient(90deg,transparent,var(--c-oth) 48px);transform:translateX(100%);transition:transform 1.3s var(--ease-out) var(--d0,.15s)}
.js:not(.rm) .pg-lookup .lk-own:not(.on) .lk-wipe{transform:none}
.pg-lookup .lk-key{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px 16px;margin-top:20px;list-style:none}
.pg-lookup .lk-key li{min-width:0;transition:opacity .6s var(--ease-out),transform .6s var(--ease-out);transition-delay:calc(var(--d0,.15s) + .12s + var(--i) * 70ms)}
.js:not(.rm) .pg-lookup .lk-own:not(.on) .lk-key li{opacity:0;transform:translateY(8px)}
.pg-lookup .lk-k{display:flex;align-items:center;gap:8px;font-size:.8125rem;font-weight:500;color:var(--ink-2);white-space:nowrap}
.pg-lookup .lk-k i,.pg-lookup .lk-sw{width:10px;height:10px;border-radius:3px;background:var(--c);box-shadow:inset 0 0 0 1px rgba(14,26,46,.22);flex:none}
.pg-lookup .lk-v{display:block;margin-top:6px;font-size:clamp(1.375rem,1.05rem + 1.1vw,2.125rem);font-weight:600;line-height:1.05;letter-spacing:-.035em;font-variant-numeric:tabular-nums;color:var(--ink)}
.pg-lookup .lk-v small{margin-left:2px;font-size:.55em;font-weight:500;letter-spacing:0;color:var(--muted)}

/* the filed lines, then the named holders, each a full-width table so every line reads on one row */
.pg-lookup .lk-tables{margin-top:clamp(44px,6.5vh,72px)}
.pg-lookup .lk-named{margin-top:clamp(44px,6.5vh,72px)}
.pg-lookup .lk-tables .ht caption{padding:0 12px 14px;font:600 1.125rem/1.3 var(--sans);letter-spacing:-.015em;color:var(--ink)}
.pg-lookup .lk-tables .ht th,.pg-lookup .lk-tables .ht td{padding-top:13px;padding-bottom:13px}
.pg-lookup .lk-tables .ht thead th{padding-top:4px;padding-bottom:10px}
.pg-lookup .lk-tables .ht :is(th,td).r{width:14%}
.pg-lookup .lk-tables .ht :is(th,td).shares{width:20%}
.pg-lookup .lk-cat th{position:relative}
.pg-lookup .lk-cat thead th:first-child,.pg-lookup .lk-cat tbody .l1 th,.pg-lookup .lk-cat tfoot th{padding-left:34px}
.pg-lookup .lk-cat tbody .l2 th{padding-left:54px}
.pg-lookup .lk-sw{position:absolute;left:12px;top:50%;margin-top:-5px}
.pg-lookup .lk-ok{margin-left:12px;align-items:baseline}
.pg-lookup .lk-ok svg{align-self:center}
.pg-lookup .lk-named tbody th{font-weight:400}
.pg-lookup .lk-named td.hide-s{width:22%;color:var(--ink-2)}
.pg-lookup .lk-sub{display:none}
.pg-lookup .lk-more{padding:14px 12px 0;font-size:.8125rem;color:var(--muted)}
.pg-lookup .lk-more:empty{display:none}
@media (hover:hover) and (pointer:fine){.pg-lookup .lk-tables tbody tr:hover{background:var(--surface-2)}}

/* a switch: rows and holders rise in, staggered by --i, done inside 300 ms; the check lands last */
@keyframes lkIn{from{opacity:0;transform:translateY(6px)}}
@keyframes lkOk{from{opacity:0;transform:scale(.6)}}
.js:not(.rm) .pg-lookup .lk-swap :is(.lk-id>*,.lk-key li,.lk-tables tbody tr,.lk-tables tfoot tr){animation:lkIn .18s var(--ease-out) both;animation-delay:calc(min(var(--i,0),11) * 10ms)}
.js:not(.rm) .pg-lookup .lk-swap .lk-ok svg{animation:lkOk .2s var(--ease-out) .1s both}

/* folds under the panel */
.pg-lookup #co-notes{font-size:.9375rem}
.pg-lookup .lk-held{font-size:.875rem}
.pg-lookup .lk-held th small{display:block;font:500 .6875rem/1.3 var(--mono);color:var(--muted)}
.pg-lookup .lk-held tbody th{font-weight:500}

/* ---------- two tiles: the same numbers as data, and as an embed ---------- */
.pg-lookup .lk-tiles{display:grid;gap:20px}
.pg-lookup .lk-tile{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,4.5vw,72px);align-items:center;padding:clamp(24px,4.2vw,60px);border-radius:var(--r-xl);background:var(--surface);border:1px solid var(--line-2);box-shadow:var(--sh-card)}
.pg-lookup #embed{grid-template-columns:minmax(0,4fr) minmax(0,8fr)}
.pg-lookup .lk-tile-h{font-size:clamp(2rem,1.35rem + 2.2vw,3.25rem);line-height:1;letter-spacing:-.04em}
.pg-lookup .lk-tile-t .note{display:table;margin-top:22px}
.pg-lookup .lk-tile-t>.go{margin-top:24px}
.pg-lookup .lk-tile-t .codeblock{margin:28px 0 0}
.pg-lookup .lk-tile-x .codeblock{margin:0}
.pg-lookup .lk-tile-x .codeblock+.codeblock{margin-top:16px}
.pg-lookup #embed-prev{height:592px}  /* the embed at this width, footer included, with no inner scroll */

@media (max-width:960px){
  .pg-lookup .lk-tile,.pg-lookup #embed{grid-template-columns:minmax(0,1fr)}
  .pg-lookup .lk-key{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:18px}
}
@media (max-width:640px){
  .pg-lookup .lk-pick{margin-top:32px}
  .pg-lookup .lk-pick select{height:68px;padding:22px 64px 0 23px;font-size:1.0625rem}
  .pg-lookup .lk-pick label{left:24px;top:13px}
  .pg-lookup .lk-chev{right:10px;top:12px;width:44px;height:44px}
  .pg-lookup .lk-meta{gap:4px 16px;font-size:.875rem}
  .pg-lookup .lk-key{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 14px}
  .pg-lookup .lk-cat thead th:first-child,.pg-lookup .lk-cat tbody .l1 th,.pg-lookup .lk-cat tfoot th{padding-left:24px}
  .pg-lookup .lk-cat tbody .l2 th{padding-left:36px}
  .pg-lookup .lk-sw{left:6px}
  .pg-lookup .lk-tables .ht :is(th,td){padding-top:10px;padding-bottom:10px}
  .pg-lookup .lk-sub{display:block;margin-top:2px;font-size:.75rem;color:var(--muted)}
  .pg-lookup .lk-tile{gap:24px}
  .pg-lookup #embed-prev{height:800px}
  .pg-lookup .lk-held thead th{white-space:normal}
  .pg-lookup .lk-held .r{font-size:.8125rem}
}

/* Method: how a number gets here. Final frames are the default; "before" states live only under .js:not(.rm).
   The navy scene's layers move on its steps ([data-at] .on/.now, data-step); method.js measures the flights and
   lines, fits the stage to the pinned view and draws the dot field. */

/* ---------- hero: the navy scene peeks in below ---------- */
.pg-method .m-hero{display:flex;align-items:center;min-height:calc(86vh - 68px)}
@supports (height:100svh){.pg-method .m-hero{min-height:calc(86svh - 68px)}}
.pg-method .m-hero .h3ro-in{width:100%}

/* ---------- the scene ---------- */
.pg-method .m-grid{display:grid;grid-template-columns:minmax(0,3.6fr) minmax(0,8.4fr);gap:clamp(32px,4.5vw,72px);align-items:start}
.js:not(.rm) .pg-method .m-grid{align-items:center}
.pg-method .m-cap{counter-reset:mc}
.pg-method .m-cap li{counter-increment:mc;font-size:clamp(1.75rem,1rem + 2.1vw,2.75rem);line-height:1.06;letter-spacing:-.035em;font-weight:600;color:#fff;text-wrap:balance}
.pg-method .m-cap li::before{content:counter(mc);display:block;margin-bottom:8px;font:500 .8125rem/1 var(--mono);letter-spacing:0;color:var(--azure)}
.js:not(.rm) .pg-method .m-cap li::before{content:none}
/* captions hand over instead of crossfading: the old one lifts away fast, the new one rises in after it */
.js:not(.rm) .pg-method .m-cap>li{transform:translateY(16px);transition:opacity .18s var(--ease-std),transform .3s var(--ease-std)}
.js:not(.rm) .pg-method .m-cap>li.on:not(.now){transform:translateY(-12px)}
.js:not(.rm) .pg-method .m-cap>li.now{transform:none;transition:opacity .5s var(--ease-std) .16s,transform .8s var(--ease-out) .16s}
.pg-method .m-rail{display:none}
.js:not(.rm) .pg-method .m-rail{display:flex;gap:6px;margin:0 0 26px}
.pg-method .m-rail i{position:relative;width:26px;height:3px;border-radius:3px;background:rgba(169,187,214,.22);overflow:hidden}
.pg-method .m-rail i::after{content:"";position:absolute;inset:0;border-radius:inherit;background:var(--azure);transform:scaleX(0);transform-origin:0 50%}
.pg-method .m-rail i.on::after{transform:scaleX(1)}
.pg-method .m-rail i.now::after{transform:scaleX(var(--sp,0))}

.pg-method .m-stage{position:relative;min-width:0}
.js:not(.rm) .pg-method .m-stage{display:flex;align-items:center;min-height:clamp(440px,58vh,560px);transform:scale(var(--fit,1));transform-origin:50% 0}
.pg-method .m-film{position:relative;width:100%;display:grid;grid-template-columns:minmax(0,1.16fr) minmax(0,.84fr);grid-template-areas:"src ." "paper side";column-gap:clamp(28px,3.4vw,52px);align-items:center}

/* the source */
.pg-method .m-src{grid-area:src;justify-self:center;display:flex;flex-direction:column;align-items:center}
.pg-method .m-node{display:inline-flex;align-items:center;gap:10px;padding:5px 14px 5px 5px;border-radius:999px;background:var(--navy-2);border:1px solid var(--line-2);font:500 .75rem/1 var(--mono);color:var(--navy-ink);white-space:nowrap}
.pg-method .m-node b{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--azure);color:var(--navy);font:600 .625rem/1 var(--mono);letter-spacing:.04em}
.pg-method .m-wire{display:block;width:1.5px;height:28px;background:linear-gradient(var(--azure),rgba(90,169,255,.12));transform-origin:50% 0}

/* the filing: light paper on navy */
.pg-method .m-paper{grid-area:paper;position:relative;width:100%;max-width:480px;justify-self:center;padding:20px 22px 8px}
.pg-method .m-paper .paper-k{padding-bottom:10px}
.pg-method .m-fn{position:relative;isolation:isolate;display:inline-block;margin:12px 0 0 -6px;padding:2px 6px;font:500 .78rem/1.35 var(--mono);color:var(--paper-link);overflow-wrap:anywhere}
.pg-method .m-fn::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:6px;background:var(--paper-hl);transition:opacity .5s var(--ease-std) .2s}
.pg-method .m-fn span{transition:opacity .1s linear;transition-delay:calc(.6s + var(--i) * 18ms)}
.pg-method .m-paper .paper-t{margin:8px 0 2px;font-size:1.125rem;line-height:1.25}
.pg-method .m-asof{font-size:.78rem;color:var(--paper-muted)}
.pg-method .m-paper dl{margin-top:10px;font-size:.9375rem}
.pg-method .m-paper dl div{padding:6px 0}
.pg-method .m-trow{border-bottom:0!important;border-top:1.5px solid var(--paper-ink);margin-top:-1px}
.pg-method .m-trow dt{color:var(--paper-ink);font-weight:500}
.pg-method .m-v,.pg-method .m-chip b{display:inline-block;padding:1px 5px;border-radius:4px;font:500 .875rem/1.3 var(--mono);font-variant-numeric:tabular-nums}
.pg-method .m-v{position:relative;isolation:isolate}
.pg-method .m-v::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:4px;background:var(--paper-hl);box-shadow:inset 0 -2px 0 var(--paper-link);transition:opacity .45s var(--ease-std);transition-delay:calc(var(--i,0) * 90ms)}

/* the check: three blocks against the filed total */
.pg-method .m-side{grid-area:side;display:grid;gap:44px;align-content:center;min-width:0}
.pg-method .m-stack{display:grid;transition:opacity .4s var(--ease-std)}
.pg-method .m-dim{position:relative;display:flex;justify-content:center;padding:10px 46px 0 0}
.pg-method .m-dim-l{position:absolute;left:0;right:46px;top:26px;height:1px;background:rgba(169,187,214,.55);transform-origin:50% 50%}
.pg-method .m-dim-l::before,.pg-method .m-dim-l::after{content:"";position:absolute;top:-5px;width:1px;height:11px;background:inherit}
.pg-method .m-dim-l::before{left:0}
.pg-method .m-dim-l::after{right:0}
.pg-method .m-bar{display:flex;align-items:center;gap:12px}
.pg-method .m-track{position:relative;flex:1;height:30px;border-radius:7px;background:rgba(169,187,214,.1);box-shadow:inset 0 0 0 1px var(--line-2);overflow:hidden}
.pg-method .m-seg{position:absolute;top:0;bottom:0;left:var(--x);width:var(--w);transform-origin:0 50%}
.pg-method .m-seg-pro{background:var(--azure)}
.pg-method .m-seg-pub{background:#A8CCF7;box-shadow:inset 2px 0 0 var(--navy)}
.pg-method .m-tick{position:absolute;top:0;bottom:0;right:0;width:2px;background:#fff}
.pg-method .m-ok{flex:none;display:block;width:34px;height:34px}
.pg-method .m-ok svg,.pg-method .m-rd-ok svg{display:block;width:100%;height:100%;fill:none;stroke:var(--ok);stroke-linecap:round;stroke-linejoin:round}
.pg-method .m-ok circle,.pg-method .m-rd-ok circle{stroke-width:1.6;stroke-dasharray:1}
.pg-method .m-ok path,.pg-method .m-rd-ok path{stroke-width:2.4;stroke-dasharray:1}
.pg-method .m-legend{list-style:none;display:grid;gap:8px;margin:0 0 20px}
.pg-method .m-chip{display:flex;align-items:center;gap:8px;width:max-content;max-width:100%;padding:4px 12px 4px 7px;border-radius:999px;background:var(--navy-2);border:1px solid var(--line-2);color:#fff;box-shadow:0 12px 26px -16px rgba(0,0,0,.7)}
.pg-method .m-chip small{font-size:.75rem;color:var(--navy-ink);white-space:nowrap}
.pg-method .m-sw{flex:none;width:10px;height:10px;border-radius:3px}
.pg-method .m-chip-pro .m-sw{background:var(--azure)}
.pg-method .m-chip-pub .m-sw{background:#A8CCF7}
.pg-method .m-chip-npnp .m-sw{box-shadow:inset 0 0 0 1.5px #fff}
.pg-method .m-tot{position:relative;z-index:1;padding:4px 14px}
.pg-method .m-tot small{margin-left:2px}

/* served: three places, each tied back to the filing */
.pg-method .m-outs{display:grid;gap:12px;order:-1}
.pg-method .m-o{position:relative;border-radius:14px;background:var(--navy-2);border:1px solid var(--line-2);box-shadow:var(--sh-card);font:400 .8125rem/1.35 var(--mono);color:#fff}
.pg-method .m-o-xl{padding-bottom:10px;overflow:hidden}
.pg-method .m-o-bar{display:flex;align-items:center;gap:5px;padding:8px 10px;border-bottom:1px solid var(--line);font-size:.6875rem;color:var(--navy-ink)}
.pg-method .m-o-bar i{width:7px;height:7px;border-radius:50%;background:var(--line-strong)}
.pg-method .m-o-bar span{margin-left:6px}
.pg-method .m-xl{display:grid;grid-template-columns:26px minmax(0,1fr) minmax(0,1fr);margin:10px 10px 0;border:1px solid var(--line-2);border-radius:6px;overflow:hidden}
.pg-method .m-xl>*{padding:5px 8px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pg-method .m-xl b{font-weight:500;color:var(--navy-ink);background:rgba(169,187,214,.07);text-align:center;padding-left:2px;padding-right:2px}
.pg-method .m-xl .m-sel{box-shadow:inset 0 0 0 2px var(--azure)}
.pg-method .m-o-api{display:grid;gap:3px;padding:12px 14px}
.pg-method .m-o-api p{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pg-method .m-o-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px 12px;padding:12px 14px;font:400 .875rem/1.3 var(--sans)}
.pg-method .m-o-row .m-o-tag{grid-column:1 / -1;justify-self:start}
.pg-method .m-o-l{flex:1;min-width:0;color:var(--navy-ink)}
.pg-method .m-o-row b{font:500 .9375rem/1 var(--mono)}
.pg-method .m-o-tag{display:inline-flex;align-items:center;gap:5px;padding:3px 8px;border-radius:999px;font:500 .6875rem/1.2 var(--mono);color:var(--azure);background:var(--tag-bg);border:1px solid var(--tag-edge);white-space:nowrap}
.pg-method .m-lines{position:absolute;left:0;top:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.pg-method .m-lines path{fill:none;stroke:var(--azure);stroke-width:1.5;stroke-linecap:round;stroke-dasharray:1;opacity:.9}
.pg-method .m-lines circle{fill:var(--azure)}

/* 48,036 filings: the dot field (method.js draws it; the canvas carries the four counts as text) */
.pg-method .m-dots{position:relative;margin:56px 0 0;height:440px;--g0:#5AA9FF;--g1:#C9D6EA;--g2:#C9D6EA;--g3:#FFFFFF;--gf:#4ADE9A}
.pg-method .m-cv{display:block;width:100%;height:100%}
html:not(.js) .pg-method .m-dots{height:auto}
html:not(.js) .pg-method .m-cv{display:none}
.pg-method .m-glab{list-style:none;display:grid;gap:8px;font-size:.9375rem;line-height:1.3;color:var(--navy-ink)}
.pg-method .m-glab b{margin-right:4px;font-size:1.125rem;font-weight:600;letter-spacing:-.015em;color:#fff;font-variant-numeric:tabular-nums}
.js .pg-method .m-glab{position:absolute;inset:0;display:block}
.js .pg-method .m-glab li{position:absolute;left:0;top:var(--t,0px);padding-left:var(--pl,0px);white-space:nowrap}

/* the scene in motion (none of this applies under reduced motion or without JS) */
.js:not(.rm) .pg-method .m-side{gap:0}
.js:not(.rm) .pg-method .m-side>*{grid-area:1/1;align-self:center}
.js:not(.rm) .pg-method .m-src,.js:not(.rm) .pg-method .m-paper{transition:transform 1s var(--ease-out),opacity .6s var(--ease-std)}
.js:not(.rm) .pg-method .m-scene:not([data-step]) :is(.m-src,.m-paper),.js:not(.rm) .pg-method .m-scene[data-step="0"] :is(.m-src,.m-paper){transform:translateX(var(--cx,0px))}
.js:not(.rm) .pg-method .m-src:not(.now){opacity:0;transform:translateY(-14px)}
.js:not(.rm) .pg-method.m-live .m-scene:not(.m-in) .m-paper{opacity:0;transform:translate(var(--cx,0px),-44px) scale(.97)}
.js:not(.rm) .pg-method .m-wire{transition:transform .7s var(--ease-out) .15s}
.js:not(.rm) .pg-method.m-live .m-scene:not(.m-in) .m-wire{transform:scaleY(0);transition-delay:0s}
.js:not(.rm) .pg-method.m-live .m-scene:not(.m-in) .m-fn span{opacity:0;transition-delay:0s}
.js:not(.rm) .pg-method .m-filed{transition:opacity .5s var(--ease-std) 1.25s}
.js:not(.rm) .pg-method.m-live .m-scene:not(.m-in) .m-filed{opacity:0;transition-delay:0s}
.js:not(.rm) .pg-method .m-fn:not(.on)::before{opacity:0;transition-delay:0s}
.js:not(.rm) .pg-method .m-row:not(.on) .m-v::before{opacity:0;transition-delay:0s}
/* step 1: the three blocks lift out of the filing (method.js sets --fx/--fy: where each sits in the filing) */
.js:not(.rm) .pg-method .m-chip{transition:transform .95s var(--ease-out),opacity .35s var(--ease-std);transition-delay:calc(.45s + var(--i,0) * 70ms)}
.js:not(.rm) .pg-method .m-chip:not(.on){opacity:0;transform:translate(var(--fx,0px),var(--fy,0px));transition-delay:0s}
.js:not(.rm) .pg-method .m-chip :is(small,.m-sw){transition:opacity .45s var(--ease-std);transition-delay:calc(1.1s + var(--i,0) * 70ms)}
.js:not(.rm) .pg-method .m-chip:not(.on) :is(small,.m-sw){opacity:0;transition-delay:0s}
.js:not(.rm) .pg-method .m-bar{transition:opacity .4s var(--ease-std) .1s}
.js:not(.rm) .pg-method .m-bar:not(.on){opacity:0;transition-delay:0s}
/* step 2: the total lifts out too, the bar fills to it, a check */
.js:not(.rm) .pg-method .m-tot{transition-delay:.1s}
.js:not(.rm) .pg-method .m-tot small{transition-delay:.8s}
.js:not(.rm) .pg-method .m-dim-l{transition:transform .8s var(--ease-out) .3s}
.js:not(.rm) .pg-method .m-dim-l:not(.on){transform:scaleX(0);transition-delay:0s}
.js:not(.rm) .pg-method .m-seg{transition:transform .75s var(--ease-out);transition-delay:calc(.55s + var(--i) * .45s)}
.js:not(.rm) .pg-method .m-seg:not(.on){transform:scaleX(0);transition-delay:0s}
.js:not(.rm) .pg-method .m-tick{transition:opacity .3s var(--ease-std) 1.4s}
.js:not(.rm) .pg-method .m-tick:not(.on){opacity:0;transition-delay:0s}
.js:not(.rm) .pg-method .m-ok circle{transition:stroke-dashoffset .55s var(--ease-out) 1.45s}
.js:not(.rm) .pg-method .m-ok path{transition:stroke-dashoffset .45s var(--ease-out) 1.7s}
.js:not(.rm) .pg-method .m-ok:not(.on) :is(circle,path){stroke-dashoffset:1;transition-delay:0s}
/* step 3: the check pulls back into the field of every filing */
.js:not(.rm) .pg-method .m-film{transition:transform .8s var(--ease-out),opacity .45s var(--ease-std);transform-origin:var(--ox,75%) var(--oy,50%)}
.js:not(.rm) .pg-method .m-scene[data-step="3"] .m-film{opacity:0;transform:scale(.6)}
.js:not(.rm) .pg-method .m-dots{position:absolute;inset:0;margin:0;height:auto;opacity:0;pointer-events:none;transition:opacity .45s var(--ease-std)}
.js:not(.rm) .pg-method .m-scene[data-step="3"] .m-dots{opacity:1}
.js:not(.rm) .pg-method.m-live .m-glab li{opacity:0;transform:translateY(8px);transition:opacity .5s var(--ease-std),transform .8s var(--ease-out);transition-delay:calc(var(--i) * 70ms)}
.js:not(.rm) .pg-method .m-dots.lab .m-glab li{opacity:1;transform:none}
/* step 4: served, each with a line drawn back to the filing */
.js:not(.rm) .pg-method .m-scene[data-step="4"] .m-stack{opacity:0}
.js:not(.rm) .pg-method .m-o{transition:transform .9s var(--ease-out),opacity .45s var(--ease-std);transition-delay:calc(.3s + var(--i) * 70ms)}
.js:not(.rm) .pg-method .m-o:not(.on){opacity:0;transform:translateX(40px);transition-delay:0s}
.js:not(.rm) .pg-method .m-lines path{transition:stroke-dashoffset .9s var(--ease-out);transition-delay:calc(.75s + var(--i) * 70ms)}
.js:not(.rm) .pg-method .m-lines path:not(.on){stroke-dashoffset:1;transition-delay:0s}
.js:not(.rm) .pg-method .m-lines circle{transition:opacity .3s var(--ease-std);transition-delay:calc(1.45s + var(--i) * 70ms)}
.js:not(.rm) .pg-method .m-lines circle:not(.on){opacity:0;transition-delay:0s}

/* ---------- 1,471,548 figures: every month read back ---------- */
.pg-method .m-pms .ch-head{max-width:1040px}
.pg-method .m-n{position:relative;display:inline-block}
.pg-method .m-n-w{visibility:hidden}
.pg-method .m-n-v{position:absolute;right:0;top:0}
.pg-method .m-zero{display:block;color:var(--blue)}
.pg-method .m-strip{list-style:none;display:grid;grid-template-columns:repeat(3,max-content);justify-content:center;gap:16px 48px;margin:clamp(48px,8vh,80px) auto 0}
.pg-method .m-strip li{display:grid;grid-template-columns:3.2em max-content;align-items:center;gap:0 10px}
.pg-method .m-strip svg{display:block;width:calc(var(--n) * 22px);height:22px;overflow:visible}
.pg-method .m-strip span{order:-1;font:500 .75rem/1 var(--mono);color:var(--muted)}
.pg-method .m-strip circle{fill:var(--line-strong);opacity:0;r:1}
.pg-method .m-strip path{fill:none;stroke:var(--ok);stroke-width:1.15;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1}
.js:not(.rm) .pg-method .m-strip :is(path,circle){transition:stroke-dashoffset .5s var(--ease-out),opacity .3s var(--ease-std);transition-delay:calc(var(--y) * 70ms + var(--m) * 7ms)}
.js:not(.rm) .pg-method.m-live .m-strip:not(.m-go) path{stroke-dashoffset:1;transition-delay:0s}
.js:not(.rm) .pg-method.m-live .m-strip:not(.m-go) circle{opacity:1;transition-delay:0s}

/* ---------- rounding: two numbers meet ---------- */
.pg-method .m-rd{display:flex;flex-direction:column;align-items:center;gap:14px;margin-top:clamp(40px,6vh,64px)}
.pg-method .m-rd-k{font-size:1.0625rem;color:var(--ink-2)}
.pg-method .m-rd-k code{margin-left:6px;font:500 1.0625rem/1 var(--mono);color:var(--ink)}
.pg-method .m-rd-c{position:relative;width:100%;height:2.5em;font:500 clamp(3.5rem,10vw,8rem)/1 var(--mono);letter-spacing:0;color:var(--ink)}
.pg-method .m-num{--adv:.9ch;position:absolute;left:50%;top:50%;width:calc(var(--cols) * var(--adv));height:1em;margin:-.5em 0 0 calc(var(--cols) * var(--adv) / -2)}
.pg-method .m-num-b{opacity:0}
.pg-method .m-g{position:absolute;left:0;top:0;width:var(--adv);height:1em;text-align:center;font-style:normal;transform:translateX(calc(var(--b) * 100%))}
.pg-method .m-g.out{opacity:0}
.pg-method .m-roll{overflow:hidden}
.pg-method .m-roll b{display:block;height:1em;font-weight:inherit;transform:translateY(-100%)}
.pg-method .m-rd-l{position:absolute;left:50%;width:1.5px;height:.5em;margin-left:-.75px;background:var(--line-strong)}
.pg-method .m-rd-l1{top:0;transform-origin:50% 0}
.pg-method .m-rd-l2{bottom:0;transform-origin:50% 100%}
.pg-method .m-rd-ok{position:absolute;top:50%;left:calc(50% + var(--cols) * .45ch + .14em);width:.36em;height:.36em;margin-top:-.2em}
.js:not(.rm) .pg-method .m-g{transition:transform 1s var(--ease-io) .25s,opacity .45s var(--ease-std) .3s}
.js:not(.rm) .pg-method .m-g.in{transition-delay:.25s,.95s}
.js:not(.rm) .pg-method .m-roll b{transition:transform .7s var(--ease-io) .55s}
.js:not(.rm) .pg-method .m-num{transition:transform .95s var(--ease-io) 1.35s,opacity .35s var(--ease-std) 2.15s}
.js:not(.rm) .pg-method .m-rd-l{transition:transform .6s var(--ease-out) 2.05s}
.js:not(.rm) .pg-method .m-rd-ok circle{transition:stroke-dashoffset .55s var(--ease-out) 2.2s}
.js:not(.rm) .pg-method .m-rd-ok path{transition:stroke-dashoffset .45s var(--ease-out) 2.45s}
.js:not(.rm) .pg-method.m-live .m-rd:not(.m-go) .m-g{transform:translateX(calc(var(--a) * 100%));transition-delay:0s}
.js:not(.rm) .pg-method.m-live .m-rd:not(.m-go) .m-g.out{opacity:1}
.js:not(.rm) .pg-method.m-live .m-rd:not(.m-go) .m-g.in{opacity:0}
.js:not(.rm) .pg-method.m-live .m-rd:not(.m-go) .m-roll b{transform:none;transition-delay:0s}
.js:not(.rm) .pg-method.m-live .m-rd:not(.m-go) .m-num-a{transform:translateY(-.68em);transition-delay:0s}
.js:not(.rm) .pg-method.m-live .m-rd:not(.m-go) .m-num-b{transform:translateY(.68em);opacity:1;transition-delay:0s}
.js:not(.rm) .pg-method.m-live .m-rd:not(.m-go) .m-rd-l{transform:scaleY(0);transition-delay:0s}
.js:not(.rm) .pg-method.m-live .m-rd:not(.m-go) .m-rd-ok :is(circle,path){stroke-dashoffset:1;transition-delay:0s}

/* ---------- what we leave out ---------- */
.pg-method .m-chips{max-width:900px;margin:clamp(36px,5vh,52px) auto 0}
.pg-method .m-chips .chip{opacity:.7}
.js:not(.rm) .pg-method .m-chips .chip{transition:opacity .5s var(--ease-std);transition-delay:calc(var(--i) * 120ms + .5s)}
.js:not(.rm) .pg-method .m-chips:not(.on) .chip{opacity:1;transition-delay:0s}

/* ---------- every build is kept ---------- */
.pg-method .m-bld{display:flex;flex-direction:column;align-items:center;margin-top:clamp(40px,6vh,64px)}
.pg-method .m-card{position:relative;z-index:1;width:min(360px,100%);padding:20px 24px 8px;border-radius:var(--r-lg);background:var(--surface);border:1px solid var(--line-2);box-shadow:var(--sh-lift)}
.pg-method .m-card-k{display:flex;justify-content:space-between;gap:12px;font:500 .6875rem/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.pg-method .m-card-d{margin-top:16px;font-size:clamp(2.25rem,4vw,3rem);font-weight:600;letter-spacing:-.04em;line-height:1}
.pg-method .m-card dl{margin-top:18px;border-top:1px dashed var(--line-2)}
.pg-method .m-card dl div{display:flex;justify-content:space-between;gap:16px;padding:10px 0;font-size:.9375rem}
.pg-method .m-card dl div+div{border-top:1px solid var(--line)}
.pg-method .m-card dt{color:var(--ink-2)}
.pg-method .m-card dd{font:500 .875rem/1.5 var(--mono);font-variant-numeric:tabular-nums}
.pg-method .m-shelf{display:block;width:min(600px,100%);height:1px;margin-top:-1px;background:linear-gradient(90deg,transparent,var(--line-strong) 20%,var(--line-strong) 80%,transparent)}
.pg-method .m-bld-l{display:block;width:1.5px;height:44px;background:var(--line-strong);transform-origin:50% 0}
.pg-method .m-ver code{display:inline-flex;padding:11px 18px;border-radius:999px;background:var(--surface);border:1px solid var(--line-2);font:500 1rem/1 var(--mono);color:var(--blue)}
.js:not(.rm) .pg-method .m-shelf{transition:transform .9s var(--ease-out)}
.js:not(.rm) .pg-method .m-card{transition:transform .9s var(--ease-out) .15s,opacity .5s var(--ease-std) .15s}
.js:not(.rm) .pg-method .m-card dl div{transition:transform .7s var(--ease-out),opacity .45s var(--ease-std);transition-delay:calc(.6s + var(--i) * 70ms)}
.js:not(.rm) .pg-method .m-bld-l{transition:transform .5s var(--ease-out) .95s}
.js:not(.rm) .pg-method .m-ver span{transition:opacity .1s linear;transition-delay:calc(1.25s + var(--i) * 24ms)}
.js:not(.rm) .pg-method.m-live .m-bld:not(.m-go) .m-shelf{transform:scaleX(0);transition-delay:0s}
.js:not(.rm) .pg-method.m-live .m-bld:not(.m-go) .m-card{opacity:0;transform:translateY(-36px);transition-delay:0s}
.js:not(.rm) .pg-method.m-live .m-bld:not(.m-go) .m-card dl div{opacity:0;transform:translateY(6px);transition-delay:0s}
.js:not(.rm) .pg-method.m-live .m-bld:not(.m-go) .m-bld-l{transform:scaleY(0);transition-delay:0s}
.js:not(.rm) .pg-method.m-live .m-bld:not(.m-go) .m-ver span{opacity:0;transition-delay:0s}

/* ---------- found a wrong number ---------- */
.pg-method .m-flow{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;max-width:940px;margin:clamp(40px,6vh,64px) auto 0}
.pg-method .m-flow li{position:relative;display:flex;flex-direction:column;align-items:center;gap:16px;text-align:center;font-size:1.125rem;font-weight:500;letter-spacing:-.01em;color:var(--ink)}
.pg-method .m-flow li+li::before{content:"";position:absolute;top:31px;left:calc(-50% + 20px);right:calc(50% + 44px);height:1.5px;border-radius:2px;background:var(--line-strong);transform-origin:0 50%}
.pg-method .m-ic{position:relative;display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:var(--sky);color:var(--blue);flex:none}
.pg-method .m-ic svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.pg-method .m-ic-ok{stroke:var(--ok);stroke-width:2;stroke-dasharray:1}
.pg-method .m-mail{margin-top:clamp(44px,6vh,60px);text-align:center}
.js:not(.rm) .pg-method .m-flow li :is(.m-ic,span:last-child){transition:transform .8s var(--ease-out),opacity .5s var(--ease-std);transition-delay:calc(var(--i) * .42s)}
.js:not(.rm) .pg-method .m-flow li+li::before{transition:transform .5s var(--ease-out);transition-delay:calc(var(--i) * .42s - .25s)}
.js:not(.rm) .pg-method .m-ic-ok{transition:stroke-dashoffset .5s var(--ease-out) 1.25s}
.js:not(.rm) .pg-method.m-live .m-flow:not(.m-go) li .m-ic{opacity:0;transform:scale(.86);transition-delay:0s}
.js:not(.rm) .pg-method.m-live .m-flow:not(.m-go) li span:last-child{opacity:0;transform:translateY(8px);transition-delay:0s}
.js:not(.rm) .pg-method.m-live .m-flow:not(.m-go) li+li::before{transform:scaleX(0);transition-delay:0s}
.js:not(.rm) .pg-method.m-live .m-flow:not(.m-go) .m-ic-ok{stroke-dashoffset:1;transition-delay:0s}

/* ---------- the long version ---------- */
.pg-method .m-more h2{color:var(--ink)}
.pg-method .m-more .more-body .card{margin-top:4px}

/* ---------- phones and narrow windows ---------- */
@media (max-width:999px){
  .pg-method .m-strip{grid-template-columns:minmax(0,1fr);gap:10px;max-width:440px}
  .pg-method .m-strip li{grid-template-columns:3.2em minmax(0,1fr)}
  .pg-method .m-strip svg{width:calc(var(--n) / 12 * 100%);height:auto}
}
@media (max-width:900px){
  .pg-method .m-grid{grid-template-columns:minmax(0,1fr);gap:20px}
  .js:not(.rm) .pg-method .m-grid{align-items:stretch}
  .js:not(.rm) .pg-method .m-rail{margin-bottom:14px}
  .pg-method .m-cap li{font-size:clamp(1.625rem,6.4vw,2.25rem)}
  .pg-method .m-film{grid-template-columns:minmax(0,1fr);grid-template-areas:"src" "paper" "side";row-gap:16px}
  .js:not(.rm) .pg-method .m-stage{min-height:0}
  .pg-method .m-paper{padding:16px 18px 6px}
  .pg-method .m-fn{margin-top:10px;font-size:.72rem}
  .pg-method .m-paper .paper-t{font-size:1.0625rem}
  .pg-method .m-paper dl{margin-top:6px;font-size:.875rem}
  .pg-method .m-paper dl div{padding:5px 0}
  .pg-method .m-legend{margin:0 0 14px;gap:6px}
  .pg-method .m-legend .m-chip{display:flex}
  .pg-method .m-outs{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  .pg-method .m-o{font-size:.6875rem;border-radius:12px}
  .pg-method .m-o-bar span,.pg-method .m-o-src,.pg-method .m-xl b:nth-child(2),.pg-method .m-xl span:not(.m-sel),.pg-method .m-o-tag .sl{display:none}
  .pg-method .m-xl{grid-template-columns:20px minmax(0,1fr);margin:8px 8px 0}
  .pg-method .m-xl>*{padding:4px 5px}
  .pg-method .m-o-api{padding:10px}.pg-method .m-o-api p{white-space:normal}
  .pg-method .m-o-row{display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:10px;font-size:.6875rem}
  .pg-method .m-o-row b{font-size:.875rem}
  .pg-method .m-o-tag{padding:2px 6px;font-size:.625rem}
  .js:not(.rm) .pg-method .m-o:not(.on){transform:translateY(24px)}
  .pg-method .m-dots{height:520px}
  .pg-method .m-glab{font-size:.8125rem}
  .pg-method .m-glab b{font-size:1rem}
}
@media (max-width:700px){
  .pg-method .m-flow{grid-template-columns:minmax(0,1fr);gap:36px;max-width:320px}
  .pg-method .m-flow li{flex-direction:row;gap:18px;text-align:left}
  .pg-method .m-ic{width:56px;height:56px}
  .pg-method .m-flow li+li::before{top:-30px;left:27.25px;right:auto;width:1.5px;height:24px;transform-origin:50% 0}
  .js:not(.rm) .pg-method.m-live .m-flow:not(.m-go) li+li::before{transform:scaleY(0)}
  .pg-method .m-rd-k,.pg-method .m-rd-k code{font-size:1rem}
}
@media (min-width:1200px){
  .pg-method .m-paper{max-width:440px;padding:24px 26px 10px}
  .pg-method .m-paper .paper-t{font-size:1.25rem}
  .pg-method .m-paper dl{font-size:1rem}
  .pg-method .m-v,.pg-method .m-chip b{font-size:.9375rem}
  .pg-method .m-fn{font-size:.8125rem}
}
.pg-method .m-paper{align-self:start}
.js:not(.rm) .pg-method .m-paper{align-self:center}
.pg-method .m-cap{gap:24px}