.weather-pv-hero {
    margin-top: 8px;
}

.weather-page .weather-pv-hero,
.weather-page .weather-results-section {
    --pv-ink: #182735;
    --pv-ink-soft: #4d6072;
    --pv-ink-muted: #617485;
    --pv-hero-bg: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 252, 0.98));
    --pv-card-bg: linear-gradient(180deg, rgba(18, 35, 52, 0.98), rgba(10, 22, 35, 0.99));
    --pv-card-bg-soft: linear-gradient(180deg, rgba(17, 32, 47, 0.98), rgba(9, 18, 31, 0.99));
    --pv-card-border: rgba(255, 255, 255, 0.1);
    --pv-card-copy: rgba(236, 242, 247, 0.95);
    --pv-card-muted: rgba(223, 232, 240, 0.84);
    --pv-accent: #6fcfc3;
    --pv-accent-soft: rgba(111, 207, 195, 0.18);
    --pv-gold: #f4c65d;
    --pv-shadow: 0 20px 48px rgba(10, 23, 37, 0.16);
}

.weather-page .weather-pv-shell,
.weather-page .weather-pv-aside,
.weather-page .weather-pv-summary,
.weather-page .weather-pv-card,
.weather-page .weather-pv-day-card,
.weather-page .weather-pv-chart,
.weather-page .weather-pv-window,
.weather-page .weather-pv-meta,
.weather-page .weather-pv-loading,
.weather-page .weather-pv-insight-card,
.weather-page .weather-pv-empty {
    border-radius: 24px;
}

.weather-page .weather-pv-shell,
.weather-page .weather-pv-aside {
    border: 1px solid rgba(24, 39, 53, 0.08);
    background: var(--pv-hero-bg);
    box-shadow: 0 18px 42px rgba(18, 32, 47, 0.08);
}

.weather-page .weather-pv-shell {
    display: grid;
    gap: 18px;
    padding: 28px;
}

.weather-page .weather-pv-aside {
    display: grid;
    gap: 16px;
    align-content: start;
    padding: 26px;
}

.weather-page .weather-pv-shell .eyebrow,
.weather-page .weather-pv-empty .eyebrow,
.weather-page .weather-pv-loading .eyebrow,
.weather-page .weather-pv-label,
.weather-page .weather-pv-aside .section-pill {
    letter-spacing: 0.1em;
}

.weather-page .weather-pv-shell h1 {
    margin: 0;
    max-width: 14ch;
    font-size: clamp(1.9rem, 3vw, 2.75rem) !important;
    line-height: 1.08 !important;
    letter-spacing: -0.035em !important;
    color: var(--pv-ink) !important;
}

.weather-page .weather-pv-aside h2 {
    margin: 0;
    font-size: clamp(1.2rem, 1.9vw, 1.6rem) !important;
    line-height: 1.2 !important;
    letter-spacing: -0.02em;
    color: var(--pv-ink) !important;
}

.weather-page .weather-pv-shell .hero-text,
.weather-page .weather-pv-shell .weather-search-help,
.weather-page .weather-pv-shell .weather-search-label,
.weather-page .weather-pv-shell .weather-breadcrumbs,
.weather-page .weather-pv-aside p,
.weather-page .weather-pv-aside li,
.weather-page .weather-pv-empty .weather-empty-copy,
.weather-page .weather-pv-empty .weather-empty-list li {
    color: var(--pv-ink-soft) !important;
}

.weather-page .weather-pv-shell .hero-text,
.weather-page .weather-pv-aside .weather-aside-intro {
    max-width: 62ch;
    font-size: 1rem !important;
    line-height: 1.72 !important;
}

.weather-page .weather-pv-shell .weather-breadcrumbs,
.weather-page .weather-pv-shell .weather-search-help,
.weather-page .weather-pv-shell .weather-search-label,
.weather-page .weather-pv-aside .weather-guide-list li,
.weather-page .weather-pv-empty .weather-empty-list li,
.weather-page .weather-pv-empty .weather-empty-copy {
    font-size: 0.97rem !important;
}

.weather-page .weather-pv-shell .weather-breadcrumbs a {
    color: #247e74;
}

.weather-page .weather-pv-shell .weather-hub-highlights {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.weather-page .weather-pv-shell .weather-hub-highlights span {
    color: #203245;
    background: rgba(19, 43, 66, 0.05);
    border: 1px solid rgba(18, 32, 47, 0.08);
    font-size: 0.92rem;
    font-weight: 700;
}

.weather-page .weather-pv-panel {
    padding: 22px;
}

.weather-page .weather-pv-search-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 12px;
    align-items: center;
}

.weather-page .weather-search-feedback[data-state="muted"] { color: var(--pv-ink-muted); }
.weather-page .weather-search-feedback[data-state="loading"] { color: #1e6a8b; }
.weather-page .weather-search-feedback[data-state="success"] { color: #16745b; }
.weather-page .weather-search-feedback[data-state="warning"] { color: #925f00; }
.weather-page .weather-search-feedback[data-state="error"] { color: #b13d3d; }

.weather-page .weather-pv-aside .weather-guide-list,
.weather-page .weather-pv-empty .weather-empty-list {
    display: grid;
    gap: 10px;
    padding-left: 1.15rem;
}

.weather-page .weather-pv-aside .weather-guide-list li::marker,
.weather-page .weather-pv-empty .weather-empty-list li::marker {
    color: #2b9387;
}

.weather-page .weather-results-section {
    margin-top: 10px;
}

.weather-page .weather-pv-results-shell,
.weather-page .weather-pv-topline,
.weather-page .weather-pv-grid,
.weather-page .weather-pv-windows,
.weather-page .weather-pv-chart-head,
.weather-page .weather-pv-chart-summary,
.weather-page .weather-pv-section-copy {
    display: grid;
    gap: 18px;
}

.weather-page .weather-pv-results-shell {
    gap: 24px;
}

.weather-page .weather-pv-summary,
.weather-page .weather-pv-card,
.weather-page .weather-pv-day-card,
.weather-page .weather-pv-chart,
.weather-page .weather-pv-window,
.weather-page .weather-pv-meta,
.weather-page .weather-pv-loading,
.weather-page .weather-pv-insight-card {
    padding: 24px;
    border: 1px solid var(--pv-card-border);
    background: var(--pv-card-bg);
    color: #f4f8fb;
    box-shadow: var(--pv-shadow);
}

.weather-page .weather-pv-insight-card {
    background: var(--pv-card-bg-soft);
}

.weather-page .weather-pv-topline {
    grid-template-columns: minmax(0, 1.18fr) minmax(340px, 0.92fr);
    align-items: start;
}

.weather-page .weather-pv-summary-head,
.weather-page .weather-pv-chart-copy {
    display: grid;
    gap: 10px;
}

.weather-page .weather-pv-summary-head h2,
.weather-page .weather-pv-card h3,
.weather-page .weather-pv-chart h3,
.weather-page .weather-pv-day-card h3,
.weather-page .weather-pv-meta h3,
.weather-page .weather-pv-insight-card h3 {
    margin: 0;
    color: #ffffff;
    font-size: clamp(1.12rem, 1.5vw, 1.42rem) !important;
    line-height: 1.28 !important;
    letter-spacing: -0.02em;
}

.weather-page .weather-pv-summary-head p,
.weather-page .weather-pv-card p,
.weather-page .weather-pv-day-card p,
.weather-page .weather-pv-summary p,
.weather-page .weather-pv-meta p,
.weather-page .weather-pv-window p,
.weather-page .weather-pv-insight-card p,
.weather-page .weather-pv-source-line,
.weather-page .weather-section-note {
    margin: 0;
    color: var(--pv-card-copy) !important;
    font-size: 0.98rem !important;
    line-height: 1.64 !important;
    overflow-wrap: anywhere;
}

.weather-page .weather-pv-scoreline {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 12px;
}

.weather-page .weather-pv-scoreline strong {
    display: inline-flex;
    align-items: baseline;
    gap: 8px;
    font-size: clamp(2rem, 3vw, 2.8rem) !important;
    line-height: 1 !important;
    letter-spacing: -0.04em;
}

.weather-page .weather-pv-scoreline strong::after {
    content: "/100";
    font-size: 0.42em;
    color: rgba(230, 238, 246, 0.72);
}

.weather-page .weather-pv-score-badge,
.weather-page .weather-pv-chip,
.weather-page .weather-pv-hour-badge,
.weather-page .weather-pv-legend-item,
.weather-page .weather-pv-mini-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 36px;
    padding: 0 14px;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(255, 255, 255, 0.08);
    color: #f8fbff;
    font-weight: 700;
    font-size: 0.92rem !important;
    line-height: 1.3;
    flex-wrap: wrap;
}

.weather-page .weather-pv-chip-grid,
.weather-page .weather-pv-meta-grid,
.weather-page .weather-pv-window-grid,
.weather-page .weather-pv-day-grid,
.weather-page .weather-pv-insight-grid {
    display: grid;
    gap: 14px;
}

.weather-page .weather-pv-chip-grid,
.weather-page .weather-pv-summary-grid {
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
}

.weather-page .weather-pv-meta-grid {
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}

.weather-page .weather-pv-meta-grid-tight {
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
}

.weather-page .weather-pv-window-grid,
.weather-page .weather-pv-day-grid,
.weather-page .weather-pv-insight-grid {
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}

.weather-page .weather-pv-card,
.weather-page .weather-pv-day-card,
.weather-page .weather-pv-window,
.weather-page .weather-pv-insight-card {
    display: grid;
    gap: 12px;
    align-content: start;
    min-width: 0;
}

.weather-page .weather-pv-card-value,
.weather-page .weather-pv-meta-value,
.weather-page .weather-pv-window strong,
.weather-page .weather-pv-day-card strong {
    display: block;
    color: #ffffff;
    font-size: clamp(1rem, 1.25vw, 1.18rem) !important;
    line-height: 1.36 !important;
    font-weight: 800;
    overflow-wrap: anywhere;
}

.weather-page .weather-pv-label {
    font-size: 0.73rem !important;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    font-weight: 800;
    color: var(--pv-accent);
}

.weather-page .weather-pv-chart {
    overflow: hidden;
}

.weather-page .weather-pv-chart-head {
    grid-template-columns: minmax(0, 1.1fr) minmax(280px, auto);
    align-items: start;
}

.weather-page .weather-pv-chart-copy p:last-child {
    color: var(--pv-card-muted) !important;
}

.weather-page .weather-pv-chart-legend {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
}

.weather-page .weather-pv-legend-dot {
    width: 10px;
    height: 10px;
    border-radius: 999px;
    display: inline-block;
}

.weather-page .weather-pv-legend-dot.is-excellent { background: #ffd96d; }
.weather-page .weather-pv-legend-dot.is-good { background: #f4a55d; }
.weather-page .weather-pv-legend-dot.is-fair { background: #75cdbd; }
.weather-page .weather-pv-legend-dot.is-night { background: #5b6880; }

.weather-page .weather-pv-chart-summary {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.weather-page .weather-pv-mini-chip {
    justify-content: center;
}

.weather-page .weather-pv-chart-scroll {
    overflow-x: auto;
    padding-bottom: 10px;
    scrollbar-width: thin;
}

.weather-page .weather-pv-chart-scroll::-webkit-scrollbar { height: 10px; }
.weather-page .weather-pv-chart-scroll::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.18);
    border-radius: 999px;
}

.weather-page .weather-pv-bars {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(42px, 42px);
    align-items: end;
    gap: 9px;
    min-width: max-content;
    padding-top: 6px;
}

.weather-page .weather-pv-bar {
    display: grid;
    gap: 8px;
    justify-items: center;
}

.weather-page .weather-pv-bar-value {
    width: 100%;
    min-height: 22px;
    border-radius: 14px 14px 10px 10px;
    background: linear-gradient(180deg, rgba(143, 215, 208, 0.98), rgba(69, 191, 167, 0.84));
    box-shadow: 0 12px 24px rgba(62, 184, 162, 0.18);
}

.weather-page .weather-pv-bar.is-night .weather-pv-bar-value {
    background: linear-gradient(180deg, rgba(96, 111, 138, 0.72), rgba(63, 75, 97, 0.76));
    box-shadow: none;
}

.weather-page .weather-pv-bar.is-good .weather-pv-bar-value {
    background: linear-gradient(180deg, rgba(255, 206, 137, 0.98), rgba(245, 151, 76, 0.9));
}

.weather-page .weather-pv-bar.is-excellent .weather-pv-bar-value {
    background: linear-gradient(180deg, rgba(255, 236, 163, 1), rgba(252, 194, 53, 0.92));
}

.weather-page .weather-pv-bar-label,
.weather-page .weather-pv-bar-day {
    font-size: 0.78rem;
    color: rgba(226, 235, 243, 0.9);
}

.weather-page .weather-pv-bar-score {
    font-size: 0.84rem;
    font-weight: 800;
    color: #ffffff;
}

.weather-page .weather-pv-window-time {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    font-weight: 700;
    color: #ffffff;
    flex-wrap: wrap;
}

.weather-page .weather-pv-window-meta,
.weather-page .weather-pv-day-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.weather-page .weather-pv-loading,
.weather-page .weather-pv-empty {
    padding: 26px;
}

.weather-page .weather-pv-loading h2,
.weather-page .weather-pv-empty h2 {
    margin: 0;
    color: inherit;
    font-size: clamp(1.28rem, 1.9vw, 1.7rem);
    line-height: 1.22;
    letter-spacing: -0.02em;
}

.weather-page .weather-pv-empty {
    background: var(--pv-hero-bg);
    border: 1px solid rgba(18, 32, 47, 0.08);
    box-shadow: 0 20px 48px rgba(18, 32, 47, 0.08);
}

.weather-page .weather-pv-empty h2,
.weather-page .weather-pv-empty .eyebrow {
    color: var(--pv-ink);
}

@media (max-width: 1120px) {
    .weather-page .weather-pv-topline,
    .weather-page .weather-pv-chart-head {
        grid-template-columns: 1fr;
    }

    .weather-page .weather-pv-chart-legend {
        justify-content: flex-start;
    }
}

@media (max-width: 860px) {
    .weather-page .weather-pv-shell,
    .weather-page .weather-pv-aside {
        padding: 22px;
    }

    .weather-page .weather-pv-search-grid {
        grid-template-columns: 1fr;
    }

    .weather-page .weather-pv-search-grid .button {
        width: 100%;
    }

    .weather-page .weather-pv-shell h1 {
        max-width: 100%;
        font-size: clamp(1.7rem, 5.7vw, 2.2rem) !important;
    }

    .weather-page .weather-pv-aside h2 {
        font-size: clamp(1.08rem, 4.2vw, 1.4rem) !important;
    }

    .weather-page .weather-pv-scoreline strong {
        font-size: clamp(1.8rem, 7.8vw, 2.35rem) !important;
    }
}

@media (max-width: 640px) {
    .weather-page .weather-pv-shell,
    .weather-page .weather-pv-aside,
    .weather-page .weather-pv-panel,
    .weather-page .weather-pv-summary,
    .weather-page .weather-pv-card,
    .weather-page .weather-pv-day-card,
    .weather-page .weather-pv-chart,
    .weather-page .weather-pv-window,
    .weather-page .weather-pv-meta,
    .weather-page .weather-pv-loading,
    .weather-page .weather-pv-empty,
    .weather-page .weather-pv-insight-card {
        padding: 18px;
        border-radius: 20px;
    }

    .weather-page .weather-pv-shell .weather-hub-highlights span,
    .weather-page .weather-pv-score-badge,
    .weather-page .weather-pv-chip,
    .weather-page .weather-pv-hour-badge,
    .weather-page .weather-pv-legend-item,
    .weather-page .weather-pv-mini-chip {
        font-size: 0.86rem !important;
    }

    .weather-page .weather-pv-summary-head p,
    .weather-page .weather-pv-card p,
    .weather-page .weather-pv-day-card p,
    .weather-page .weather-pv-summary p,
    .weather-page .weather-pv-meta p,
    .weather-page .weather-pv-window p,
    .weather-page .weather-pv-insight-card p,
    .weather-page .weather-pv-source-line,
    .weather-page .weather-section-note,
    .weather-page .weather-pv-shell .hero-text,
    .weather-page .weather-pv-shell .weather-search-help,
    .weather-page .weather-pv-shell .weather-search-label,
    .weather-page .weather-pv-aside p,
    .weather-page .weather-pv-aside li {
        font-size: 0.94rem !important;
        line-height: 1.58 !important;
    }

    .weather-page .weather-pv-bars {
        grid-auto-columns: minmax(36px, 36px);
        gap: 7px;
    }
}
