body.dashboard-v3 { --v3-accent: #225c80; --v3-soft: #edf4f7; --v3-line: #d8e2e9; background: #f1f5f8; }
body.dashboard-v3.dark-mode { --v3-accent: #8acbf0; --v3-soft: #202f3c; --v3-line: #3b4b5c; background: #14202b; }
.dashboard-v3 .wrap > header > .right { position: relative; }
.v3-advanced { flex: 0 0 auto; }
.v3-advanced > summary { color: var(--muted); cursor: pointer; font-family: inherit; font-size: 12px; font-weight: 600; line-height: 32px; padding: 0 10px; border: 1px solid var(--border); border-radius: 10px; background: var(--chip); white-space: nowrap; }
.v3-advanced > summary:focus-visible { outline: 2px solid var(--v3-accent); outline-offset: 2px; }
.v3-advanced[open] > summary { background: var(--chip-active); color: var(--chip-active-text); }
.v3-advanced-content { position: absolute; top: calc(100% + 8px); right: 0; z-index: 1000; width: min(560px, calc(100vw - 48px)); box-sizing: border-box; display: flex; flex-wrap: wrap; gap: 10px; align-items: center; padding: 12px; border: 1px solid var(--v3-line); border-radius: 10px; background: #fff; box-shadow: 0 6px 20px #233b5026; }
.v3-advanced-content > div { min-width: 0; max-width: 100%; flex-wrap: wrap; }
.dark-mode .v3-advanced-content { background: #1e293b; }
.dashboard-v3 .panel, .dashboard-v3 .small-chart-panel { border: 1px solid var(--v3-line); border-radius: 12px; box-shadow: none; }
.dashboard-v3 #chart { margin-top: 8px; }
.v3-stats { border: 1px solid var(--v3-line); border-radius: 12px; overflow: hidden; margin: 12px 0; background: var(--panel, #fff); }
.v3-stats-title { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; padding: 12px 14px; gap: 6px; border-bottom: 1px solid var(--v3-line); }
.v3-stats-title h2 { font-size: 14px; margin: 0; }
.v3-stats-title small { font-size: 11px; color: var(--muted); }
.v3-stat-row { display: grid; grid-template-columns: minmax(170px, 1.3fr) repeat(3, minmax(100px, 1fr)); padding: 11px 14px; gap: 8px; align-items: center; border-bottom: 1px solid var(--v3-line); font-size: 13px; }
.v3-stat-row:last-child { border-bottom: 0; }
.v3-stat-row:nth-child(odd) { background: var(--v3-soft); }
.v3-stat-name { font-weight: 600; display: flex; align-items: center; gap: 7px; }
.v3-swatch { width: 9px; height: 9px; border-radius: 2px; flex: 0 0 9px; }
.v3-stat-cell { font-variant-numeric: tabular-nums; }
.v3-stat-cell b { font-weight: 600; display: block; }
.v3-stat-cell small { display: block; font-size: 10px; color: var(--muted); }
.v3-stat-caption { color: var(--muted); font-size: 10px; }
.v3-stat-min { color: #1976d2; }
.v3-stat-max { color: #d62728; }
.dark-mode .v3-stat-min { color: #70b7ff; }
.dark-mode .v3-stat-max { color: #ff8585; }
.v3-stat-cell:is(.v3-stat-min, .v3-stat-max) :is(.v3-stat-caption, small) { color: inherit; }
.v3-climate-row { grid-column: 1 / -1; font-size: 11px; color: var(--muted); }
.v3-original-summary-hidden { display: none !important; }
.v3-dialog { border: 1px solid var(--v3-line); border-radius: 14px; width: min(1100px, calc(100vw - 32px)); max-width: none; max-height: calc(100dvh - 32px); padding: 0; background: var(--panel, #fff); color: var(--text); box-shadow: 0 18px 80px #0004; }
.v3-dialog::backdrop { background: #10213199; }
.v3-dialog header { border: 0; border-bottom: 1px solid var(--v3-line); border-radius: 0; margin: 0; box-shadow: none; display: flex; align-items: center; gap: 12px; padding: 14px; }
.v3-dialog header h2 { margin: 0; font-size: 16px; flex: 1; }
.v3-dialog-body { padding: 14px; }
.v3-dialog footer { display: flex; justify-content: flex-end; gap: 8px; padding: 12px 14px; border-top: 1px solid var(--v3-line); }
.v3-dialog iframe { width: 100%; height: 64dvh; border: 0; background: #dde4ea; }
.v3-dialog img { display: block; max-width: 100%; max-height: 65dvh; width: auto; height: auto; margin: auto; object-fit: contain; }
.v3-dialog .v3-export-meta { margin: 0 0 12px; font-size: 12px; line-height: 1.6; }
.dashboard-v3 [hidden] { display: none !important; }
.v3-range-heading { display:flex; flex-wrap:wrap; gap:6px 12px; justify-content:space-between; align-items:center; padding:8px 12px; border-bottom:1px solid var(--v3-line); font-size:12px; }
.v3-range-heading button,.v3-dialog button { cursor:pointer; border:1px solid var(--v3-line); border-radius:6px; padding:6px 12px; background:var(--panel,#fff); color:var(--text); }
.dashboard-v3 .small-chart-summary { padding:0; margin:0; border-radius:0 0 12px 12px; border:0; }
.dashboard-v3 .small-chart-panel { overflow:hidden; }
.dashboard-v3 .weather-chart-svg { user-select:none; -webkit-user-select:none; -webkit-touch-callout:none; }
.v3-stat-cell { min-width:0; overflow-wrap:anywhere; }
.v3-primary { background:var(--v3-accent)!important; color:white!important; }
@media(max-width:760px) {
.dashboard-v3 .small-chart-panel > .weather-chart { --weather-chart-proportional:0; height:280px!important; min-height:280px!important; }
.dashboard-v3 #chart { --weather-chart-proportional:0; height:360px!important; min-height:360px!important; }
.v3-stat-row { grid-template-columns:repeat(3,minmax(0,1fr)); padding:10px; gap:8px; font-size:12px; }
.v3-stat-name { grid-column:1 / -1; }
.v3-stat-cell small { font-size:9px; overflow-wrap:anywhere; }
.v3-advanced-content { gap:8px; }
.v3-advanced-content > div { flex-wrap:wrap; max-width:100%; }
.v3-dialog { width:calc(100vw - 16px); }
}