/*
 * MeteoSensor Local v0.12.089 — ARQUITECTURA VISUAL MESTRA
 * Base exacta: v0.12.087.
 *
 * Objectiu: una única jerarquia visual i una única gramàtica de components
 * per a Configuració, Previsió, Gràfiques, Ajuda, diàlegs i controls comuns.
 * La pantalla «Ara» conserva expressament la seva identitat visual pròpia:
 * no es redissenyen les sis targetes, els dibuixos ni la seva geometria.
 *
 * Regla: mateixa funció = mateixa mida, pes, color, radi, fons i espaiat.
 */

:root{
  /* Família única de lectura. No s'introdueix cap font nova. */
  --arch-font:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;

  /* Jerarquia tipogràfica canònica. */
  --arch-fs-screen:clamp(30px,7.5vw,34px);   /* nivell 1: pantalla */
  --arch-fs-screen-sub:clamp(19px,4.8vw,22px);
  --arch-fs-section:clamp(22px,5.45vw,25px);/* nivell 2: secció */
  --arch-fs-item:19px;                       /* nivell 3: element */
  --arch-fs-control:17px;                    /* nivell d'acció/control */
  --arch-fs-body:15.5px;                     /* nivell 4: lectura explicativa */
  --arch-fs-label:16.5px;                    /* nivell 3: etiqueta/subtítol intern */
  --arch-fs-meta:15.5px;                     /* nivell 4: ajuda/font/metadada */
  --arch-fs-axis:13px;                     /* excepció tècnica: eixos */
  --arch-fs-data:19px;                       /* dada en camp */

  --arch-fw-regular:400;
  --arch-fw-medium:400;
  --arch-fw-label:600;
  --arch-fw-strong:700;
  --arch-fw-data:700;

  --arch-lh-tight:1.08;
  --arch-lh-title:1.12;
  --arch-lh-body:1.48;
  --arch-lh-meta:1.36;

  /* Ritme únic 4 / 8 / 12 / 16 / 24. */
  --arch-s1:4px;
  --arch-s2:8px;
  --arch-s3:12px;
  --arch-s4:16px;
  --arch-s5:24px;

  --arch-radius-panel:20px;
  --arch-radius-control:16px;
  --arch-control-h:50px;

  /* El verd funcional és únic i hereta el verd vigent del tema. */
  --arch-accent:var(--green);
  --arch-link:#3a5273;
  --arch-primary:#8fc3a2;
  --arch-primary-border:#5f9e79;
}

:root[data-theme="light"]{
  --arch-text:#13201b;
  --arch-text-2:#596a62;
  --arch-text-3:#77847e;
  --arch-panel:#fbfcfb;
  --arch-panel-soft:#f4f7f5;
  --arch-readout:#ffffff;
  --arch-control:var(--ms-light-page,#bed0c7);
  --arch-control-hover:#b5d0c1;
  --arch-selected:#a6cdb6;
  --arch-primary:#8fc3a2;
  --arch-primary-border:#5f9e79;
  --arch-border:#a8b8b0;
  --arch-divider:#d5ddd9;
  --arch-shadow:0 1px 2px rgba(23,56,43,.08);
  --arch-link:#3a5273;
  --arch-success-small:#0a8531;
}

:root[data-theme="dark"]{
  --arch-text:#f4f7f5;
  --arch-text-2:#b8c7c0;
  --arch-text-3:#91a59b;
  --arch-panel:#10271f;
  --arch-panel-soft:#153027;
  --arch-readout:#19372d;
  --arch-control:var(--ms-dark-page-deep,#17372d);
  --arch-control-hover:#244a3c;
  --arch-selected:#315b49;
  --arch-primary:#4c7a5e;
  --arch-primary-border:#68957a;
  --arch-border:#5b766a;
  --arch-divider:#355247;
  --arch-shadow:0 1px 2px rgba(0,0,0,.22);
  --arch-link:#a9c0dc;
  --arch-success-small:#7fd89a;
}

html,body,button,input,select,textarea,optgroup{
  font-family:var(--arch-font)!important;
}

/* ========================================================================
   1. CAPÇALERA DE PANTALLA — NIVELL 1, IDÈNTIC A TOTA L'APP
   ======================================================================== */
.v19-screen-heading,
.charts-v012005 .v19-screen-heading,
.forecast-v012005 .v19-screen-heading,
.help-v012003 .v19-screen-heading,
.config-page .v19-screen-heading{
  grid-template-columns:34px minmax(0,1fr)!important;
  gap:12px!important;
  align-items:center!important;
  margin:0 0 var(--arch-s4)!important;
}
.v19-screen-heading h1,
.charts-v012005 .v19-screen-heading h1,
.forecast-v012005 .v19-screen-heading h1,
.help-v012003 .v19-screen-heading h1,
.config-page .v19-screen-heading h1{
  margin:0!important;
  color:var(--arch-text)!important;
  font-size:var(--arch-fs-screen)!important;
  font-weight:var(--arch-fw-strong)!important;
  line-height:var(--arch-lh-tight)!important;
  letter-spacing:-.015em!important;
}
.v19-screen-heading p,
.charts-v012005 .v19-screen-heading p,
.forecast-v012005 .v19-screen-heading p,
.help-v012003 .v19-screen-heading p{
  margin:4px 0 0!important;
  color:var(--arch-accent)!important;
  font-size:var(--arch-fs-screen-sub)!important;
  font-weight:var(--arch-fw-label)!important;
  line-height:var(--arch-lh-title)!important;
}
.v19-screen-icon,
.charts-v012005 .v19-screen-icon,
.forecast-v012005 .v19-screen-icon,
.help-v012003 .v19-screen-icon{
  width:34px!important;
  height:34px!important;
  color:var(--arch-text)!important;
}
.v19-help-icon{color:var(--arch-accent)!important;font-weight:var(--arch-fw-strong)!important;}

/* ========================================================================
   2. NIVELL 2 — TÍTOLS DE SECCIÓ: SEMPRE VERD, MATEIXA MIDA I PES
   ======================================================================== */
.config-page.ui-system-master .config-section h2,
.forecast-v012005.ui-system-master .v4-section-title h2,
.charts-v012005.ui-system-master>.v4-group-title>strong,
.environment-guide-title,
.version-title{
  margin:0!important;
  color:var(--arch-accent)!important;
  font-size:var(--arch-fs-section)!important;
  font-weight:var(--arch-fw-strong)!important;
  line-height:var(--arch-lh-title)!important;
  letter-spacing:-.01em!important;
}

/* Els títols de la font/grup de Gràfiques són seccions, no un nivell especial. */
.charts-v012005.ui-system-master>.ui-source-group strong{
  color:var(--arch-accent)!important;
  font-size:var(--arch-fs-section)!important;
  font-weight:var(--arch-fw-strong)!important;
  line-height:var(--arch-lh-title)!important;
}
.charts-v012005.ui-system-master>.ui-source-group span{
  color:var(--arch-text-2)!important;
  font-size:var(--arch-fs-meta)!important;
  font-weight:var(--arch-fw-label)!important;
  line-height:var(--arch-lh-meta)!important;
}

/* ========================================================================
   3. NIVELL 3 — TÍTOL D'ELEMENT: NEGRE/BLANC, 18 PX, 700
   L'accent de magnitud viu a la icona/traç, no canvia la jerarquia del text.
   ======================================================================== */
.config-page.ui-system-master .saved-copy strong,
.config-page.ui-system-master .install-preview strong,
.config-page.ui-system-master .widget-name,
.forecast-v012005.ui-system-master .v4-hero-grid>h3,
.forecast-v012005.ui-system-master .v4-aqi>div:first-child>strong,
.forecast-v012005.ui-system-master .v67-compare-row>h3,
.forecast-v012005.ui-system-master .v4-air>h3,
.charts-v012005.ui-system-master .v4-chart-title h2,
.charts-v012005.ui-system-master .v3-chart-title h2,
.help-v012003 .help-section summary,
.environment-topic-label,
.environment-now-notes>summary,
.forecast-help-body h3,
.modal-head strong{
  color:var(--arch-text)!important;
  font-size:var(--arch-fs-item)!important;
  font-weight:var(--arch-fw-strong)!important;
  line-height:1.22!important;
  letter-spacing:0!important;
}

/* ========================================================================
   4. COS, ETIQUETES I METADADES — UNA SOLA ESCALA
   ======================================================================== */
.config-page.ui-system-master .field label,
.config-page.ui-system-master .version-row span,
.forecast-v012005.ui-system-master .v4-field>label,
.forecast-v012005.ui-system-master .v4-pollen label,
.forecast-v012005.ui-system-master .v4-celestial-times b,
.charts-v012005.ui-system-master .v3-datebox label,
.charts-v012005.ui-system-master .v4-stats span{
  color:var(--arch-text-2)!important;
  font-size:var(--arch-fs-label)!important;
  font-weight:var(--arch-fw-label)!important;
  line-height:1.25!important;
}

.help-v012003 .help-section-body>p,
.help-v012003 .help-section-body li,
.forecast-help-body p,
.environment-reading p,
.install-instructions p{
  color:var(--arch-text)!important;
  font-size:var(--arch-fs-body)!important;
  font-weight:var(--arch-fw-regular)!important;
  line-height:var(--arch-lh-body)!important;
}

.config-page.ui-system-master .field-help,
.config-page.ui-system-master .field-note,
.config-page.ui-system-master .saved-copy span,
.config-page.ui-system-master .install-preview span,
.config-page.ui-system-master .release-notes,
.config-page.ui-system-master .config-footer,
.forecast-v012005.ui-system-master .v4-card>footer,
.forecast-v012005.ui-system-master .v4-celestial>footer,
.forecast-v012005.ui-system-master .v4-astro-source,
.forecast-v012005.ui-system-master .v4-location small,
.charts-v012005.ui-system-master .v4-chart-card>footer,
.charts-v012005.ui-system-master .v3-noise-empty>footer,
.charts-v012005.ui-system-master .v4-chart-meta,
.charts-v012005.ui-system-master .v4-multi-legend,
.help-v012003 .v3-help-intro,
.help-v012003 .help-search p,
.help-v012003 .help-links a,
.forecast-help-source,
.modal-head span,
.map-toolbar span,
.map-selection span,
.source-note{
  color:var(--arch-text-2)!important;
  font-size:var(--arch-fs-meta)!important;
  font-weight:var(--arch-fw-medium)!important;
  line-height:var(--arch-lh-meta)!important;
}

/* ========================================================================
   5. SUPERFÍCIES — UNA SOLA TARGETA/PANELL
   ======================================================================== */
.config-page.ui-system-master>.config-section,
.forecast-v012005.ui-system-master>.v4-card,
.forecast-v012005.ui-system-master .v4-astro>.v4-celestial,
.forecast-v012005.ui-system-master .v4-astro>.v4-phase,
.charts-v012005.ui-system-master>.v3-period-panel,
.charts-v012005.ui-system-master>.history-status-card,
.charts-v012005.ui-system-master>.v4-chart-card,
.charts-v012005.ui-system-master>.v3-noise-empty,
.help-v012003 .help-search,
.help-v012003 .help-card,
.detail,
.config-modal-panel,
.version-card{
  background:var(--arch-panel)!important;
  background-image:none!important;
  border:1px solid var(--arch-border)!important;
  border-radius:var(--arch-radius-panel)!important;
  box-shadow:var(--arch-shadow)!important;
}

.config-page.ui-system-master>.config-section,
.help-v012003 .help-search{
  padding:var(--arch-s4)!important;
}
.config-page.ui-system-master>.config-section,
.forecast-v012005.ui-system-master>.v4-card,
.charts-v012005.ui-system-master>.v3-period-panel,
.charts-v012005.ui-system-master>.history-status-card,
.charts-v012005.ui-system-master>.v4-chart-card,
.charts-v012005.ui-system-master>.v3-noise-empty{
  margin-bottom:var(--arch-s3)!important;
}

/* ========================================================================
   6. CAMPS DE DADA/LECTURA — SEMPRE EL MATEIX COMPONENT
   ======================================================================== */
.config-page.ui-system-master .field input,
.config-page.ui-system-master .field select,
.forecast-v012005.ui-system-master .v4-value-box,
.forecast-v012005.ui-system-master .v4-celestial-times strong,
.forecast-v012005.ui-system-master .v4-phase-line,
.charts-v012005.ui-system-master .v3-datebox input,
.charts-v012005.ui-system-master .v4-stats .v4-measure,
.help-v012003 .help-search input{
  min-height:var(--arch-control-h)!important;
  height:var(--arch-control-h)!important;
  box-sizing:border-box!important;
  border:1px solid var(--arch-border)!important;
  border-radius:var(--arch-radius-control)!important;
  background:var(--arch-readout)!important;
  background-image:none!important;
  color:var(--arch-text)!important;
  box-shadow:none!important;
}

.config-page.ui-system-master .field input,
.config-page.ui-system-master .field select,
.help-v012003 .help-search input{
  padding:0 14px!important;
  font-size:var(--arch-fs-data)!important;
  font-weight:var(--arch-fw-data)!important;
  line-height:1.15!important;
}

.forecast-v012005.ui-system-master .v4-value-box>.v4-measure,
.forecast-v012005.ui-system-master .v4-celestial-times .v4-time-line,
.forecast-v012005.ui-system-master .v4-secondary-data,
.forecast-v012005.ui-system-master .v69-compare-value,
.charts-v012005.ui-system-master .v4-stats .v4-measure,
.charts-v012005.ui-system-master .v3-period-panel .v54-period-value{
  color:var(--arch-text)!important;
  font-size:var(--arch-fs-data)!important;
  font-weight:var(--arch-fw-data)!important;
  line-height:1!important;
}

/* ========================================================================
   7. BOTONS I DESPLEGABLES — TRES ESTATS I CAP MÉS
   primari / secundari / seleccionat
   ======================================================================== */
.config-page.ui-system-master .save-station-top,
.config-page.ui-system-master .share-main,
.config-page.ui-system-master .mini-button,
.config-page.ui-system-master .config-secondary,
.config-page.ui-system-master .input-action button,
.config-page.ui-system-master .saved-actions button,
.config-page.ui-system-master .language-buttons button,
.config-page.ui-system-master .theme-buttons button,
.config-page.ui-system-master .advanced-sensors summary,
.charts-v012005.ui-system-master .v3-period-panel .period,
.charts-v012005.ui-system-master .v3-datebox .btn,
.btn,
.config-modal .map-toolbar button,
.config-modal .map-selection button{
  min-height:var(--arch-control-h)!important;
  height:var(--arch-control-h)!important;
  box-sizing:border-box!important;
  padding:0 14px!important;
  border:1px solid var(--arch-border)!important;
  border-radius:var(--arch-radius-control)!important;
  background:var(--arch-control)!important;
  background-image:none!important;
  color:var(--arch-text)!important;
  font-size:var(--arch-fs-control)!important;
  font-weight:var(--arch-fw-label)!important;
  line-height:1.15!important;
  box-shadow:none!important;
}

.config-page.ui-system-master .save-station-top,
.config-page.ui-system-master .share-main,
.charts-v012005.ui-system-master .v3-datebox .btn,
.config-modal .map-selection button,
.btn{
  background:var(--arch-primary)!important;
  border-color:var(--arch-primary-border)!important;
  color:#07140e!important;
  font-weight:var(--arch-fw-strong)!important;
}

.config-page.ui-system-master .language-buttons button.active,
.config-page.ui-system-master .theme-buttons button.active,
.charts-v012005.ui-system-master .v3-period-panel .period.active{
  background:var(--arch-selected)!important;
  border-color:var(--arch-primary-border)!important;
  color:var(--arch-text)!important;
  font-weight:var(--arch-fw-strong)!important;
}

@media(hover:hover){
  .config-page.ui-system-master .config-secondary:hover,
  .config-page.ui-system-master .language-buttons button:hover,
  .config-page.ui-system-master .theme-buttons button:hover,
  .charts-v012005.ui-system-master .v3-period-panel .period:hover,
  .config-modal .map-toolbar button:hover{
    background:var(--arch-control-hover)!important;
  }
}

/* ========================================================================
   8. CONFIGURACIÓ — RITME ÚNIC
   ======================================================================== */
.config-page.ui-system-master .config-grid,
.config-page.ui-system-master .saved-list{
  gap:var(--arch-s3)!important;
}
.config-page.ui-system-master .config-section h2{
  margin-bottom:var(--arch-s3)!important;
}
.config-page.ui-system-master .field label{margin:0 0 6px!important;}
.config-page.ui-system-master .field-help{margin:6px 0 0!important;}
.config-page.ui-system-master .version-row{
  min-height:42px!important;
  padding:10px 0!important;
  border-bottom:1px solid var(--arch-divider)!important;
}
.config-page.ui-system-master .saved-row,
.config-page.ui-system-master .widget-sample{
  border:1px solid var(--arch-divider)!important;
  border-radius:var(--arch-radius-control)!important;
  background:var(--arch-panel-soft)!important;
  box-shadow:none!important;
}
.config-page.ui-system-master .advanced-sensors{
  border-color:var(--arch-border)!important;
  border-radius:var(--arch-radius-control)!important;
  background:transparent!important;
}
.config-page.ui-system-master .release-notes-title{
  color:var(--arch-text-2)!important;
  font-size:var(--arch-fs-label)!important;
  font-weight:var(--arch-fw-label)!important;
  text-decoration:none!important;
}

/* ========================================================================
   9. PREVISIÓ — MATEIXA JERARQUIA, SENSE NIVELLS PARAL·LELS
   ======================================================================== */
.forecast-v012005.ui-system-master>.v4-section-title,
.forecast-v012005.ui-system-master .v4-astro>.v4-section-title{
  margin:var(--arch-s5) 4px var(--arch-s3)!important;
}
.forecast-v012005.ui-system-master .v4-card>.v4-section-title,
.forecast-v012005.ui-system-master>.v4-forecast-hero>.v46-card-title{
  margin:0 0 var(--arch-s3)!important;
}
.forecast-v012005.ui-system-master>.v4-forecast-hero,
.forecast-v012005.ui-system-master>.v4-details,
.forecast-v012005.ui-system-master>.v4-air,
.forecast-v012005.ui-system-master>.v4-compare{
  padding:var(--arch-s4)!important;
}
.forecast-v012005.ui-system-master>.v4-hourly,
.forecast-v012005.ui-system-master>.v4-daily-list{
  padding-top:var(--arch-s4)!important;
}
.forecast-v012005.ui-system-master .v4-fields,
.forecast-v012005.ui-system-master .v47-hero-summary,
.forecast-v012005.ui-system-master .v47-temperature-extremes{
  gap:var(--arch-s3)!important;
}
.forecast-v012005.ui-system-master .v4-field{gap:6px!important;}
.forecast-v012005.ui-system-master .v4-cape{
  border-top:1px solid var(--arch-divider)!important;
}
.forecast-v012005.ui-system-master .v4-cape summary{
  color:var(--arch-text)!important;
  font-size:var(--arch-fs-item)!important;
  font-weight:var(--arch-fw-strong)!important;
}
.forecast-v012005.ui-system-master a,
.forecast-help-source a,
.environment-source-links a{
  color:var(--arch-link)!important;
  text-decoration:underline!important;
  text-underline-offset:2px!important;
}

/* Estat d'actualització: mateix component a Previsió i Gràfiques. */
.forecast-v012005.ui-system-master>.v5-forecast-status,
.charts-v012005.ui-system-master>.history-status-card{
  padding:12px 14px!important;
  gap:4px!important;
  border-radius:var(--arch-radius-panel)!important;
  background:var(--arch-panel)!important;
  box-shadow:var(--arch-shadow)!important;
}
.forecast-v012005.ui-system-master>.v5-forecast-status .connection-state,
.charts-v012005.ui-system-master>.history-status-card .connection-state{
  font-size:var(--arch-fs-control)!important;
  font-weight:var(--arch-fw-strong)!important;
  line-height:1.18!important;
}
.forecast-v012005.ui-system-master>.v5-forecast-status .connection-label,
.forecast-v012005.ui-system-master>.v5-forecast-status .connection-stamp strong,
.forecast-v012005.ui-system-master>.v5-forecast-status .connection-hint-line,
.charts-v012005.ui-system-master>.history-status-card .connection-label,
.charts-v012005.ui-system-master>.history-status-card .connection-stamp strong{
  font-size:var(--arch-fs-meta)!important;
  line-height:1.25!important;
}

/* ========================================================================
   10. GRÀFIQUES — TÍTOLS NEUTRES, ACCENT NOMÉS A LA DADA/ICONA/TRAÇ
   ======================================================================== */
.charts-v012005.ui-system-master>.v4-group-title{
  margin:var(--arch-s5) 4px var(--arch-s3)!important;
  gap:4px!important;
}
.charts-v012005.ui-system-master>.v4-chart-card,
.charts-v012005.ui-system-master>.v3-noise-empty{
  padding:var(--arch-s4) var(--arch-s4) 0!important;
}
.charts-v012005.ui-system-master .v4-chart-title h2,
.charts-v012005.ui-system-master .v3-chart-title h2{
  color:var(--arch-text)!important;
}
.charts-v012005.ui-system-master .v4-chart-title .title-icon,
.charts-v012005.ui-system-master .v3-chart-title .title-icon{
  width:38px!important;
  height:38px!important;
  flex:0 0 38px!important;
}
.charts-v012005.ui-system-master .v4-chart-svg .v4-ytext,
.charts-v012005.ui-system-master .v4-chart-svg .v4-xtext,
.charts-v012005.ui-system-master .v4-chart-svg .v4-axis-unit{
  fill:var(--arch-text-2)!important;
  color:var(--arch-text-2)!important;
  font-size:var(--arch-fs-axis)!important;
  font-weight:var(--arch-fw-medium)!important;
}
.charts-v012005.ui-system-master .v4-chart-svg .v4-grid-x,
.charts-v012005.ui-system-master .v4-chart-svg .v4-grid-y{
  stroke:var(--arch-divider)!important;
}

/* ========================================================================
   11. AJUDA — LECTURA EDITORIAL, MATEIXA JERARQUIA
   ======================================================================== */
.help-v012003 .v3-help-intro{
  margin:0 2px var(--arch-s3)!important;
}
.help-v012003 .help-search{
  margin:0 0 var(--arch-s3)!important;
}
.help-v012003 .help-search label{
  display:block!important;
  margin:0 0 7px!important;
  color:var(--arch-text)!important;
  font-size:var(--arch-fs-item)!important;
  font-weight:var(--arch-fw-strong)!important;
  line-height:1.2!important;
}
.help-v012003 .help-card{
  padding:0 var(--arch-s4)!important;
  overflow:hidden!important;
}
.help-v012003 .help-section{
  margin:0!important;
  border-bottom:1px solid var(--arch-divider)!important;
}
.help-v012003 .help-section:last-child{border-bottom:0!important;}
.help-v012003 .help-section summary{
  padding:15px 0!important;
  cursor:pointer!important;
}
.help-v012003 .help-section-body{
  padding:0 0 var(--arch-s4)!important;
}
.help-v012003 .help-section-body>p{margin:0 0 var(--arch-s3)!important;}
.help-v012003 .help-section-body li{margin:5px 0!important;}
.help-v012003 .help-links a,
.environment-source-links a{
  color:var(--arch-link)!important;
  font-size:var(--arch-fs-meta)!important;
  font-weight:var(--arch-fw-label)!important;
}

/* ========================================================================
   12. MENÚS CONTEXTUALS / HISTORIALS — MATEIX PATRÓ QUE AJUDA
   ======================================================================== */
.detail{
  padding:var(--arch-s4)!important;
}
.detail-title{
  color:var(--arch-accent)!important;
  font-size:var(--arch-fs-section)!important;
  font-weight:var(--arch-fw-strong)!important;
  line-height:var(--arch-lh-title)!important;
}
.detail-meta{
  color:var(--arch-text-2)!important;
  font-size:var(--arch-fs-meta)!important;
  font-weight:var(--arch-fw-medium)!important;
  line-height:var(--arch-lh-meta)!important;
}
.detail-current{
  border-top:1px solid var(--arch-divider)!important;
  border-bottom:1px solid var(--arch-divider)!important;
  color:var(--arch-text)!important;
  font-weight:var(--arch-fw-data)!important;
}
.history-row{
  border:1px solid var(--arch-divider)!important;
  border-radius:var(--arch-radius-control)!important;
  background:var(--arch-panel-soft)!important;
  box-shadow:none!important;
}
.history-time{font-weight:var(--arch-fw-medium)!important;}
.history-ago{color:var(--arch-text-2)!important;font-weight:var(--arch-fw-medium)!important;}
.history-val{color:var(--arch-text)!important;font-weight:var(--arch-fw-data)!important;}
.forecast-help-icon{
  border:1px solid var(--arch-border)!important;
  background:var(--arch-control)!important;
  color:var(--arch-accent)!important;
  box-shadow:none!important;
}
.forecast-help-body{gap:var(--arch-s2)!important;}
.forecast-help-body h3{margin:var(--arch-s3) 0 0!important;}
.forecast-help-source{
  border-top:1px solid var(--arch-divider)!important;
  padding-top:var(--arch-s3)!important;
}
.forecast-help-source strong{color:var(--arch-text)!important;font-weight:var(--arch-fw-strong)!important;}

/* ========================================================================
   13. MODALS DE CONFIGURACIÓ / MAPA / INSTAL·LACIÓ
   ======================================================================== */
.config-modal-panel{padding:var(--arch-s4)!important;}
.modal-head{margin-bottom:var(--arch-s3)!important;}
.modal-head button,
.close{
  border:1px solid var(--arch-border)!important;
  background:var(--arch-control)!important;
  color:var(--arch-text)!important;
  box-shadow:none!important;
}
.map-toolbar{margin-bottom:var(--arch-s2)!important;}
.map-selection{margin-top:var(--arch-s3)!important;}
.install-step{
  border:1px solid var(--arch-divider)!important;
  border-radius:var(--arch-radius-control)!important;
  background:var(--arch-panel-soft)!important;
  box-shadow:none!important;
}
.install-step>strong{
  color:var(--arch-text)!important;
  font-size:var(--arch-fs-body)!important;
  font-weight:var(--arch-fw-label)!important;
}

/* ========================================================================
   14. NAVEGACIÓ INFERIOR — UNA SOLA JERARQUIA I PES
   ======================================================================== */
.bottomnav{
  border-top:1px solid var(--arch-border)!important;
  box-shadow:0 -2px 8px rgba(0,0,0,.05)!important;
}
.bottomnav .navlabel{
  color:var(--arch-accent)!important;
  font-size:clamp(14px,3.7vw,17px)!important;
  font-weight:var(--arch-fw-label)!important;
}
.bottomnav .navbtn.active .navlabel{font-weight:var(--arch-fw-strong)!important;}

/* ========================================================================
   15. ENLLAÇOS I FOCUS — COMPORTAMENT ÚNIC
   ======================================================================== */
.help-v012003 a,
.config-page.ui-system-master a,
.forecast-v012005.ui-system-master a,
.charts-v012005.ui-system-master a,
.detail a{
  color:var(--arch-link)!important;
}
button:focus-visible,
input:focus-visible,
select:focus-visible,
summary:focus-visible,
a:focus-visible{
  outline:2px solid color-mix(in srgb,var(--arch-accent) 65%,transparent)!important;
  outline-offset:2px!important;
}

/* ========================================================================
   16. ARA — EXCEPCIÓ DELIBERADA
   Les sis targetes, els seus colors, dibuixos, màscares, proporcions i
   geometria queden fora d'aquesta arquitectura. Només comparteixen la
   capçalera comuna i la navegació, perquè tenen la mateixa funció global.
   ======================================================================== */

@media(max-width:390px){
  :root{
    --arch-fs-screen:29px;
    --arch-fs-screen-sub:19px;
    --arch-fs-section:22px;
    --arch-fs-item:18px;
    --arch-fs-control:17px;
    --arch-fs-body:15.5px;
    --arch-fs-label:16.5px;
    --arch-fs-meta:15.5px;
    --arch-fs-data:18.5px;
  }
  .v19-screen-heading,
  .charts-v012005 .v19-screen-heading,
  .forecast-v012005 .v19-screen-heading,
  .help-v012003 .v19-screen-heading,
  .config-page .v19-screen-heading{
    grid-template-columns:32px minmax(0,1fr)!important;
    gap:10px!important;
  }
  .v19-screen-icon,
  .charts-v012005 .v19-screen-icon,
  .forecast-v012005 .v19-screen-icon,
  .help-v012003 .v19-screen-icon{
    width:32px!important;
    height:32px!important;
  }
}

/* ========================================================================
   17. ENFORCEMENT CANÒNIC
   El full històric conté regles !important amb especificitat elevada. Aquest
   bloc final fixa els tokens del sistema antic als tokens mestres nous i
   repeteix amb la mateixa especificitat els nivells que no poden divergir.
   ======================================================================== */
:root{
  --ui-section-title-size:var(--arch-fs-section);
  --ui-item-title-size:var(--arch-fs-item);
  --ui-field-size:var(--arch-fs-control);
  --ui-readout-size:var(--arch-fs-data);
  --ui-data-field-size:var(--arch-fs-data);
  --ui-readout-weight:var(--arch-fw-data);
  --ui-control-size:var(--arch-fs-control);
  --ui-body-size:var(--arch-fs-meta);
  --ui-control-height:var(--arch-control-h);
  --ui-readout-height:var(--arch-control-h);
}
:root[data-theme="light"]{
  --ui-control-bg:var(--arch-control);
  --ui-control-border:var(--arch-border);
  --ui-readout-bg:var(--arch-readout);
  --ui-readout-text:var(--arch-text);
  --ui-primary-bg:var(--arch-primary);
  --ui-primary-border:var(--arch-primary-border);
  --ui-primary-text:#07140e;
  --ui-selected-bg:var(--arch-selected);
  --ui-selected-border:var(--arch-primary-border);
  --ui-selected-text:var(--arch-text);
  --ui-context-bg:var(--arch-control);
  --ui-helper:var(--arch-text-2);
}
:root[data-theme="dark"]{
  --ui-control-bg:var(--arch-control);
  --ui-control-border:var(--arch-border);
  --ui-readout-bg:var(--arch-readout);
  --ui-readout-text:var(--arch-text);
  --ui-primary-bg:var(--arch-primary);
  --ui-primary-border:var(--arch-primary-border);
  --ui-primary-text:#07140e;
  --ui-selected-bg:var(--arch-selected);
  --ui-selected-border:var(--arch-primary-border);
  --ui-selected-text:var(--arch-text);
  --ui-context-bg:var(--arch-control);
  --ui-helper:var(--arch-text-2);
}

/* Nivell 2: secció. */
:root[data-theme] .config-page.ui-system-master .config-section h2,
:root[data-theme] .forecast-v012005.ui-system-master .v4-section-title h2,
:root[data-theme] .charts-v012005.ui-system-master>.v4-group-title strong,
:root[data-theme] .environment-guide-title{
  color:var(--arch-accent)!important;
  font-size:var(--arch-fs-section)!important;
  font-weight:var(--arch-fw-strong)!important;
  line-height:var(--arch-lh-title)!important;
}
:root[data-theme] .charts-v012005.ui-system-master>.ui-source-group strong{
  color:var(--arch-accent)!important;
  font-size:var(--arch-fs-section)!important;
  font-weight:var(--arch-fw-strong)!important;
  line-height:var(--arch-lh-title)!important;
}
:root[data-theme] .charts-v012005.ui-system-master>.ui-source-group span{
  color:var(--arch-text-2)!important;
  font-size:var(--arch-fs-meta)!important;
  font-weight:var(--arch-fw-label)!important;
  line-height:var(--arch-lh-meta)!important;
}

/* Nivell 3: element. */
:root[data-theme] .config-page.ui-system-master .saved-copy strong,
:root[data-theme] .config-page.ui-system-master .install-preview strong,
:root[data-theme] .config-page.ui-system-master .widget-name,
:root[data-theme] .forecast-v012005.ui-system-master .v4-hero-grid>h3,
:root[data-theme] .forecast-v012005.ui-system-master .v4-aqi>div:first-child>strong,
:root[data-theme] .forecast-v012005.ui-system-master .v67-compare-row>h3,
:root[data-theme] .charts-v012005.ui-system-master .v4-chart-title h2,
:root[data-theme] .charts-v012005.ui-system-master .v3-chart-title h2{
  color:var(--arch-text)!important;
  font-size:var(--arch-fs-item)!important;
  font-weight:var(--arch-fw-strong)!important;
  line-height:1.22!important;
}

/* Etiquetes i metadades. */
:root[data-theme] .config-page.ui-system-master .field label,
:root[data-theme] .config-page.ui-system-master .version-row span,
:root[data-theme] .forecast-v012005.ui-system-master .v4-field>label,
:root[data-theme] .forecast-v012005.ui-system-master .v4-pollen label,
:root[data-theme] .charts-v012005.ui-system-master .v3-datebox label,
:root[data-theme] .charts-v012005.ui-system-master .v4-stats span{
  color:var(--arch-text-2)!important;
  font-size:var(--arch-fs-label)!important;
  font-weight:var(--arch-fw-label)!important;
  line-height:1.25!important;
}
:root[data-theme] .config-page.ui-system-master .field-help,
:root[data-theme] .config-page.ui-system-master .field-note,
:root[data-theme] .config-page.ui-system-master .saved-copy span,
:root[data-theme] .config-page.ui-system-master .install-preview span,
:root[data-theme] .config-page.ui-system-master .release-notes,
:root[data-theme] .config-page.ui-system-master .config-footer,
:root[data-theme] .forecast-v012005.ui-system-master .v4-card>footer,
:root[data-theme] .forecast-v012005.ui-system-master .v4-celestial>footer,
:root[data-theme] .forecast-v012005.ui-system-master .v4-astro-source,
:root[data-theme] .charts-v012005.ui-system-master .v4-chart-card>footer,
:root[data-theme] .charts-v012005.ui-system-master .v3-noise-empty>footer,
:root[data-theme] .charts-v012005.ui-system-master .v4-chart-meta,
:root[data-theme] .charts-v012005.ui-system-master .v4-multi-legend{
  color:var(--arch-text-2)!important;
  font-size:var(--arch-fs-meta)!important;
  font-weight:var(--arch-fw-medium)!important;
  line-height:var(--arch-lh-meta)!important;
}

/* Controls i dades. */
:root[data-theme] .config-page.ui-system-master .field input,
:root[data-theme] .config-page.ui-system-master .field select,
:root[data-theme] .charts-v012005.ui-system-master .v3-datebox input{
  height:var(--arch-control-h)!important;
  min-height:var(--arch-control-h)!important;
  border-color:var(--arch-border)!important;
  background:var(--arch-readout)!important;
  color:var(--arch-text)!important;
  font-size:var(--arch-fs-data)!important;
  font-weight:var(--arch-fw-data)!important;
}
:root[data-theme] .forecast-v012005.ui-system-master .v4-value-box,
:root[data-theme] .forecast-v012005.ui-system-master .v4-celestial-times strong,
:root[data-theme] .forecast-v012005.ui-system-master .v4-phase-line,
:root[data-theme] .charts-v012005.ui-system-master .v4-stats .v4-measure{
  height:var(--arch-control-h)!important;
  min-height:var(--arch-control-h)!important;
  border-color:var(--arch-border)!important;
  background:var(--arch-readout)!important;
  color:var(--arch-text)!important;
  box-shadow:none!important;
}
:root[data-theme] .forecast-v012005.ui-system-master .v4-value-box>.v4-measure,
:root[data-theme] .forecast-v012005.ui-system-master .v5-range .v4-value-box .v4-measure,
:root[data-theme] .charts-v012005.ui-system-master .v4-stats .v4-measure{
  color:var(--arch-text)!important;
  font-size:var(--arch-fs-data)!important;
  font-weight:var(--arch-fw-data)!important;
}

/* Família única de botons. */
:root[data-theme] .config-page.ui-system-master .save-station-top,
:root[data-theme] .config-page.ui-system-master .share-main,
:root[data-theme] .config-page.ui-system-master .mini-button,
:root[data-theme] .config-page.ui-system-master .config-secondary,
:root[data-theme] .config-page.ui-system-master .input-action button,
:root[data-theme] .config-page.ui-system-master .saved-actions button,
:root[data-theme] .config-page.ui-system-master .language-buttons button,
:root[data-theme] .config-page.ui-system-master .theme-buttons button,
:root[data-theme] .config-page.ui-system-master .advanced-sensors summary,
:root[data-theme] .charts-v012005.ui-system-master .v3-period-panel .period,
:root[data-theme] .charts-v012005.ui-system-master .v3-datebox .btn,
:root[data-theme] .config-modal .map-toolbar button,
:root[data-theme] .config-modal .map-selection button{
  height:var(--arch-control-h)!important;
  min-height:var(--arch-control-h)!important;
  border-color:var(--arch-border)!important;
  border-radius:var(--arch-radius-control)!important;
  background:var(--arch-control)!important;
  background-image:none!important;
  color:var(--arch-text)!important;
  font-size:var(--arch-fs-control)!important;
  font-weight:var(--arch-fw-label)!important;
  box-shadow:none!important;
}
:root[data-theme] .config-page.ui-system-master .save-station-top,
:root[data-theme] .config-page.ui-system-master .share-main,
:root[data-theme] .charts-v012005.ui-system-master .v3-datebox .btn,
:root[data-theme] .config-modal .map-selection button{
  background:var(--arch-primary)!important;
  border-color:var(--arch-primary-border)!important;
  color:#07140e!important;
  font-weight:var(--arch-fw-strong)!important;
}
:root[data-theme] .config-page.ui-system-master .language-buttons button.active,
:root[data-theme] .config-page.ui-system-master .theme-buttons button.active,
:root[data-theme] .charts-v012005.ui-system-master .v3-period-panel .period.active{
  background:var(--arch-selected)!important;
  border-color:var(--arch-primary-border)!important;
  color:var(--arch-text)!important;
  font-weight:var(--arch-fw-strong)!important;
}

/* Superfícies amb la mateixa especificitat que el sistema històric. */
:root[data-theme] .config-page.ui-system-master>.config-section,
:root[data-theme] .forecast-v012005.ui-system-master>.v4-forecast-hero,
:root[data-theme] .forecast-v012005.ui-system-master>.v4-hourly,
:root[data-theme] .forecast-v012005.ui-system-master>.v4-daily-list,
:root[data-theme] .forecast-v012005.ui-system-master>.v4-details,
:root[data-theme] .forecast-v012005.ui-system-master>.v4-air,
:root[data-theme] .forecast-v012005.ui-system-master>.v4-compare,
:root[data-theme] .forecast-v012005.ui-system-master .v4-astro>.v4-celestial,
:root[data-theme] .forecast-v012005.ui-system-master .v4-astro>.v4-phase,
:root[data-theme] .charts-v012005.ui-system-master>.v3-period-panel,
:root[data-theme] .charts-v012005.ui-system-master>.history-status-card,
:root[data-theme] .charts-v012005.ui-system-master>.v4-chart-card,
:root[data-theme] .charts-v012005.ui-system-master>.v3-noise-empty{
  background:var(--arch-panel)!important;
  background-image:none!important;
  border-color:var(--arch-border)!important;
  box-shadow:var(--arch-shadow)!important;
}

/* Valors textuals estructurals: sempre contrast correcte en tots dos temes. */
:root[data-theme] .config-page.ui-system-master .version-row strong,
:root[data-theme] .config-page.ui-system-master .config-footer strong,
:root[data-theme] .forecast-v012005.ui-system-master footer strong,
:root[data-theme] .charts-v012005.ui-system-master footer strong,
:root[data-theme] .help-v012003 strong,
:root[data-theme] .detail strong{
  color:var(--arch-text)!important;
}


/* ========================================================================
   18. V0.12.086 — AJUST MESTRE DES DE CONFIGURACIÓ
   Tota correcció de jerarquia feta aquí s'aplica als mateixos rols de
   Previsió, Gràfiques, Ajuda, historials i modals. «Ara» continua essent
   l'excepció visual de les sis targetes.
   ======================================================================== */

/* Tots els botons rectangulars: text realment centrat als dos eixos. */
:root[data-theme] .config-page.ui-system-master .save-station-top,
:root[data-theme] .config-page.ui-system-master .share-main,
:root[data-theme] .config-page.ui-system-master .mini-button,
:root[data-theme] .config-page.ui-system-master .config-secondary,
:root[data-theme] .config-page.ui-system-master .input-action button,
:root[data-theme] .config-page.ui-system-master .saved-actions button,
:root[data-theme] .config-page.ui-system-master .language-buttons button,
:root[data-theme] .config-page.ui-system-master .theme-buttons button,
:root[data-theme] .config-page.ui-system-master .advanced-sensors summary,
:root[data-theme] .charts-v012005.ui-system-master .v3-period-panel .period,
:root[data-theme] .charts-v012005.ui-system-master .v3-datebox .btn,
:root[data-theme] .config-modal .map-toolbar button,
:root[data-theme] .config-modal .map-selection button,
:root[data-theme] .btn,
:root[data-theme] .v3-expand{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  line-height:1.15!important;
}

/* Jerarquia cromàtica única dels botons: secundari -> seleccionat -> primari. */
:root[data-theme] .config-page.ui-system-master .config-secondary,
:root[data-theme] .config-page.ui-system-master .mini-button,
:root[data-theme] .config-page.ui-system-master .input-action button,
:root[data-theme] .config-page.ui-system-master .saved-actions button,
:root[data-theme] .config-page.ui-system-master .language-buttons button,
:root[data-theme] .config-page.ui-system-master .theme-buttons button,
:root[data-theme] .config-page.ui-system-master .advanced-sensors summary,
:root[data-theme] .config-modal .map-toolbar button{
  background:var(--arch-control)!important;
  background-image:none!important;
  border-color:var(--arch-border)!important;
  color:var(--arch-text)!important;
}
:root[data-theme] .config-page.ui-system-master .language-buttons button.active,
:root[data-theme] .config-page.ui-system-master .theme-buttons button.active,
:root[data-theme] .charts-v012005.ui-system-master .v3-period-panel .period.active{
  background:var(--arch-selected)!important;
  border-color:var(--arch-primary-border)!important;
  color:var(--arch-text)!important;
}
:root[data-theme] .config-page.ui-system-master .save-station-top,
:root[data-theme] .config-page.ui-system-master .share-main,
:root[data-theme] .config-modal .map-selection button,
:root[data-theme] .charts-v012005.ui-system-master .v3-datebox .btn,
:root[data-theme] .btn{
  background:var(--arch-primary)!important;
  background-image:none!important;
  border-color:var(--arch-primary-border)!important;
  color:var(--arch-text)!important;
}

/* «Esborrar» manté exactament la caixa secundària; només el text és d'avís. */
:root[data-theme] .config-page.ui-system-master .saved-actions .danger{
  background:var(--arch-control)!important;
  border-color:var(--arch-border)!important;
}

/* Textos de lectura: regular per defecte. La negreta queda reservada a
   títols, dades i <strong>/<b> realment significatius. */
:root[data-theme] .config-page.ui-system-master .field-help,
:root[data-theme] .config-page.ui-system-master .field-note,
:root[data-theme] .config-page.ui-system-master .release-notes,
:root[data-theme] .config-page.ui-system-master .release-notes li,
:root[data-theme] .config-page.ui-system-master .config-footer,
:root[data-theme] .forecast-v012005.ui-system-master .v4-card>footer,
:root[data-theme] .forecast-v012005.ui-system-master .v4-celestial>footer,
:root[data-theme] .forecast-v012005.ui-system-master .v4-astro-source,
:root[data-theme] .charts-v012005.ui-system-master .v4-chart-card>footer,
:root[data-theme] .charts-v012005.ui-system-master .v3-noise-empty>footer,
:root[data-theme] .help-v012003 .help-section-body>p,
:root[data-theme] .help-v012003 .help-section-body li,
:root[data-theme] .forecast-help-body p,
:root[data-theme] .environment-reading p,
:root[data-theme] .source-note{
  font-weight:var(--arch-fw-regular)!important;
}

/* Títol de bloc de notes d'actualització: etiqueta, no paràgraf en negreta. */
:root[data-theme] .config-page.ui-system-master .release-notes-title{
  font-size:var(--arch-fs-label)!important;
  font-weight:var(--arch-fw-label)!important;
  color:var(--arch-text-2)!important;
}

/* Capçalera: icona d'app i botons quadrats tornen a compartir mida exacta. */
:root{--arch-header-square:58px;}
:root[data-theme] .topbar .appicon,
:root[data-theme] .topbar .iconbtn{
  width:var(--arch-header-square)!important;
  height:var(--arch-header-square)!important;
  min-width:var(--arch-header-square)!important;
  min-height:var(--arch-header-square)!important;
  border-radius:16px!important;
  box-sizing:border-box!important;
}
:root[data-theme] .topbar .iconbtn{
  display:grid!important;
  place-items:center!important;
  padding:0!important;
}

/* Mapa: més amplada útil a l'acció llarga i centratge inequívoc. */
:root[data-theme] .config-modal .map-panel{
  --map-main-action-width:min(63%,390px)!important;
}
:root[data-theme] .config-modal .map-toolbar button,
:root[data-theme] .config-modal .map-selection button{
  padding-inline:12px!important;
}
:root[data-theme] .config-modal .map-toolbar #mapStatus{
  font-size:var(--arch-fs-meta)!important;
  font-weight:var(--arch-fw-regular)!important;
  color:var(--arch-text-2)!important;
}

/* Desplegable avançat: quan és obert, la part inferior arrodonida és blanca
   com el contingut i no queda cap falca del gris del títol. */
:root[data-theme] .config-page.ui-system-master details.advanced-sensors{
  overflow:hidden!important;
  background:var(--arch-control)!important;
  border:1px solid var(--arch-border)!important;
  padding:0!important;
}
:root[data-theme] .config-page.ui-system-master details.advanced-sensors[open]{
  background:var(--arch-readout)!important;
}
:root[data-theme] .config-page.ui-system-master details.advanced-sensors[open] summary{
  border-radius:calc(var(--arch-radius-control) - 1px) calc(var(--arch-radius-control) - 1px) 0 0!important;
  border:0!important;
  border-bottom:1px solid var(--arch-divider)!important;
}
:root[data-theme] .config-page.ui-system-master details.advanced-sensors .inner{
  margin:0!important;
  padding:var(--arch-s3)!important;
  background:var(--arch-readout)!important;
  border-radius:0 0 calc(var(--arch-radius-control) - 1px) calc(var(--arch-radius-control) - 1px)!important;
}

/* Valors de versió i dades: un pas per sobre de l'etiqueta, sense exagerar. */
:root[data-theme] .config-page.ui-system-master .version-row strong{
  color:var(--arch-text)!important;
  font-size:var(--arch-fs-control)!important;
  font-weight:var(--arch-fw-strong)!important;
}

@media(max-width:520px){
  :root{--arch-header-square:48px;}
}


/* ========================================================================
   19. V0.12.086 — CONFIGURACIÓ COM A PATRÓ MESTRE VALIDABLE
   Correccions de Configuració que defineixen rols reutilitzables a tota l'app.
   No es modifica la família tipogràfica: continua essent system-ui amb fallbacks.
   ======================================================================== */

/* Estat de càrrega/validació: mateix nivell d'etiqueta a tota Configuració. */
:root[data-theme] .config-page.ui-system-master .chip-status{
  margin:7px 0 0!important;
  font-size:var(--arch-fs-label)!important;
  font-weight:var(--arch-fw-label)!important;
  line-height:1.28!important;
}

/* Notes d'actualització: lectura real de cos, no metadada petita. */
:root[data-theme] .config-page.ui-system-master .release-notes,
:root[data-theme] .config-page.ui-system-master .release-notes li{
  color:var(--arch-text-2)!important;
  font-size:var(--arch-fs-body)!important;
  font-weight:var(--arch-fw-regular)!important;
  line-height:1.48!important;
}
:root[data-theme] .config-page.ui-system-master .release-notes-title{
  font-size:var(--arch-fs-label)!important;
  font-weight:var(--arch-fw-label)!important;
  color:var(--arch-text-2)!important;
}

/* Patró editorial: paraula/etiqueta clau destacada amb pes, però sense pujar
   al negre dels títols i dades principals. */
:root[data-theme] .editorial-key{
  color:var(--arch-text-2)!important;
  font-weight:var(--arch-fw-label)!important;
}

/* Peu de Configuració: metadada llegible; copyright un nivell per sobre. */
:root[data-theme] .config-page.ui-system-master>.config-footer{
  font-size:var(--arch-fs-meta)!important;
  font-weight:var(--arch-fw-regular)!important;
  line-height:1.44!important;
}
:root[data-theme] .config-page.ui-system-master>.config-footer strong.config-copyright{
  color:var(--arch-text)!important;
  font-size:var(--arch-fs-control)!important;
  font-weight:var(--arch-fw-strong)!important;
  line-height:1.25!important;
}
:root[data-theme] .config-page.ui-system-master>.config-footer .config-footer-label{
  color:var(--arch-text-2)!important;
  font-weight:var(--arch-fw-label)!important;
}

/* ------------------------------------------------------------------------
   MAPA SENSOR.COMMUNITY
   Mateixa amplada per a les dues accions. A dalt creix des de l'esquerra;
   a baix creix des de la dreta. Les dues vores coincideixen amb el mapa.
   ------------------------------------------------------------------------ */
:root[data-theme] .config-modal .map-panel{
  --map-main-action-width:min(63%,390px)!important;
}
:root[data-theme] .config-modal .map-toolbar{
  display:grid!important;
  grid-template-columns:var(--map-main-action-width) minmax(0,1fr)!important;
  gap:12px!important;
  align-items:center!important;
  width:100%!important;
}
:root[data-theme] .config-modal .map-toolbar button{
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  justify-self:stretch!important;
  white-space:nowrap!important;
}
:root[data-theme] .config-modal .map-toolbar #mapStatus{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  margin:0!important;
  text-align:center!important;
  white-space:normal!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
  font-size:var(--arch-fs-meta)!important;
  font-weight:var(--arch-fw-regular)!important;
  line-height:1.22!important;
  color:var(--arch-text-2)!important;
}
:root[data-theme] .config-modal .map-selection{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) var(--map-main-action-width)!important;
  gap:12px!important;
  align-items:center!important;
  width:100%!important;
}
:root[data-theme] .config-modal .map-selection>.map-selection-info{
  min-width:0!important;
  display:grid!important;
  gap:2px!important;
  align-content:center!important;
}
:root[data-theme] .config-modal .map-selection>.map-selection-info>strong{
  display:block!important;
  min-width:0!important;
  color:var(--arch-text)!important;
  font-size:var(--arch-fs-control)!important;
  font-weight:var(--arch-fw-strong)!important;
  line-height:1.18!important;
  white-space:nowrap!important;
}
:root[data-theme] .config-modal .map-selection>.map-selection-info>.sensor-line{
  display:block!important;
  min-width:0!important;
  color:var(--arch-text-2)!important;
  font-size:var(--arch-fs-meta)!important;
  font-weight:var(--arch-fw-regular)!important;
  line-height:1.2!important;
  white-space:nowrap!important;
}
:root[data-theme] .config-modal .map-selection button{
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  margin:0!important;
  justify-self:stretch!important;
  white-space:nowrap!important;
}

/* Títols de qualsevol modal de Configuració: mateix rol verd que la resta
   de menús/contextuals. */
:root[data-theme] .config-modal .modal-head>strong,
:root[data-theme] .config-modal .modal-head>div>strong{
  color:var(--arch-accent)!important;
  font-size:var(--arch-fs-item)!important;
  font-weight:var(--arch-fw-strong)!important;
  line-height:1.2!important;
}
:root[data-theme] .config-modal .modal-head span{
  color:var(--arch-text-2)!important;
  font-size:var(--arch-fs-meta)!important;
  font-weight:var(--arch-fw-regular)!important;
  line-height:1.3!important;
}

/* ------------------------------------------------------------------------
   MODAL «CREAR UNA ICONA COM SI FOS UNA APP»
   Adopta la mateixa jerarquia i ritme que Configuració i la resta de modals.
   ------------------------------------------------------------------------ */
:root[data-theme] .config-modal .install-instructions{
  text-align:left!important;
}
:root[data-theme] .config-modal .install-instructions>img{
  display:block!important;
  margin:4px auto 12px!important;
}
:root[data-theme] .config-modal .install-instructions>h2{
  margin:0 0 12px!important;
  color:var(--arch-text)!important;
  font-size:var(--arch-fs-item)!important;
  font-weight:var(--arch-fw-strong)!important;
  line-height:1.2!important;
  text-align:left!important;
}
:root[data-theme] .config-modal .install-steps{
  gap:8px!important;
  margin:12px 0!important;
}
:root[data-theme] .config-modal .install-step{
  height:var(--arch-control-h)!important;
  min-height:var(--arch-control-h)!important;
  padding:0 14px!important;
  grid-template-columns:30px minmax(0,1fr)!important;
  gap:12px!important;
  align-items:center!important;
  background:var(--arch-panel-soft)!important;
  border-color:var(--arch-divider)!important;
}
:root[data-theme] .config-modal .install-step>span{
  width:30px!important;
  height:30px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:50%!important;
  background:var(--arch-selected)!important;
  border:1px solid var(--arch-primary-border)!important;
  color:var(--arch-text)!important;
  font-size:var(--arch-fs-label)!important;
  font-weight:var(--arch-fw-strong)!important;
}
:root[data-theme] .config-modal .install-step>strong{
  color:var(--arch-text)!important;
  font-size:var(--arch-fs-body)!important;
  font-weight:var(--arch-fw-label)!important;
  line-height:1.2!important;
}
:root[data-theme] .config-modal .install-note{
  margin:12px 0 0!important;
  color:var(--arch-text-2)!important;
  font-size:var(--arch-fs-body)!important;
  font-weight:var(--arch-fw-regular)!important;
  line-height:1.42!important;
  text-align:left!important;
}

/* ------------------------------------------------------------------------
   BARRA INFERIOR
   «Ara» havia heretat un desplaçament històric específic; s'anul·la perquè
   icona i etiqueta comparteixin els mateixos eixos de la resta.
   ------------------------------------------------------------------------ */
.bottomnav .navbtn.nav-now .navicon{
  transform:translateY(0)!important;
}
.bottomnav .navbtn.nav-now .navlabel{
  transform:translateY(0)!important;
}


/* ========================================================================
   20. V0.12.087 — ESCALA JERÀRQUICA TANCADA I GLOBAL
   La v0.12.086 havia fet créixer alguns textos de lectura fins a competir amb
   etiquetes i controls. Es corregeix el sistema per ROL, no per pantalla.

   Ordre canònic al mòbil:
   pantalla 29 > secció 22 > element 18 > control 17 > etiqueta 16,5
   > lectura/metadada 15,5. Les dades dels camps són 18,5 com a excepció
   funcional perquè són informació carregada, no un nivell editorial.
   ======================================================================== */

/* NIVELL 3 — etiquetes/subtítols interns: mateix rol a tota l'app. */
:root[data-theme] .config-page.ui-system-master .field label,
:root[data-theme] .config-page.ui-system-master .version-row span,
:root[data-theme] .config-page.ui-system-master .release-notes-title,
:root[data-theme] .forecast-v012005.ui-system-master .v4-field>label,
:root[data-theme] .forecast-v012005.ui-system-master .v4-pollen label,
:root[data-theme] .forecast-v012005.ui-system-master .v4-celestial-times b,
:root[data-theme] .charts-v012005.ui-system-master .v3-datebox label,
:root[data-theme] .charts-v012005.ui-system-master .v4-stats span{
  font-size:var(--arch-fs-label)!important;
  font-weight:var(--arch-fw-label)!important;
  color:var(--arch-text-2)!important;
  line-height:1.25!important;
}

/* NIVELL 4 — lectura i metadada: sempre per sota d'etiquetes i controls. */
:root[data-theme] .config-page.ui-system-master .field-help,
:root[data-theme] .config-page.ui-system-master .field-note,
:root[data-theme] .config-page.ui-system-master .release-notes,
:root[data-theme] .config-page.ui-system-master .release-notes li,
:root[data-theme] .config-page.ui-system-master .saved-copy span,
:root[data-theme] .config-page.ui-system-master .install-preview span,
:root[data-theme] .config-page.ui-system-master>.config-footer,
:root[data-theme] .forecast-v012005.ui-system-master .v4-card>footer,
:root[data-theme] .forecast-v012005.ui-system-master .v4-celestial>footer,
:root[data-theme] .forecast-v012005.ui-system-master .v4-astro-source,
:root[data-theme] .forecast-v012005.ui-system-master .v4-location small,
:root[data-theme] .charts-v012005.ui-system-master .v4-chart-card>footer,
:root[data-theme] .charts-v012005.ui-system-master .v3-noise-empty>footer,
:root[data-theme] .charts-v012005.ui-system-master .v4-chart-meta,
:root[data-theme] .charts-v012005.ui-system-master .v4-multi-legend,
:root[data-theme] .help-v012003 .v3-help-intro,
:root[data-theme] .help-v012003 .help-search p,
:root[data-theme] .forecast-help-source,
:root[data-theme] .source-note,
:root[data-theme] .detail-meta,
:root[data-theme] .install-note{
  font-size:var(--arch-fs-meta)!important;
  font-weight:var(--arch-fw-regular)!important;
  color:var(--arch-text-2)!important;
  line-height:var(--arch-lh-meta)!important;
}

/* Cos editorial de lectura: la mateixa mida de nivell 4 i pes regular. */
:root[data-theme] .help-v012003 .help-section-body>p,
:root[data-theme] .help-v012003 .help-section-body li,
:root[data-theme] .forecast-help-body p,
:root[data-theme] .environment-reading p,
:root[data-theme] .install-instructions p{
  font-size:var(--arch-fs-body)!important;
  font-weight:var(--arch-fw-regular)!important;
  line-height:var(--arch-lh-body)!important;
}

/* Controls: un nivell per sobre d'etiquetes. */
:root[data-theme] .config-page.ui-system-master .save-station-top,
:root[data-theme] .config-page.ui-system-master .share-main,
:root[data-theme] .config-page.ui-system-master .mini-button,
:root[data-theme] .config-page.ui-system-master .config-secondary,
:root[data-theme] .config-page.ui-system-master .input-action button,
:root[data-theme] .config-page.ui-system-master .saved-actions button,
:root[data-theme] .config-page.ui-system-master .language-buttons button,
:root[data-theme] .config-page.ui-system-master .theme-buttons button,
:root[data-theme] .config-page.ui-system-master .advanced-sensors summary,
:root[data-theme] .charts-v012005.ui-system-master .v3-period-panel .period,
:root[data-theme] .charts-v012005.ui-system-master .v3-datebox .btn,
:root[data-theme] .btn,
:root[data-theme] .v3-expand{
  font-size:var(--arch-fs-control)!important;
  font-weight:var(--arch-fw-label)!important;
}

/* Dades carregades: rol propi, més visibles que l'etiqueta que les descriu. */
:root[data-theme] .config-page.ui-system-master .field input,
:root[data-theme] .config-page.ui-system-master .field select,
:root[data-theme] .charts-v012005.ui-system-master .v3-datebox input{
  font-size:var(--arch-fs-data)!important;
  font-weight:var(--arch-fw-data)!important;
  text-align:center!important;
}

/* Missatges d'estat: etiqueta semàntica, no títol ni cos gran. */
:root[data-theme] .config-page.ui-system-master .chip-status{
  font-size:var(--arch-fs-meta)!important;
  font-weight:var(--arch-fw-label)!important;
  line-height:1.25!important;
}

/* Copyright per sobre del nivell de metadades, però per sota d'un títol d'element. */
:root[data-theme] .config-page.ui-system-master>.config-footer strong.config-copyright{
  font-size:var(--arch-fs-control)!important;
  font-weight:var(--arch-fw-strong)!important;
}

/* CAMP SENSOR.COMMUNITY: conserva el component i els marges; el valor llarg
   pot ajustar òpticament la mida mitjançant JS sense retallar-se. */
:root[data-theme] .config-page.ui-system-master #cfgSC{
  min-width:0!important;
  width:100%!important;
  padding-inline:12px!important;
  white-space:nowrap!important;
}

/* MAPA SENSOR.COMMUNITY: geometria validada i tipografia connectada als rols
   mestres. Mateixa funció = mateixa mida també dins del modal. */
:root[data-theme] .config-modal .map-panel .modal-head strong{
  font-size:var(--arch-fs-item)!important;
}
:root[data-theme] .config-modal .map-panel .modal-head span,
:root[data-theme] .config-modal .map-panel .map-toolbar #mapStatus,
:root[data-theme] .config-modal .map-panel .map-selection .sensor-line{
  font-size:var(--arch-fs-meta)!important;
}
:root[data-theme] .config-modal .map-panel .map-toolbar button,
:root[data-theme] .config-modal .map-panel .map-selection button,
:root[data-theme] .config-modal .map-panel .map-selection-info>strong{
  font-size:var(--arch-fs-control)!important;
}


/* ========================================================================
   21. V0.12.088 — TANCAMENT DE CONFIGURACIÓ
   Auditoria final sobre v0.12.087. No es redissenya cap component: s'eliminen
   les últimes excepcions que contradeien els rols mestres.
   ======================================================================== */

/* Estat positiu petit: manté la família cromàtica verda però amb contrast
   suficient per a text funcional de mida reduïda. */
:root[data-theme] .config-page.ui-system-master .chip-status.ok{
  color:var(--arch-success-small)!important;
}

/* Leaflet/OpenStreetMap és una excepció tècnica/legal; només se n'eleva
   lleugerament la llegibilitat sense tocar el contingut ni la geometria. */
:root[data-theme] .config-modal .map-panel .leaflet-control-attribution{
  font-size:12px!important;
  line-height:1.2!important;
}

/* ========================================================================
   22. V0.12.089 — MICROJERARQUIA DE CONFIGURACIÓ I BARRA INFERIOR
   Base exacta: v0.12.088. Només s'apliquen els ajustos aprovats a l'auditoria
   visual de Configuració; la resta de l'arquitectura i la lògica es preserven.
   ======================================================================== */

/* Etiquetes de camp i capçaleres de dades: +0,5 px per separar-les del text
   explicatiu sense alterar-ne el color ni el pes. */
:root[data-theme] .config-page.ui-system-master .field label,
:root[data-theme] .config-page.ui-system-master .version-row span,
:root[data-theme] .config-page.ui-system-master .release-notes-title{
  font-size:17px!important;
}

/* Controls de Configuració: +1 px. L'alçada creix 2 px perquè el text nou
   mantingui el mateix centrat vertical i el mateix aire interior. */
:root[data-theme] .config-page.ui-system-master .save-station-top,
:root[data-theme] .config-page.ui-system-master .share-main,
:root[data-theme] .config-page.ui-system-master .mini-button,
:root[data-theme] .config-page.ui-system-master .config-secondary,
:root[data-theme] .config-page.ui-system-master .input-action button,
:root[data-theme] .config-page.ui-system-master .saved-actions button,
:root[data-theme] .config-page.ui-system-master .language-buttons button,
:root[data-theme] .config-page.ui-system-master .theme-buttons button,
:root[data-theme] .config-page.ui-system-master .advanced-sensors summary,
:root[data-theme] .config-modal .map-toolbar button,
:root[data-theme] .config-modal .map-selection button{
  font-size:18px!important;
  min-height:52px!important;
  height:52px!important;
}

/* Les tres opcions del modal d'instal·lació són accions/passos, no text
   explicatiu: pugen al mateix nivell de control. */
:root[data-theme] .config-modal .install-step{
  min-height:52px!important;
  height:52px!important;
}
:root[data-theme] .config-modal .install-step>strong{
  font-size:18px!important;
  line-height:1.18!important;
}

/* Títols dels modals: mateixa jerarquia visual que un títol de quadre/secció
   (p. ex. «Estació actual»), tal com es va acordar a l'auditoria. */
:root[data-theme] .config-modal .modal-head>strong,
:root[data-theme] .config-modal .modal-head>div>strong,
:root[data-theme] .config-modal .map-panel .modal-head strong{
  font-size:var(--arch-fs-section)!important;
  line-height:var(--arch-lh-title)!important;
}

/* Dades de versió: mateix tractament tipogràfic que les dades variables dels
   camps blancs, no el d'un botó. */
:root[data-theme] .config-page.ui-system-master .version-row strong{
  font-size:var(--arch-fs-data)!important;
  font-weight:var(--arch-fw-data)!important;
}

/* Peu: «Dades:» conserva exactament família, mida i color de la resta de la
   línia; l'única diferència és la negreta. */
:root[data-theme] .config-page.ui-system-master>.config-footer .editorial-key{
  font-family:inherit!important;
  font-size:inherit!important;
  line-height:inherit!important;
  color:inherit!important;
  font-weight:var(--arch-fw-strong)!important;
}

/* Botó amb icona: el conjunt icona + text continua centrat amb la mida nova. */
:root[data-theme] .config-page.ui-system-master .install-button-with-icon{
  min-height:52px!important;
  height:52px!important;
  padding-inline:14px!important;
}
:root[data-theme] .config-page.ui-system-master .install-button-with-icon span{
  font-size:18px!important;
  line-height:1.15!important;
}

/* Barra inferior: les etiquetes queden intactes. Ajust exclusivament òptic
   de les dues icones detectades a l'auditoria. */
.bottomnav .navbtn.nav-now .navicon{
  transform:translateY(-7px)!important;
}
.bottomnav .navbtn.nav-now .signal-icon{
  width:32px!important;
  height:32px!important;
}
.bottomnav .navbtn.nav-forecast .weather-emoji{
  font-size:25px!important;
}
