/* Shared formatting roles. Change spacing here for equivalent components,
 * rather than assigning a new rhythm to each page. Specialized map canvases,
 * chart axes, Now artwork and calibration geometry retain their own layout. */
:root{
 --msl-format-field-height:38px;
 --msl-format-label-gap:6px;
 --msl-format-row-gap:12px;
 --msl-format-column-gap:12px;
 --msl-format-title-gap:8px;
 --msl-format-section-gap:16px;
 --msl-format-panel-gap:12px;
 --msl-format-panel-padding:12px;
 --msl-format-page-margin:10px;
 --msl-format-copy-gap:8px;
 --msl-format-radius:16px;
 --msl-disclosure-stack-gap:6px;
 --arch-radius-control:var(--msl-format-radius);
 --arch-radius-panel:var(--msl-format-radius);
 --msl-format-label-size:var(--arch-fs-config-label,17px);
 --msl-format-data-size:var(--arch-fs-data,19px);
 --msl-format-control-size:var(--arch-fs-config-control,18px);
}
/* Field label, value and following row: the compact hourly-detail reference. */
:root[data-theme] #app :is(.forecast-v012005 .v4-field,.detail .v13001-detail-field){
 display:grid!important;grid-template-columns:minmax(0,1fr)!important;
 grid-template-rows:auto var(--msl-format-field-height)!important;
 gap:var(--msl-format-label-gap)!important;min-width:0!important;
 margin:0!important;padding:0!important;
}
:root[data-theme] #app :is(.forecast-v012005.ui-system-master .v64-detail-fields .v4-field>label,.forecast-v012005 .v4-field>label,.detail .v13001-detail-field>span,.config-page .field>label,.charts-v012005 .v3-datebox label,.metric-charts .metric-chart-controls label,.forecast-v012005 .v4-pollen label,.forecast-v012005 .v4-celestial-times>span>b){
 font-family:var(--arch-font)!important;font-size:var(--msl-format-label-size)!important;
 font-weight:var(--arch-fw-label)!important;line-height:1.25!important;
 min-height:0!important;margin:0!important;padding:0!important;
}
:root[data-theme] #app :is(.forecast-v012005 .v4-field>label,.detail .v13001-detail-field>span){display:flex!important;align-items:flex-end!important;}
:root[data-theme] #app :is(.forecast-v012005 .v4-field>.v4-value-box,.detail .v13001-detail-field>strong,.charts-v012005 .v4-stats .v4-measure,.metric-charts .v4-stats .v4-measure){
 height:var(--msl-format-field-height)!important;min-height:var(--msl-format-field-height)!important;
 box-sizing:border-box!important;padding-block:0!important;
}
:root[data-theme] #app :is(.forecast-v012005 .v4-field .v4-measure,.detail .v13001-detail-field>strong,.charts-v012005 .v4-stats .v4-measure,.metric-charts .v4-stats .v4-measure){
 font-family:var(--arch-font)!important;font-size:var(--msl-format-data-size)!important;
 font-weight:var(--arch-fw-data)!important;
}
:root[data-theme] #app :is(.forecast-v012005 .v4-fields,.detail .v13001-detail-grid,.forecast-v012005 .v67-compare-fields,.forecast-v012005 .v4-pollen,.forecast-v012005 .v4-celestial-times){
 row-gap:var(--msl-format-row-gap)!important;column-gap:var(--msl-format-column-gap)!important;
 align-content:start!important;
}
/* Major and minor titles use their established roles, with one content gap. */
:root[data-theme] #app .content .v19-screen-heading{margin-bottom:var(--msl-format-title-gap)!important;}
:root[data-theme] #app :is(.forecast-v012005 .v46-card-title,.config-page .config-section>h2,.forecast-v012005 .v64-forecast-details>h3,.detail :is(.v13010-hour-details,.v13011-hour-details,.v13012-hour-details,.v13013-hour-details)>h3){
 margin-top:0!important;margin-bottom:var(--msl-format-title-gap)!important;
}
:root[data-theme] #app :is(.forecast-v012005.ui-system-master>.v4-forecast-hero .v64-forecast-details>h3,.detail :is(.v13010-hour-details,.v13011-hour-details,.v13012-hour-details,.v13013-hour-details)>h3){
 font-size:var(--arch-fs-item)!important;font-weight:var(--arch-fw-strong)!important;line-height:1.22!important;
}
:root[data-theme] #app .forecast-v012005>.v4-forecast-hero{row-gap:var(--msl-format-title-gap)!important;column-gap:var(--msl-format-column-gap)!important;}
:root[data-theme] #app .forecast-v012005>.v4-forecast-hero>.v46-card-title{margin:0!important;}
:root[data-theme] #app .forecast-v012005 .v64-forecast-details{
 margin-top:calc(var(--msl-format-section-gap) - var(--msl-format-title-gap))!important;padding-top:0!important;
}
:root[data-theme] #app .forecast-v012005 .v47-temperature-extremes>.v4-field:last-child{margin-top:0!important;}
:root[data-theme] #app .forecast-v012005 .v47-hero-main>.v4-hero-grid>h3{align-self:start!important;}
/* Forecast summary: two complete, vertically centred blocks. */
:root[data-theme] #app#app .forecast-v012005>.v4-forecast-hero{grid-template-columns:minmax(0,1fr)!important;grid-template-rows:none!important;grid-auto-rows:auto!important}
:root[data-theme] #app#app .forecast-v012005>.v4-forecast-hero>:is(.v46-card-title,.v64-forecast-details,.msl-forecast-sources-footer){grid-column:1!important;grid-row:auto!important}
:root[data-theme] #app#app .forecast-v012005 .v47-hero-main{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:var(--msl-format-column-gap)!important;align-items:center!important;grid-column:1!important;grid-row:auto!important;min-width:0}
:root[data-theme] #app#app .forecast-v012005 .v47-hero-main>.v4-hero-grid{display:grid!important;grid-template-columns:minmax(0,1fr)!important;grid-template-rows:auto auto auto!important;grid-column:1!important;grid-row:1!important;gap:10px!important;height:auto!important;align-self:center!important;min-width:0!important;margin:0!important;padding:0!important}
:root[data-theme] #app#app .forecast-v012005 .v47-temperature-extremes{display:grid!important;grid-template-columns:minmax(0,1fr)!important;grid-template-rows:auto auto!important;grid-column:2!important;grid-row:1!important;gap:var(--msl-format-row-gap)!important;align-self:center!important;min-width:0}
:root[data-theme] #app#app .forecast-v012005 .v47-temperature-extremes>.v4-field{grid-column:1!important;grid-row:auto!important;align-self:auto!important;margin:0!important}
:root[data-theme] #app#app :is(.forecast-v012005 .v47-hero-main>.v4-hero-grid>h3,.detail .v13013-hour-condition>h3){font-size:18px!important;font-weight:700!important;line-height:1.15!important;width:100%!important;min-width:0!important;max-width:100%!important;margin:0!important;padding:0!important;white-space:normal!important;letter-spacing:0!important;transform:none!important}
:root[data-theme] #app#app .msl-condition-text{display:block!important;width:100%!important;max-width:100%!important;margin:0!important;padding:0!important;font:inherit!important;transform:none!important}
:root[data-theme] #app#app .msl-condition-line{display:block!important;width:100%!important;max-width:100%!important;white-space:nowrap!important;font:inherit!important;letter-spacing:normal!important;transform:none!important;line-height:inherit!important}
:root[data-theme] #app#app .forecast-v012005 .v55-current-row{height:60px!important;min-height:60px!important;gap:11px!important}
:root[data-theme] #app#app .forecast-v012005 .v55-current-row>.weather-symbol{font-size:54px!important;width:54px!important;height:60px!important;min-height:60px!important;flex:0 0 54px!important}
:root[data-theme] #app#app .forecast-v012005 .v64-forecast-details>summary h3,
:root[data-theme] #app#app .detail .v13013-hour-details>h3{font-size:var(--msl-format-label-size)!important;line-height:1.22!important}
/* Hourly detail follows the same two column tabs as the fields below. */
:root[data-theme] #app#app .detail .v13013-hour-hero{align-items:center!important;column-gap:var(--msl-format-column-gap)!important}
:root[data-theme] #app#app .detail .v13013-hour-condition{align-self:center!important;transform:none!important}
:root[data-theme] #app#app .detail .v13013-hour-summary{width:100%!important;max-width:100%!important;min-width:0!important;margin:0!important;justify-items:start!important;align-self:center!important;row-gap:10px!important;transform:none!important}
:root[data-theme] #app#app .detail .v13013-hour-current,
:root[data-theme] #app#app .detail .v13013-hour-feels{justify-self:start!important;justify-content:flex-start!important;transform:none!important;margin:0!important}
:root[data-theme] #app#app .detail .v13013-hour-current{gap:10px!important}
/* Only the sky descriptions change; period headings and chart geometry stay. */
:root[data-theme] #app#app .detail .v13025-day-view .v13025-period-condition{display:flex!important;align-self:stretch!important;align-items:center!important;justify-content:center!important;box-sizing:border-box!important;width:100%!important;max-width:100%!important;padding-inline:var(--msl-condition-inset,5px)!important;translate:none!important;transform:none!important;text-align:center!important;line-height:1.15!important;font-size:var(--msl-forecast-label-size,18px)!important}
:root[data-theme] #app#app .detail .v13025-day-view .v13025-period-heading>h3{box-sizing:border-box!important;width:calc(100% - 2 * var(--msl-condition-inset,5px))!important;max-width:calc(100% - 2 * var(--msl-condition-inset,5px))!important;margin-inline:var(--msl-condition-inset,5px)!important;translate:none!important;transform:none!important}
:root[data-theme] #app#app .forecast-v012005>.v19-screen-heading{grid-template-columns:38px minmax(0,1fr)!important}
:root[data-theme] #app#app .forecast-v012005>.v19-screen-heading .v19-screen-icon{width:38px!important;height:38px!important}
:root[data-theme] #app#app .forecast-v012005>.v19-screen-heading .weather-emoji.msl-weather-family-glyph{width:38px!important;height:38px!important;font-size:38px!important;max-width:100%!important}
:root[data-theme] #app .detail :is(.v13010-hour-details,.v13011-hour-details,.v13012-hour-details,.v13013-hour-details){margin-top:var(--msl-format-section-gap)!important;}

/* Shared help disclosures; content typography and the outer close control stay. */
:root[data-theme] :is(#app,#mapChoiceHostGlobal) .msl-help-section{margin:0!important;padding:0!important;border:0!important;background:transparent!important;color:var(--arch-text)!important}
:root[data-theme] :is(#app,#mapChoiceHostGlobal) .msl-help-section+ .msl-help-section{margin-top:6px!important}
:root[data-theme] :is(#app,#mapChoiceHostGlobal) .msl-help-section>summary{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;min-height:44px!important;padding:6px 0!important;margin:0!important;list-style:none!important;cursor:pointer!important;color:var(--arch-text)!important}
:root[data-theme] :is(#app,#mapChoiceHostGlobal) .msl-help-section>summary::-webkit-details-marker{display:none!important}
:root[data-theme] :is(#app,#mapChoiceHostGlobal) .msl-help-section>summary::after{content:none!important;display:none!important}
:root[data-theme] :is(#app,#mapChoiceHostGlobal) .msl-help-section>summary>h3{flex:1!important;min-width:0!important;margin:0!important;padding:0!important;font-size:var(--arch-fs-item,18px)!important;line-height:1.25!important;color:var(--arch-text)!important}
:root[data-theme] :is(#app,#mapChoiceHostGlobal) .msl-help-section-toggle{display:grid!important;place-items:center!important;flex:0 0 28px!important;width:28px!important;height:28px!important;border:1px solid var(--arch-border)!important;border-radius:50%!important;background:var(--arch-control)!important;color:var(--arch-text)!important;font:700 21px/1 var(--arch-font)!important}
:root[data-theme] :is(#app,#mapChoiceHostGlobal) .msl-help-section .msl-help-minus{display:none!important}
:root[data-theme] :is(#app,#mapChoiceHostGlobal) .msl-help-section[open]>summary .msl-help-plus{display:none!important}
:root[data-theme] :is(#app,#mapChoiceHostGlobal) .msl-help-section[open]>summary .msl-help-minus{display:inline!important}
:root[data-theme] :is(#app,#mapChoiceHostGlobal) .msl-help-section>summary:focus-visible{outline:2px solid var(--arch-accent)!important;outline-offset:2px!important;border-radius:4px!important}
:root[data-theme] :is(#app,#mapChoiceHostGlobal) .msl-help-section-body{padding:6px 0 12px!important;min-width:0!important}
:root[data-theme] :is(#app,#mapChoiceHostGlobal) .msl-help-section-body .forecast-help-source{border-top:0!important;margin:0!important;padding:0!important}
:root[data-theme] :is(#app,#mapChoiceHostGlobal) .msl-help-section-body .environment-reading{padding-top:0!important}
:root[data-theme] :is(#app,#mapChoiceHostGlobal) .msl-help-section-body>p:first-child{margin-top:0!important}
/* Panels share symmetric inner margins. Map/radar canvas dimensions stay
 * unchanged; expanded maps retain their existing inner padding. */
:root[data-theme] #app :is(.config-page>.config-section,.forecast-v012005>.v4-forecast-hero,.forecast-v012005>.v4-details,.forecast-v012005>.v4-air,.forecast-v012005>.v4-compare,.forecast-v012005>.v13064-noise-forecast,.help-v012003 .help-search){
 padding:var(--msl-format-panel-padding)!important;
}
:root[data-theme] #app .detail:not([data-detail-key="radar"]):not([data-detail-key="weather-map"]){padding:var(--msl-format-panel-padding)!important;}
:root[data-theme] #app .content:not(.now-page){padding-inline:var(--msl-format-page-margin)!important;}
:root[data-theme] #app :is(.config-page>.config-section,.forecast-v012005>.v4-card,.charts-v012005>.v4-chart-card,.charts-v012005>.v3-period-panel,.help-v012003 .help-search){margin-bottom:var(--msl-format-panel-gap)!important;}
:root[data-theme] #app :is(.forecast-v012005>.v4-section-title,.forecast-v012005 .v4-astro>.v4-section-title,.charts-v012005>.v4-group-title){margin-top:var(--msl-format-section-gap)!important;margin-bottom:var(--msl-format-title-gap)!important;}
/* Forms: label-to-control spacing is independent of help paragraphs. */
:root[data-theme] #app .config-page .config-grid{row-gap:var(--msl-format-row-gap)!important;column-gap:var(--msl-format-column-gap)!important;}
:root[data-theme] #app .config-page .field{display:grid!important;grid-template-columns:minmax(0,1fr)!important;row-gap:var(--msl-format-label-gap)!important;align-content:start!important;}
:root[data-theme] #app .config-page .current-station-section .config-section-title-row{
 min-height:var(--msl-format-field-height)!important;margin-bottom:var(--msl-format-title-gap)!important;
}
:root[data-theme] #app .config-page .config-section-title-row h2{margin:0!important;}
:root[data-theme] #app :is(.config-page .field-help,.config-page .field-note){margin-top:var(--msl-format-copy-gap)!important;}
:root[data-theme] #app .config-page .field>.field-help{margin:0!important;}
:root[data-theme] #app :is(.config-page .saved-list,.config-page .saved-actions,.config-page .language-buttons,.config-page .theme-buttons,.charts-v012005 .v3-datebox,.metric-charts .metric-chart-controls){gap:var(--msl-format-row-gap) var(--msl-format-column-gap)!important;}
:root[data-theme] #app :is(.charts-v012005 .v3-datebox label,.metric-charts .metric-chart-controls label){gap:var(--msl-format-label-gap)!important;}
:root[data-theme] #app :is(.charts-v012005 .v4-stats,.metric-charts .v4-stats)>div>span:first-child{
 font-size:var(--msl-format-label-size)!important;font-weight:var(--arch-fw-label)!important;line-height:1.25!important;
 margin:0 0 var(--msl-format-label-gap)!important;
}
:root[data-theme] #app :is(.forecast-v012005 .v4-celestial-times>span,.forecast-v012005 .v4-pollen article){display:grid!important;gap:var(--msl-format-label-gap)!important;}
:root[data-theme] #app .forecast-v012005 .v4-pollen article>.v70-pollen-value{height:var(--msl-format-field-height)!important;min-height:var(--msl-format-field-height)!important;}
/* Running prose retains its readable size. Equivalent metadata has one rhythm. */
:root[data-theme] #app :is(.forecast-v012005 .v4-card>footer,.detail .v13001-detail-source){
 font-family:var(--arch-font)!important;font-size:var(--arch-fs-meta)!important;line-height:var(--arch-lh-meta)!important;
 margin-top:var(--msl-format-row-gap)!important;
}
:root[data-theme] #app .help-v012003 .help-groups{gap:calc(var(--msl-format-section-gap)/2)!important;}
:root[data-theme] #app .help-v012003 .help-group{gap:calc(var(--msl-format-title-gap)/2)!important;}
:root[data-theme] #app .help-v012003 .help-search label{font-size:var(--msl-format-label-size)!important;margin-bottom:var(--msl-format-label-gap)!important;}
/* The web widget's setup form uses the same label/control roles. Its canvas,
 * native Android companion and fixed header/footer are deliberately untouched. */
.widget-workshop :is(.widget-options,.widget-install,.widget-notes){padding:var(--msl-format-panel-padding);margin-block:var(--msl-format-panel-gap);}
.widget-workshop .widget-options label{gap:var(--msl-format-label-gap);margin-top:var(--msl-format-row-gap);font-size:var(--msl-format-label-size);line-height:1.25;}
.widget-workshop .widget-option-row{gap:var(--msl-format-column-gap);}
.widget-workshop .widget-options :is(input,select){height:var(--msl-format-field-height);min-height:var(--msl-format-field-height);padding-block:0;font-size:var(--msl-format-control-size);}

/* Equivalent list and dialog panels share the same inset, without changing
 * their action targets, colors or content. */
:root[data-theme] #app .config-page .saved-row{padding:var(--msl-format-panel-padding)!important;}
:root[data-theme] #app .help-v012003 .help-card{padding-inline:var(--msl-format-panel-padding)!important;}
:root[data-theme] #app .help-v012003 .help-group-title{font-size:var(--arch-fs-section)!important;font-weight:var(--arch-fw-strong)!important;line-height:var(--arch-lh-title)!important;margin-inline:0!important;}
:root[data-theme] :is(.msl-removal-dialog,.version-card,.config-modal-panel:not(.map-panel)){padding:var(--msl-format-panel-padding)!important;}
:root[data-theme] :is(.msl-removal-dialog>h2,.version-title,.config-modal-panel:not(.map-panel) .modal-head){margin-bottom:var(--msl-format-title-gap)!important;}
:root[data-theme] #app .forecast-v012005>.v4-card{margin-top:0!important;}
:root[data-theme] #app .forecast-v012005>:is(.msl-weather-card,.msl-radar-card){margin-block:0 var(--msl-format-panel-gap)!important;}

/* Padding belongs to the panel once; footer and last paragraph must not
 * reserve a second empty strip below the same content. */
:root[data-theme] #app .forecast-v012005>:is(.v4-forecast-hero,.v4-details,.v4-air,.v4-compare,.v13064-noise-forecast)>footer{padding-bottom:0!important;}
:root[data-theme] #app .help-v012003 .help-section summary{padding-block:calc(var(--msl-format-copy-gap)/2)!important;}

/* Submenus have a cue; help targets and existing action buttons do not.
 * Header close buttons retain the shared 38px rule in ui-architecture.css. */
:root[data-theme]{--msl-menu-control-size:38px;}
:root[data-theme] #app .msl-menu-symbol,
:root[data-theme] #app details>summary::after,
:root[data-theme] :is(.msl-selection-reference-details,.msl-selection-disclosure)>summary::after{
 display:inline-grid;place-items:center;box-sizing:border-box;
 width:var(--msl-menu-control-size);height:var(--msl-menu-control-size);
 min-width:var(--msl-menu-control-size);flex:0 0 var(--msl-menu-control-size);
 padding:0;border:1px solid var(--arch-border);border-radius:50%;
 background:var(--role-fixed);color:var(--arch-text);
 font:600 26px/1 var(--arch-font);text-align:center;
 transform:none;pointer-events:none;
}
:root[data-theme] #app .msl-now-view-heading{
 grid-template-columns:34px minmax(0,1fr) var(--msl-menu-control-size)!important;
}
:root[data-theme] #app .msl-now-view-heading>.msl-menu-symbol{justify-self:end;}
:root[data-theme] #app details>summary{list-style:none!important;}
:root[data-theme] #app details>summary::-webkit-details-marker{display:none!important;}
:root[data-theme] #app details>summary::marker{content:""!important;}
:root[data-theme] #app details>summary::before{content:none!important;display:none!important;}
:root[data-theme] #app details:not(.msl-alert-entry)>summary{
 display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px;
}
:root[data-theme] #app details>summary::after{content:"+";margin-left:auto;}
:root[data-theme] #app details[open]>summary::after{content:"−";}
/* These titles alone open the section; only an open section shows its −. */
:root[data-theme] #app details:is(.advanced-sensors,.help-section,.msl-alert-guide,.environment-now-notes,.v4-cape,.install-alternatives):not([open])>summary::after{
 display:none!important;content:none!important;
}
:root[data-theme] #app .config-page.ui-system-master .advanced-sensors>summary>span{flex:1 1 auto;min-width:0;}
:root[data-theme] #app .help-v012003 .help-section-body{padding-bottom:calc(var(--msl-format-panel-padding)/2)!important;}
:root[data-theme] #app .help-v012003 .help-section-body>:last-child{margin-bottom:0!important;}

:root[data-theme] #app details.msl-alert-entry>summary::after{width:var(--msl-menu-control-size);height:var(--msl-menu-control-size);border:1px solid var(--arch-border);background:var(--role-fixed);color:var(--arch-text);font:600 26px/1 var(--arch-font);}
:root[data-theme] #app details.msl-alert-entry>summary{padding-right:calc(var(--arch-s3) + var(--msl-menu-control-size) + 8px)!important;}
:root[data-theme] #app details.observation-explanation:not([open])>summary::after{display:none!important;content:none!important;}

/* Data footers: one type scale, bold labels and regular values. */
:root[data-theme] #app :is(.forecast-v012005,.charts-v012005,.detail) footer,
:root[data-theme] #app :is(.v13001-detail-source,.msl-weather-source,.msl-radar-card>footer){
 font-family:var(--arch-font)!important;font-size:var(--arch-fs-meta)!important;
 font-weight:var(--arch-fw-regular)!important;line-height:var(--arch-lh-meta)!important;
 color:var(--arch-text-2)!important;text-align:left!important;
 display:block!important;
 padding:0!important;margin-top:var(--msl-format-row-gap)!important;
}
:root[data-theme] #app :is(footer,.v13001-detail-source) :is(.v66-footer-block,.v66-footer-detail,.v31-model-point,.celestial-source-text){
 font:inherit!important;color:inherit!important;margin:0!important;
}
:root[data-theme] #app :is(footer,.v13001-detail-source)>:is(.v66-footer-detail,.v31-model-point),
:root[data-theme] #app :is(footer,.v13001-detail-source)>.v66-footer-block+.v66-footer-block,
:root[data-theme] #app :is(.msl-weather-source,.msl-radar-card>footer)>div+div{
 margin-top:var(--msl-format-copy-gap)!important;
}
:root[data-theme] #app :is(footer,.v13001-detail-source)>strong,
:root[data-theme] #app :is(footer,.v13001-detail-source)>div>strong:first-child,
:root[data-theme] #app .celestial-source-text>strong,
:root[data-theme] #app .msl-footer-label{
 font-size:inherit!important;font-weight:var(--arch-fw-label)!important;color:inherit!important;
}
:root[data-theme] #app .v31-model-point>.notranslate{font:inherit!important;color:inherit!important;}
:root[data-theme] #app .msl-radar-card.msl-radar-expanded>footer{display:none!important;}

/* Only the current forecast's additional fields become a submenu. */
:root[data-theme] #app .forecast-v012005 details.msl-now-forecast-details{
 --msl-menu-control-size:28px;
 margin-top:calc(var(--msl-format-panel-padding) - var(--msl-sources-layout-gap,0px))!important;
}
:root[data-theme] #app .msl-now-forecast-details>summary{min-height:var(--msl-menu-control-size);}
:root[data-theme] #app .msl-now-forecast-details>summary>h3{
 min-width:0;margin:0!important;color:var(--arch-text)!important;
 font:var(--arch-fw-strong) var(--arch-fs-item)/1.22 var(--arch-font)!important;
}
:root[data-theme] #app .msl-now-forecast-details[open]>.v64-detail-fields{margin-top:var(--msl-format-title-gap)!important;}

/* Map expansion belongs to the title, leaving a single shared action row. */
:root[data-theme] #app .v46-card-title:has(>.msl-map-expand){display:flex;align-items:center;justify-content:space-between;gap:12px;}
:root[data-theme] #app .v46-card-title:has(>.msl-map-expand)>h2{flex:1 1 auto;min-width:0;margin:0!important;}
:root[data-theme] #app .msl-map-expand{
 display:grid;place-items:center;box-sizing:border-box;flex:0 0 var(--msl-menu-control-size);
 width:var(--msl-menu-control-size)!important;min-width:var(--msl-menu-control-size)!important;
 height:var(--msl-menu-control-size)!important;min-height:var(--msl-menu-control-size)!important;
 padding:0!important;border:1px solid var(--arch-border)!important;border-radius:50%!important;
 font:600 26px/1 var(--arch-font)!important;text-align:center;
}
:root[data-theme] #app :is(.msl-weather-controls,.msl-radar-controls){
 position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
 gap:12px;margin:12px 0 0;align-items:stretch;
}
:root[data-theme] #app :is(.msl-weather-controls,.msl-radar-controls)>button:not([data-radar-play]){
 box-sizing:border-box;height:38px;min-height:38px;padding:0 14px;
 border:1px solid var(--arch-border);border-radius:16px;background:var(--role-fixed);
 color:var(--arch-text);font:600 var(--msl-forecast-label-size,18px)/1.15 var(--arch-font);
 text-align:center;
}
/* A real transparent notch leaves 6px around the 50px playback circle. */
:root[data-theme] #app .msl-radar-card .msl-radar-controls{margin-top:16px;}
:root[data-theme] #app .msl-radar-controls>[data-radar-centre]{
 -webkit-mask-image:radial-gradient(circle at calc(100% + 6px) 1px,transparent 30.5px,#000 31.5px);
 mask-image:radial-gradient(circle at calc(100% + 6px) 1px,transparent 30.5px,#000 31.5px);
}
:root[data-theme] #app .msl-radar-controls>[data-radar-refresh]{
 -webkit-mask-image:radial-gradient(circle at -6px 1px,transparent 30.5px,#000 31.5px);
 mask-image:radial-gradient(circle at -6px 1px,transparent 30.5px,#000 31.5px);
}
:root[data-theme] #app .msl-radar-card .msl-radar-controls>[data-radar-play]{
 position:absolute;left:50%;top:-24px;transform:translateX(-50%);z-index:2;
 display:grid;place-items:center;box-sizing:border-box;width:50px;min-width:50px;
 height:50px;min-height:50px;padding:0;border:1px solid var(--arch-border);
 border-radius:50%;background:var(--role-fixed);color:var(--arch-text);
}
:root[data-theme] #app [data-radar-play]>svg{display:block;width:44px;height:44px;fill:currentColor;pointer-events:none;}
:root[data-theme] #app [data-radar-play]:focus-visible{outline:2px solid var(--arch-heading);outline-offset:2px;}

/* Forecast sources and the two map guides share one compact disclosure format. */
:root[data-theme] #app#app .msl-forecast-sources-footer{
 margin-top:calc(var(--msl-sources-top-gap,12px) - var(--msl-sources-layout-gap,0px))!important;padding:0!important;
}
:root[data-theme] #app#app .msl-before-forecast-sources{margin-bottom:0!important;}
:root[data-theme] #app#app .forecast-v012005 :is(.v4-card,.v4-celestial):has(>footer.msl-forecast-sources-footer){padding-bottom:var(--msl-format-panel-padding)!important;}
:root[data-theme] #app#app .forecast-v012005>.v4-hourly>footer.msl-forecast-sources-footer{padding-inline:var(--msl-forecast-card-inset,12px)!important;}
:root[data-theme] #app#app .msl-forecast-sources-footer[data-forecast-sources-prefix="true"]{margin-top:12px!important;}
:root[data-theme] #app#app .msl-forecast-sources-prefix{margin-bottom:0!important;}
:root[data-theme] #app#app .msl-forecast-sources-footer>.msl-forecast-sources-prefix+details{margin-top:8px!important;}
:root[data-theme] #app#app details:is(.msl-forecast-sources,.msl-weather-help,.msl-radar-help){
 --msl-menu-control-size:28px;
 margin:0;padding:0;border:0;background:none;color:var(--arch-text-2);
 font:400 var(--arch-fs-meta)/1.2 var(--arch-font);text-align:left;
}
:root[data-theme] #app#app details:is(.msl-forecast-sources,.msl-weather-help,.msl-radar-help)>summary{
 box-sizing:border-box;min-height:28px;gap:8px;margin:0;padding:0;
 color:inherit;font:600 var(--arch-fs-meta)/1.2 var(--arch-font);cursor:pointer;
}
:root[data-theme] #app#app details:is(.msl-forecast-sources,.msl-weather-help,.msl-radar-help,.msl-now-forecast-details)>summary::after{
 width:28px;height:28px;min-width:28px;flex:0 0 28px;font-size:20px;
 margin-right:0;border:1px solid var(--arch-border);transform:none;
}
:root[data-theme] #app#app details.msl-forecast-sources>.msl-forecast-sources-body{
 display:flex;flex-direction:column;gap:2px;margin:4px 0 0;padding:0;
 color:inherit;font:400 var(--arch-fs-meta)/1.2 var(--arch-font);overflow-wrap:anywhere;
}
:root[data-theme] #app#app details.msl-forecast-sources:not([open])>.msl-forecast-sources-body{display:none!important;}
:root[data-theme] #app#app .msl-forecast-sources-body>*{
 margin:0!important;padding:0!important;color:inherit!important;font:inherit!important;
}
:root[data-theme] #app#app .msl-forecast-sources-body strong{font-weight:600!important;}
:root[data-theme] #app#app .msl-forecast-sources-body a{font:inherit!important;color:inherit!important;text-decoration:underline;}

/* Keep 16px after the map actions; paired disclosure circles share a 6px gap. */
:root[data-theme] #app#app details.msl-weather-help{margin-top:16px;}
:root[data-theme] #app#app .msl-radar-card>.msl-radar-legend{
 margin:16px 0 0!important;color:var(--arch-text-2);
 font:400 var(--arch-fs-meta)/1.2 var(--arch-font);
}
:root[data-theme] #app#app details.msl-radar-help{margin-top:2px;}
:root[data-theme] #app#app :is(.msl-weather-help,.msl-radar-help)>p{
 margin:2px 0 0;padding:0;color:inherit;font:400 var(--arch-fs-meta)/1.2 var(--arch-font);
}
:root[data-theme] #app#app :is(.msl-weather-help,.msl-radar-help)>summary+p{margin-top:4px;}
:root[data-theme] #app#app :is(.msl-weather-card,.msl-radar-card) .msl-forecast-sources-footer,
:root[data-theme] #app#app .v4-forecast-hero>.msl-forecast-sources-footer{--msl-sources-top-gap:var(--msl-disclosure-stack-gap);}
:root[data-theme] #app#app .msl-now-forecast-details[open]{padding-bottom:var(--msl-disclosure-stack-gap)!important;}

/* Equivalent secondary titles and field labels have the same 6px gap. */
:root[data-theme] #app#app .forecast-v012005 .v67-compare-row>h3,
:root[data-theme] #app#app .forecast-v012005 .v4-air>h3{margin-bottom:var(--msl-format-label-gap)!important;}

/* Keep the ruler, dates and raised player together with symmetric spacing. */
:root[data-theme] #app#app .msl-radar-card .msl-radar-rule{padding-bottom:16px;}
:root[data-theme] #app#app .msl-radar-card>.msl-radar-legend{min-height:28px;display:flex;align-items:center;}
:root[data-theme] #app#app :is(.msl-weather-help,.msl-radar-help)>summary{font-weight:700!important;}

/* All subordinate Now disclosures use the small circle, centred on their copy. */
:root[data-theme] #app#app .msl-selection-summary details>summary{align-items:center!important;}
:root[data-theme] #app#app .msl-selection-summary details>summary::after{
 width:28px!important;height:28px!important;min-width:28px!important;flex:0 0 28px!important;
 font-size:20px!important;margin-right:0!important;
}
:root[data-theme] #app#app .msl-now-view-heading>.msl-menu-symbol{
 background:var(--role-selected)!important;border-color:var(--role-selected-border)!important;
}

/* Chart sources reuse the Forecast footer, including its inset and compact rows. */
:root[data-theme] #app#app .charts-v012005 :is(.v4-card,.v3-chart-card):has(>footer.msl-forecast-sources-footer){padding-bottom:var(--msl-format-panel-padding)!important;}
:root[data-theme] #app#app .charts-v012005 .msl-forecast-sources-footer{
 margin-left:calc(var(--msl-format-panel-padding) - var(--msl-sources-parent-left,var(--msl-format-panel-padding)))!important;
 margin-right:calc(var(--msl-format-panel-padding) - var(--msl-sources-parent-right,var(--msl-format-panel-padding)))!important;
}

/* Help paragraphs keep their words and links; paragraph gaps exceed line gaps. */
:root[data-theme] #app#app .msl-help-prose p{
 line-height:1.4!important;margin-top:0!important;margin-bottom:8px!important;
}
:root[data-theme] #app#app .msl-help-prose>summary+p{margin-top:8px!important;}
:root[data-theme] #app#app .msl-help-prose p:last-child{margin-bottom:0!important;}
:root[data-theme] #app#app .msl-help-prose :is(strong,b,.v13003-help-keyword){font-weight:700!important;}
:root[data-theme] #app#app .msl-help-prose .help-links{grid-template-columns:minmax(0,1fr);min-width:0;}
:root[data-theme] #app#app .msl-help-prose .help-links a{
 white-space:normal!important;max-width:100%;min-width:0;box-sizing:border-box;overflow-wrap:anywhere;
}

/* Rectangular controls and panels share a radius, independent of their height.
 * Explicit +/−, playback, map and close circles retain their round geometry. */
:root[data-theme] :is(#app#app,#mapChoiceHostGlobal#mapChoiceHostGlobal)
 :is(button,input:not([type="range"]):not([type="checkbox"]):not([type="radio"]),select,textarea,[role="button"]):not(:is(
 .msl-alert-count,.map-choice-data-row,.v4-day-row,.v13007-hour-hit,.msl-map-expand,[data-radar-play],.map-locate-button,[data-action="closeinstall"],.close,.leaflet-control-zoom-in,.leaflet-control-zoom-out,.leaflet-popup-close-button,.map-legend-target,.modal-head>button,.msl-weather-territory button)){border-radius:var(--msl-format-radius)!important;}
:root[data-theme] :is(#app#app,#mapChoiceHostGlobal#mapChoiceHostGlobal) :is(.map-choice-data-row,.v4-day-row,.v13007-hour-hit){border-radius:0!important;}
:root[data-theme] :is(#app#app,#mapChoiceHostGlobal#mapChoiceHostGlobal) :is(.modal-head>button,.detail-head>.close,.msl-weather-territory button){border-radius:50%!important;}
:root[data-theme] :is(#app#app,#mapChoiceHostGlobal#mapChoiceHostGlobal) :is(.v4-card,.v3-chart-card,.v4-celestial,.config-section,.help-card,.help-search,.metric-card,.noise-card,.connection-card,.info-card,.detail,.config-modal,.saved-station,.v4-value-box,.v4-stat-empty,.msl-now-view-choice,.msl-now-view-mini-frame,.v13064-hour-card,.v13064-detail-summary,.map-choice-panel){border-radius:var(--msl-format-radius)!important;}
:root[data-theme] #app#app .help-v012003 details.help-section{border-radius:0!important;}
:root[data-theme] #app#app .config-page .advanced-sensors>summary{min-height:var(--msl-format-field-height)!important;box-sizing:border-box!important;}
:root[data-theme] #app#app .config-page .map-button{height:var(--msl-format-field-height)!important;padding-block:0!important;}
:root[data-theme] #app#app .config-page .map-button>span:last-child{display:block;flex:1 1 0;white-space:nowrap!important;min-width:0;transform:scaleX(var(--msl-label-scale,1));transform-origin:center;}

/* Help closes with the same small circle as source and secondary Now menus. */
:root[data-theme] #app#app details:is(.help-section,.msl-alert-guide,.environment-now-notes,.v4-cape,.observation-explanation)>summary::after{
 width:28px!important;height:28px!important;min-width:28px!important;flex:0 0 28px!important;
 font-size:20px!important;margin-right:0!important;
}
:root[data-theme] #app#app .detail:has(.forecast-help-icon,.forecast-help-body,.environment-help-body) .detail-head>.close,
:root[data-theme] #app#app .detail:is([data-detail-key="wind"],[data-detail-key="rainBar"]) .detail-head>.close,
:root[data-theme] :is(#app#app,#mapChoiceHostGlobal#mapChoiceHostGlobal) .msl-selection-help-panel .modal-head>button,
:root[data-theme] #app#app .config-modal[data-modal="install"] .modal-head>button{
 --msl-menu-control-size:28px;
 width:28px!important;height:28px!important;min-width:28px!important;min-height:28px!important;
 flex:0 0 28px!important;padding:0!important;font-size:20px!important;line-height:1!important;
 border-radius:50%!important;align-self:center!important;
}

/* A source row has the same 12px clearance above and below; paired menus keep 6px. */
:root[data-theme] #app#app .v67-compare-rows{padding-bottom:0!important;}

/* Half the guide's space between panels and between each title and its divider. */
:root[data-theme] #app#app .help-v012003 .help-current-body{gap:9px!important;}
:root[data-theme] #app#app .help-v012003 .help-search{margin-bottom:6px!important;}
:root[data-theme] #app#app .help-v012003 .help-section>summary{
 position:relative;padding-right:36px!important;min-height:calc(var(--msl-format-field-height) - 2px);box-sizing:border-box;
}
:root[data-theme] #app#app .help-v012003 .help-section>summary::after{
 position:absolute;right:0;top:50%;transform:translateY(-50%)!important;
 display:inline-grid!important;
}
:root[data-theme] #app#app .help-v012003 .help-section:not([open])>summary::after{content:"+"!important;}

/* Every Configuration card opens independently; pending actions keep a visible cue. */
:root[data-theme] #app#app .config-page>.msl-config-section{padding:0!important;overflow:hidden;}
:root[data-theme] #app#app .msl-config-section>summary{
 box-sizing:border-box;min-height:52px;padding:12px!important;margin:0!important;
 gap:8px!important;border-radius:var(--msl-format-radius);cursor:pointer;
}
:root[data-theme] #app#app .msl-config-section>summary>h2{
 flex:1 1 auto;min-width:0;margin:0!important;padding:0!important;
 color:var(--arch-accent)!important;font:var(--arch-fw-strong) var(--arch-fs-section)/var(--arch-lh-title) var(--arch-font)!important;
 white-space:nowrap!important;transform:scaleX(var(--msl-label-scale,1));transform-origin:left center;
}
:root[data-theme] #app#app .msl-config-section>summary::after{
 width:28px!important;height:28px!important;min-width:28px!important;flex:0 0 28px!important;
 margin:0!important;font-size:20px!important;
}
:root[data-theme] #app#app .msl-config-section>.msl-config-body{padding:0 12px 12px;}
:root[data-theme] #app#app .msl-config-section:not([open])>.msl-config-body{display:none!important;}
:root[data-theme] #app#app .msl-config-body>.config-section-title-row{display:flex!important;justify-content:flex-end!important;}
:root[data-theme] #app#app .msl-config-body>.config-section-title-row>.save-station-top{width:calc(50% - 6px)!important;}
:root[data-theme] #app#app .msl-config-section.msl-config-pending{border-color:#be6300!important;}
:root[data-theme] #app#app .msl-config-section.msl-config-pending>summary{background:#ffa333!important;}
:root[data-theme] #app#app .msl-config-section.msl-config-pending>summary>h2{color:#10271f!important;}
:root[data-theme] #app#app .msl-config-section>summary:focus-visible{outline:2px solid var(--arch-accent);outline-offset:-3px;}


/* Configuration: the calibration card defines the first-content clearance. */
:root[data-theme] #app#app .msl-config-body>:first-child{margin-top:0!important;}
:root[data-theme] #app#app .msl-config-body>.version-row:first-child{padding-top:0!important;min-height:0!important;}
:root[data-theme] #app#app .msl-config-section[data-config-section="install"]>.msl-config-body{display:grid;gap:var(--msl-format-copy-gap);}
:root[data-theme] #app#app .msl-config-section[data-config-section="install"]>.msl-config-body>*{margin-block:0!important;}
:root[data-theme] #app#app .msl-config-section[data-config-section="install"] .field-help{font-size:var(--arch-fs-meta)!important;line-height:1.36!important;}
:root[data-theme] #app#app .msl-config-groups{display:grid;gap:var(--msl-format-section-gap);}
:root[data-theme] #app#app .msl-config-group{display:grid;gap:var(--msl-format-row-gap);min-width:0;}
:root[data-theme] #app#app .msl-config-group .msl-config-subtitle{margin:0!important;padding:0!important;color:var(--arch-text)!important;font:var(--arch-fw-strong) var(--arch-fs-item)/1.25 var(--arch-font)!important;}
:root[data-theme] #app#app .msl-config-group>.save-station-top{width:100%!important;max-width:none!important;transform:none!important;margin:0!important;}
:root[data-theme] #app#app .msl-config-group>.map-choice-block>.map-button{margin:0!important;}
:root[data-theme] #app#app .msl-config-group>.advanced-sensors{margin:0!important;}
/* Copyright keeps its original footer surface; only the sign is prominent enough to read. */
:root[data-theme] #app#app .config-footer .msl-copyright-details{border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;padding:0!important;margin:0!important;}
:root[data-theme] #app#app .msl-copyright-details>summary{display:flex!important;align-items:center;gap:8px;padding:0!important;margin:0!important;min-height:28px;cursor:pointer;}
:root[data-theme] #app#app .msl-copyright-details>summary::after{width:28px!important;height:28px!important;min-width:28px!important;flex:0 0 28px!important;font-size:20px!important;border:1px solid #fff!important;background:transparent!important;box-shadow:none!important;color:inherit!important;margin:0!important;}
:root[data-theme] #app#app .msl-copyright-details>summary>.config-copyright{flex:1;min-width:0;font-size:var(--arch-fs-control)!important;font-weight:var(--arch-fw-strong)!important;line-height:1.25!important;color:inherit!important;}
:root[data-theme] #app#app .msl-copyright-body{display:grid;gap:8px;margin-top:8px;}
:root[data-theme] #app#app .msl-copyright-body>p{margin:0!important;font:inherit!important;}
:root[data-theme] #app#app .msl-copyright-details:not([open])>.msl-copyright-body{display:none!important;}
:root[data-theme] #app#app .msl-copyright-details>summary:focus-visible{outline:2px solid currentColor;outline-offset:2px;}


/* Expanded maps use the same horizontal rails as their Forecast cards. */
:root[data-theme] #app#app .detail-overlay:has(>.detail:is([data-detail-key="weather-map"],[data-detail-key="radar"])){padding-inline:var(--msl-format-page-margin)!important;}
:root[data-theme] #app#app .detail:is([data-detail-key="weather-map"],[data-detail-key="radar"]){padding:var(--msl-format-panel-padding)!important;}
/* Help headings and the search label share the midpoint of their former sizes. */
:root[data-theme] #app#app .help-v012003 :is(.help-section>summary,.help-search>label){font-size:17.5px!important;}

/* A coordinate group shares the final row's rule, without a second boundary. */
:root[data-theme] #app#app .msl-selection-disclosure[data-selection-disclosure="coordinates"][open]{border-bottom:0!important;padding-bottom:0!important;}
/* Chart legends share the axis-unit row and the Forecast footer rhythm. */
:root[data-theme] #app#app .charts-v012005 .v4-chart-wrap+:is(.v4-chart-meta,.v4-multi-legend){margin-top:var(--msl-chart-legend-offset,-6px)!important;padding-right:var(--msl-chart-unit-clearance,0px)!important;}
:root[data-theme] #app#app .charts-v012005 .v4-chart-wrap+.v4-multi-legend{grid-template-columns:repeat(auto-fit,minmax(90px,1fr))!important;}
:root[data-theme] #app#app .charts-v012005 .msl-forecast-sources-footer{--msl-sources-top-gap:8px;}
/* The editable name defines the gap below each internal Settings heading. */
:root[data-theme] #app#app .msl-config-group>h3.msl-config-subtitle{margin-bottom:calc(var(--msl-format-label-gap) - var(--msl-format-row-gap))!important;}
:root[data-theme] #app#app .config-page .field>.chip-status{margin-top:0!important;}
:root[data-theme] #app#app .msl-config-section>.msl-config-body{margin-top:var(--msl-config-content-offset,0px)!important;}

/* Shared midpoint for the Settings and Help disclosure headings. A one-line
 * panel is 46px including its two borders; longer help titles may wrap. */
:root[data-theme]{--msl-menu-title-size:calc((var(--arch-fs-section) + 17.5px)/2);--msl-menu-row-height:44px;}
:root[data-theme] #app#app .msl-config-section>summary{min-height:var(--msl-menu-row-height);padding-block:8px!important;}
:root[data-theme] #app#app .msl-config-section>summary>h2,
:root[data-theme] #app#app .help-v012003 :is(.help-section>summary,.help-search>label){font-size:var(--msl-menu-title-size)!important;}
:root[data-theme] #app#app .help-v012003 .help-section>summary{min-height:var(--msl-menu-row-height);padding-block:8px!important;}
:root[data-theme] #app#app .help-v012003 .help-group-title{font-size:clamp(22px,5.5vw,32px)!important;}
/* The last hour has the same straight divider and text clearance as the rest.
 * A zero-height scroll spacer retains the canvas fit and the first-hour rail. */
:root[data-theme] #app#app .forecast-v012005 .v13007-hour-hit:last-child{border-inline-end:1px solid color-mix(in srgb,var(--arch-border) 55%,transparent)!important;}
:root[data-theme] #app#app .forecast-v012005 .v13057-hourly .v4-hour-scroll::after{content:"";display:block;width:calc(var(--msl-hourly-scroll-width,0px) + var(--msl-format-panel-padding));height:1px;margin-top:-1px;pointer-events:none;}

/* Title text opens help; adjacent expansion controls keep their own action. */
:root[data-theme] #app .msl-title-help{cursor:pointer!important}
:root[data-theme] #app .msl-title-help:focus-visible{outline:2px solid var(--arch-accent)!important;outline-offset:3px!important;border-radius:3px!important}