/* One phone type scale. The important layer overrides legacy desktop font
   declarations without changing their placement, colours or desktop sizes. */
@layer atlas-mobile-type {
 @media(max-width:650px){
  body[data-access=public]{
   --mobile-text:12px;--mobile-control:11px;--mobile-meta:10px;
   --mobile-title:20px;--mobile-panel-title:13px;--mobile-value:20px;
  }
  body[data-access=public] #main{font-size:var(--mobile-text)!important;line-height:1.4!important}
  body[data-access=public] #main :is(p,span,a,b,strong,em,small,label,legend,li,dt,dd,td,th,button,summary,select,figcaption,output){font-size:var(--mobile-text)!important;line-height:1.4!important}
  body[data-access=public] #main h1{font-size:var(--mobile-title)!important;line-height:1.2!important;letter-spacing:-.3px!important}
  body[data-access=public] #main .oc-hero h1{font-size:26px!important;line-height:1.15!important}
  body[data-access=public] #main .oc-hero-copy>div>a{font-size:var(--mobile-control)!important;line-height:1.35!important}
  body[data-access=public] #main .oc-photo-credit{font-size:9px!important;line-height:1.3!important}
  body[data-access=public] #main .oc-replay{font-size:var(--mobile-meta)!important;line-height:1.4!important}
  body[data-access=public] #main :is(h2,h3,h4){font-size:var(--mobile-panel-title)!important;line-height:1.3!important;letter-spacing:0!important}
  body[data-access=public] #main :is(h1,h2,h3,h4) :is(span,a,b,strong,em){font-size:inherit!important;line-height:inherit!important}
  body[data-access=public] #main :is(small,figcaption,.muted,.small,.cp-note,.rc-foot,.eh-foot,.xw-empty){font-size:var(--mobile-meta)!important;line-height:1.35!important}
  body[data-access=public] #main :is(small,figcaption) :is(span,a,b,strong,em){font-size:inherit!important;line-height:inherit!important}
  body[data-access=public] #main :is(button,summary,select,label,legend,.button){font-size:var(--mobile-control)!important;line-height:1.35!important}
  body[data-access=public] #main :is(button,summary,.button){overflow-wrap:anywhere!important}
  body[data-access=public] #main :is(button,summary,label,.button) :is(span,b,strong,small){font-size:inherit!important;line-height:inherit!important}
  /* Editable form text retains the native phone input size. */
  body[data-access=public] #main :is(input:not([type=checkbox]):not([type=radio]):not([type=range]),textarea){font-size:16px!important;line-height:1.35!important}
  body[data-access=public] #main :is(th,td,th :is(span,a,b,strong,button),td :is(span,a,b,strong,button)){font-size:11px!important;line-height:1.35!important}
  body[data-access=public] #main :is(th,td) small{font-size:var(--mobile-meta)!important}
  body[data-access=public] #main :is(.ref-wall-stats strong,.oc-stats strong,.xw-kpi strong,.tw-kpis strong,.hw-kpis strong,.os-metrics strong,.cbx-summary dd,.rb-kpis strong,.ib-influence-score strong){font-size:var(--mobile-value)!important;line-height:1.15!important;font-variant-numeric:tabular-nums}
  body[data-access=public] #main .ib-influence-score strong>small{font-size:var(--mobile-meta)!important;line-height:1.3!important}
  body[data-access=public] #main :is(.ref-person>strong,.nr-executive-identity>strong){font-size:24px!important;line-height:1.15!important;font-variant-numeric:tabular-nums}
  body[data-access=public] #main :is(.ref-votes>b,.ib-metric b,.tw-county dd,.os-number-grid strong){font-size:16px!important;line-height:1.2!important;font-variant-numeric:tabular-nums}
  body[data-access=public] #main .ib-metric b{font-size:clamp(13px,3.7vw,16px)!important;white-space:nowrap}
  body[data-access=public] #main :is(.xw-kpi small,.tw-kpis span,.hw-kpis span,.os-metrics span,.os-metrics small,.ref-wall-stats :is(span,small)){font-size:var(--mobile-meta)!important;line-height:1.35!important}
  body[data-access=public] #main .ib-hero p,body[data-access=public] #main .ib-hero p :is(span,b){font-size:var(--mobile-meta)!important;line-height:1.4!important}
  body[data-access=public] #main .ib-profile-grid b{font-size:clamp(9px,2.9vw,13px)!important;line-height:1.25!important;font-variant-numeric:tabular-nums}
  body[data-access=public] #main .ib-profile-grid :is(span,small){font-size:var(--mobile-meta)!important;line-height:1.3!important}
  body[data-access=public] #main svg :is(text,tspan){font-size:10px!important;line-height:normal!important}
  body[data-access=public] #main .rb-gauges svg text{font-size:20px!important}
  body[data-access=public] #main .atlas-world-label-detail{font-size:9px!important}
  body[data-access=public] #main :is(.atlas-world-credit,.atlas-world-credit a,.maplibregl-ctrl-attrib,.maplibregl-ctrl-attrib a){font-size:9px!important;line-height:1.3!important}
  body[data-access=public] #main :is([data-amm-legend],.ib-map-legend) :is(span,strong,small){font-size:var(--mobile-meta)!important;line-height:1.35!important}
  /* Preview text is sized at the leaf nodes, so desktop span/b rules cannot
     silently enlarge a single label or push its neighbour out of the row. */
  body[data-access=public] #main :is([data-amm-part=preview],.ib-hover) :is(p,span,a,b,strong,small,li,dt,dd,button){font-size:11px!important;line-height:1.35!important}
  body[data-access=public] #main :is([data-amm-part=preview],.ib-hover) :is(h3,h4,header strong){font-size:14px!important;line-height:1.25!important}
  body[data-access=public] #main :is([data-amm-part=preview],.ib-hover) small{font-size:var(--mobile-meta)!important;line-height:1.3!important}
  body[data-access=public] #main .ref-map-preview-metrics>span{font-size:11px!important;line-height:1.3!important}
  body[data-access=public] #main .ref-map-preview-metrics b{font-size:13px!important;line-height:1.35!important;font-variant-numeric:tabular-nums;white-space:nowrap}
  body[data-access=public] #main .ref-map-preview:not([data-amm-expanded=true]) li{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:2px!important}
  body[data-access=public] #main .ref-map-preview:not([data-amm-expanded=true]) li>div{width:100%;min-width:0}
  body[data-access=public] #main .ref-map-preview:not([data-amm-expanded=true]) li>div>span{display:block!important;font-size:11px!important;line-height:1.35!important;overflow-wrap:normal!important}
  body[data-access=public] #main .ref-map-preview:not([data-amm-expanded=true]) li>b{display:flex!important;align-items:baseline;justify-content:space-between;gap:5px;font-size:12px!important;line-height:1.3!important;white-space:nowrap;font-variant-numeric:tabular-nums}
  body[data-access=public] #main .ref-map-preview:not([data-amm-expanded=true]) li>b>small{font-size:var(--mobile-meta)!important;line-height:1.3!important;margin:0!important;white-space:nowrap}
  body[data-access=public] #main :is(.ib-hover-candidate b,.os-hover>div>b,.cbx-hover>div>b,.rb-map-hover .rb-person>b){font-size:12px!important;line-height:1.3!important;font-variant-numeric:tabular-nums}
  body[data-access=public] #main :is(.map-zoom,.atlas-world-zoom,.studio-map-zoom,.tm-zoom,.oc-map-controls) button,body[data-access=public] #main button[aria-label^="Close"],body[data-access=public] #main :is(.amm-close,.ib-hover [data-ib-hover-close]){font-size:16px!important;line-height:1!important}
 }
 @media(max-width:359px){
  body[data-access=public]{--mobile-title:18px;--mobile-value:18px}
  body[data-access=public] #main .ib-hero p,body[data-access=public] #main .ib-hero p :is(span,b){font-size:9px!important}
  body[data-access=public] #main .ref-map-preview:not([data-amm-expanded=true]) li>b>small{font-size:9px!important}
 }
}
