/* ProCivica móvil — /m/* shell + card grammar. v1
   Loads AFTER tokens.css; every value is a token. Phone-first (360–480px
   portrait), no desktop mode, so no media queries. Constraints
   (Design_System_Mobile.md): no shadows; radius ≤6px; 1px ink borders (§11);
   no bottom tab bar / icon nav / FAB — typeset labels only (§7); every
   target ≥ var(--tap-min) 44px (§8); inputs 16px vs iOS zoom (§10).
   Shared "voice" groups first (mono label, chip shape, tap target) — the
   per-component rules after them only carry what differs. */
/* base */
html{-webkit-text-size-adjust:100%;}
.m-body{margin:0;background:var(--color-bg);color:var(--color-ink);font-family:var(--font-body);font-size:var(--text-body);line-height:var(--leading-normal);}
.m-main a{color:var(--color-ink);}
/* voice: mono uppercase labels */
.m-kicker,.m-tab,.m-topbar__right a,.m-footer,.m-badge,.m-card__group,.m-why,.m-stage,.m-tag,.m-fresh__chip,.m-ad__label,.m-bar__party,.m-voto,.m-partychip,.m-field label{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:var(--tracking-wide);}
.m-kicker,.m-tab,.m-field label{letter-spacing:var(--tracking-wider);}
/* voice: small chips */
.m-badge,.m-why,.m-stage,.m-tag,.m-partychip,.m-fresh__chip{font-size:var(--text-micro-mobile);padding:2px 6px;border-radius:var(--radius-sm);}
.m-badge,.m-partychip,.m-voto,.m-bar__party{font-weight:var(--weight-semibold);}
/* voice: ≥44px inline targets */
.m-wordmark,.m-topbar__right a,.m-tab,.m-card__vota,.m-card__foot .fuente,.m-link{display:inline-flex;align-items:center;min-height:var(--tap-min);}
/* topbar — 56px ink bar, sticky, safe-area padded */
.m-topbar{position:sticky;top:0;z-index:var(--z-sticky);display:flex;align-items:center;justify-content:space-between;min-height:var(--topbar-height-mobile);padding:env(safe-area-inset-top) calc(var(--space-4) + env(safe-area-inset-right)) 0 calc(var(--space-4) + env(safe-area-inset-left));background:var(--color-ink);color:var(--color-on-dark);}
.m-wordmark{font-family:var(--font-display);font-weight:var(--weight-bold);font-size:20px;color:var(--color-on-dark);text-decoration:none;}
.m-wordmark em{font-style:italic;color:var(--color-gold);}
.m-topbar__right a{padding:0 var(--space-2);font-size:var(--text-label);color:var(--color-on-dark-soft);text-decoration:none;}
.m-topbar__right a[aria-current="page"]{color:var(--color-gold);border-bottom:2px solid var(--color-gold);}
/* tab strip — text-only nav; active underline sits ON the strip rule */
.m-tabs{display:flex;background:var(--color-bg);border-bottom:var(--border-width) solid var(--color-ink);padding:0 calc(var(--space-2) + env(safe-area-inset-right)) 0 calc(var(--space-2) + env(safe-area-inset-left));}
.m-tab{padding:0 var(--space-3);font-size:var(--text-caption);color:var(--color-soft);text-decoration:none;border-bottom:3px solid transparent;margin-bottom:-1px;}
.m-tab[aria-current="page"]{color:var(--color-ink);font-weight:var(--weight-semibold);border-bottom-color:var(--color-gold-ink);}
/* main + footer */
.m-main{max-width:480px;margin:0 auto;padding:var(--space-4) calc(var(--space-4) + env(safe-area-inset-right)) var(--space-8) calc(var(--space-4) + env(safe-area-inset-left));}
.m-footer{border-top:var(--border-width) solid var(--color-ink);padding:var(--space-4) var(--space-4) calc(var(--space-4) + env(safe-area-inset-bottom));font-size:var(--text-label);color:var(--color-soft);text-align:center;}
.m-footer p{margin:0;}
.m-footer a{color:var(--color-gold-ink);}
/* page headings */
.m-kicker{font-size:var(--text-label);color:var(--color-gold-ink);margin:0 0 var(--space-2);}
.m-h1{font-family:var(--font-display);font-size:var(--text-display-md-mobile);line-height:var(--leading-tight-mobile);margin:0 0 var(--space-3);}
/* raw-Gaceta asunto headline: bureaucratic prose, not a display title —
   body scale so a 200-char string doesn't own the viewport */
.m-h1--asunto{font-family:var(--font-sans);font-size:var(--text-body);font-weight:var(--weight-semibold);line-height:var(--leading-normal);}
.m-asunto-full{margin:0 0 var(--space-3);font-size:var(--text-body-sm);color:var(--color-soft);}
.m-asunto-full summary{min-height:var(--tap-min);display:flex;align-items:center;color:var(--color-gold-ink);cursor:pointer;}
.m-h2{font-family:var(--font-display);font-size:var(--text-display-sm-mobile);line-height:var(--leading-snug-mobile);margin:var(--space-6) 0 var(--space-3);}
.m-lede{font-size:var(--text-body-lg-mobile);margin:0 0 var(--space-4);}
/* feed card — <article>; fuente + votación are the only anchors */
.m-card{background:var(--color-paper);border:var(--border-width) solid var(--color-ink);border-radius:var(--radius-md);padding:var(--space-4);margin:0 0 var(--space-3);}
.m-card__kicker{display:flex;align-items:baseline;flex-wrap:wrap;gap:var(--space-2);margin-bottom:var(--space-2);}
.m-badge{background:var(--color-ink);color:var(--color-on-dark);}
/* source hues mirror the monitor signal-class mapping in tokens.css */
.m-badge--dof{background:var(--color-gold-ink);}
.m-badge--iniciativa{background:var(--color-stage-aprobacion);}
.m-badge--votacion{background:var(--color-signal);}
.m-badge--scjn{background:var(--color-entity-comision-ink);}
.m-badge--mananera{background:var(--color-axis-left-2);}
.m-card__group{font-size:var(--text-micro-mobile);color:var(--color-soft);}
.m-card__title{font-family:var(--font-display);font-size:var(--text-headline-mobile);line-height:var(--leading-snug-mobile);font-weight:var(--weight-bold);margin:0 0 var(--space-2);}
.m-card__line{font-size:14px;margin:0 0 var(--space-1);}
.m-card__line b{font-weight:var(--weight-semibold);}
.m-card__pending{background:var(--color-pending-bg);border-radius:var(--radius-sm);padding:var(--space-2) var(--space-3);font-size:var(--text-body-sm);color:var(--color-soft);margin:0 0 var(--space-2);}
.m-card__actor{font-size:var(--text-body-sm);color:var(--color-soft);margin:var(--space-1) 0 var(--space-2);}
.m-card__chips{display:flex;flex-wrap:wrap;gap:var(--space-1) var(--space-2);margin:0 0 var(--space-2);}
.m-why{background:var(--color-gold-soft);color:var(--color-gold-ink);}
.m-stage{background:var(--color-stage-aprobacion-bg);color:var(--color-stage-aprobacion);}
.m-tag{border:var(--border-width) solid var(--color-rule-strong);color:var(--color-soft);}
.m-card__vota{font-size:var(--text-body-sm);font-weight:var(--weight-semibold);}
.m-card__foot{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);border-top:var(--border-width) solid var(--color-rule);margin-top:var(--space-2);padding-top:var(--space-1);}
.m-card__meta{font-size:var(--text-caption);color:var(--color-soft-2);}
.m-card__foot .fuente{flex-shrink:0;font-size:var(--text-body-sm);font-weight:var(--weight-semibold);color:var(--color-gold-ink);}
/* freshness chip + stale banner */
.m-fresh{display:flex;margin:0 0 var(--space-3);}
.m-fresh__chip{padding:var(--space-1) var(--space-2);color:var(--color-good);background:var(--color-good-bg);}
.m-stale{background:var(--color-warn-bg);border:var(--border-width) solid var(--color-warn);border-left-width:var(--border-width-4);border-radius:var(--radius-sm);padding:var(--space-3);font-size:var(--text-body-sm);color:var(--color-ink);margin:0 0 var(--space-3);}
/* ad slot — height reserved BEFORE load so it never shifts layout */
.m-ad{min-height:250px;margin:var(--space-4) 0;padding:var(--space-2);background:var(--color-pending-bg);border:var(--border-dotted);border-radius:var(--radius-sm);}
.m-ad__label{display:block;margin-bottom:var(--space-1);font-size:var(--text-micro-mobile);color:var(--color-soft-2);}
/* buttons + standalone links */
.m-btn{display:flex;align-items:center;justify-content:center;width:100%;box-sizing:border-box;min-height:var(--tap-target);padding:0 var(--space-4);background:var(--color-ink);color:var(--color-on-dark);border:var(--border-width) solid var(--color-ink);border-radius:var(--radius-md);font-family:var(--font-body);font-size:var(--text-body);font-weight:var(--weight-semibold);text-decoration:none;cursor:pointer;}
.m-btn--ghost{background:transparent;color:var(--color-ink);}
.m-link{font-weight:var(--weight-semibold);}
/* stacked party bars (§9.3) — name+count line, full-width bar below.
   Fill width/color come inline from party color_hex; the count text
   carries the number — never color alone. */
.m-bars{margin:var(--space-3) 0;}
.m-bar{margin:0 0 var(--space-3);}
.m-bar__head{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-2);margin-bottom:var(--space-1);}
.m-bar__party{font-size:var(--text-caption);}
.m-bar__count{font-size:var(--text-caption);color:var(--color-soft);}
.m-bar__track{display:flex;height:28px;overflow:hidden;background:var(--color-rule);border-radius:var(--radius-sm);}
.m-bar__fill{height:100%;}
/* vote-sense text chips — locked vote palette */
.m-voto{font-size:var(--text-micro-mobile);white-space:nowrap;}
.m-voto--favor{color:var(--color-vote-yes);}
.m-voto--contra{color:var(--color-vote-no);}
.m-voto--abstencion{color:var(--color-vote-abs);}
.m-voto--ausente{color:var(--color-vote-aus);}
/* collapsible roll-call (details/summary) */
.m-rollcall{background:var(--color-paper);border:var(--border-width) solid var(--color-rule-strong);border-radius:var(--radius-md);margin:var(--space-3) 0;}
.m-rollcall summary{display:flex;align-items:center;justify-content:space-between;min-height:var(--tap-min);padding:0 var(--space-4);font-size:var(--text-body-sm);font-weight:var(--weight-semibold);cursor:pointer;list-style:none;}
.m-rollcall summary::-webkit-details-marker{display:none;}
.m-rollcall summary::after{content:"▾";color:var(--color-soft);}
.m-rollcall[open] summary::after{content:"▴";}
.m-rollcall__body{border-top:var(--border-width) solid var(--color-rule);padding:var(--space-1) var(--space-4);}
.m-rollcall__row{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-2);padding:var(--space-2) 0;border-bottom:var(--border-width) solid var(--color-rule);font-size:var(--text-body-sm);}
.m-rollcall__row:last-child{border-bottom:0;}
/* list rows (representantes picker/list) */
.m-list{margin:0 0 var(--space-4);padding:0;list-style:none;background:var(--color-paper);border:var(--border-width) solid var(--color-ink);border-radius:var(--radius-md);}
.m-list li + li{border-top:var(--border-width) solid var(--color-rule);}
.m-list a{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2);min-height:var(--tap-target);padding:var(--space-2) var(--space-4);text-decoration:none;}
.m-list__sub{display:block;font-size:var(--text-caption);color:var(--color-soft);}
/* Non-link picker row (the "N/A" bucket) — same box as .m-list a, minus the chevron/affordance. */
.m-list__static{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2);min-height:var(--tap-target);padding:var(--space-2) var(--space-4);color:var(--color-soft);}
/* party chip: inline bg from color_hex + matching -fg token; the
   abbreviation text carries the meaning, never the color alone */
.m-partychip{flex-shrink:0;}
/* forms — label above input; 16px input text (iOS zoom guard, §10) */
.m-field{margin:0 0 var(--space-4);}
.m-field label{display:block;margin-bottom:var(--space-2);font-size:var(--text-label);color:var(--color-soft);}
.m-field input,.m-field select,.m-field textarea{width:100%;box-sizing:border-box;min-height:var(--tap-min);padding:var(--space-3) var(--space-4);font-family:var(--font-body);font-size:16px;color:var(--color-ink);background:var(--color-paper);border:var(--border-width) solid var(--color-ink);border-radius:var(--radius-md);}
.m-field input:focus,.m-field select:focus,.m-field textarea:focus{outline:none;border-color:var(--color-signal);box-shadow:var(--focus-ring);}
/* honest empty state — mono caption, no illustration (§11) */
.m-empty{background:var(--color-pending-bg);border:1px dashed var(--color-rule-strong);border-radius:var(--radius-md);padding:var(--space-4);font-family:var(--font-mono);font-size:var(--text-caption);line-height:var(--leading-normal);color:var(--color-soft);}

/* ════ /m/ home: bands by level of government ═══════════════════════════
   Density rhythm is the point: ONE full card per band at most, everything
   else a ≥44px row. Per-band hues are the SAME values the source badges
   already use; color never carries meaning alone — every hue sits beside
   its band name, and every state chip is a word. */
/* Cortes uses the LEGISLADOR violet, not entity-comision-ink (#92400e):
   that brown is a near-twin of gold-ink (#8a5e1c) and the two bands were
   indistinguishable side by side. The five hues must survive being read
   as 10px squares in a row. */
.m-band--ejecutivo_federal{--band-hue:var(--color-gold-ink);}
.m-band--congreso{--band-hue:var(--color-ink);}
.m-band--cortes{--band-hue:var(--color-entity-legislador-ink);}
.m-band--estados{--band-hue:var(--color-axis-left-2);}
.m-band--autonomos{--band-hue:var(--color-soft);}
.m-idx__hue--ejecutivo_federal,.m-bar__i--ejecutivo_federal{background:var(--color-gold-ink);}
.m-idx__hue--congreso,.m-bar__i--congreso{background:var(--color-ink);}
.m-idx__hue--cortes,.m-bar__i--cortes{background:var(--color-entity-legislador-ink);}
.m-idx__hue--estados,.m-bar__i--estados{background:var(--color-axis-left-2);}
.m-idx__hue--autonomos,.m-bar__i--autonomos{background:var(--color-soft);}
/* dateline: kicker + freshness chip share one baseline */
.m-dateline{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-2);margin:0 0 var(--space-1);}
.m-dateline .m-kicker{margin:0;}
/* El día — summary panel */
.m-idx{background:var(--color-paper);border:var(--border-width) solid var(--color-ink);border-radius:var(--radius-md);padding:var(--space-4);margin:0 0 var(--space-6);}
.m-idx__label{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:var(--tracking-wider);font-size:var(--text-micro-mobile);color:var(--color-soft-2);margin:0 0 var(--space-3);}
.m-idx__stats{display:flex;gap:var(--space-6);margin:0 0 var(--space-3);}
.m-stat__n{font-family:var(--font-display);font-size:var(--text-display-sm-mobile);line-height:var(--leading-tight-mobile);font-weight:var(--weight-bold);font-variant-numeric:tabular-nums;}
.m-stat__l{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:var(--tracking-wide);font-size:var(--text-micro-mobile);color:var(--color-soft);margin-top:2px;}
.m-bar{display:flex;height:10px;border:var(--border-width) solid var(--color-ink);border-radius:var(--radius-sm);overflow:hidden;margin:0 0 var(--space-3);}
.m-bar__i{display:block;height:100%;}
.m-idx__rows{list-style:none;margin:0;padding:0;border-top:var(--border-width) solid var(--color-rule);}
.m-idx__rows li + li{border-top:var(--border-width) solid var(--color-rule);}
.m-idx__rows a{display:flex;align-items:center;gap:var(--space-2);min-height:var(--tap-min);text-decoration:none;color:var(--color-ink);}
.m-idx__hue{flex:0 0 auto;width:10px;height:10px;border-radius:2px;}
.m-idx__name{flex:1 1 auto;font-size:var(--text-body-sm);font-weight:var(--weight-semibold);}
.m-idx__n{font-family:var(--font-mono);font-size:var(--text-caption);color:var(--color-soft);font-variant-numeric:tabular-nums;white-space:nowrap;}
.m-idx__st{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:var(--tracking-wide);font-size:9px;font-weight:var(--weight-bold);white-space:nowrap;width:62px;text-align:right;}
.m-idx__st--activo{color:var(--color-good);}
.m-idx__st--quieto{color:var(--color-soft-2);}
.m-idx__st--captura_detenida{color:var(--color-warn);}
.m-idx__st--captura_fallida{color:var(--color-signal-strong);}
/* La portada — the lead pairing */
.m-lead{border-top:var(--border-double);padding-top:var(--space-3);margin:0 0 var(--space-8);}
.m-lead__kicker{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:var(--tracking-wide);font-size:var(--text-micro-mobile);color:var(--color-gold-ink);margin:0 0 var(--space-2);}
.m-lead__title{font-family:var(--font-display);font-size:var(--text-display-sm-mobile);line-height:var(--leading-snug-mobile);font-weight:var(--weight-bold);margin:0 0 var(--space-3);}
.m-lead__line{font-size:14px;margin:0 0 var(--space-2);}
.m-lead__meta{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:var(--tracking-wide);font-size:var(--text-micro-mobile);color:var(--color-soft-2);margin:0 0 var(--space-3);}
.m-lead__echo{background:var(--color-gold-soft);border-radius:var(--radius-sm);padding:var(--space-3) var(--space-4);margin:0 0 var(--space-2);}
.m-lead__echo-label{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:var(--tracking-wide);font-size:var(--text-micro-mobile);font-weight:var(--weight-bold);color:var(--color-gold-ink);margin:0 0 var(--space-1);}
.m-lead__echo ul{list-style:none;margin:0;padding:0;}
.m-lead__echo li{border-top:1px solid rgba(138,94,28,.25);}
.m-lead__echo a{display:block;min-height:var(--tap-min);padding:var(--space-2) 0;color:var(--color-ink);text-decoration:none;font-size:var(--text-body-sm);line-height:var(--leading-snug-mobile);}
.m-lead__o{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:var(--tracking-wide);font-size:9px;font-weight:var(--weight-bold);color:var(--color-gold-ink);margin-right:var(--space-1);}
.m-lead__foot{display:flex;justify-content:flex-end;}
/* Band */
.m-band{border-top:3px solid var(--band-hue,var(--color-ink));padding-top:var(--space-2);margin:0 0 var(--space-8);}
.m-band__head{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-2);margin:0 0 var(--space-2);}
.m-band__name{font-family:var(--font-display);font-size:var(--text-headline-mobile);line-height:var(--leading-snug-mobile);font-weight:var(--weight-bold);margin:0;}
.m-band__n{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:var(--tracking-wide);font-size:var(--text-micro-mobile);color:var(--color-soft-2);white-space:nowrap;font-variant-numeric:tabular-nums;}
/* severity in visual weight: quiet is a line, failures are boxes */
.m-band__quieto{font-family:var(--font-mono);font-size:var(--text-caption);line-height:var(--leading-relaxed);color:var(--color-soft);border-left:3px solid var(--color-rule-strong);padding:var(--space-1) 0 var(--space-1) var(--space-3);margin:0 0 var(--space-3);}
.m-band__alert{border-radius:var(--radius-sm);padding:var(--space-3);font-size:var(--text-body-sm);line-height:var(--leading-normal);margin:0 0 var(--space-3);border:var(--border-width) solid;border-left-width:var(--border-width-4);}
.m-band__alert--detenida{background:var(--color-warn-bg);border-color:var(--color-warn);color:var(--color-ink);}
.m-band__alert--fallida{background:var(--color-signal-bg);border-color:var(--color-signal-strong);color:var(--color-ink);}
.m-band__receipt{display:block;margin-top:var(--space-2);font-family:var(--font-mono);font-size:9px;letter-spacing:.06em;color:var(--color-soft);}
/* Compact rows — the default weight below the featured card */
.m-rows{list-style:none;margin:0 0 var(--space-2);padding:0;}
.m-rows li + li{border-top:var(--border-width) solid var(--color-rule);}
.m-rows a{display:block;padding:var(--space-2) 0;min-height:var(--tap-min);text-decoration:none;color:var(--color-ink);}
.m-row__pre{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:var(--tracking-wide);font-size:9px;font-weight:var(--weight-bold);color:var(--band-hue,var(--color-soft));margin-right:var(--space-1);}
.m-row__pre--prensa{color:var(--color-soft-2);}
.m-row__t{font-size:var(--text-body-sm);line-height:var(--leading-snug-mobile);}
.m-row__meta{font-family:var(--font-mono);font-size:9px;letter-spacing:.06em;color:var(--color-soft-2);margin-left:var(--space-1);white-space:nowrap;}