/* ============================================================================
   CLIENT TYPE — one scale for every family-facing page        2026-08-16
   ----------------------------------------------------------------------------
   Caleb, after spending a morning tuning the client dashboard:

     "I want the dashboard to run consistent with the text and everything else
      on all the other pages… we're getting away from all those very big huge
      unprofessional very thick stuff… if someone was clicking very fast going
      through different pages there was consistency throughout every page."

   THE STANDARD IS NOT INVENTED HERE. Every value below is lifted verbatim from
   css/admin-console.css §4 — the scale the dashboards already run on, which is
   what the screenshots show. This file's only job is to make the other fourteen
   pages speak it too.

     ROLE            SIZE   WEIGHT  TRACK  COLOUR     (source)
     Page title      26px   600     0      #1A2130    .nx-h1
     Page sub        14px   400     0      #77808F    .nx-sub
     Section title   20px   600     0      #1A2130    (step between h1 and card)
     Card title      17px   600     0      #1A2130    .nx-card__title
     Card sub        13px   400     0      #A2AAB6    .nx-card__sub
     Row name        15px   600     0      #1A2130    (rail/list scale)
     Body            14.5px 400     0      #2C3341    body
     Meta            13.5px 400     0      #77808F    .pmpf__tab
     Micro label     12.5px 600     .05em  #77808F    .nx-stats__label (caps)
     Stat XL         29px   700     0      #1A2130    .nx-stats__num
     Stat L          22px   700     0      #1A2130
     Stat M          18px   700     0      #1A2130

   WHAT WAS ACTUALLY WRONG — the audit, so nobody has to redo it
   Every one of these pages set its page title to **Archivo 800 at 30–36px with
   -.028em tracking**, while the body around it was already Nunito 400. So each
   page opened with a heavy black slab in a DIFFERENT TYPEFACE from everything
   under it, and the fourteen pages disagreed with each other and with the
   dashboard. Card titles were 18–20px/800 against the console's 17px/600, and
   the big numbers ran 32–44px/800 against the console's 29px/700.
   That mismatch — not the sizes alone — is the "bulky and unprofessional" feel.

   FAMILY: these headings are pulled onto Nunito. That is NOT a new typeface
   being introduced (see the hard rule about never swapping a font family on a
   "make it cleaner" brief) — Nunito is what the body of every one of these
   pages ALREADY is, set by parent-console.css. The Archivo headings were the
   odd ones out. This removes an inconsistency; it does not add a font.

   TYPOGRAPHY ONLY. Family, size, weight, tracking, line-height, colour and the
   margin directly under a heading. No layout, no spacing systems, no colour
   accents, no component chrome. Nothing here can move a box.

   SCOPE: family views only — body.pm-parent-console (set by
   js/parent-console-rail.js) or body.pm-parent-rail. An admin looking at a
   shared page such as messages.html keeps their own console styling.

   REVERT: remove this file's <link> from the pages that carry it. Every rule it
   overrides is still in place underneath, untouched.
   ============================================================================ */

/* ── 0) THE FACE — the finding that actually explains the whole complaint ───
   Measured on the live pages, not guessed. The DASHBOARD renders 175 elements
   in Nunito against 42 in Inter. The other pages render the reverse: their body
   copy, buttons, meta rows and empty states are all Inter, and only the console
   chrome that parent-console.css owns is Nunito. So clicking from the dashboard
   to any other page changes TYPEFACE mid-product — which is the thing that reads
   as "not consistent" long before anyone notices a weight is 800.

   This puts the page content on the same face the dashboard already uses.
   `body *` is deliberately blunt, exactly like the landing page's own site-font
   rule, because a per-component list would leave gaps and gaps are the bug.

   NOT COVERED, on purpose: the left rail, the top bar and the sidebar popovers
   are shared chrome rendered identically on EVERY page including the dashboard,
   so they are already consistent and are left exactly as they are. Monospace
   stays monospace. Icon fonts are untouched. */
html body:is(.pm-parent-console, .pm-parent-rail) :is(
  .nx-shell, .nx-main, main,
  .lj-shell, .nb-shell, .sf-shell, .ca-shell, .as-shell,
  .gd-shell, #lpMount                       /* grades + learning plan have no `shell` class */
) *:not(:is(code, pre, kbd, samp, .material-icons, [class*="icon"])){
  font-family:"Nunito", ui-rounded, system-ui, -apple-system, sans-serif !important;
}
/* THE LEFT RAIL — the last Inter on every page, and it is on EVERY page.
   Scoped to `.pm-parent-console` ONLY: the same `.pmkid-nav` markup is the
   CHILD dashboard's rail, and the child view never carries that class, so a
   kid's account is untouched — the child dashboard is its own design and was
   not part of this brief.

   Targets the item AND its descendants. The visible text sits in a nested
   `.pmkid-nav__item__label` which sets its own font-family, so styling the
   parent alone changed nothing — measured on Shared Files, where 12 of the 15
   rendered elements were rail labels still in Inter. */
html body.pm-parent-console :is(.pmkid-nav__item, .pmkid-fly__head, .pmkid-fly__item, .ppr__item, .ppr__label),
html body.pm-parent-console :is(.pmkid-nav__item, .pmkid-fly__head, .pmkid-fly__item, .ppr__item) *{
  font-family:"Nunito", ui-rounded, system-ui, -apple-system, sans-serif !important;
}

/* ── 1) PAGE TITLE + SUB — the top block of every page ──────────────────────
   The dashboard's own top block is the reference: 26/600 greeting with a 14/400
   line under it. These are the same block on every other page, wearing a
   different face and twice the weight. */
html body:is(.pm-parent-console, .pm-parent-rail) :is(
  .nx-h1,                    /* schedule · hours · contract · membership · gift */
  .nb-h1,                    /* family notebook   */
  .sf-h1,                    /* shared files      */
  .lj-h1, .lj-headbar__h1,   /* lesson journal    */
  .ca-h1,                    /* my assistant      */
  .as-h1, .zh-greeting,      /* family studio     */
  .gd-top__title,            /* grades            */
  .pm-pricing__title         /* membership pricing*/
){
  font-family:"Nunito", ui-rounded, system-ui, -apple-system, sans-serif !important;
  font-size:26px !important;
  font-weight:600 !important;
  letter-spacing:0 !important;
  line-height:1.2 !important;
  /* COLOUR IS OPT-OUTABLE, and it has to be. This rule is !important and beats
     a page's own colour, which broke the Lesson Journal on 2026-08-16: that
     page's title sits on a THEMED DARK header bar and its own `color:#fff`
     rule lost to this one, so the title went near-black on navy and vanished.
     Any page with a dark surface under a title sets --pmct-h1 on the container
     and this follows it. Two pages need it today (lesson journal, and studio if
     its bar ever darkens); everything else is a light surface. */
  color:var(--pmct-h1, #1A2130) !important;
  margin-bottom:6px !important;
}
html body:is(.pm-parent-console, .pm-parent-rail) :is(
  .nx-sub, .nb-sub, .sf-sub, .lj-sub, .ca-sub, .as-sub, .gd-top__sub, .pm-pricing__sub
){
  font-family:"Nunito", ui-rounded, system-ui, -apple-system, sans-serif !important;
  font-size:14px !important;
  font-weight:400 !important;
  letter-spacing:0 !important;
  line-height:1.5 !important;
  color:var(--pmct-sub, #77808F) !important;   /* same opt-out as the title above */
}

/* ── 2) SECTION TITLE — the step between a page title and a card ────────────
   Used where a page groups several cards under one heading. 20/600 keeps it
   clearly under the 26px page title and clearly over the 17px card. */
html body:is(.pm-parent-console, .pm-parent-rail) :is(
  .nx-hub__title, .nx-glass__title, .sc-contract__title, .nx-contract__name,
  .nx-bank-strip__title, .ca-submitbar__title, .lj-detail__title, .sfd-title
){
  font-family:"Nunito", ui-rounded, system-ui, -apple-system, sans-serif !important;
  font-size:20px !important;
  font-weight:600 !important;
  letter-spacing:0 !important;
  line-height:1.25 !important;
  color:#1A2130 !important;
}

/* ── 3) CARD TITLE + SUB — the console's 17/600 over 13/400 ─────────────────
   These were the 18–20px/800 pairs. The card is the unit you see most often
   when you click quickly between pages, so this is the rule that does the most
   work for the "consistency at speed" Caleb asked for. */
html body:is(.pm-parent-console, .pm-parent-rail) :is(
  .nx-card__title, .nx-review__title, .pm-msg-thread__title, .pm-msg-system__title
){
  font-family:"Nunito", ui-rounded, system-ui, -apple-system, sans-serif !important;
  font-size:17px !important;
  font-weight:600 !important;
  letter-spacing:0 !important;
  line-height:1.3 !important;
  color:#1A2130 !important;
}
html body:is(.pm-parent-console, .pm-parent-rail) :is(
  .nx-card__sub, .nx-review__sub, .pm-msg-thread__sub
){
  font-size:13px !important;
  font-weight:400 !important;
  letter-spacing:0 !important;
  color:#A2AAB6 !important;
}

/* ── 4) MODAL TITLES — a dialog is a card, not a page ───────────────────────
   These were 18–22px/800, which made every modal read louder than the page
   that opened it. Same 17/600 as a card title. */
html body:is(.pm-parent-console, .pm-parent-rail) :is(
  .nx-modal__title, .nx-rmodal__title, .ca-modal__title
){
  font-family:"Nunito", ui-rounded, system-ui, -apple-system, sans-serif !important;
  font-size:17px !important;
  font-weight:600 !important;
  letter-spacing:0 !important;
  color:#1A2130 !important;
}

/* ── 5) ROW / ITEM NAMES — lists, pickers, sessions ─────────────────────────
   15/600. A person's name in a list is not a heading; at 700–800 it competed
   with the card title above it. */
html body:is(.pm-parent-console, .pm-parent-rail) :is(
  .ca-card__name, .ca-pickrow__name, .nx-review__plan-tier, .nx-sess__num
){
  font-family:"Nunito", ui-rounded, system-ui, -apple-system, sans-serif !important;
  font-size:15px !important;
  font-weight:600 !important;
  letter-spacing:0 !important;
  color:#1A2130 !important;
}
html body:is(.pm-parent-console, .pm-parent-rail) .nx-sess__time{
  font-size:13.5px !important; font-weight:400 !important; color:#77808F !important;
}

/* ── 5b) THE FAMILY NOTEBOOK's rows (added 2026-08-16 after Caleb: "the text
   doesn't have the new stuff we did") ──────────────────────────────────────
   This page was missed by the first pass because its cards use their own class
   names rather than the shared `.nx-*` ones. It was still setting titles in
   **Inter 700 at 14px** — a different typeface AND a heavier weight than the
   15/600 every other row title on the product uses — which is exactly the
   mismatch this file exists to remove. Descriptions and meta lines follow the
   same body/meta steps as everywhere else.
   (The reading-width cap that fixes the "sorta wide" line length is layout, so
   it lives in the page next to the card, not here — this file is type only.) */
html body:is(.pm-parent-console, .pm-parent-rail) :is(.nb-task__title, .nb-note__title, .nb-contact__label){
  font-family:"Nunito", ui-rounded, system-ui, -apple-system, sans-serif !important;
  font-size:15px !important;
  font-weight:600 !important;
  letter-spacing:0 !important;
  line-height:1.35 !important;
  color:#1A2130 !important;
}
html body:is(.pm-parent-console, .pm-parent-rail) :is(.nb-task__desc, .nb-note__body, .nb-contact__name){
  font-family:"Nunito", ui-rounded, system-ui, -apple-system, sans-serif !important;
  font-size:13.5px !important;
  font-weight:400 !important;
  line-height:1.6 !important;
  color:#4A5261 !important;
}
html body:is(.pm-parent-console, .pm-parent-rail) :is(.nb-task__meta, .nb-contact__row, .nb-contact__rows){
  font-family:"Nunito", ui-rounded, system-ui, -apple-system, sans-serif !important;
  font-size:12.5px !important;
  font-weight:400 !important;
  color:#77808F !important;
}

/* ── 6) EMPTY STATES — the quietest thing on the page, not the loudest ──────
   "No open tasks." on the dashboard is calm; these were 16–17px/700. */
html body:is(.pm-parent-console, .pm-parent-rail) :is(
  .nb-empty__title, .sf-empty__title, .lj-empty__title,
  .ca-empty__title, .ca-loading__title, .pm-msg-thread__empty h3
){
  font-family:"Nunito", ui-rounded, system-ui, -apple-system, sans-serif !important;
  font-size:15px !important;
  font-weight:600 !important;
  letter-spacing:0 !important;
  color:#4A5261 !important;
}

/* ── 7) THE NUMBERS — three steps, matching the dashboard exactly ───────────
   The dashboard shows "43 / HOURS AVAILABLE" at 29px/700. Every other page was
   showing the same kind of number at 32–44px/800. Bringing them to the same
   three steps is what makes the pages read as one product.

   XL (29/700) — the page's headline figure: hours, contract balance, totals. */
html body:is(.pm-parent-console, .pm-parent-rail) :is(
  .nx-kpi__num, .sc-contract__num, .nx-contract__remaining-num,
  .nb-stat__value, .lj-stat__value, .nx-hero__tier
){
  font-family:"Nunito", ui-rounded, system-ui, -apple-system, sans-serif !important;
  font-size:29px !important;
  font-weight:700 !important;
  letter-spacing:0 !important;
  line-height:1.1 !important;
  color:#1A2130 !important;
}
/* L (22/700) — a figure inside a card: amounts, summary values, big dates. */
html body:is(.pm-parent-console, .pm-parent-rail) :is(
  .nx-summary__value, .nx-plan-row__amount, .nx-review__plan-amount,
  .pm-gift__card-amount, .lj-date__day
){
  font-family:"Nunito", ui-rounded, system-ui, -apple-system, sans-serif !important;
  font-size:22px !important;
  font-weight:700 !important;
  letter-spacing:0 !important;
  color:#1A2130 !important;
}
/* M (18/700) — a figure inside a row. */
html body:is(.pm-parent-console, .pm-parent-rail) :is(
  .nx-listrow__amount, .nx-payment-stat__num, .nx-day__date
){
  font-family:"Nunito", ui-rounded, system-ui, -apple-system, sans-serif !important;
  font-size:18px !important;
  font-weight:700 !important;
  letter-spacing:0 !important;
  color:#1A2130 !important;
}
/* THE ONE DELIBERATE EXCEPTION — the membership price. It was 44px/700, and a
   price genuinely IS the headline of a pricing page rather than a stat in a
   card, so it keeps a step of its own above Stat XL instead of being flattened
   into it. Pulled to 34/700 so it still leads without out-shouting the rest of
   the product. Flagged rather than done quietly. */
html body:is(.pm-parent-console, .pm-parent-rail) .pm-tier__price{
  font-family:"Nunito", ui-rounded, system-ui, -apple-system, sans-serif !important;
  font-size:34px !important; font-weight:700 !important; letter-spacing:0 !important;
  color:#1A2130 !important;
}
html body:is(.pm-parent-console, .pm-parent-rail) .pm-tier__price-currency{
  font-size:18px !important; font-weight:600 !important; color:#77808F !important;
}

/* ── 8) MICRO LABELS — the uppercase captions under every number ────────────
   The console's own: 12.5px / 600 / .05em. The pages ran these anywhere from
   10px/800 to 13px/700 with tracking from .02em to .12em, which is why the
   stat blocks never lined up between pages. */
html body:is(.pm-parent-console, .pm-parent-rail) :is(
  .nx-kpi__label, .nb-stat__label, .lj-stat__label, .nx-summary__label,
  .sc-contract__label, .nx-contract__remaining-label, .nx-payment-stat__label,
  .nx-day__dow, .nx-hero__tier-label
){
  font-family:"Nunito", ui-rounded, system-ui, -apple-system, sans-serif !important;
  font-size:12.5px !important;
  font-weight:600 !important;
  letter-spacing:.05em !important;
  text-transform:uppercase !important;
  color:#77808F !important;
}

/* ── 8b) THE WEIGHT PASS — the actual source of "bulky and thick" ───────────
   Caleb, on every family page: "we're getting away from all those very big huge
   unprofessional very thick stuff."

   An audit of the eleven remaining pages found **396 classes** styled big or
   bold that the named rules above do not reach, and they share one shape almost
   without exception: **small UI text set at weight 700 or 800**. Buttons at
   12px/700. Filter pills at 11px/700. Field labels at 10px/700. Category chips
   at 9px/700. Individually each looks like a decision; together they are why the
   pages read heavy next to the dashboard, which sets the same furniture at 600.

   Listing 396 selectors would be unreadable and would rot the first time someone
   adds a twelfth page. These pages name things with real discipline, so the
   PATTERN is the reliable target — the same reasoning as the eyebrow rule in §4,
   which has held up across every page since.

   WEIGHT ONLY. Sizes are untouched, because size differences here are usually
   deliberate; it was the weight that was uniform and wrong. Numbers are
   deliberately excluded and stay at 700 — a stat is meant to be the heaviest
   thing in its card, and that is the console's own rule. */
html body:is(.pm-parent-console, .pm-parent-rail) :is(
  [class*="__btn"], [class*="-btn"], [class*="__cta"],
  [class*="__label"], [class*="__filter"], [class*="-filter"],
  [class*="__tab"], [class*="__chip"], [class*="__pill"],
  [class*="__badge"], [class*="__status"], [class*="__count"],
  [class*="__cat"], [class*="__name"], [class*="__sub"], [class*="__meta"],
  [class*="eyebrow"], [class*="kicker"],
  /* added after measuring Schedule: day/date/time captions and flyout heads
     were still landing at 700-800 because they matched none of the above */
  [class*="__day"], [class*="__dow"], [class*="__head"], [class*="__time"],
  [class*="__role"], [class*="__step"]
):not([class*="__num"]):not([class*="__value"]):not([class*="__amount"]):not([class*="__price"]){
  font-weight:600 !important;
  letter-spacing:0 !important;
}
/* Body copy inside those same cards stays at reading weight — a description is
   not furniture and should never have been bold. */
html body:is(.pm-parent-console, .pm-parent-rail) :is(
  [class*="__desc"], [class*="__body"], [class*="__text"], [class*="__note"]
){
  font-weight:400 !important;
}

/* ── 9) AVATAR INITIALS — a monogram, not a headline ────────────────────────
   16px/800 initials read as shouting inside a 34px circle. */
html body:is(.pm-parent-console, .pm-parent-rail) .ca-card__avatar{
  font-family:"Nunito", ui-rounded, system-ui, -apple-system, sans-serif !important;
  font-weight:600 !important; letter-spacing:0 !important;
}

/* ── 10) THE FAMILY STUDIO CLOCK — the one number that should stay big ──────
   .as-clock__time is the live wall clock on the Studio page (the "5:34 PM" card
   in the screenshot) and it is a display element, not a stat. It keeps its size
   and only loses the tracking so it sits on the same face as everything else. */
html body:is(.pm-parent-console, .pm-parent-rail) .as-clock__time{
  font-family:"Nunito", ui-rounded, system-ui, -apple-system, sans-serif !important;
  font-weight:600 !important; letter-spacing:0 !important;
}

/* ── 11) PHONE — the same scale, one step down ──────────────────────────────
   The pages already have their own phone blocks; this only pulls the page title
   and the headline figure in, because those are the two that overflow at 390px
   once they are on Nunito. Everything else is already small enough to hold. */
@media (max-width:760px){
  html body:is(.pm-parent-console, .pm-parent-rail) :is(
    .nx-h1, .nb-h1, .sf-h1, .lj-h1, .lj-headbar__h1, .ca-h1, .as-h1,
    .zh-greeting, .gd-top__title, .pm-pricing__title
  ){ font-size:22px !important; }
  html body:is(.pm-parent-console, .pm-parent-rail) :is(
    .nx-kpi__num, .sc-contract__num, .nx-contract__remaining-num,
    .nb-stat__value, .lj-stat__value, .nx-hero__tier
  ){ font-size:25px !important; }
  html body:is(.pm-parent-console, .pm-parent-rail) .pm-tier__price{ font-size:29px !important; }
}