/* THE NINE TEXT STYLES (Style Guide §2.3), the one home of type for every page family: the site, the Calculator, the ECG Lab and the
   Learn pages. A component joins a style by adding its selector to that style's list here and sets no size or weight of its own. */
@layer reset, components, roles;
@layer roles{
/* ============================================================
   CANONICAL TYPE ROLES — enforced. Placed LAST so it wins by source
   order. ONE definition per role; components must not fork these.
   A genuinely new role is raised before it's added. See
   STYLE_GUIDE §4 for the role table.
   ============================================================ */
/* The Section label's type shape (Style Guide §2.3). This rule sets only the lettering. A list's group heading takes its spacing from
   .rowlist-h, and the other labels in this list move onto it under issue #942, so that no screen sets a heading's margins itself. */
.eyebrow,
.rowlist-h,
.group>.label,
.dd-section,
.sortpanel-cap,
.dgroup,
.contra-lvl,
.sheet-sub,
.res-eyebrow,
.strip-head,
.qmeta .qtag:not(.qid),
.qcard .qtype,
.medstruct-zoomhint,
.sugg-class,
.explain .h,
.lab-table .lab-head,
.exp-concept .ee,
.explain .fc-sc,
.dd-grp-h,
.label,
.gdc-lb,
.sgcol-h,
.rc-qg-h,
.rc-hit-g,
.calcgrp-lb,
.gl-fold-t,
.dzb-h,
.acct-sect,
.rtype-chip,
.tool-type,
.sugg-kind,
.subtopic-dom-h,
.group > .label,
.res-review-hd,
.zoomov-hint,
.ft-traps-h,
.ft-treat-h,
.ft-change,
.ft-data-h,
.ft-role,
.ft-scope,
.grid-axes,
.mkt-badge,
.rt-h,
.afchip .afk,
.chip-badge,
.rc-ring-n span,
.fam-dz-c,
.fam-cap,
.ft-clicky::after,
.ffopt-f,
.sgcrumb-b,
.rc-pot-act,
.rc-dup,
.sgt th,
.ft-class-lb,
.cmp-tbl .cmp-grp th,
.ft-ask-lb,
.lab-table .lab-flag,
.drow .drow-tag,
.sgival b,
.navlink .nl-ic,
.kp-work-h,
.learn figcaption .lbl,
.learn caption .lbl,
.learn th,
.learn .calc > .lbl,
.learn .terms > .lbl,
.learn .myth .lbl,
.learn .grp td,
.learn .qgroup,
.dd-tbl .dd-grp th{font-family:var(--sans);font-weight:var(--w-cap);font-size:var(--t-eye);line-height:var(--lh-label);letter-spacing:var(--track-caps);text-transform:uppercase}
/* FIELD LABEL — a row's own label ("Brand", "Boxed warning"). STYLE_GUIDE R5 (2026-10-03): ⛔ NOT caps — caps are for a
   SECTION label only. 👤: "so many words… every page looks different"; a card whose every row label shouts in caps
   is the loudest thing on the screen. Secondary role: the sans face, --t-meta, ink-2, no tracking. */
.dd-tbl td:first-child,.explain .fc-k,.kv-k,.dz-txrow-h{font-family:var(--sans);font-weight:400;font-size:var(--t-meta);line-height:var(--lh-meta);letter-spacing:normal;text-transform:none}
/* META: a caption, a hint, a key or an ID beside the content. It is the smallest role; nothing on the site is drawn smaller. This rule sets
   only the size and weight, so each part keeps its own face and color. */
.mcard .mn,
.ionkey,
.apnote,
.drugsub,
.chaincap,
.condhint,
.strip-lead,
.kbhud kbd,
.rev-mark,
.rev-q,
.calc-pts,
.mstatus,
.cbox,
.mv span,
.maplegend,
.tag,
.tag-nav,
a.tag-ref:not(.is-plain),
.kbhud span,
.explain .fc-one,
.explain .fc-more > summary,
.dd-bysys summary,
.dz-more summary,
.cmp-pick > summary,
.qprog,
.qprog-jump,
.qmeta .qtag.qid,
.explain .fc-link,
.dd-part-k,
kbd,
.calc-clear,
.calc-res-u,
.calc-sfx,
.kp-pick-v,
.kp-use,
.kp-w-v,
.ab-lo-car,
.ab-lo-sub,
.facet-pill,
.subcard-row,
.cat-grid .chip,
.seg .seg-b,
.rev-stem,
.strip-legend .lg,
.lab-table,
.acct-busy,
.acct-said,
.acct-act,
.acct-row-p,
.acct-empty,
.gd-note,
.gdc-none,
.ab-ver,
.authov-out,
.authov-err,
.authov-warn,
.authov-email,
.authov-hint,
.rptcard-s,
.rpt-toast,
.qfig-table table,
.qfig-cap,
.update-toast .ut-reload,
.update-toast .ut-msg,
.gl-cls-eg,
.gl-cls-q,
.gl-cls-gov,
.gl-cls-intro,
.gl-empty,
.gl-tab,
.backbtn-lb,
.tb-lb,
.backbtn,
.glossbtn,
.densebtn,
.ft-traps-body,
.ft-auto,
.ft-ask-u,
.ft-data-calc,
.ft-pre-tag,
.ft-plan,
.ft-drug,
.ft-toollink,
.ft-step,
.topic-group-line,
.topic-note,
.grid-why,
.grid-leg-item,
.grid-tbl td,
.grid-tbl th,
.rt-meta,
.rt-det,
.rt-cap,
.offline-note,
.dgroup-caret,
.sortopt,
.af-clear,
.afchip,
.af-n,
.ffopt,
.search,
.sugg-empty,
.sugg-brand,
.chip,
.bb-count,
.navlink,
.rail-toggle,
.topback-lb,
.rc-dchip,
.ft-dose,
.dzb-none,
#bkcard .dd-bysys dt,
.subcard-row .scname,
.subcard-row .dir,
.brow .v,
.brow .name,
.ind-more,
.ind-limit,
.tag-prose,
.ind-prose,
.dd-qual,
.kv-v,
.kv-none,
.kv-hint,
.dd-empty,
.ffind,
.ffmore,
.sgnote,
.rc-pot-note,
.sgread-note,
.sgread-pearl,
.sgb li,
.sgpill,
.sgival,
.sgt td,
.rc-hit,
.rc-none,
.ft-broken,
.ft-class-v,
.ft-np,
.acct-course-sub,
.acct-termh-col,
.nument-u,
.nument-say,
.acct-secm,
.tag--person,
.fc-legend,
.lr-segb,
.lr-note,
.lr-empty,
.lr-meta,
.lr-k,
.lr-uid,
.lr-status,
.ldg-zoom-hint,
.cmp-pick-l,
.rc-pot .rc-x,
.rc-pot-n,
.ck-v,
.sgd-sp,
.sgd-k,
.lp-note,
.lp-empty,
.lp-sum,
.lp-del,
.qhint-tip,
.stages-s,
.cmp-tbl td::before,
.chip .n,
.ffopt-n,
.afchip .afx,
.grid-monitor,
.grid-monitor-lb,
.rpt-toast-s,
.gdc-opt-sub,
.facet-pill .n,
.sgrow-mt,
.sgcrumb-s,
.sgpill i,
.rc-pot-n,
.rc-fold-sum,
.acct-termh-t,
.cmp-tbl th[scope="row"],
.rc-pot .rc-dchip,
.calc-expr,
.calc-send,
.calc-band-warn,
.calc-note,
.calcsheet-back,
.kp-why,
.kp-work-k,
.fx-u,
.jp-table [role="columnheader"],
.jp-notes,
.learn figcaption,
.learn caption,
.learn table,
.learn .note,
.learn dl.pairs,
.learn nav.weeks .wk,
.learn .rdr-crumb,
.learn .pg,
.learn .pg-pick,
.learn .hint,
.learn .score,
.learn .score button,
.learn .mark button,
.learn .calc > .lbl + p,
.learn .calc label,
.learn .calc input,
.learn .calc .drugs button,
.learn .legend,
.learn .opt,
.learn .myth,
.learn details p,
.learn .no,
.learn .z,
.learn .kit-name,
.learn .kit-when,
.learn .kit-code pre,
.learn .kit-copy,
.learn .kit-sw-n,
.drow .cl{font-size:var(--t-meta);line-height:var(--lh-meta);font-weight:var(--fw-text)}
/* STEM: the question itself. */
.qcard .stem,.qstory{font-family:var(--body);font-size:var(--t-h3);line-height:var(--lh-stem)}
.qcard .stem{font-weight:var(--fw-stem)}
/* BODY: every line a student reads in a question and its reveal (options, the Why, the case story, card rows, table cells). */
.opt,
.opt .lbl,
.exp-concept .rationale,
.exp-concept .rationale-list,
.kv-h,
.kv-lead,
.kv-sub,
.kv-note,
.explain .fc-wrong,
.kp-w-lb,
.calc-lb,
.ab-lo-list,
.ab-lo-topic-t,
.ab-lo-course-t,
.ab-learn-link,
.setrow-name,
.seg.seg-field .seg-b,
.rev-go,
.res-phrase i,
.explain,
.zoomov-close,
.acct-course-t,
.acct-row-t,
.acct-chev,
.gdc-opt-main,
.gdc-in,
.authov-in,
.authov-note,
.rpt-toast-x,
.gl-cls-name,
.gl-aword,
.gl-aabbr,
.gl-anone,
.ft-chosen-val,
.ft-ask-in,
.grid-pt,
.ft-data .ft-ask-lb,
.ft-branch,
.ft-answer,
.ft-var,
.ft-why-card,
.act-link,
.topic-lead,
.tool-what-body,
.rt-main,
.setup-empty,
.dd-tbl td,
.empty,
.ffhead,
.wait,
textarea,
select,
input,
.course-err-p,
.rc-done-p,
.rc-x,
.rc-dsearch,
.rc-empty,
.hub-title,
.fam-dz-a,
.dz-val,
#bkcard .dz-row-t,
.dzb-n,
.dd-lede,
.dz-txline,
.dd-practice,
.ind-name,
.dd-oneliner,
.rptov-sub,
.rptov-note,
.sgread-lede,
.sgread-p,
.nument-in,
.nument-rule,
.lr-raw,
.lr-t,
.cmp-tbl,
.cmp-empty,
.ldg-note,
.gl-ck,
.lp-q,
.lp-name,
.dx-explain p,
.dx-sel,
.dx-x,
.searchbox input,
.acct-in,
.res-phrase b,
.res-score .pct small,
.buildq-quip,
.navlink .nl-lb,
.lr-edit,
.calc-in,
.calc-insert,
.calc-item-lb,
.calc-band-act,
.calcsheet .calcpick-it,
.calcpick-list .calcpick-nm,
.calcsheet .calcpick-nm,
.kp-w,
.kp-work-t,
.fx-n,
.fx-x,
.jp-table [role="rowheader"],
body.learn,
.learn summary,
.learn .kit-lede,
.drow .chev{font-family:var(--body);font-size:var(--t-body);line-height:var(--lh-body);font-weight:var(--fw-text)}
/* BUTTON: Body at the emphasis weight (the Result, a fold's title, an option key, emphasis inside a line, a card's name in the reveal).
   A name is a label, not a paragraph, so its line is the title line (--lh-title) and adds no space of its own to its row. */
.exp-concept .verdict,
.exp-concept .sum-card summary,
.opt .key,
.opt .mk,
.exp-concept .rationale strong,
.explain .fc-name,
.kp-w-v b,
.calc-res-lb,
.kp-pick-q,
.wiz-nav-btn,
.gd-fc-t,
.authov-send,
.ft-derived-lb,
.ft-next,
.sugg-generic,
.btn,
.course-err-btn,
.subtab,
.drow .nm,
.rptcard-h,
.acct-go,
.lr-btn,
.dx-add,
.qhint,
.rc-pot-acts .acct-act,.rc-pot-acts .acct-go,
.stages-h,
.sgscen,
.ft-derived-n,
.sgrow-lb,
.rpt-toast-t,
.calc-band-lb,
.calcpick-nm,
.kp-w-v b,
.kp-pick-v b,
.kp-stage,
.jp-table b,
.learn h3,
.story-dt{font-family:var(--body);font-size:var(--t-body);line-height:var(--lh-title);font-weight:var(--fw-strong)}
/* Emphasis inside a line keeps the line's weight; color marks it. */
.learn .calc dd b,.condex b,.maplegend b,.strip-legend .lg b,.chain .arrow{font-weight:400}
/* ICON: a glyph that stands alone (a back chevron, a close or clear cross, the search mark, a plus). It is not a text style. */
.topback::before,
.side-brand-icon,
.searchbox .si-ic,
.backbtn-ic,
.update-toast .ut-x,
.authov-close,
.gdc-clear,
.tb-arrow,
.acct-plus,
.drow-tick,
.calcsheet .calcpick-it::after,
.calcpick-list .calcpick-it::after,
.learn .pg-arw,
.fam-car{font-size:var(--t-h3);line-height:1;font-weight:var(--fw-text)}
/* DISPLAY: the rxdx wordmark and a result's grade; each keeps its own face. */
.hero-logo,
.hub-mark,
.authov-mark,
.bq-grade{font-size:var(--t-hero);line-height:1;font-weight:700}
/* TITLE: the name of a card, a sheet, an overlay or a result. */
.rc-done-h,
.course-err-h,
.authov-user,
.gd-card-nm,
.rptov-h,
.calc-out,
.res-score .pct,
.acct-who,
.ab-h,
.ab-lead,
.drawer-close,
.rc-ring-n b,
.rc-q,
.hub-card.hub-add .hub-ic,
.brand-mark,
.topctx,
.sgread-h,
.lr-h,
.calc-nm,
.learn h1,
.learn .kit-h,
.dd-name{font-size:var(--t-h1);line-height:var(--lh-title);font-weight:var(--fw-strong)}
/* A setup step's title and a side panel's name are the Title size in the thin weight, because the side panel holds no bold. */
.wiz-q,
.sheet-title{font-family:var(--body);font-size:var(--t-h1);line-height:var(--lh-title);font-weight:var(--fw-text)}
/* HEADING: a section heading inside a long page, between the Title and the Body. */
.panel-toolcalc .calc-nm,
.panel-toolcalc .calc-out,
.learn h2,
.sgblk-h{font-size:var(--t-h2);line-height:var(--lh-title);font-weight:var(--fw-strong)}
/* STRONG STATE: a selected control and the arrow of a value outside its range take the strong weight at their own style's size; nothing else is bold by state. */
.seg .seg-b.on,.stages-s.on,.ldg-dir,.lab-dir,.calcpick-list .calcpick-it.on .calcpick-nm,.fx-u-k{font-weight:var(--fw-strong)}
/* A sub or superscript is three quarters of its line. */
.exp-concept sub,.exp-concept sup,.mx-t sub,.mx-sup,.kp-work-t sup{font-size:.75em}
/* The square root sign is drawn a little larger than its radicand so that its stroke spans the expression. */
.mx-sqs{font-size:1.15em}
/* A dosing condition heads its part with a hairline; its type is the Body role. */
/* VALUE: what a field says. Body, ink. A detail that qualifies a value (a route, a class, a scenario's criteria) is the same size in ink-2.
   A value is never bold. */
}