/* Opt-in depth: keep original shadows, instrument glows and geometry when disabled. */
:root[data-design-depth="raised"], .site-theme-live-preview[data-depth-preview="raised"] {
    --depth-factor: 1;
    --depth-color: 3 28 48;
    --depth-contact: .22;
    --depth-diffuse: .16;
    --depth-light: .45;
    --depth-y: 13px;
    --depth-blur: 23px;
    --design-depth-shadow: 0 3px 5px rgb(var(--depth-color) / calc(var(--depth-contact) * var(--depth-factor))), 0 var(--depth-y) var(--depth-blur) rgb(var(--depth-color) / calc(var(--depth-diffuse) * var(--depth-factor))), inset 0 1px 0 rgb(255 255 255 / var(--depth-light));
    --design-depth-soft: 0 2px 4px rgb(var(--depth-color) / calc(var(--depth-contact) * var(--depth-factor) * .8)), 0 7px 15px rgb(var(--depth-color) / calc(var(--depth-diffuse) * var(--depth-factor) * .75)), inset 0 1px 0 rgb(255 255 255 / calc(var(--depth-light) * .8));
    /* Existing components consuming the common tokens are covered automatically. */
    --shadow: var(--design-depth-shadow);
    --shadow-soft: var(--design-depth-soft);
}
:root[data-design-depth="raised"][data-depth-strength="subtle"], .site-theme-live-preview[data-depth-strength="subtle"] { --depth-factor: .55; }
:root[data-design-depth="raised"][data-depth-strength="strong"], .site-theme-live-preview[data-depth-strength="strong"] { --depth-factor: 1.4; }
:root[data-design-depth="raised"][data-depth-strength="extra"], .site-theme-live-preview[data-depth-strength="extra"] { --depth-factor: 1.8; }
:root[data-theme="dark"][data-design-depth="raised"] {
    --depth-color: 0 0 0;
    --depth-contact: .5;
    --depth-diffuse: .34;
    --depth-light: .12;
    --depth-y: 14px;
    --depth-blur: 27px;
}
/* Explicit surfaces also cover cards with component-specific literal shadows.
   Calendar scroll wrappers, not individual cells or unboxed grid containers. */
html[data-design-depth="raised"] :is(
    .side-panel,.dashboard-card,.glass-card,.metric-card,.content-card,.forecast-grid>article,.notice-card,
    .welcome-card,.live-hero,.rain-hero,.temperature-hero,.pressure-hero,.wind-hero,
    .soil-temperature-hero,.soil-moisture-hero,.solar-hero,.uv-hero,.humidity-hero,.weather-scene-card,
    .rain-gauge-card,.rain-event-card,.rain-year-card,.rain-metric-card,.rain-sensors-panel,
    .rain-history-card,.rain-intensity-card,.rain-last-card,.rain-phase-card,.rain-comparison-card,
    .pressure-instrument-card,.pressure-trend-card,.uv-gauge-card,.uv-advice-card,.uv-forecast-card,
    .live-metric-card,.temperature-card,.temperature-current-card,.temperature-sensor-card,
    .temperature-normal-card,.temperature-change-card,.temperature-comfort-card,
    .temperature-database-day-card,.temperature-top-ten-card,.temperature-trend-panel,
    .wind-value-card,.wind-current-card,.wind-sensor-card,.wind-top-ten-card,
    .soil-value-card,.soil-installation-card,.soil-frost-panel,
    .moisture-value-card,.moisture-nfk-card,.moisture-water-monitor,.humidity-card,.humidity-sensor-card,
    .solar-current-card,.sun-journey-card,.solar-chart-card,.solar-timeline-card,
    .particulate-local-card,.particulate-distribution-card,.particulate-volume-card,
    .particulate-principle-card,.particulate-mass-card,.particulate-detector-lab,
    .rain-year-calendar-scroll,.soil-year-calendar-scroll,
    .same-day-table-card,.same-day-chart-card,.custom-chart-card,
    .temperature-archive-panel,.temperature-archive-summary-panel,
    .forecast-day-card,.forecast-hour-card,.forecast-chart-card,.forecast-detail-day,
    .wildfire-index-card,.wildfire-advice-card,.wildfire-forecast-card,.wildfire-grass-card,.wildfire-map-card,
    .warning-detail-card,.warning-measurement-card,.warning-map-card,.bbk-detail-card,
    .earthquake-overview-card,.earthquake-map-card,.earthquake-ranking-card,
    .radiation-page-sensor-card,.radiation-official-card,
    .rur-focus-card,.rur-course-card,.rur-chart-card,.rur-reference-card,.rur-cross-card,
    .satellite-card,.noaa-card,.weather-review-card,.agriculture-report-card,.agriculture-chart-card,
    .space-scale-card,.space-sun-card,.space-wind-card,.station-panel
) { box-shadow: var(--design-depth-shadow); }
html[data-design-depth="raised"] :is(
    .section-heading,.warning-type-heading,.warning-measurement-heading,.local-page-menu,.page-menu,
    .soil-year-control-group,.soil-year-legend,.particulate-year-picker,.rain-year-calendar-legend,.rain-sensor-item,
    .rain-year-calendar-summary>article,.temperature-comparison-summary>article,
    .temperature-database-day-summary>article,.wind-hero-values>article,.wind-direction-facts>article,
    .moisture-nfk-summary>article,.solar-explanation-grid>article,
    .quake-education>article,.earthquake-knowledge-grid>article,.rur-knowledge-grid>article,
    .agriculture-current-grid>article,.agriculture-period-grid>article,.agriculture-forecast-grid>article
) { box-shadow: var(--design-depth-soft); }
html[data-design-depth="raised"][data-heading-surface="none"] :is(.section-heading,.warning-type-heading,.warning-measurement-heading) { box-shadow: none; }
html[data-design-depth="raised"] :is(.card-heading,.side-panel>h2) { box-shadow: 0 2px 4px rgb(var(--depth-color) / calc(var(--depth-contact) * var(--depth-factor) * .8)), inset 0 1px 0 rgb(255 255 255 / calc(var(--depth-light) * .45)); }
html[data-design-depth="raised"] .main-navigation { box-shadow: var(--design-depth-shadow); }
.site-theme-live-preview[data-depth-preview="raised"] :is(article,aside) { box-shadow: var(--design-depth-shadow); }
.live-status-summary{display:grid;gap:5px;margin:10px 12px 0;padding:10px 11px;border:1px solid var(--line);border-radius:11px;background:var(--surface-soft);font-size:.74rem;line-height:1.5;overflow-wrap:anywhere}
.live-status-summary>strong{display:flex;gap:8px;align-items:center;color:var(--ink);font-size:.76rem}
.live-status-summary .status-dot{flex:0 0 auto;width:7px;height:7px;border-radius:50%}
.live-status-summary>span{color:var(--muted);font-variant-numeric:tabular-nums}
@media(max-width:760px) {
    :root[data-design-depth="raised"] { --depth-contact: .19; --depth-diffuse: .12; --depth-light: .35; --depth-y: 8px; --depth-blur: 15px; }
    :root[data-theme="dark"][data-design-depth="raised"] { --depth-contact: .44; --depth-diffuse: .28; --depth-light: .1; --depth-y: 9px; --depth-blur: 17px; }
}
