/* Extend WP's shell and meteo components; preserve the shell's header offset. */
#precipitation-page { padding-bottom: 2rem; }
.forecast-switcher a:focus-visible, #precipitation-page button:focus-visible { outline:2px solid lightskyblue; outline-offset:3px; }
.precip-hero { --om-shade:8 23 36; --om-shade-bot:.9; }
.precip-hero .om-hero-inner { justify-content:flex-end; }
.pc-controls { display:flex; gap:6px; margin:1.2rem 1rem; padding:5px; border-radius:14px; background:#1b2b36; }
.pc-controls button { flex:1; padding:14px 10px; border:0; border-radius:10px; background:transparent; color:#c6d4e6; font:inherit; cursor:pointer; }
.pc-controls button[aria-pressed=true] { background:#21688c; color:white; }
.pc-controls button:disabled { opacity:.6; cursor:wait; }
#pc-refresh { flex:0 0 auto; }
#pc-status { margin:1rem; color:#c6d4e6; }
#pc-status:empty { display:none; }
.pc-highlight { display:flex; flex-direction:column; text-align:left; font:inherit; color:inherit; cursor:pointer; border:1px solid transparent; }
.pc-highlight:disabled { cursor:default; }
.pc-heading { display:flex; align-items:baseline; justify-content:space-between; margin:1.5rem 1rem 1rem; gap:12px; }
.pc-heading h2 { margin:0; color:#f3f6fb; font-size:1.2rem; }
.pc-heading span { color:#a3b3c4; }
.pc-day-grid { display:grid; grid-template-columns:minmax(0,1fr); gap:1rem; margin:0 1rem; }
.pc-day { padding:1.2rem; border-radius:18px; border:1px solid #354453; background:#1b2531; scroll-margin-top:90px; }
.pc-day-heading { display:flex; position:static; background:none; padding:0; height:auto; width:auto; gap:10px; align-items:baseline; color:#a3b3c4; box-shadow:none; }
.pc-day-heading h3 { margin:0; color:#f3f6fb; font-size:1.1rem; }
.pc-provider { margin-top:1.25rem; }
.pc-provider h4 { margin:0 0 10px; color:#c6d4e6; font-size:1rem; }
.pc-stat-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.pc-stat { padding:14px; background:#253442; border-radius:12px; color:#c6d4e6; }
.pc-stat-head { display:flex; gap:8px; align-items:center; font-size:.72rem; letter-spacing:.025em; text-transform:uppercase; }
.pc-glyph { font-size:1.6rem; color:#a3adb8; }
.pc-amount { margin:10px 0 6px; font-size:1.5rem; font-weight:650; }
.pc-amount small { font-size:.9rem; font-weight:400; }
.has-snow .pc-amount,.has-snow .pc-glyph { color:lightskyblue; }
.has-rain .pc-amount,.has-rain .pc-glyph { color:lightgreen; }
.has-snow { background:linear-gradient(135deg,rgba(135,206,250,.12),#253442); }
.pc-freeze { margin:0; font-size:.82rem; line-height:1.5; }
.pc-partial { display:inline-block; font-size:.72rem; margin-top:8px; color:#a3b3c4; }
.pc-about { margin:1.5rem 1rem; padding:1.2rem; border-top:1px solid #354453; color:#a3b3c4; line-height:1.6; }
.pc-about h2 { color:#c6d4e6; font-size:1rem; }
#pc-updated p { display:flex; flex-wrap:wrap; justify-content:space-between; gap:6px 20px; font-size:.8rem; }
@media(min-width:720px) { .pc-day-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .pc-day { padding:1.4rem; } }
@media(min-width:1600px) { .pc-day-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(max-width:360px) { .pc-stat { padding:10px; } .pc-stat-head { flex-wrap:wrap; } .pc-controls button { padding:12px 6px; } }

/* Colored highlights follow the PLP dark palette and WP's rounded modules. */
#pc-summary .pc-highlight { min-height:172px; padding:20px; border-radius:16px; gap:9px; border:1px solid rgba(255,255,255,.08); box-shadow:none; }
#pc-summary .pc-snow { background:#16446c; }
#pc-summary .pc-rain { background:#294c3c; }
#pc-summary .pc-cold { background:#305269; }
#pc-summary .pc-warm { background:#8b4b23; }
.pc-highlight-icon { color:#87cefa; width:26px; height:26px; margin-bottom:4px; }
.pc-rain .pc-highlight-icon { color:#90ee90; }
.pc-warm .pc-highlight-icon { color:#ffd1a3; }
.pc-highlight-icon svg,.pc-glyph svg { display:block; width:100%; height:100%; }
#pc-summary .om-summary-tile-label { color:#dce5ef; font-size:.7rem; font-weight:600; letter-spacing:.06em; }
#pc-summary .om-summary-tile-value { color:#fff; font-size:1.45rem; line-height:1.2; }
#pc-summary .om-summary-tile-note { color:#dce5ef; font-size:.8rem; margin-top:auto; line-height:1.4; }
.pc-highlight:not(:disabled):hover { filter:brightness(1.12); }
.pc-glyph { display:block; width:24px; height:24px; flex-shrink:0; }
.pc-about { padding:14px 0; font-size:.78rem; line-height:1.5; background:none; border-radius:0; }
.pc-about summary { cursor:pointer; color:#b7c5d3; font-size:.82rem; font-weight:600; }
.pc-about>p { max-width:70em; margin:12px 0 0; font-size:.78rem; }
#pc-updated { display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:6px 24px; margin-top:14px; }
#pc-updated p { display:block; margin:0; font-size:.75rem; }
#pc-updated strong,#pc-updated span { display:block; }
@media(max-width:440px) { #pc-summary .pc-highlight { padding:16px; min-height:170px; } #pc-summary .om-summary-tile-value { font-size:1.3rem; } }
/* Match the 17rem phone heroes on Elevations and Temperature History. */
@media (max-width:719px) {
    .precip-hero,
    .precip-hero .om-hero-inner { min-height:17rem; }
    .precip-hero .om-hero-img { inset:0; height:100%; object-position:center 25%; }
}
/* Anchor Black Tusk's summit (15.3% down the source image) near the top
   of the hero, independent of the card's width/aspect ratio. */
.precip-hero .om-hero-img {
    inset:6% 0 auto;
    width:100%;
    height:auto;
    max-height:none;
    object-position:center;
    transform:translateY(-15.3%);
}

/* Follow the homepage camera notice's quiet disclosure row. */
.pc-about { padding:0 0 .1rem; border-top:0; border-bottom:1px solid rgb(255 255 255 / .08); -webkit-font-smoothing:antialiased; }
.pc-about summary { display:flex; align-items:center; gap:.5rem; min-height:44px; padding:.2rem .15rem; list-style:none; color:rgb(176 196 222 / .85); font-size:.82rem; font-weight:300; line-height:1.3; user-select:none; -webkit-tap-highlight-color:transparent; }
.pc-about summary::-webkit-details-marker { display:none; }
.pc-about summary:focus-visible { outline:2px solid lightskyblue; outline-offset:2px; border-radius:6px; }
.pc-notes-icon { flex:none; width:16px; height:16px; color:#87cefa; }
.pc-notes-label { color:#a6cce3; }
.pc-notes-dot { color:#788c9d; margin:0 .2rem; }
.pc-notes-chevron { flex:none; width:14px; height:14px; color:rgb(176 196 222 / .7); transition:transform .16s ease; }
.pc-about[open] .pc-notes-chevron { transform:rotate(180deg); }
.pc-about #pc-updated { margin-top:.1rem; }
.pc-about>p { margin-bottom:.85rem; }
@media(prefers-reduced-motion:reduce) { .pc-notes-chevron { transition:none; } }

/* Native dialog keeps keyboard focus inside the forecast sheet. */
html.pc-modal-open { overflow:hidden; }
#pc-period-dialog { box-sizing:border-box; width:calc(100% - 24px); max-width:560px; max-height:calc(100dvh - 32px); margin:auto; padding:0; border:1px solid #425565; border-radius:22px; background:#1b2531; color:#f3f6fb; overflow:auto; overscroll-behavior:contain; box-shadow:0 24px 80px rgb(0 0 0 / .45); }
#pc-period-dialog::backdrop { background:rgb(5 12 18 / .72); backdrop-filter:blur(5px); }
.pc-dialog-heading { position:sticky; top:0; z-index:1; display:flex; align-items:center; justify-content:space-between; gap:16px; padding:16px 20px; background:#1b2531; border-bottom:1px solid #354453; }
.pc-dialog-heading h2 { margin:0; font-size:1rem; }
#pc-dialog-close { padding:10px 16px; min-height:44px; border:1px solid #486277; border-radius:22px; background:#254b65; color:#fff; font:inherit; cursor:pointer; }
#pc-dialog-close:focus-visible { outline:2px solid lightskyblue; outline-offset:2px; }
#pc-dialog-content .pc-day { border:0; border-radius:0; margin:0; padding:20px; }
@media(max-width:599px) { #pc-period-dialog { margin:auto auto 0; width:100%; max-height:92dvh; border-radius:22px 22px 0 0; padding-bottom:env(safe-area-inset-bottom); } }
