/* Established weather theme: compact comparison and native local scrolling. */
.hb-weather-detail,.hb-cold-page { --hb-detail-paper:#fff; --hb-detail-line:#e2e8f0; --hb-detail-ink:#1e293b; --hb-detail-muted:#475569; --hb-detail-soft:#f1f5f9; --hb-detail-accent:#cbd5e1; }
.hb-weather-detail { padding:20px; margin:24px 0; color:var(--hb-detail-ink); min-width:0; }
.hb-weather-detail h2 { margin:0 0 12px; font-size:1.3rem; line-height:1.3; }
.hb-detail-answer { line-height:1.6; margin:12px 0; }
.hb-detail-note { color:var(--hb-detail-muted); line-height:1.65; font-size:.85rem; margin:12px 0; }
.hb-detail-windows { display:flex; flex-wrap:wrap; gap:8px 24px; padding-left:20px; font-variant-numeric:tabular-nums; }
.hb-detail-hours { display:grid; grid-auto-flow:column; grid-auto-columns:calc((100% - 40px)/6); gap:8px; overflow-x:auto; overscroll-behavior-x:contain; scroll-snap-type:x mandatory; padding:4px 0 12px; }
.hb-detail-hour { box-sizing:border-box; min-width:0; padding:12px 6px; text-align:center; display:flex; flex-direction:column; gap:8px; align-items:center; border:1px solid var(--hb-detail-line); border-radius:10px; background:var(--hb-detail-paper); scroll-snap-align:start; font-variant-numeric:tabular-nums; }
.hb-detail-hour time { font-weight:700; font-size:1rem; display:flex; flex-direction:column; gap:4px; }
.hb-detail-hour small { color:var(--hb-detail-muted); font-size:.75rem; font-weight:500; }
.hb-detail-hour strong { font-size:1.3rem; }
.hb-detail-hour>span:not(.hb-detail-icon) { font-size:.75rem; color:var(--hb-detail-muted); }
.hb-detail-icon { font-size:1.5rem; line-height:1.3; }
.hb-detail-hour.is-highlight { background:var(--hb-detail-soft); border-color:var(--hb-detail-accent); }
.hb-detail-hours:focus-visible,.hb-detail-links a:focus-visible { outline:2px solid var(--hb-detail-ink); outline-offset:3px; }
.hb-detail-links { display:flex; flex-wrap:wrap; gap:12px; margin:20px 0; }
.hb-detail-links a { min-height:44px; display:inline-flex; align-items:center; padding:0 12px; color:var(--hb-detail-ink); background:var(--hb-detail-soft); border:1px solid var(--hb-detail-line); border-radius:8px; }
.hb-cold-page .header-line { display:flex; justify-content:space-between; align-items:baseline; gap:16px; }
.hb-cold-page .left-group { display:flex; flex-wrap:wrap; align-items:baseline; gap:8px; min-width:0; }
.hb-cold-page .page-titles { margin:0; font-size:1.3rem; line-height:1.4; color:var(--hb-detail-ink); }
.hb-cold-page .update-time { font-size:.85rem; white-space:nowrap; }
@media(max-width:768px) {
    .hb-weather-detail { padding:14px; }
    .hb-detail-hours { grid-auto-columns:calc((100% - 16px)/3); }
    .hb-weather-detail h2,.hb-cold-page .page-titles { font-size:1.05rem; }
    .hb-cold-page .header-line { flex-direction:column; gap:8px; }
    .hb-detail-hour { padding:10px 4px; }
}
