/* Donor Insight Explorer. Colour tokens come from styles.css, which loads
   first, and type, buttons and focus from refresh.css. This file used to
   repeat the whole :root block, which put back the older, weaker grey
   (#6B7280) that styles.css had darkened to pass contrast; it now adds only
   the Explorer's own colours. */
:root {
  --ex-pos:#15803D;   /* gains: 5.0:1 on white (the old #16A34A was 3.3:1) */
  --ex-neg:#B91C1C;   /* losses: 6.5:1 on white */
  --ex-field:#7A86AE; /* form field borders: 3.7:1 on white (WCAG 1.4.11) */
  --ex-nav-h:72px;    /* the refreshed navbar; the tabs stick under it */
}
@media (max-width:900px){ :root{ --ex-nav-h:64px; } }
/* WCAG 2.4.11: on a profile, focus and anchors land below the navbar and the
   sticky tab row, and above the phone call-to-action bar when it shows. */
html:has(#out:not([hidden]) .ip-tabs){scroll-padding-top:calc(var(--ex-nav-h) + 64px);}
html:has(body.has-mbar){scroll-padding-bottom:84px;}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;font-size:16px;}
@media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto;} }
[hidden]{display:none !important;}
body{font-family:var(--font-ui,Roboto,system-ui,sans-serif);color:var(--text-body);background:var(--white);line-height:1.65;}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
ul,ol{list-style:none;}
button{font-family:inherit;cursor:pointer;border:none;background:none;}
input,select,textarea{font-family:inherit;}
h1,h2,h3,h4,h5,h6{font-family:var(--font-ui,Roboto,system-ui,sans-serif);color:var(--text-primary);line-height:1.2;}
h1,h2{font-family:var(--font-display,Georgia,serif);font-weight:600;letter-spacing:-.015em;}
h2{font-size:clamp(1.7rem,4vw,2.4rem);}
h3{font-size:clamp(1.15rem,2.5vw,1.5rem);font-weight:650;}
h4{font-size:1.1rem;font-weight:700;}
p{font-size:1rem;line-height:1.75;}

/* ---------------------------------------------------------------- chrome */


/* ---------------------------------------------------------------- calm first screen */
.rep-lede{margin:0 0 .4rem;} /* inside the Org Summary tab, under its heading */
.rep-lede p{font-size:1.05rem;line-height:1.65;color:var(--text-body);max-width:88ch;}
.rep-lede b{color:var(--text-primary);font-weight:700;}
.tab-panel .stats-strip{margin:0 0 1.25rem;padding:0;background:transparent;border:0;}
.ip-further{margin-top:2.25rem;}
.ip-further .dim-tally{margin-top:0;}
.ip-link{display:inline;padding:0;color:var(--blue);font:inherit;font-weight:600;text-decoration:underline;text-underline-offset:3px;}

/* ---------------------------------------------------------------- from insight/index.html */
  .ip-wrap{max-width:var(--max-w);margin:0 auto;padding:0 24px;}   /* the site's .container */
  /* The same dropdown as the homepage hero search, so the site has one search
     rather than two. Rows are buttons here (a click loads the profile in place)
     but they are drawn exactly as the homepage draws its links. */
  .ip-results{position:absolute;top:calc(100% + 8px);left:0;right:0;z-index:30;
    background:var(--white);border-radius:12px;box-shadow:var(--shadow-lg);overflow:hidden;
    max-height:340px;overflow-y:auto;text-align:left;}
  .ip-results button{display:flex;justify-content:space-between;align-items:baseline;gap:14px;
    width:100%;padding:12px 18px;background:none;border:0;border-bottom:1px solid var(--gray-100);
    cursor:pointer;font-family:inherit;transition:background var(--transition);}
  .ip-results button:last-child{border-bottom:none;}
  .ip-results button:hover{background:var(--blue-xlight);}
  .ip-results button:focus{outline:none;}
  /* A ring as well as a tint, so a keyboard user sees which row Enter opens (audit B1). */
  .ip-results button:focus-visible{background:var(--blue-light);outline:3px solid var(--blue);outline-offset:-3px;border-radius:0;}
  .ip-results .nm{font-weight:600;color:var(--text-primary);font-size:.95rem;line-height:1.35;text-align:left;}
  .ip-results .meta{flex:none;font-size:.8rem;color:var(--text-muted);white-space:nowrap;}
  .ip-results .err .nm{color:var(--text-body);font-weight:500;}
  .ip-results .err .retry{flex:none;color:var(--blue);font-weight:600;font-size:.88rem;}
  .ip-results .note{display:block;padding:14px 18px;font-size:.88rem;color:var(--blue);font-weight:600;}
  .ip-results .corrected{margin:0;padding:10px 18px;border-bottom:1px solid var(--gray-100);font-size:.85rem;color:var(--text-muted);}

  /* staged loading */
  .ip-loading{padding:2.5rem 0;}
  .ip-bar{height:5px;background:var(--gray-200);border-radius:99px;overflow:hidden;max-width:420px;}
  .ip-bar span{display:block;height:100%;width:8%;background:var(--blue);border-radius:99px;
    transition:width .5s ease;}
  .ip-stage{margin-top:.85rem;color:var(--text-muted);font-size:.94rem;}
  .ip-stage b{color:var(--text-primary);font-weight:600;}
  .skel{background:linear-gradient(90deg,var(--gray-100) 25%,var(--gray-200) 37%,var(--gray-100) 63%);
    background-size:400% 100%;animation:sk 1.4s ease infinite;border-radius:6px;}
  @keyframes sk{0%{background-position:100% 50%}100%{background-position:0 50%}}

  section.ip-sec{padding:2.25rem 0;border-top:1px solid var(--gray-200);}
  .ip-sec h2{color:var(--text-primary);font-size:1.3rem;margin-bottom:.35rem;}
  .ip-sec .sub{color:var(--text-muted);font-size:.9rem;margin-bottom:1.25rem;}

  .ip-orghead h2{font-size:1.75rem;margin-bottom:.25rem;}
  .ip-tags{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:.6rem;}
  .ip-tag{background:var(--blue-light);color:var(--blue-mid);font-size:.78rem;font-weight:600;
    padding:.25rem .6rem;border-radius:99px;}

  .ip-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(165px,1fr));gap:1px;
    background:var(--gray-200);border:1px solid var(--gray-200);border-radius:var(--radius);overflow:hidden;}
  .ip-tile{background:#fff;padding:1rem .9rem;}
  .ip-tile .v{font-size:1.4rem;font-weight:700;color:var(--blue);line-height:1.2;}
  .ip-tile .l{font-size:.78rem;color:var(--text-muted);margin-top:.25rem;}

  .ip-chart{margin-top:1.25rem;}
  .ip-legend{display:flex;gap:1.1rem;font-size:.82rem;color:var(--text-body);margin-bottom:.5rem;}
  .locked-row td{opacity:.55}
    .redact{display:inline-block;height:.72rem;border-radius:3px;
      background:linear-gradient(90deg,#DDE1EC,#EEF1F7);vertical-align:middle}
    /* --- skeleton loader for the lazily-loaded grant detail --- */
  .sk{background:linear-gradient(90deg,#EDF0F6 25%,#F6F8FC 37%,#EDF0F6 63%);
    background-size:400% 100%;animation:skshine 1.3s ease-in-out infinite;border-radius:5px;}
  @keyframes skshine{0%{background-position:100% 0}100%{background-position:-100% 0}}
  .sk-k{height:.62rem;width:58%;margin-bottom:.55rem;}
  .sk-v{height:1.5rem;width:74%;margin-bottom:.5rem;}
  .sk-s{height:.6rem;width:88%;}
  .sk-lbl{height:.72rem;}
  .sk-bar{height:11px;border-radius:99px;}
  .sk-amt{height:.72rem;width:64px;justify-self:end;}
  .sk-note{font-size:.72rem;font-weight:600;color:var(--text-muted);letter-spacing:.02em;
    text-transform:none;margin-left:.6rem;display:inline-flex;align-items:center;gap:.35rem;}
  .sk-dot{width:6px;height:6px;border-radius:50%;background:var(--blue);
    animation:skpulse 1s ease-in-out infinite;}
  @keyframes skpulse{0%,100%{opacity:.25}50%{opacity:1}}
  .sk-wrap{animation:skfade .25s ease-in;}
  @keyframes skfade{from{opacity:0}to{opacity:1}}
  @media (prefers-reduced-motion:reduce){
    .sk,.sk-dot,.sk-wrap{animation:none;}
    .sk{background:#EDF0F6;}
  }

  /* --- funding purposes --- */
  .purp{margin-top:1rem;display:grid;gap:.7rem;}
  .purp-row{display:grid;grid-template-columns:minmax(140px,26%) 1fr auto;gap:1rem;align-items:center;}
  .purp-lbl{font-size:.9rem;color:var(--text-primary);font-weight:400;line-height:1.35;
    display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
  .purp-track{background:var(--gray-200);border-radius:99px;height:11px;overflow:hidden;}
  .purp-fill{background:linear-gradient(90deg,var(--blue),#5B6FE8);height:100%;border-radius:99px;}
  .purp-amt{font-size:.9rem;font-weight:700;color:var(--text-primary);text-align:right;white-space:nowrap;}
  .purp-n{display:block;font-size:.76rem;font-weight:400;color:var(--text-muted);}
  @media(max-width:640px){.purp-row{grid-template-columns:1fr;gap:.25rem;}
    .purp-amt{text-align:left;}.purp-n{display:inline;margin-left:.4rem;}}

  /* --- no-filings state --- */
  .nf{background:#fff;border:1px solid var(--gray-200);border-radius:12px;
    padding:2.25rem 2rem;margin:2rem 0;max-width:760px;}
  .nf-icon{width:52px;height:52px;border-radius:12px;display:grid;place-items:center;
    background:var(--blue-xlight);color:var(--blue);margin-bottom:1.1rem;}
  .nf h2{font-size:1.3rem;line-height:1.35;margin:0 0 .75rem;color:var(--text-primary);}
  .nf p{color:var(--text-muted);line-height:1.65;margin:0 0 1rem;}
  .nf-why{background:var(--blue-xlight);border-radius:10px;padding:1.1rem 1.3rem;margin:1.4rem 0;}
  .nf-why-k{color:var(--blue);font-size:.72rem;font-weight:800;letter-spacing:.09em;
    text-transform:uppercase;margin-bottom:.6rem;}
  .nf-why ul{margin:0;padding-left:1.15rem;color:var(--text-primary);list-style:disc;}
  .nf-why li{display:list-item;}
  .nf-why li::marker{color:var(--blue);}
  .nf-why li{margin-bottom:.5rem;line-height:1.6;font-size:.93rem;}
  .nf-why li:last-child{margin-bottom:0;}
  .nf-note{font-size:.88rem;}
  .nf-cta{display:flex;gap:.75rem;align-items:center;flex-wrap:wrap;margin-top:1.5rem;}
  .nf-cta + .ip-cta-line{margin-top:.6rem;}
  .nf-alt{background:none;border:1px solid var(--gray-200);border-radius:8px;
    padding:.7rem 1.1rem;font:inherit;color:var(--text-muted);cursor:pointer;}
  .nf-alt:hover{border-color:var(--blue);color:var(--blue);}

  /* --- Insight Summary: intro, dimension cards, use-case band --- */
  .dim-intro{background:var(--blue-xlight);border-radius:10px;padding:1.25rem 1.4rem;}
  .dim-intro .k{color:var(--blue);font-size:.72rem;font-weight:800;letter-spacing:.09em;
    text-transform:uppercase;margin-bottom:.5rem;}
  .dim-intro p{color:var(--text-primary);margin:0;line-height:1.6;}

  .dim-list{margin-top:1.5rem;display:grid;gap:.85rem;}
  .dim-card{border:1px solid var(--gray-200);border-radius:10px;background:#fff;}
  .dim-card.partial{background:#FFFBEB;border-color:#FDE68A;}
  .dim-card.locked{background:var(--gray-50,#F8FAFC);}
  .dim-card>summary{display:flex;gap:1rem;align-items:flex-start;padding:1.15rem 1.3rem;
    cursor:pointer;list-style:none;}
  .dim-card>summary::-webkit-details-marker{display:none;}
  .dim-n{flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;
    font-size:.82rem;font-weight:700;background:var(--gray-200);color:var(--text-muted);}
  /* Gold means this preview shows you something. Capacity in full, Trend and
     Proximity in part - the same three, and the same colour, as the grids on
     the landing page and the homepage. */
  .dim-card.shown .dim-n,
  .dim-card.partial .dim-n{background:var(--gold);color:var(--blue-dark);}
  .dim-main{flex:1;min-width:0;display:grid;gap:.3rem;}
  .dim-h{font-weight:700;color:var(--text-primary);font-size:1.02rem;
    display:flex;align-items:center;gap:.55rem;flex-wrap:wrap;}
  .dim-b{font-size:.75rem;font-weight:700;letter-spacing:.02em;border-radius:99px;
    padding:.16rem .55rem;white-space:nowrap;}
  .dim-b.shown{background:var(--blue);color:#fff;}
  .dim-b.partial{background:var(--gold);color:var(--blue-dark);}
  .dim-b.locked{display:inline-flex;align-items:center;gap:4px;background:var(--gray-100);color:var(--text-muted-strong);}   /* 5.3:1 */
  .dim-b.account{background:var(--blue-light);color:var(--blue-mid);}
  .dim-card.account{background:var(--blue-xlight);border-color:#C7D2FE;}
  .dim-sub{color:var(--text-muted);font-size:.9rem;line-height:1.5;}
  .dim-val{color:var(--blue);font-weight:700;font-size:.95rem;margin-top:.15rem;}
  .dim-note{color:var(--text-muted);font-size:.83rem;}
  .dim-x{flex:none;position:relative;width:15px;height:15px;margin-top:.35rem;color:var(--text-muted);}
  .dim-x::before,.dim-x::after{content:"";position:absolute;background:currentColor;}
  .dim-x::before{left:0;top:7px;width:15px;height:1.5px;}
  .dim-x::after{left:7px;top:0;width:1.5px;height:15px;transition:transform .18s;}
  .dim-card[open] .dim-x::after{transform:scaleY(0);}
  .dim-more{padding:0 1.3rem 1.2rem calc(30px + 2.3rem);color:var(--text-muted);
    font-size:.9rem;line-height:1.65;border-top:1px solid var(--gray-200);margin-top:.2rem;
    padding-top:.95rem;}
  .dim-more p{margin:0 0 .7rem;}
  .dim-need{color:var(--text-primary);background:var(--gray-50,#F8FAFC);border-radius:6px;
    padding:.5rem .7rem;font-size:.85rem;}
  .dim-need .lk-sm{margin-right:6px;vertical-align:-1px;color:var(--text-muted-strong);}
  .dim-link{color:var(--blue);font-weight:600;font-size:.88rem;text-decoration:none;}
  .dim-link:hover{text-decoration:underline;}

  .uc-band{margin-top:2rem;background:var(--blue-dark);border-radius:12px;padding:1.6rem;}
  .uc-k{color:var(--gold);font-size:.72rem;font-weight:800;letter-spacing:.09em;
    text-transform:uppercase;margin-bottom:1.1rem;}
  .uc-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.9rem;}
  .uc{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);
    border-radius:8px;padding:1rem 1.1rem;}
  .uc h4,.uc .as-h4{color:var(--gold);font-size:.94rem;margin:0 0 .35rem;}
  .uc p{color:rgba(255,255,255,.8);font-size:.86rem;line-height:1.55;margin:0;}
  .uc-foot{color:rgba(255,255,255,.55);font-size:.82rem;margin:1.1rem 0 0;}
  @media screen and (max-width:760px){.uc-grid{grid-template-columns:1fr;}}

  .ip-legend i.dash{height:0;border-top:2px dashed #F0AC1A;background:none!important;border-radius:0}
    .ip-legend i{width:11px;height:11px;border-radius:3px;display:inline-block;margin-right:.35rem;vertical-align:-1px;}

  table.ip-tbl{width:100%;border-collapse:collapse;font-size:.88rem;margin-top:.5rem;}
  /* The site stylesheet gives `th` a solid blue fill; override it so the
     header reads as a quiet label row rather than a heavy band. */
  table.ip-tbl th{text-align:left;background:#fff !important;color:var(--text-muted) !important;
    font-weight:600;font-size:.76rem;text-transform:uppercase;letter-spacing:.04em;
    padding:.5rem .6rem;border-bottom:1px solid var(--gray-200);}
  table.ip-tbl td{padding:.5rem .6rem;border-bottom:1px solid var(--gray-100);}
  table.ip-tbl td.n{text-align:right;font-variant-numeric:tabular-nums;}

  .ip-locked{background:var(--gold-light);border:1px solid var(--gold);border-radius:var(--radius);
    padding:1.4rem 1.5rem;}
  .ip-locked h3{color:var(--text-primary);font-size:1.05rem;margin-bottom:.4rem;}
  .ip-locked p{color:var(--text-body);font-size:.92rem;max-width:60ch;}
  .ip-locked ul{margin:.75rem 0 1rem 1.1rem;color:var(--text-body);font-size:.92rem;}
  .ip-locked li{margin:.2rem 0;}
  /* The one primary action on a profile: gold, as on the rest of the site. */
  .ip-cta{display:inline-flex;align-items:center;justify-content:center;min-height:48px;background:var(--gold);
    color:var(--blue-dark);font-weight:700;font-size:1rem;padding:0 1.4rem;border-radius:10px;
    transition:background var(--transition),box-shadow var(--transition);}
  .ip-cta:hover{background:#E09E0F;box-shadow:0 6px 18px rgba(240,172,26,.35);}
  /* The line under each "Unlock potential prospects" button: it says what the
     button leads to. A column keeps the header's action row aligned. */
  .ip-cta-col{display:flex;flex-direction:column;align-items:flex-start;gap:.3rem;}
  .ip-cta-line{display:block;font-size:.8125rem;line-height:1.4;color:var(--text-muted-strong);}
  .ip-note{color:var(--text-muted);font-size:.8rem;margin-top:1.5rem;}
  .ip-err{background:#FEF2F2;border:1px solid #FCA5A5;color:#991B1B;padding:1rem 1.2rem;border-radius:var(--radius);}
  /* In the hero, under the search box: a short message and, when the failure
     may pass, a Retry button. */
  .ip-hero .ip-err{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.6rem 1rem;
    max-width:640px;margin:1rem auto 0;text-align:left;font-size:.95rem;}
  .ip-hero .ip-err[hidden]{display:none;}
  .ip-err-retry{flex:none;background:#991B1B;color:#fff;border:0;border-radius:var(--radius);
    padding:.45rem 1rem;font:inherit;font-weight:600;font-size:.88rem;cursor:pointer;}
  .ip-err-retry:hover{background:#7F1D1D;}

  /* ---- landing hero ---- */
  .ip-hero[hidden]{display:none;}
  .ip-hero{background:linear-gradient(135deg,#0D1B4B 0%,#1E2E7A 45%,#3B52D4 100%);
    padding:clamp(56px,7vw,96px) 0 clamp(48px,6vw,80px);border-bottom:0;color:#fff;text-align:center;}
  .ip-eyebrow{display:inline-flex;align-items:center;gap:10px;color:#E6EAFB;font-size:.875rem;font-weight:600;
    letter-spacing:.02em;margin-bottom:1rem;}
  .ip-eyebrow::before{content:"";flex:none;width:8px;height:8px;border-radius:50%;background:var(--gold);}
  .ip-hero h1{color:#fff;font-size:clamp(2.4rem,3.4vw + 1rem,4rem);line-height:1.05;margin:0 auto 1.1rem;max-width:16ch;}
  .ip-hero .lede{color:rgba(255,255,255,.9);max-width:54ch;margin:0 auto 2rem;
    font-size:clamp(1.0625rem,.35vw + 1rem,1.1875rem);line-height:1.6;}

  .ip-search{position:relative;max-width:640px;margin:0 auto;}
  .ip-search .box{display:flex;align-items:center;gap:10px;background:var(--white);
    border-radius:14px;padding:8px 8px 8px 18px;box-shadow:var(--shadow-float);}
  .ip-search .icon{color:var(--text-muted-strong);flex:none;}
  .ip-search input{flex:1;min-width:0;border:0;outline:none;font-size:1.0625rem;font-family:inherit;
    color:var(--text-primary);background:transparent;padding:12px 0;}
  .ip-search input::placeholder{color:var(--text-muted-strong);}
  /* The ring sits outside the white box, on the navy hero: gold reads there (8.3:1). */
  .ip-search .box:has(input:focus){outline:3px solid var(--gold);outline-offset:3px;}
  .ip-search .go{flex:none;min-height:48px;background:var(--gold);color:var(--blue-dark);border:0;
    border-radius:10px;padding:0 24px;font-weight:700;font-size:1rem;font-family:inherit;cursor:pointer;
    white-space:nowrap;transition:background var(--transition),box-shadow var(--transition);}
  .ip-search .go:hover{background:#E09E0F;box-shadow:0 6px 18px rgba(240,172,26,.35);}
  .ip-search .go:focus-visible{outline:3px solid var(--blue-dark);outline-offset:2px;}
  @media(max-width:560px){.ip-search .box{flex-wrap:wrap;padding:10px;}.ip-search .go{width:100%;}}
  .ip-hero :where(button):focus-visible{outline-color:var(--gold);}

  /* ---- what each level shows: free, free account, walkthrough ---- */
  .ip-levels{padding:var(--space-section) 0 calc(var(--space-section) * .55);background:var(--white);}
  .ip-levels h2,.ip-dimband h2{text-align:center;font-size:clamp(1.85rem,1.9vw + 1rem,2.5rem);line-height:1.12;margin-bottom:.75rem;}
  .lv-list{margin:2.25rem 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;}
  .lv{position:relative;background:var(--white);border:1px solid var(--line);border-radius:var(--radius-lg);
    padding:26px 26px 24px;box-shadow:var(--shadow-card);}
  .lv-n{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--blue-xlight);
    border:1px solid var(--line-strong);color:var(--blue);font-weight:700;font-size:.95rem;margin-bottom:16px;}
  .lv-k{font-size:.875rem;font-weight:700;color:var(--blue);margin:0 0 4px;line-height:1.4;}
  .lv-h{font-size:1.25rem;line-height:1.3;margin:0 0 8px;}
  .lv p:last-child{font-size:.975rem;line-height:1.6;color:var(--text-muted-strong);margin:0;}
  .lv-call{background:var(--blue-dark);border-color:var(--blue-dark);}
  .lv-call .lv-n{background:var(--gold);border-color:var(--gold);color:var(--blue-dark);}
  .lv-call .lv-k{color:var(--gold);}               /* on navy: 8.3:1 */
  .lv-call .lv-h{color:#fff;}
  .lv-call p:last-child{color:#DDE1EC;}
  /* A chevron between the levels on wide screens: each leads to the next. */
  @media(min-width:861px){
    .lv:not(:last-child)::after{content:"";position:absolute;top:42px;right:-17px;width:9px;height:9px;
      border-top:2px solid var(--line-strong);border-right:2px solid var(--line-strong);transform:rotate(45deg);}
  }
  @media(max-width:860px){ .lv-list{grid-template-columns:1fr;gap:14px;} }

  /* ---- the seven dimensions, as an even glossary ---- */
  .ip-dimband{padding:calc(var(--space-section) * .55) 0 var(--space-section);background:var(--white);}
  .ip-dimband .s{text-align:center;color:var(--text-muted-strong);font-size:1.0625rem;max-width:62ch;margin:0 auto 2rem;}
  .dim-gloss{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:48px;margin:0;border-top:1px solid var(--line);}
  .dim-gloss > div{display:grid;grid-template-columns:190px minmax(0,1fr);gap:4px 20px;align-items:baseline;
    padding:16px 0;border-bottom:1px solid var(--line);}
  .dim-gloss dt{display:flex;align-items:center;gap:12px;font-weight:650;color:var(--text-primary);font-size:1rem;}
  .dim-gloss dd{margin:0;color:var(--text-muted-strong);font-size:.95rem;line-height:1.55;}
  .dg-n{flex:none;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--blue);
    color:#fff;font-weight:700;font-size:.8125rem;}
  .dim-gloss-note dt{font-weight:600;font-size:.9375rem;color:var(--text-muted-strong);}
  @media(max-width:860px){ .dim-gloss{grid-template-columns:1fr;} }
  @media(max-width:560px){
    .dim-gloss > div{grid-template-columns:1fr;}
    .dim-gloss > div:not(.dim-gloss-note) dd{padding-left:40px;}
  }

  /* ---- closing: back to the search box, so the page never dead-ends ---- */
  .ip-again{background:var(--blue-xlight);border-top:1px solid var(--line);}
  .ip-again-in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px 40px;
    padding-top:calc(var(--space-section) * .55);padding-bottom:calc(var(--space-section) * .55);}
  .ip-again h2{font-size:clamp(1.5rem,1.4vw + 1rem,2rem);margin-bottom:.35rem;}
  .ip-again p{color:var(--text-muted-strong);margin:0;}
  .ip-again-btn{min-height:48px;padding:0 26px;border-radius:10px;background:var(--gold);color:var(--blue-dark);
    font-weight:700;font-size:1rem;transition:background var(--transition);}
  .ip-again-btn:hover{background:#E09E0F;}

  /* ---- explainer band ---- */
  .ip-band{padding:2.75rem 0;}
  .ip-kicker{text-align:center;color:var(--text-muted);font-size:.76rem;font-weight:700;
    letter-spacing:.14em;text-transform:uppercase;margin-bottom:1.4rem;}
  .ip-two{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1rem;}
  .ip-card{background:var(--gray-50);border:1px solid var(--gray-200);border-radius:var(--radius);
    padding:1.15rem 1.3rem;}
  .ip-badge{display:inline-block;font-size:.68rem;font-weight:700;letter-spacing:.1em;
    text-transform:uppercase;padding:.16rem .6rem;border-radius:99px;margin-right:.55rem;}
  .ip-badge.free{background:#DCFCE7;color:#166534;}
  .ip-badge.locked{background:var(--gold-light);color:var(--gold-text);}
  .ip-card h4,.ip-card .as-h4{display:inline;color:var(--text-primary);font-size:.98rem;}
  .ip-card p{color:var(--text-body);font-size:.88rem;margin-top:.6rem;line-height:1.6;}

  /* ---- five classifications ---- */
  .ip-cls{display:grid;grid-template-columns:repeat(auto-fit,minmax(185px,1fr));gap:.9rem;}
  .ip-c{border:1px solid var(--gray-200);border-radius:var(--radius);padding:1rem;text-align:center;}
  .ip-c .pill{display:inline-block;color:#fff;font-size:.72rem;font-weight:700;letter-spacing:.06em;
    padding:.24rem .8rem;border-radius:99px;margin-bottom:.7rem;}
  .ip-c p{color:var(--text-body);font-size:.83rem;line-height:1.55;min-height:5.2em;}
  .ip-c .act{display:block;margin-top:.7rem;color:#fff;font-size:.72rem;font-weight:700;
    letter-spacing:.05em;padding:.45rem .5rem;border-radius:99px;}

  /* ---- seven dimensions ---- */
  table.ip-dim{width:100%;border-collapse:collapse;font-size:.88rem;
    border:1px solid var(--gray-200);border-radius:var(--radius);overflow:hidden;}
  table.ip-dim th{background:var(--blue-dark) !important;color:#fff !important;text-align:left;
    font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;padding:.7rem .9rem;}
  table.ip-dim td{padding:.65rem .9rem;border-bottom:1px solid var(--gray-100);
    color:var(--text-body);}
  table.ip-dim td.dim{color:var(--blue);font-weight:600;}
  .ip-yes,.ip-partial,.ip-only{font-size:.72rem;font-weight:700;padding:.2rem .6rem;border-radius:99px;}
  .ip-yes{background:#DCFCE7;color:#166534;}
  .ip-partial{background:var(--blue-light);color:var(--blue-mid);}
  .ip-only{background:var(--gold-light);color:var(--gold-text);}

  /* ---- closing CTA ---- */
  .ip-close{background:var(--blue-dark);border-radius:var(--radius-lg);padding:1.5rem 1.75rem;
    display:flex;gap:1.5rem;align-items:center;justify-content:space-between;flex-wrap:wrap;
    margin:2.5rem 0;}
  .ip-close p{color:rgba(255,255,255,.88);font-size:.92rem;max-width:62ch;line-height:1.6;}
  .ip-close b{color:var(--gold);}
  .ip-close a{background:var(--gold);color:var(--blue-dark);font-weight:700;font-size:.9rem;
    padding:.7rem 1.4rem;border-radius:99px;white-space:nowrap;}


  /* ---- loading screen (mirrors the prototype) ---- */
  /* At least a screen tall, so the footer starts below the fold: otherwise the
     profile pushes a visible footer down when it lands (CLS was 0.37-0.43). */
  .ls{padding:4rem 2rem;text-align:center;max-width:520px;margin:0 auto;min-height:100vh;}
  .ls-spinner{width:52px;height:52px;border:4px solid var(--gray-200);border-top-color:var(--blue);
    border-radius:50%;animation:spin .75s linear infinite;margin:0 auto 1.5rem;}
  @keyframes spin{to{transform:rotate(360deg)}}
  .ls-title{font-size:1.1rem;font-weight:600;color:var(--text-primary);margin-bottom:.4rem;}
  .ls-sub{font-size:.86rem;color:var(--text-muted);}
  .ls-steps{margin-top:1.6rem;display:flex;flex-direction:column;gap:.6rem;text-align:left;
    max-width:300px;margin-left:auto;margin-right:auto;}
  /* Steps still to come stay muted but readable (no fade below 4.5:1). */
  .ls-step{display:flex;align-items:center;gap:.6rem;font-size:.85rem;color:var(--text-muted);
    transition:opacity .4s,color .4s;}
  .ls-step.active{opacity:1;color:var(--blue);font-weight:500;}
  .ls-step.done{opacity:1;color:#166534;}
  .ls-dot{width:8px;height:8px;border-radius:50%;background:currentColor;flex-shrink:0;}

  /* ---- tabs ---- */
  /* Sticky under the site navbar so the section nav stays in reach while
     scrolling a long profile - candid-style. */
  .ip-tabs{display:flex;gap:.25rem;border-bottom:1px solid var(--line-strong);margin:1.75rem 0 0;
    flex-wrap:wrap;position:sticky;top:var(--ex-nav-h);background:#fff;z-index:60;}
  .tab-btn{display:inline-flex;align-items:center;gap:6px;min-height:48px;background:none;border:0;
    border-bottom:3px solid transparent;margin-bottom:-1px;padding:.6rem 1.1rem;font-family:inherit;
    font-size:.9375rem;font-weight:600;color:var(--text-muted-strong);cursor:pointer;
    transition:color var(--transition),border-color var(--transition);}
  .tab-btn:hover{color:var(--blue);}
  .tab-btn.active{color:var(--blue-dark);border-bottom-color:var(--blue);}
  /* Inside the bar, so a scrolling row never clips the ring. */
  .tab-btn:focus-visible{outline-offset:-4px;}
  .tab-lk{display:inline-flex;color:var(--gold-text);}
  .tab-lk.open{color:var(--blue);}
  /* Phones: one row, edge to edge, that scrolls sideways instead of two rows
     pinned under the navbar. An edge fades where more tabs wait beyond it
     (more-l / more-r come from the page script). */
  @media(max-width:640px){
    .ip-tabs{flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-webkit-overflow-scrolling:touch;
      border-bottom:0;box-shadow:inset 0 -1px 0 var(--line-strong);margin-left:-24px;margin-right:-24px;padding:0 12px;}
    .ip-tabs::-webkit-scrollbar{display:none;}
    .tab-btn{flex:none;white-space:nowrap;padding:.6rem .85rem;margin-bottom:0;}
    .ip-tabs.more-r{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 56px),transparent);
      mask-image:linear-gradient(90deg,#000 calc(100% - 56px),transparent);}
    .ip-tabs.more-l{-webkit-mask-image:linear-gradient(90deg,transparent,#000 56px);
      mask-image:linear-gradient(90deg,transparent,#000 56px);}
    .ip-tabs.more-l.more-r{-webkit-mask-image:linear-gradient(90deg,transparent,#000 56px,#000 calc(100% - 56px),transparent);
      mask-image:linear-gradient(90deg,transparent,#000 56px,#000 calc(100% - 56px),transparent);}
  }
  .tab-panel{display:none;padding-top:1.5rem;}
  .tab-panel.active{display:block;}
  .sec-hdr h2{color:var(--text-primary);font-size:1.35rem;margin-bottom:.25rem;}
  /* A heading with no subtitle under it has to carry the gap itself. */
  .sec-hdr h2:last-child{margin-bottom:1.25rem;}
  .sec-hdr p{color:var(--text-muted);font-size:.88rem;margin-bottom:1.25rem;}
  /* A second heading inside one tab needs air above it, not a page's worth. */
  .sec-hdr-2{margin-top:2.25rem;}
  .two-col{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(330px,100%),1fr));gap:1.5rem;}
  .two-col > *{min-width:0;}
  /* The yearly table scrolls inside its own box on a phone, never the page (WCAG 1.4.10). */
  .tbl-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;margin-top:.5rem;}
  .tbl-scroll:focus-visible{outline:3px solid var(--blue);outline-offset:2px;}
  .chart-wrap{border:1px solid var(--gray-200);border-radius:var(--radius);padding:1.1rem 1.2rem;}
  .chart-title{font-weight:600;color:var(--text-primary);font-size:.95rem;}
  .chart-note{color:var(--text-muted);font-size:.8rem;margin-top:.15rem;margin-bottom:.6rem;}
  .ip-summary{background:var(--blue-xlight);border:1px solid var(--gray-200);
    border-radius:var(--radius);padding:1.25rem 1.4rem;font-size:.94rem;line-height:1.7;
    color:var(--text-body);}
  .ip-summary b{color:var(--text-primary);}

  /* ---- key facts (candid-style summary card) ---- */
  .kf{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:0 2.25rem;
    border:1px solid var(--gray-200);border-radius:var(--radius);background:#fff;
    padding:.35rem 1.4rem;margin-bottom:1.5rem;}
  .kf-row{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;
    padding:.72rem 0;border-bottom:1px solid var(--gray-100);font-size:.92rem;}
  .kf-row:last-child{border-bottom:0;}
  .kf-k{color:var(--text-muted);font-weight:600;white-space:nowrap;}
  .kf-v{color:var(--text-primary);font-weight:600;text-align:right;}
  .kf-code{color:var(--text-muted);font-weight:400;font-size:.84rem;}


  .trend-banner{display:flex;align-items:center;justify-content:space-between;gap:1rem;
    border:1px solid var(--gray-200);border-left:4px solid var(--blue);border-radius:var(--radius);
    padding:.85rem 1.1rem;margin-bottom:1.25rem;flex-wrap:wrap;background:var(--blue-xlight);}
  .trend-banner .lbl{font-size:.95rem;color:var(--text-primary);}
  .trend-banner .lbl b.pos{color:#166534;} .trend-banner .lbl b.neg{color:#B91C1C;}
  .trend-banner .lbl b.neutral{color:var(--text-primary);}
  .trend-banner .dim{font-size:.7rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
    color:var(--blue-mid);background:#fff;border:1px solid var(--gray-200);
    padding:.25rem .7rem;border-radius:99px;white-space:nowrap;}
  .ip-tile[title]{cursor:help;}
  .cx-line{stroke:#9CA3AF;stroke-width:1;stroke-dasharray:3 3;opacity:0;}
  .cx-hit{fill:transparent;}
  .cx-tip{position:absolute;background:var(--blue-dark);color:#fff;font-size:.82rem;
    padding:.6rem .8rem;border-radius:10px;pointer-events:none;opacity:0;transition:opacity .12s;
    white-space:nowrap;z-index:40;box-shadow:0 8px 24px rgba(13,27,75,.28);line-height:1.5;}
  .cx-tip .yr{color:rgba(255,255,255,.6);font-size:.78rem;margin-bottom:.15rem;}
  .cx-tip .row{display:flex;justify-content:space-between;gap:1.5rem;}
  .cx-tip .row .lb{color:rgba(255,255,255,.72);}
  .cx-tip .row .vl{font-weight:700;}
  .cx-tip .net{margin-top:.35rem;padding-top:.35rem;border-top:1px solid rgba(255,255,255,.2);}
  .cx-tip .net .vl.pos{color:#4ADE80;}
  .cx-tip .net .vl.neg{color:#F87171;}
  .cx-dot{fill:#fff;stroke-width:2.5;opacity:0;pointer-events:none;}
  .bx-hit{fill:transparent;cursor:pointer;}
  .bx-bar{transition:opacity .12s, fill .12s;}
  .bx-svg.dim .bx-bar{opacity:.35;}
  .bx-svg.dim .bx-bar.on{opacity:1;fill:#2A3FC4;}
  .cx-tip .row .vl.pos{color:#4ADE80;}
  .cx-tip .row .vl.neg{color:#F87171;}

  .chart-wrap{position:relative;}


  /* ---- result header: the name, one plain sentence, four figures ---- */
  .rep-hd{background:linear-gradient(180deg,var(--blue-xlight) 0%,#fff 88%);border-bottom:1px solid var(--line);
    padding:1.25rem 0 1.75rem;}
  .rep-hd-in{max-width:var(--max-w);margin:0 auto;padding:0 24px;}
  .rep-crumb{margin-bottom:.9rem;}
  .rep-back{display:inline-flex;align-items:center;min-height:32px;background:none;border:0;color:var(--blue);
    font-weight:600;font-size:.9375rem;cursor:pointer;font-family:inherit;padding:0;}
  .rep-back:hover{text-decoration:underline;text-underline-offset:3px;}
  .rep-row{display:flex;gap:1.25rem 2.5rem;align-items:flex-start;justify-content:space-between;flex-wrap:wrap;}
  .rep-id{flex:1 1 520px;min-width:0;}
  /* The organization's name is the page's one h1 while a profile is open (the
     hero, with its own h1, is hidden then), and the largest heading on it. */
  .rep-id h1{color:var(--text-primary);font-size:clamp(2rem,2.4vw + 1rem,2.75rem);line-height:1.1;margin:0 0 .6rem;}
  .rep-meta{color:var(--text-muted-strong);font-size:.9375rem;display:flex;gap:.25rem .55rem;flex-wrap:wrap;align-items:center;}
  .rep-meta .sep{color:#9AA6D9;}
  .rep-own{color:var(--blue-mid);font-weight:600;}
  .rep-chip{background:#fff;border:1px solid var(--line-strong);color:var(--blue-mid);font-weight:600;font-size:.8125rem;
    padding:.15rem .7rem;border-radius:99px;}
  .rep-sum{margin:.8rem 0 0;font-size:1.0625rem;line-height:1.6;color:var(--text-body);max-width:68ch;}
  .rep-actions{flex:none;display:flex;flex-direction:column;align-items:flex-end;gap:.6rem;padding-top:.2rem;}
  .rep-actions .ip-cta-col{align-items:flex-end;text-align:right;}
  .rep-tools{display:flex;align-items:center;gap:.4rem;}
  .rep-print{display:inline-flex;align-items:center;gap:.45rem;min-height:40px;
    background:#fff;border:1px solid var(--line-strong);color:var(--text-primary);
    border-radius:8px;padding:0 .9rem;font-size:.875rem;font-weight:500;font-family:inherit;cursor:pointer;
    transition:border-color var(--transition),color var(--transition),background var(--transition);}
  .rep-print:hover{border-color:var(--blue);color:var(--blue);}
  /* Print is a quiet tool beside the call to action, not a second button. */
  .rep-print.rep-quiet{border-color:transparent;background:none;color:var(--text-muted-strong);padding:0 .65rem;}
  .rep-print.rep-quiet:hover{color:var(--blue);background:var(--blue-xlight);}
  @media screen and (max-width:760px){
    .rep-actions{width:100%;align-items:stretch;}
    .rep-actions .ip-cta-col{align-items:stretch;text-align:left;}
    .rep-tools{justify-content:flex-start;margin-left:-.65rem;}
  }
  /* Four figures, ProPublica-style: a big number, what it is, its year. */
  .rep-kpis{margin-top:1.5rem;}
  .kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:0;background:#fff;
    border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow-card);overflow:hidden;}
  .kpi{padding:16px 20px 15px;min-width:0;}
  .kpi + .kpi{border-left:1px solid var(--line);}
  .kpi dt{font-size:.8125rem;font-weight:600;color:var(--text-muted-strong);line-height:1.35;}
  .kpi-v{margin:6px 0 0;font-family:var(--font-display);font-size:clamp(1.6rem,1.1vw + 1rem,2.125rem);font-weight:600;
    line-height:1.1;color:var(--text-primary);font-variant-numeric:tabular-nums lining-nums;}
  .kpi-s{margin:5px 0 0;font-size:.8125rem;line-height:1.4;color:var(--text-muted-strong);}
  .sk-kpi{display:inline-block;width:3.4ch;height:1.7rem;vertical-align:middle;}
  .rep-src{margin:.6rem 0 0;font-size:.8125rem;color:var(--text-muted-strong);}
  @media screen and (max-width:760px){
    .kpis{grid-template-columns:repeat(2,minmax(0,1fr));}
    .kpi:nth-child(3){border-left:0;}
    .kpi:nth-child(n+3){border-top:1px solid var(--line);}
    .kpi{padding:14px 16px;}
  }

  /* audience-aware cross-sell: grantmaker profiles pitch the funder product */
  .xsell{background:var(--gold-light);border-bottom:1px solid var(--gray-200);}
  .xsell-in{max-width:var(--max-w);margin:0 auto;padding:.85rem 1.25rem;
    display:flex;align-items:center;gap:1rem;flex-wrap:wrap;}
  .xsell-chip{flex:none;background:#fff;color:var(--gold-dark);font-size:.68rem;font-weight:800;
    letter-spacing:.08em;text-transform:uppercase;padding:.3rem .7rem;border-radius:99px;
    border:1px solid var(--gold);}
  .xsell-in p{flex:1;min-width:260px;margin:0;font-size:.92rem;color:var(--text-body);line-height:1.55;}
  .xsell-in a{color:var(--blue);font-weight:700;white-space:nowrap;font-size:.92rem;}
  .xsell-in a:hover{text-decoration:underline;}

  /* quantified dimensions tally (the "how much you'd get" pointer) */
  .dim-tally{border:1px solid var(--gray-200);border-left:4px solid var(--gold);
    border-radius:var(--radius);background:#fff;padding:.8rem 1.1rem;margin:1.25rem 0 1rem;
    font-size:.92rem;color:var(--text-body);}
  .dim-tally b{color:var(--text-primary);}

  /* ---- at-a-glance strip ---- */
  .stats-strip{background:var(--gray-50);border-bottom:1px solid var(--gray-200);}
  .stats-grid{max-width:var(--max-w);margin:0 auto;padding:1.1rem 1.25rem;display:grid;
    grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:.8rem;}
  .stat{background:#fff;border:1px solid var(--gray-200);border-radius:10px;
    padding:.85rem 1.05rem;text-align:left;}
  .stat .k{font-size:.68rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
    color:var(--text-muted);}
  .stat .v{font-size:1.45rem;font-weight:700;color:var(--text-primary);line-height:1.25;margin:.15rem 0;}
  .stat .v.pos{color:var(--ex-pos);} .stat .v.neg{color:var(--ex-neg);}
  .stat .s{font-size:.76rem;color:var(--text-muted);}


  /* ---- metric cards with colour-coded left border ---- */
  .mcards{display:grid;grid-template-columns:repeat(auto-fit,minmax(185px,1fr));gap:1rem;margin-top:1.25rem;}
  .mcard{border:1px solid var(--gray-200);border-left:4px solid var(--blue);border-radius:var(--radius);
    padding:1rem 1.1rem;background:#fff;}
  .mcard.good{border-left-color:var(--ex-pos);} .mcard.bad{border-left-color:var(--ex-neg);}
  .mcard .k{font-size:.8125rem;font-weight:600;letter-spacing:0;text-transform:none;line-height:1.35;color:var(--text-muted-strong);margin-bottom:.35rem;}
  .mcard .v{font-size:1.75rem;font-weight:700;color:var(--text-primary);line-height:1;}
  .mcard .v.pos{color:var(--ex-pos);} .mcard .v.neg{color:var(--ex-neg);}
  .mcard .v small{font-size:.9rem;font-weight:600;color:var(--text-muted);}
  .mcard .s{font-size:.8125rem;color:var(--text-muted-strong);margin-top:.35rem;}

  /* ---- trend dimension band ---- */
  .trend-band{display:flex;align-items:center;justify-content:space-between;gap:1rem;
    background:var(--blue-xlight);border-radius:var(--radius);padding:.9rem 1.15rem;
    margin-top:1.5rem;flex-wrap:wrap;}
  .trend-band .k{font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
    color:var(--blue-mid);}
  .trend-band .t{font-size:.95rem;color:var(--text-body);}
  .trend-band .t b.pos{color:var(--ex-pos);} .trend-band .t b.neg{color:var(--ex-neg);}
  .trend-band .d{font-size:.8rem;color:var(--text-muted);}

  /* ---- revenue architecture ---- */
  .arch-bar{display:flex;height:14px;border-radius:4px;overflow:hidden;margin:.75rem 0 1rem;}
  .arch-legend{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:.9rem;}
  .arch-legend .it{font-size:.86rem;}
  .arch-legend .it i{width:11px;height:11px;border-radius:2px;display:inline-block;margin-right:.4rem;}
  .arch-legend .it b{color:var(--text-primary);} .arch-legend .it span{color:var(--text-muted);}
  .arch-legend .it .d{color:var(--text-muted);font-size:.78rem;margin-left:1.15rem;}
  .note-blue{border-left:3px solid var(--blue);background:var(--blue-xlight);padding:.7rem 1rem;
    font-size:.86rem;color:var(--text-body);border-radius:0 6px 6px 0;margin-top:1.25rem;}
  .chart-hdr{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;flex-wrap:wrap;}


/* ---------------------------------------------------------------- visual summary (story 51) */
  .kts{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:.9rem;}
  .kt{border:1px solid var(--gray-200);border-radius:var(--radius);padding:.95rem 1rem .7rem;
    background:var(--white);box-shadow:var(--shadow-sm);display:flex;flex-direction:column;}
  .kt-k{font-size:.8125rem;font-weight:600;letter-spacing:0;text-transform:none;line-height:1.35;color:var(--text-muted-strong);}
  .kt-v{font-size:1.65rem;font-weight:700;color:var(--text-primary);line-height:1.15;margin-top:.3rem;}
  .kt-v.pos{color:var(--ex-pos);} .kt-v.neg{color:var(--ex-neg);}
  .kt-s{font-size:.8125rem;color:var(--text-muted-strong);margin-top:.2rem;}
  .kt-s .pos{color:var(--ex-pos);font-weight:700;} .kt-s .neg{color:var(--ex-neg);font-weight:700;}
  .kt-spark{display:block;width:100%;height:30px;margin-top:auto;padding-top:.55rem;}

  .donut{display:flex;align-items:center;gap:1.25rem;flex-wrap:wrap;margin-top:.4rem;}
  .donut svg{flex-shrink:0;}
  .donut-leg{flex:1;min-width:180px;display:grid;gap:.7rem;}
  .donut-leg .it{display:grid;grid-template-columns:12px 1fr auto;gap:.5rem;align-items:baseline;font-size:.88rem;}
  .donut-leg i{width:11px;height:11px;border-radius:3px;display:inline-block;}
  .donut-leg b{color:var(--text-primary);font-weight:600;}
  .donut-leg span{font-weight:700;color:var(--text-primary);font-variant-numeric:tabular-nums;}


  .fp .chart-hdr{align-items:flex-start;}
  .fp-more{font-size:.85rem;white-space:nowrap;}
  .fp-lock{position:relative;min-height:230px;}
  .fp-lock .purp{margin-top:.4rem;}
  .fp-blur{filter:blur(4px);opacity:.55;pointer-events:none;user-select:none;}
  .fp-over{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;
    text-align:center;padding:1rem;background:rgba(255,255,255,.55);}
  .fp-over h3{font-size:1.05rem;color:var(--text-primary);margin-bottom:.35rem;}
  .fp-over p{max-width:58ch;color:var(--text-body);font-size:.92rem;margin-bottom:.8rem;}
  .fp-over p b{color:var(--text-primary);}
  .split{margin-top:1.1rem;}
  .split-bar{display:flex;height:11px;border-radius:99px;overflow:hidden;background:var(--gray-200);}
  .split-leg{display:flex;flex-wrap:wrap;gap:.35rem 1.2rem;font-size:.82rem;color:var(--text-body);margin-top:.5rem;}
  .split-leg i{width:10px;height:10px;border-radius:3px;display:inline-block;margin-right:.35rem;vertical-align:-1px;}
  .split-leg b{color:var(--text-primary);}
  .fd-link{color:var(--blue);font-weight:inherit;text-decoration:none;}
  .purp-row.locked-row{opacity:.55;}
  .fd-link:hover{text-decoration:underline;text-underline-offset:3px;}
  @media(max-width:640px){
    .fp-over{position:static;background:none;padding:.8rem 0 0;}
    .fp-blur{max-height:120px;overflow:hidden;}
  }

/* ---------------------------------------------------------------- who funds it: the walkthrough */
  .wt-h{font-size:clamp(1.6rem,1.5vw + 1rem,2.125rem);line-height:1.15;color:var(--text-primary);max-width:32ch;}
  .wt-status{margin-top:1rem;font-size:.9375rem;color:var(--text-muted-strong);display:flex;align-items:center;gap:.5rem;}
  .wt-cue{margin-top:.6rem;display:flex;align-items:center;gap:.5rem;font-size:1rem;line-height:1.45;font-weight:500;
    color:var(--text-muted-strong);}
  .wt-cue svg{flex:none;width:18px;height:18px;}

  /* The stepper: three equal segments in one bar. Each says in words whether
     it is done, current or next (and a done step shows a tick), and a thin
     bar under them fills by thirds. */
  .wt-steps{margin-top:1rem;}
  .wt-seg{margin:0;padding:4px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;
    background:var(--blue-xlight);border:1px solid var(--line);border-radius:14px;}
  .wt-seg li{min-width:0;display:flex;}
  .wt-step{flex:1;min-width:0;min-height:58px;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;
    column-gap:10px;padding:8px 12px;border-radius:10px;background:transparent;text-align:left;color:var(--text-primary);
    transition:background .25s ease,box-shadow .25s ease;}
  .wt-step:hover{background:rgba(255,255,255,.75);}
  .wt-dot{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#fff;
    border:1.5px solid var(--line-strong);color:var(--text-muted-strong);font-weight:700;font-size:.8125rem;}
  .wt-check{display:none;}
  .wt-step-tx{min-width:0;display:grid;line-height:1.3;}
  .wt-step-tx b{font-size:.9375rem;font-weight:650;}
  .wt-step-sub{font-size:.8125rem;color:var(--text-muted-strong);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .wt-tag{font-style:normal;font-size:.75rem;font-weight:700;line-height:18px;color:var(--text-muted-strong);
    white-space:nowrap;padding:1px 8px;border-radius:99px;}
  .wt-step.is-cur{background:#fff;box-shadow:var(--shadow-card);}
  .wt-step.is-cur .wt-dot{background:var(--blue);border-color:var(--blue);color:#fff;}
  .wt-step.is-cur .wt-tag{background:var(--blue-light);color:var(--blue-mid);}
  .wt-step.is-next .wt-dot{background:var(--gold);border-color:var(--gold);color:var(--blue-dark);}
  .wt-step.is-next .wt-tag{background:var(--gold-light);color:var(--gold-text);}
  .wt-step.is-done .wt-dot{background:var(--blue-dark);border-color:var(--blue-dark);color:#fff;}
  .wt-step.is-done .wt-dot-n{display:none;}
  .wt-step.is-done .wt-check{display:block;}
  .wt-step.is-done .wt-tag{color:var(--blue-mid);}
  .wt-step.is-todo .wt-tag{box-shadow:inset 0 0 0 1px var(--line-strong);}
  .wt-prog{height:3px;margin:8px 8px 0;border-radius:99px;background:var(--line);overflow:hidden;}
  .wt-prog span{display:block;height:100%;width:33.33%;background:var(--blue);border-radius:99px;transition:width .4s ease;}
  @keyframes wtNudge{0%,100%{box-shadow:0 0 0 0 rgba(240,172,26,.6)}50%{box-shadow:0 0 0 7px rgba(240,172,26,0)}}
  @media screen and (max-width:760px){
    .wt-seg{padding:3px;gap:3px;}
    .wt-step{display:flex;flex-direction:column;align-items:flex-start;gap:5px;padding:8px;min-height:0;}
    .wt-dot{width:24px;height:24px;}
    .wt-step-sub{display:none;}
    .wt-step-tx b{font-size:.875rem;line-height:1.25;}
  }

  .wt-body{margin-top:1.5rem;display:flex;flex-wrap:wrap;gap:20px 48px;align-items:flex-start;}
  .wt-story{flex:999 1 520px;min-width:0;}
  .wt-say h3{font-size:clamp(1.25rem,.8vw + 1rem,1.5rem);line-height:1.25;font-weight:650;color:var(--text-primary);}
  .wt-say p{margin-top:.6rem;font-size:1.0625rem;line-height:1.65;max-width:62ch;color:var(--text-body);}
  /* The two tallies: the same card twice, so they read as a pair. "What we
     know" turns navy once the outer ring is showing. */
  .wt-tally{flex:1 1 360px;min-width:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:stretch;}
  .wt-t{display:flex;flex-direction:column;min-width:0;min-height:160px;padding:16px;border-radius:14px;
    background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-card);transition:background .35s ease,border-color .35s ease;}
  .wt-t .k{display:flex;align-items:center;gap:7px;font-size:.8125rem;font-weight:700;line-height:1.4;color:var(--text-primary);margin:0;}
  .wt-t-sw{flex:none;width:9px;height:9px;border-radius:50%;background:var(--blue);}
  .wt-t-we .wt-t-sw{background:var(--gold);}
  .wt-t .v{margin:10px 0 0;font-family:var(--font-display);font-size:1.875rem;line-height:1.1;font-weight:600;
    color:var(--text-primary);font-variant-numeric:tabular-nums lining-nums;}
  .wt-t .s{margin:6px 0 0;font-size:.8125rem;line-height:1.45;color:var(--text-muted-strong);}
  .wt-t-we .v{color:var(--text-muted-strong);}
  .wt-live .wt-t-we{background:var(--blue-dark);border-color:var(--blue-dark);}
  .wt-live .wt-t-we .k,.wt-live .wt-t-we .v{color:#fff;}
  .wt-live .wt-t-we .s{color:#DDE1EC;}

  .wt-legend{margin-top:1.25rem;display:flex;flex-wrap:wrap;gap:8px 20px;font-size:.8125rem;color:var(--text-body);
    padding:10px 14px;border:1px solid var(--line);border-radius:10px;background:#fff;}
  .wt-legend span{display:inline-flex;align-items:center;gap:7px;}
  .wt-sw{display:inline-block;flex:none;width:18px;height:12px;border-radius:3px;}
  .wt-sw-tgt{background:var(--blue-dark);}
  .wt-sw-donor{background:var(--blue);}
  .wt-sw-up{background:#fff;border:1px solid var(--line-strong);box-shadow:inset 4px 0 0 var(--gold);}
  .wt-sw-peer{background:#fff;border:1.5px solid var(--line-strong);}
  .wt-sw-lock{background:#fff;border:1.5px dashed #9AA6D9;}
  .wt-lg-ar svg{color:var(--blue);}

  /* The network: a fixed 1080 x 600 canvas, scrolled sideways when narrower.
     Two rings, as in the approved design: the inner one holds the two donors
     and the organization, the outer one the upstream and cross-stream cards. */
  .wt-scroll{margin-top:12px;overflow-x:auto;padding-bottom:8px;}
  .wt-canvas{position:relative;width:1080px;height:600px;margin:0 auto;}
  .wt-ring{position:absolute;border:2px dashed;border-radius:50%;transition:all .7s ease;}
  .wt-ring-we{left:8px;top:12px;width:1064px;height:576px;border-color:var(--line-strong);opacity:.7;}
  .wt-ring-you{left:264px;top:150px;width:552px;height:400px;border-color:var(--blue);background:rgba(238,241,252,.6);}
  .wt-live .wt-ring-we{border-color:#9AA6D9;background:rgba(245,247,255,.7);opacity:1;}
  .wt-badge{position:absolute;height:24px;display:flex;align-items:center;justify-content:center;
    color:#fff;border-radius:12px;font-size:12px;font-weight:600;transition:background .5s ease;}
  .wt-badge-you{left:480px;top:132px;width:120px;background:var(--blue);}
  .wt-badge-we{left:475px;top:0;width:130px;background:var(--text-muted-strong);}
  .wt-live .wt-badge-we{background:var(--blue-dark);}
  .wt-edges{position:absolute;left:0;top:0;overflow:visible;fill:none;}
  .wt-e path{stroke-width:2;stroke-linecap:round;transition:stroke-width .3s ease;}
  .wt-e.fresh path{stroke-width:3;}
  .wt-e.wt-mask path{stroke-dasharray:5 5;}
  .wt-up path{stroke:var(--blue);}                  #wt-ah-up path{fill:var(--blue);}
  .wt-cross path{stroke:var(--text-muted-strong);}  #wt-ah-cross path{fill:var(--text-muted-strong);}

  /* Cards: names 14px semibold (17px at the centre), everything else 12px. */
  .wt-n{position:absolute;width:240px;height:96px;border-radius:12px;display:flex;align-items:center;
    gap:10px;padding:10px 14px;font-size:12px;line-height:16px;text-align:left;}
  .wt-n svg{flex:none;}
  .wt-card{display:flex;flex-direction:column;gap:2px;min-width:0;}
  .wt-nm{font-size:14px;line-height:18px;font-weight:600;letter-spacing:0;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
  .wt-nm a{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:2px;
    text-decoration-color:rgba(255,255,255,.55);}
  .wt-id,.wt-fin{font-size:12px;line-height:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .wt-target{background:var(--blue-dark);color:#fff;justify-content:center;text-align:center;padding:12px 18px;
    box-shadow:0 10px 28px rgba(13,27,75,.3);}
  .wt-target .wt-card{align-items:center;}
  .wt-target .wt-nm{font-size:17px;line-height:22px;}
  .wt-target .wt-id,.wt-target .wt-fin{color:#DDE1EC;}
  .wt-donor{background:var(--blue);color:#fff;box-shadow:0 4px 14px rgba(59,82,212,.25);}
  .wt-donor .wt-id,.wt-donor .wt-fin{color:var(--blue-light);}       /* 5.6:1 on blue */
  .wt-dprospect{background:#fff;color:var(--blue-dark);border:1px solid var(--line-strong);
    border-left:4px solid var(--gold);box-shadow:var(--shadow-card);}
  .wt-neighbor{background:#fff;color:var(--blue-dark);border:1.5px solid var(--line-strong);box-shadow:var(--shadow-card);}
  .wt-dprospect .wt-nm a,.wt-neighbor .wt-nm a{text-decoration-color:rgba(13,27,75,.35);}
  .wt-dprospect :is(.wt-id,.wt-fin),.wt-neighbor :is(.wt-id,.wt-fin){color:var(--text-muted-strong);}

  /* Ghost cards: a slot the free Explorer (or a free account) does not name.
     Dashed, with what it stands for, two blurred bars where a name would be,
     and a pill that says where it is named. Empty slots say why, plainly. */
  .wt-n.wt-ghost{background:rgba(255,255,255,.94);color:var(--blue-dark);border:1.5px dashed #9AA6D9;box-shadow:none;}
  .wt-n.wt-empty{background:rgba(255,255,255,.8);border-color:var(--line-strong);}
  .wt-ghost .wt-lk{color:var(--text-muted-strong);}
  .wt-tz{font-size:14px;line-height:18px;font-weight:600;}
  .wt-sub{font-size:12px;line-height:16px;color:var(--text-muted-strong);}
  .wt-bars{display:grid;gap:5px;margin:4px 0 1px;}
  .wt-bars i{display:block;height:7px;border-radius:4px;background:linear-gradient(90deg,#C9D1F5,#E3E7F3);filter:blur(1.2px);}
  .wt-bars i:first-child{width:128px;} .wt-bars i:last-child{width:80px;}
  .wt-pill-lk{align-self:flex-start;margin-top:4px;display:inline-flex;align-items:center;height:20px;padding:0 8px;
    border-radius:99px;font-size:12px;font-weight:700;line-height:1;}
  .wt-pill-free{background:var(--gold);color:var(--blue-dark);}          /* 8.3:1 */
  .wt-pill-report{background:var(--blue-dark);color:#fff;}
  a.wt-go{text-decoration:none;cursor:pointer;transition:border-color .2s ease,box-shadow .2s ease;}
  a.wt-go:hover{border-color:var(--blue);box-shadow:var(--shadow-card);}
  a.wt-go:hover .wt-tz,a.wt-go:focus-visible .wt-tz{text-decoration:underline;text-underline-offset:2px;}
  a.wt-go:focus-visible{outline:3px solid var(--blue);outline-offset:3px;}

  /* An amount and its own years ("$40.0K, 2022–2024"), centred on its arrow. */
  .wt-amt{position:absolute;min-width:88px;height:22px;padding:0 9px;transform:translateX(-50%);
    display:flex;align-items:center;justify-content:center;gap:4px;background:#fff;border:1px solid var(--line-strong);
    border-radius:11px;font-size:12px;color:var(--blue-dark);font-weight:600;white-space:nowrap;
    font-variant-numeric:tabular-nums;box-shadow:0 1px 2px rgba(13,27,75,.06);}

  /* Layers fade in step by step; the newest is ringed in gold. */
  .wt-n,.wt-e,.wt-amt{opacity:0;}
  /* The graph opens still; fades and motion only follow a step the visitor picks. */
  .wt-moving :is(.wt-n,.wt-e,.wt-amt){transition:opacity .55s ease,box-shadow .3s ease;}
  /* Under the graph: how many prospects and peers the named pairs stand for. */
  .wt-more{position:absolute;left:50%;bottom:6px;transform:translateX(-50%);margin:0;white-space:nowrap;
    padding:5px 14px;border-radius:99px;background:var(--blue-dark);color:#fff;font-size:.8125rem;font-weight:600;
    opacity:0;transition:opacity .55s ease;}
  .wt-more.on{opacity:1;}
  .wt-n.on,.wt-e.on,.wt-amt.on{opacity:1;}
  .wt-n.fresh{box-shadow:0 0 0 3px rgba(240,172,26,.75);}
  .wt-n:not(.on){visibility:hidden;}
  .wt-moving .wt-n:not(.on){transition:opacity .55s ease,visibility 0s linear .55s;}

  /* Masked figures for an anonymous visitor: a real amount, hidden. Muted,
     with a small lock, so it never reads as a number. */
  .wt-amt-mask{color:var(--text-muted-strong);font-weight:600;letter-spacing:.06em;border-style:dashed;background:var(--blue-xlight);}
  .wt-amt-mask svg{flex:none;}
  .wt-masked{display:inline-flex;align-items:center;gap:6px;letter-spacing:.04em;}
  .wt-masked svg{width:18px;height:18px;flex:none;opacity:.85;}
  .wt-tease path{stroke-opacity:.7;}

  /* Phones: the 1080px canvas showed only a slice, cutting off both donor cards.
     Here the cards stack in a two-column grid that reads outward from the
     organization, in the order the steps add them: the organization, its
     donors, the funders of those donors, then its peers and their funders.
     Each amount sits between giver (below) and receiver (above) with an up
     arrow; rings and drawn arrows are left out, and the legend swaps its arrow
     key for that rule. The ring labels become section labels, so "What you
     know" and "What we know" still say which cards are free and which are
     locked; ::after labels the cross-stream rows. A layer that is not on yet
     takes no room, so steps 1 and 2 leave no gap. data-k names a card's slot
     and data-e the giver of an amount. */
  .wt-legend .wt-lg-up{display:none;}
  @media screen and (max-width:760px){
    .wt-legend .wt-lg-ar{display:none;}
    .wt-legend .wt-lg-up{display:inline-flex;}
    .wt-lg-up b{color:var(--blue);font-size:15px;}
    .wt-scroll{overflow:visible;}
    .wt-canvas{width:auto;height:auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
      gap:8px 10px;align-items:start;}
    .wt-ring,.wt-edges{display:none;}
    .wt-badge,.wt-canvas::after{position:static;justify-self:start;width:auto;padding:0 12px;margin-top:6px;}
    .wt-badge-you{grid-row:1;grid-column:1 / -1;}
    .wt-badge-we{grid-row:5;grid-column:1 / -1;}
    .wt-canvas::after{content:"What we know";grid-row:8;grid-column:1 / -1;height:24px;display:flex;align-items:center;
      color:#fff;border-radius:12px;font-size:12px;font-weight:600;background:var(--text-muted-strong);}
    .wt-live .wt-canvas::after{background:var(--blue-dark);}
    .wt-n{position:static;width:auto!important;height:auto!important;min-height:88px;padding:10px 12px;align-items:flex-start;}
    .wt-n.wt-target{align-items:center;}
    .wt-n.wt-ghost .wt-lk{display:none;}
    .wt-id,.wt-fin{white-space:normal;}
    .wt-nm{-webkit-line-clamp:3;}
    .wt-bars i:first-child{width:100%;} .wt-bars i:last-child{width:62%;}
    .wt-amt{position:static;transform:none;justify-self:center;max-width:100%;}
    .wt-amt::before{content:"\2191";margin-right:2px;font-weight:700;}
    .wt-n[data-k=u1],.wt-n[data-k=d1],.wt-n[data-k=pf1],.wt-n[data-k=p1],
    .wt-amt[data-e=u1],.wt-amt[data-e=d1],.wt-amt[data-e=pf1]{grid-column:1;}
    .wt-n[data-k=u2],.wt-n[data-k=d2],.wt-n[data-k=pf2],.wt-n[data-k=p2],
    .wt-amt[data-e=u2],.wt-amt[data-e=d2],.wt-amt[data-e=pf2]{grid-column:2;}
    .wt-n[data-k=tgt]{grid-row:2;grid-column:1 / -1;}
    .wt-amt[data-e^=d]{grid-row:3;}  .wt-n[data-k^=d]{grid-row:4;}
    .wt-amt[data-e^=u]{grid-row:6;}  .wt-n[data-k^=u]{grid-row:7;}
    .wt-n[data-k=p1],.wt-n[data-k=p2]{grid-row:9;}
    .wt-amt[data-e^=pf]{grid-row:10;} .wt-n[data-k^=pf]{grid-row:11;}
    .wt-more{position:static;grid-row:12;grid-column:1 / -1;justify-self:center;transform:none;
      white-space:normal;text-align:center;}
    .wt-n:not(.on),.wt-amt:not(.on),.wt-more:not(.on){display:none;}
    .wt-canvas:not(:has([data-layer="2"].on)) .wt-badge-we,
    .wt-canvas:not(:has([data-layer="3"].on))::after{display:none;}
  }

  /* The live graph. Money dots ride each arrow that has a real amount, then
     fade out a few seconds after their layer turns on; the pulses and the
     marching dashes run two or three times and stop (WCAG 2.2.2). All of it
     sits behind no-preference, so reduced motion and print get the still graph. */
  .wt-flow{display:none;}
  .wt-flow circle{fill:var(--gold);stroke:#fff;stroke-width:1;}
  @media (prefers-reduced-motion:no-preference){
    .wt-moving .wt-step.is-next .wt-dot{animation:wtNudge 1.8s ease-in-out 3;}
    /* An arrow draws in from its giver when its layer turns on. No fill mode,
       so a dashed arrow returns to its dashes when the drawing ends. */
    .wt-moving .wt-e.on path{animation:wt-draw .7s ease-out;}
    @keyframes wt-draw{from{stroke-dasharray:var(--len);stroke-dashoffset:var(--len);}
      to{stroke-dasharray:var(--len);stroke-dashoffset:0;}}
    /* A masked arrow: the dashes march toward the receiver, twice. */
    .wt-moving .wt-e.wt-tease.on path{animation:wt-draw .7s ease-out,wt-march 1.8s linear .7s 2;}
    @keyframes wt-march{from{stroke-dashoffset:10px;}to{stroke-dashoffset:0;}}
    /* Then the money moves for a few seconds, and the layer's cards arrive in turn. */
    .wt-moving .wt-e.on .wt-flow{display:inline;animation:wt-fade .4s ease-out .7s both,wt-rest .6s ease-in 4.2s forwards;}
    .wt-moving .wt-n.on:not(.wt-target){animation:wt-pop .45s ease-out both;animation-delay:calc(.6s + var(--i,0) * .15s);}
    .wt-moving .wt-amt.on{animation:wt-fade .4s ease-out .55s both;}
    @keyframes wt-fade{from{opacity:0;}to{opacity:1;}}
    @keyframes wt-rest{from{opacity:1;}to{opacity:0;}}
    @keyframes wt-pop{from{opacity:0;transform:scale(.94);}to{opacity:1;transform:scale(1);}}
    /* The organization pulses gently as the giving arrives, twice. */
    .wt-moving .wt-target.wt-recv{animation:wt-recv 2.4s ease-in-out .7s 2;}
    @keyframes wt-recv{0%,100%{box-shadow:0 10px 28px rgba(13,27,75,.3),0 0 0 0 rgba(240,172,26,0);}
      50%{box-shadow:0 10px 28px rgba(13,27,75,.3),0 0 0 6px rgba(240,172,26,.3);}}
  }

  .wt-nav{margin:16px 0 0;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;}
  .wt-prev{min-height:48px;padding:0 22px;border:1px solid var(--line-strong);border-radius:10px;
    background:#fff;color:var(--blue-dark);font-size:1rem;font-weight:600;}
  .wt-prev:hover:not(:disabled){border-color:var(--blue);color:var(--blue);}
  .wt-prev:disabled{opacity:.6;cursor:default;}
  .wt-count{margin:0;font-size:.875rem;color:var(--text-muted-strong);}
  .wt-next{min-height:48px;padding:0 26px;border-radius:10px;background:var(--blue);color:#fff;
    font-size:1rem;font-weight:700;}
  .wt-next:hover{background:var(--blue-mid);}
  .wt-book{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 26px;border-radius:10px;
    background:var(--gold);color:var(--blue-dark);font-size:1rem;font-weight:700;}
  .wt-book:hover{background:#E09E0F;}
  .wt-book-wrap{display:flex;flex-direction:column;align-items:flex-end;gap:.35rem;text-align:right;}
  .wt-foot{margin:12px 0 0;font-size:.8125rem;color:var(--text-muted-strong);}
  /* Phones: the step count on top, Previous and Next side by side below it. */
  @media screen and (max-width:760px){
    .wt-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
    .wt-count{grid-column:1 / -1;grid-row:1;text-align:center;}
    .wt-prev,.wt-next,.wt-book{width:100%;padding:0 10px;font-size:.9375rem;}
    .wt-book-wrap{align-items:stretch;text-align:left;}
  }

  /* ---- under the tabs: the request band ---- */
  .wt-demo{margin-top:var(--space-section);background:var(--blue-dark);color:#fff;}
  .wt-demo-in{padding-top:clamp(48px,6vw,80px);padding-bottom:clamp(48px,6vw,80px);display:flex;flex-wrap:wrap;
    gap:32px 64px;align-items:center;}
  .wt-demo-copy{flex:1 1 420px;min-width:0;}
  .wt-demo-copy h2{color:#fff;font-size:clamp(1.75rem,1.6vw + 1rem,2.4rem);line-height:1.15;}
  .wt-demo-copy p{margin-top:14px;font-size:1.0625rem;line-height:1.6;color:#DDE1EC;max-width:560px;}
  .wt-demo-copy .wt-demo-lede{font-weight:600;color:#fff;}
  .wt-perks{margin:14px 0 0;padding:0;display:grid;gap:12px;}
  .wt-perks li{display:flex;gap:12px;align-items:flex-start;font-size:1rem;line-height:1.5;color:#E6EAFB;}
  .wt-perks .wt-ck{flex:none;margin-top:1px;width:22px;height:22px;padding:3px;border-radius:50%;
    background:var(--gold);color:var(--blue-dark);}
  .wt-perks b{color:#fff;font-weight:700;}
  .wt-demo-card{flex:1 1 380px;min-width:0;background:#fff;color:var(--text-body);border-radius:var(--radius-lg);
    padding:28px;box-shadow:var(--shadow-float);}
  .wt-demo-k{font-family:var(--font-display);font-size:1.375rem;font-weight:600;line-height:1.25;color:var(--text-primary);margin:0 0 14px;}
  .wt-perks-call{margin:0 0 18px;}
  .wt-perks-call li{color:var(--text-body);font-size:.975rem;}
  .wt-perks-call .wt-ck{background:var(--blue-xlight);color:var(--blue);border:1px solid var(--line);}
  .wt-demo-card label{display:block;font-size:.875rem;font-weight:600;color:var(--text-primary);}
  .wt-demo-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px;}
  .wt-demo-row input{flex:1 1 220px;min-width:0;min-height:48px;padding:0 14px;font-size:1rem;
    color:var(--text-primary);border:1.5px solid var(--ex-field);border-radius:10px;background:#fff;}
  .wt-demo-row input::placeholder{color:var(--text-muted-strong);}
  .wt-demo-row input[aria-invalid="true"]{border-color:#991B1B;}
  .wt-demo-row button{flex:none;min-height:48px;padding:0 24px;border-radius:10px;background:var(--gold);
    color:var(--blue-dark);font-size:1rem;font-weight:700;}
  .wt-demo-row button:hover{background:#E09E0F;}
  .wt-demo-row button:disabled{opacity:.7;cursor:default;}
  .wt-demo-book{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 24px;border-radius:10px;
    background:var(--gold);color:var(--blue-dark);font-size:1rem;font-weight:700;text-decoration:none;}
  .wt-demo-book:hover{background:#E09E0F;}
  /* The booking pop-up and its FAQ are in styles.css, shared with every page. */
  .wt-demo-err{margin-top:10px;font-size:.875rem;color:#991B1B;}
  .wt-demo-call{margin-top:12px;font-size:.9375rem;line-height:1.5;color:var(--text-primary);}
  .wt-demo-note{margin-top:12px;font-size:.8125rem;line-height:19px;color:var(--text-muted-strong);}
  .wt-demo-ok{font-size:1.25rem;line-height:1.4;font-weight:700;color:var(--text-primary);}
  #demoDoneMsg{margin-top:8px;font-size:.95rem;line-height:1.55;}
  @media(max-width:560px){ .wt-demo-row button,.wt-demo-book{width:100%;} .wt-demo-card{padding:22px 20px;} }

  /* ---- phones: a slim bar with the one call to action ---- */
  /* Shown by the page script once the header has scrolled away, hidden while
     the request band is on screen, and never over the consent bar. The page
     gains bottom padding while it shows, so the last content is never covered. */
  .ip-mbar{display:none;}
  @media screen and (max-width:760px){
    .ip-mbar{position:fixed;left:0;right:0;bottom:0;z-index:2400;display:flex;align-items:center;gap:8px;
      padding:10px 12px calc(10px + env(safe-area-inset-bottom,0px)) 16px;background:#fff;
      border-top:1px solid var(--line);box-shadow:0 -8px 24px rgba(13,27,75,.1);}
    .ip-mbar-cta{flex:1;display:inline-flex;align-items:center;justify-content:center;min-height:48px;border-radius:10px;
      background:var(--gold);color:var(--blue-dark);font-weight:700;font-size:1rem;}
    .ip-mbar-x{flex:none;width:44px;height:44px;display:grid;place-items:center;border-radius:10px;color:var(--text-muted-strong);}
    .ip-mbar-x:hover{background:var(--blue-xlight);color:var(--blue-dark);}
    body.has-mbar{padding-bottom:calc(68px + env(safe-area-inset-bottom,0px));}
    body:has(.consent-bar) .ip-mbar{display:none !important;}
    body.has-mbar:has(.consent-bar){padding-bottom:0;}
  }
  @media (prefers-reduced-motion:reduce){
    .wt-step,.wt-step.is-next .wt-dot,.wt-t,.wt-ring,.wt-badge,.wt-n,.wt-n.on,.wt-target.wt-recv,.wt-e,.wt-e path,
    .wt-e.on path,.wt-e.wt-tease.on path,.wt-amt,.wt-amt.on,.wt-prog span,.ip-search .go,.rep-print{transition:none;animation:none;}
  }

/* ---------------------------------------------------------------- print
   A printed profile is a document, not a screenshot: every tab is laid out in
   sequence, every disclosure is open, and nothing that only makes sense on a
   screen survives. body.printing is set by the Print button just before the
   dialog opens, so the same rules apply to Save as PDF. */
@media print {
  .navbar, .footer, .ip-tabs, .rep-actions, .rep-crumb, #hero, #dims, #loading,
  .ip-cta, .ip-cta-line, .ip-locked, .dim-link, .uc-band,
  .chart-note + .sk-wrap, .fp-more, #levels, #again, .ip-mbar,
  .wt-steps, .wt-nav, .wt-gate, .wt-cue, .wt-demo, .wt-flow { display: none !important; }
  /* Its own rule: a browser without :has() would drop the whole list above. */
  .chart-wrap:has(.fp-lock) { display: none !important; }

  .tab-panel { display: block !important; padding-top: 0; }

  /* The network prints whole, as on a wide screen (30 Oct feedback #15). A page is
     about 700px wide, under the 760px where screens switch to the phone card grid, so
     every phone rule in this file is screen-only. explorer-page.js shows the full
     network and every step's words before printing. The 1080px canvas is scaled to
     the page, whatever zoom wtFit() set for the screen, and never split across pages. */
  .wt-scroll { overflow: visible !important; }
  .wt-canvas { zoom: .62 !important; }
  .wt-scroll, .wt-legend, .wt-tally { break-inside: avoid; page-break-inside: avoid; }
  .wt-legend { break-after: avoid; page-break-after: avoid; }
  /* One column in reading order: every step's words, then the network with its key
     and tallies, then the donors and the peers. Printed as on screen, the donor list
     came first and the network jumped to the next page, leaving one mostly blank. */
  .wt-split .wt-grid { display: flex; flex-direction: column; gap: 16px; }
  .wt-split .wt-side-top, .wt-split .wt-side-bot, .wt-split .wt-graph { display: contents; }
  .wt-split .wt-story { order: 1; } .wt-split .wt-legend { order: 2; } .wt-split .wt-scroll { order: 3; }
  .wt-split .wt-tally { order: 4; } .wt-split .wt-list-wrap { order: 5; } .wt-split .wt-peers-wide { order: 6; }
  .wt-split :is(.wt-story, .wt-legend, .wt-scroll, .wt-tally, .wt-list-wrap, .wt-peers-wide) { flex: none; }
  .wt-screen-only, .wt-unlock, .signup-alt, .setup-strip, .fb-tab, .aprize-preview-badge,
  .wt-peers-act, .wt-pill button { display: none !important; }
  /* At .62 the screen's 13.5px card text would print near 6pt; these print near 7-8pt
     and still fit the 96px cards. */
  .wt-canvas .wt-nm, .wt-canvas .wt-tz { font-size: 18px; line-height: 21px; }
  .wt-canvas .wt-id, .wt-canvas .wt-fin, .wt-canvas .wt-sub { font-size: 15.5px; line-height: 19px; }
  .wt-canvas .wt-target .wt-nm { font-size: 21px; line-height: 25px; }
  .wt-canvas .wt-amt, .wt-canvas .wt-badge { font-size: 15px; }
  /* Every step's words print, one after another. */
  .wt-say + .wt-say { margin-top: 18px; }
  .tab-panel + .tab-panel { break-before: page; page-break-before: always; }
  .dim-more { display: block !important; }

  .dim-card, .mcard, .chart-wrap, .kf, .trend-band, .nf, .kt, .kpis,
  .stat, .sec-hdr { break-inside: avoid; page-break-inside: avoid; }
  .sec-hdr { break-after: avoid; page-break-after: avoid; }

  body { background: #fff; }
  .rep-hd { border-top: 0; background: #fff; }
  body.has-mbar { padding-bottom: 0; }
  .stats-strip { break-inside: avoid; }
  a { text-decoration: none; color: inherit; }
  @page { margin: 14mm; }
}

  /* Peers under the cross-stream step (signed in): whose list, and the editor. */
  .wt-peers{margin-top:14px;padding:12px 14px;border:1px solid var(--gray-200);border-radius:10px;background:var(--blue-xlight);}
  .wt-peers-h{font-size:.9rem;line-height:1.5;margin:0;}
  .wt-peers-h span{color:var(--text-muted);}
  .wt-peers-list{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 0;}
  /* Full width under the step text; the pills sit on one line and scroll sideways. */
  .wt-peers-wide{margin-top:4px;}
  .wt-pills{list-style:none;margin:10px 0 0;padding:2px 0 8px;display:flex;flex-wrap:nowrap;gap:8px;
    overflow-x:auto;scrollbar-width:thin;
    -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 32px),transparent);
            mask-image:linear-gradient(90deg,#000 calc(100% - 32px),transparent);}
  .wt-pill{flex:none;display:inline-flex;align-items:center;gap:2px;white-space:nowrap;
    padding:5px 4px 5px 12px;border:1px solid var(--blue-light);border-radius:99px;background:#fff;
    font-size:.82rem;font-weight:600;color:var(--text-primary);transition:opacity .2s ease;}
  .wt-pill button{width:24px;height:24px;border:0;border-radius:99px;background:none;cursor:pointer;
    font-size:1rem;line-height:1;color:var(--text-muted);}
  .wt-pill button:hover,.wt-pill button:focus-visible{background:var(--blue-light);color:var(--blue);}
  .wt-pill.is-going{opacity:.4;pointer-events:none;}
  .wt-peers-act{margin:10px 0 0;display:flex;gap:14px;flex-wrap:wrap;}

/* ---------------------------------------------------------------- the network beside its panel
   Matthew, 27 Oct 2026: the concept's right-hand panel (steps as tabs, the donor list,
   the free-account box) beside the current network. Wide screens put the network on the
   left and the panel on the right. The whole Explorer page is 1400px wide there, so the
   logo, tabs, heading, legend and network share one left edge and the network stays
   readable (explorer-page.js wtFit() scales it to its column, never below 72%). Narrower
   screens stack them: steps and list, then the network, then the tallies and next step. */
  .wt-split .wt-h{max-width:none;}
  .wt-grid{margin-top:1.25rem;display:grid;grid-template-columns:minmax(0,1fr);gap:16px;}
  .wt-graph .wt-legend{margin-top:0;}
  .wt-graph .wt-scroll{margin-top:10px;}
  .wt-graph .wt-tally{margin-top:12px;}
  @media (min-width:1280px){
    :root{--max-w:1400px;}
    .wt-grid{grid-template-columns:minmax(0,1fr) 400px;grid-template-rows:auto 1fr;grid-template-areas:"graph top" "graph bot";
      column-gap:32px;row-gap:0;align-items:start;}
    .wt-side-top{grid-area:top;}
    /* the network stays in view while the panel beside it scrolls (the Feedback tab keeps its edge) */
    .wt-graph{grid-area:graph;position:sticky;top:calc(var(--ex-nav-h,72px) + 64px);}
    .wt-side-bot{grid-area:bot;}
    .wt-side{background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-card);padding:16px 18px;}
    .wt-side-top{border-radius:16px 16px 0 0;border-bottom:none;padding-bottom:4px;}
    .wt-side-bot{border-radius:0 0 16px 16px;border-top:none;padding-top:12px;}
  }

  /* Steps as tabs: number and name, then what a signed-out visitor needs for it. */
  .wt-split .wt-steps{margin-top:0;}
  .wt-split .wt-seg{padding:4px;gap:4px;}
  .wt-split .wt-step{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;
    gap:2px;min-height:56px;padding:8px 6px;}
  .wt-split .wt-step-tx{justify-items:center;line-height:1.25;}
  .wt-split .wt-step-tx b{display:inline-flex;align-items:center;gap:4px;font-size:.875rem;font-weight:700;}
  .wt-split .wt-step-sub{font-size:.75rem;white-space:normal;}
  .wt-split .wt-step .wt-check{display:none;width:12px;height:12px;}
  .wt-split .wt-step.is-done .wt-check{display:inline-block;}
  .wt-split .wt-step.is-cur{background:var(--blue-dark);box-shadow:none;}
  .wt-split .wt-step.is-cur .wt-step-tx b,.wt-split .wt-step.is-cur .wt-step-sub{color:#fff;}
  .wt-split .wt-step.is-cur:focus-visible{outline-color:var(--gold);}
  @media screen and (max-width:760px){ .wt-split .wt-step{align-items:center;} .wt-split .wt-step-sub{display:block;} }

  .wt-split .wt-story{margin-top:16px;}
  .wt-split .wt-say h3{font-size:1.375rem;line-height:1.25;}
  .wt-split .wt-say p{font-size:.9375rem;line-height:1.55;}

  /* Step 1's donor list */
  .wt-list{list-style:none;margin:14px 0 6px;padding:0;border:1px solid var(--line);border-radius:12px;overflow:hidden;}
  .wt-li{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:11px 14px;border-top:1px solid var(--line);}
  .wt-li:first-child{border-top:none;}
  .wt-li-tx{display:grid;gap:2px;min-width:0;}
  .wt-li-tx b{font-size:.9375rem;line-height:1.3;font-weight:600;color:var(--blue-dark);overflow-wrap:anywhere;}
  .wt-li-tx b a{color:inherit;text-decoration:underline;text-decoration-color:rgba(13,27,75,.3);text-underline-offset:2px;}
  .wt-li-tx b a:hover{text-decoration-color:currentColor;}
  .wt-li-tx span{font-size:.8125rem;color:var(--text-muted-strong);}
  .wt-li-amt{flex:none;font-weight:700;color:var(--blue-dark);font-variant-numeric:tabular-nums;}
  .wt-li-more{background:var(--blue-xlight);}
  .wt-li-more .wt-li-tx > span:last-child{color:var(--text-body);font-weight:500;}
  .wt-li-blur{filter:blur(5px);user-select:none;color:var(--blue-dark);font-weight:600;}

  /* Tallies under the network; the next step in the panel */
  .wt-split .wt-tally{gap:10px;}
  .wt-split .wt-t{min-height:0;padding:12px 14px;}
  .wt-split .wt-t .v{font-size:1.5rem;}
  .wt-split .wt-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
  .wt-split .wt-count{grid-column:1 / -1;grid-row:1;text-align:center;}
  .wt-split .wt-prev,.wt-split .wt-next,.wt-split .wt-book{width:100%;padding:0 10px;font-size:.9375rem;}
  .wt-split .wt-book-wrap{grid-column:1 / -1;align-items:stretch;text-align:center;}
  .wt-split .wt-peers-wide{margin-top:14px;}

  /* Signed out: the free-account box */
  .wt-unlock{margin-top:16px;padding:18px;border-radius:14px;background:var(--blue-dark);color:#fff;}
  .wt-unlock h3{margin:0;color:#fff;font-size:1.125rem;line-height:1.3;}
  .wt-unlock .wt-perks{margin:12px 0 14px;gap:8px;}
  .wt-unlock .wt-perks li{font-size:.9rem;line-height:1.4;gap:8px;}
  .wt-unlock .wt-perks .wt-ck{width:18px;height:18px;padding:2px;}
  .wt-unlock-form label{display:block;margin:0 0 6px;font-size:.8125rem;font-weight:600;color:#C9D1F5;}
  .wt-unlock-row{display:flex;gap:6px;padding:5px;border-radius:10px;background:#fff;}
  .wt-unlock-row:has(input:focus-visible){outline:3px solid var(--gold);outline-offset:2px;}
  .wt-unlock-row input{flex:1;min-width:0;border:0;outline:0;padding:8px 10px;font:inherit;font-size:.9375rem;
    color:var(--blue-dark);background:transparent;}
  .wt-unlock-row input::placeholder{color:var(--text-muted-strong);}
  .wt-unlock-row button{flex:none;min-height:44px;padding:0 14px;border:0;border-radius:8px;background:var(--gold);
    color:var(--blue-dark);font:inherit;font-size:.9375rem;font-weight:700;cursor:pointer;}
  .wt-unlock-row button:hover{background:#E09E0F;}
  .wt-unlock-note{margin:8px 0 0;font-size:.8125rem;line-height:1.45;color:#C9D1F5;}
  .wt-then{margin:12px 2px 0;font-size:.875rem;color:var(--text-muted-strong);}
  @media(max-width:400px){ .wt-unlock-row{flex-wrap:wrap;} .wt-unlock-row button{width:100%;} }

/* 28 Oct (Matthew's and Steve's feedback): a smaller header so the network
   starts higher, one call to action per view, and on phones the network read
   top-down like the desktop one. */
.rep-hd{padding:1rem 0 1.25rem;}
.rep-id h1{font-size:2rem;margin:0 0 .45rem;}
.rep-kpis{margin-top:1rem;}
.kpis{grid-template-columns:repeat(3,minmax(0,1fr));}
.kpi{padding:9px 16px 10px;}
.kpi-v{font-size:1.45rem;margin-top:2px;}
.kpi-s{margin-top:2px;}
/* The tabs share a row with Save and Print, which left the header. */
.ip-tabbar{display:flex;align-items:flex-end;gap:12px;border-bottom:1px solid var(--line-strong);margin:.75rem 0 0;}
.ip-tabbar .ip-tabs{border-bottom:0;margin:0;flex:1 1 auto;min-width:0;}
.ip-tabbar .rep-tools{flex:none;padding-bottom:4px;}
#funder-content .wt-h{font-size:1.4rem;}
/* Who funds it has the panel's box; the band serves the other tabs. */
#out.on-funders #demo{display:none;}
.ip-src{max-width:var(--max-w);margin:1.5rem auto 0;padding:0 24px;font-size:.78rem;line-height:1.5;color:var(--text-muted-strong);}
/* The panel ends with Next (and, signed in, the booking link): no Previous, no step count. */
.wt-split .wt-nav{display:flex;flex-direction:column;align-items:stretch;gap:10px;}
.wt-split .wt-next{width:100%;}
.wt-step-sub .lk-sm{margin-left:4px;vertical-align:-1px;}
@media screen and (max-width:760px){
  .rep-id h1{font-size:1.6rem;}
  .rep-meta{font-size:.8125rem;}
  .kpi{padding:8px 10px;}
  .kpi-v{font-size:1.15rem;}
  .kpi-s{font-size:.72rem;}
  .ip-tabbar #printBtn{display:none;}
  /* One column, in reading order: the steps, what this step says, the network,
     the tallies, Next, the donors, the key, then peers and the free-account box. */
  .wt-split .wt-side-top,.wt-split .wt-side-bot,.wt-split .wt-graph{display:contents;}
  .wt-split .wt-steps{order:1;} .wt-split .wt-story{order:2;} .wt-split .wt-scroll{order:3;margin-top:0;}
  .wt-split .wt-tally{order:4;margin-top:0;} .wt-split .wt-nav{order:5;margin-top:0;}
  .wt-split .wt-list-wrap{order:6;} .wt-split .wt-legend{order:7;}
  .wt-split .wt-peers-wide{order:8;margin-top:0;} .wt-split .wt-unlock{order:9;margin-top:0;}
  .wt-split .wt-list-wrap[hidden]{display:block;}
  .wt-split .wt-story{scroll-margin-top:calc(var(--ex-nav-h,72px) + 16px);}
  /* Step 1 is the inner ring only, so "What we know" waits for step 2. */
  #funder-content:not(.wt-live) .wt-t-we{display:none;}
  #funder-content:not(.wt-live) .wt-tally{grid-template-columns:1fr;}
  /* Newest layer on top, as on desktop: funders above the donors they give to,
     the organization at the bottom, each gift on a down arrow. */
  .wt-canvas{align-items:stretch;}
  .wt-canvas::after{display:none;}
  .wt-amt::before{content:"\2193";}
  .wt-badge-we{grid-row:1;}
  .wt-n[data-k^=pf]{grid-row:2;} .wt-amt[data-e^=pf]{grid-row:3;}
  .wt-n[data-k=p1],.wt-n[data-k=p2]{grid-row:4;}
  .wt-more{grid-row:5;}
  .wt-n[data-k^=u]{grid-row:6;} .wt-amt[data-e^=u]{grid-row:7;}
  .wt-badge-you{grid-row:8;}
  .wt-n[data-k^=d]{grid-row:9;} .wt-amt[data-e^=d]{grid-row:10;}
  .wt-n[data-k=tgt]{grid-row:11;}
}
@media print{ .ip-tabbar .rep-tools{display:none !important;} }
/* Phones: the dollar tiles keep just their figure; the donor count keeps its
   line, or 64 reads as the donors behind the dollars beside it. */
@media screen and (max-width:760px){ .kpi:not([data-kpi-donors]) .kpi-s{display:none;} }

/* 29 Oct (critique of Taylor's page): the panel's Next is a text link under the
   step's words and donors, so the only full-width button is the call to action. */
.wt-step-nav{margin:12px 0 0;}
.wt-split .wt-step-nav .wt-next{width:auto;min-height:44px;padding:0;border-radius:0;background:none;color:var(--blue);
  font-size:1rem;font-weight:700;text-decoration:underline;text-underline-offset:3px;}
.wt-split .wt-step-nav .wt-next:hover{background:none;color:var(--blue-mid);}
/* The panel's sign-up form stacks, so the whole address shows. */
.wt-unlock-row{flex-direction:column;align-items:stretch;}
.wt-unlock-row button{width:100%;}
/* Graph text: the 1080px canvas is scaled to its column (about 0.85 at 1440),
   so these sizes render near 12px there. Cards keep their 96px height. */
.wt-n{font-size:13.5px;line-height:17px;}
.wt-nm,.wt-tz{font-size:15px;line-height:18px;}
.wt-target .wt-nm{font-size:18px;line-height:22px;}
.wt-id,.wt-fin,.wt-sub{font-size:13.5px;line-height:17px;}
.wt-amt{height:24px;border-radius:12px;font-size:13px;}
.wt-badge{font-size:13px;}
.wt-pill-lk{font-size:12.5px;}
@media(min-width:1280px){ .wt-grid{grid-template-columns:minmax(0,1fr) 360px;} }
@media screen and (max-width:760px){
  .wt-split .wt-step-nav{order:5;margin-top:0;}
  .wt-split .wt-nav{order:10;}
  /* The section heading already says it; the overview keeps its paragraph. */
  .wt-split [data-say="0"] > h3{display:none;}
}
@media print{ .wt-step-nav{display:none !important;} }
/* 1280-1439: the graph column is narrower (scale about 0.78), so the text steps up again. */
@media(min-width:1280px) and (max-width:1439px){
  .wt-n{padding:8px 12px;}
  .wt-nm,.wt-tz{font-size:16px;line-height:19px;}
  .wt-id,.wt-fin,.wt-sub{font-size:15px;line-height:18px;}
  .wt-amt,.wt-badge{font-size:14px;}
}
/* The step tabs line up: titles share a row and what each needs shares the next,
   however many lines either wraps to. Titles start at the top, so 1, 2 and 3 sit on one line
   when one title wraps and another doesn't. */
@supports (grid-template-rows:subgrid){
  .wt-split .wt-seg{grid-template-rows:auto auto;row-gap:0;}
  .wt-split .wt-seg li,.wt-split .wt-step,.wt-split .wt-step-tx{grid-row:span 2;display:grid;grid-template-rows:subgrid;row-gap:2px;}
  .wt-split .wt-step{min-height:0;}
  .wt-split .wt-step-tx b{align-self:start;justify-self:center;}
  .wt-split .wt-step-sub{align-self:start;}
}
/* 29 Oct (QA): phones, signed out. The locked outer layers fold into one card in "What we
   know" (explorer-page.js, wtCanvas), so the organization and its donors follow one box,
   not six. A line says when no funder was traced behind the donors. Each part shows with
   its own step. Desktop keeps the ring of cards. */
.wt-n.wt-fold,.wt-fold-none{display:none;}
@media screen and (max-width:760px){
  .wt-folded .wt-ghost:not(.wt-fold):is([data-layer="2"],[data-layer="3"]){display:none;}
  .wt-folded .wt-fold.on{display:flex;grid-row:2;grid-column:1 / -1;min-height:0;}
  .wt-n.wt-ghost.wt-fold .wt-lk{display:block;}
  .wt-fold [data-layer]:not(.on){display:none;}
  .wt-folded .wt-fold-none.on{display:block;grid-row:3;grid-column:1 / -1;margin:0;padding:0 12px;
    font-size:.8125rem;line-height:1.4;color:var(--text-muted-strong);}
  .wt-folded .wt-amt[data-e^=u]{grid-row:4;}
  .wt-folded .wt-badge-you{grid-row:5;}
  .wt-folded .wt-n[data-k^=d]{grid-row:6;} .wt-folded .wt-amt[data-e^=d]{grid-row:7;}
  .wt-folded .wt-n[data-k=tgt]{grid-row:8;}
}

/* 29 Oct: an organization with no filings but donors (a church, a mission agency,
   a public university). One wide tile says why there are no dollar figures and
   where its donors come from; the donor count keeps its place. */
.kpis-nf .kpi-nf{grid-column:span 2;}
.kpi-nf .kpi-v{font-size:1.25rem;line-height:1.3;}
@media screen and (max-width:760px){
  .kpis-nf .kpi{grid-column:1 / -1;border-left:0;}
  .kpis-nf .kpi + .kpi{border-top:1px solid var(--line);}
  .kpis .kpi.kpi-nf .kpi-s{display:block;}
  .kpi-nf .kpi-v{font-size:1.05rem;}
}
