.weather-page{max-width:1200px;margin:0 auto;padding:2rem 1rem}.weather-breadcrumbs{color:var(--color-text-muted);font-family:var(--font-sans);align-items:center;gap:.45rem;margin:0 0 .75rem;font-size:.875rem;display:flex}.weather-breadcrumbs a{color:inherit;text-underline-offset:2px;text-decoration:underline}.weather-container,.weather-content-wrapper{flex-direction:column;gap:2rem;display:flex}h1{color:var(--color-text);margin:0 0 1rem;font-size:2.5rem;font-weight:700}.location-editor-section{background:var(--color-background-alt);border:1px solid var(--color-border);border-radius:8px;margin-bottom:1rem;padding:1rem 1.5rem}.location-display{flex-wrap:wrap;align-items:center;gap:.75rem;display:flex}.location-label{font-size:var(--font-size-sm);color:var(--color-text-muted);font-weight:500}.location-name{font-size:var(--font-size-base);color:var(--color-text);font-weight:600}.change-location-btn{background-color:var(--color-primary);color:var(--color-black);font-size:var(--font-size-sm);cursor:pointer;transition:all var(--transition-fast);border:none;border-radius:6px;padding:.375rem .875rem;font-family:inherit;font-weight:600}.change-location-btn:hover{color:var(--color-black);background-color:#38bdf8;transform:translateY(-1px)}@media (prefers-color-scheme:dark){:root:not([data-theme=light]):not([data-theme=dark]) .change-location-btn:hover{color:var(--color-black);background-color:#8ee0ff}}:root[data-theme=dark] .change-location-btn:hover{color:var(--color-black);background-color:#8ee0ff}.location-editor-form{border-top:1px solid var(--color-border);margin-top:1rem;padding-top:1rem}.location-input-wrapper{width:100%;max-width:500px;margin-bottom:.75rem;position:relative}.location-editor-form input{border:1px solid var(--color-border);width:100%;font-size:var(--font-size-base);background:var(--color-background);color:var(--color-text);caret-color:var(--color-text);border-radius:6px;padding:.625rem;font-family:inherit}.location-editor-form input:focus{outline:2px solid var(--color-primary);outline-offset:0;border-color:var(--color-primary)}.location-editor-form input::placeholder{color:var(--color-text-muted);opacity:.7}.location-suggestions{background:var(--color-background);border:1px solid var(--color-border);z-index:100;border-top:none;border-radius:0 0 6px 6px;max-height:300px;position:absolute;top:100%;left:0;right:0;overflow-y:auto}.location-suggestion-item{cursor:pointer;border-bottom:1px solid var(--color-border);color:var(--color-text);padding:.75rem;transition:background-color .15s}.location-suggestion-item:last-child{border-bottom:none}.location-suggestion-item:hover,.location-suggestion-item.selected{background-color:#6ad4fc1a}.location-editor-actions{gap:.5rem;display:flex}.location-editor-btn{font-size:var(--font-size-base);cursor:pointer;transition:all var(--transition-fast);border:none;border-radius:6px;padding:.5rem 1.25rem;font-family:inherit;font-weight:500}.location-editor-btn.save{background-color:var(--color-primary);color:var(--color-black);font-weight:600}.location-editor-btn.save:hover{color:var(--color-black);background-color:#38bdf8}@media (prefers-color-scheme:dark){:root:not([data-theme=light]):not([data-theme=dark]) .location-editor-btn.save:hover{color:var(--color-black);background-color:#8ee0ff}}:root[data-theme=dark] .location-editor-btn.save:hover{color:var(--color-black);background-color:#8ee0ff}.location-editor-btn.cancel{color:#111827;background-color:#f3f4f6;border:1px solid #d1d5db}.location-editor-btn.cancel:hover{color:#111827;background-color:#e5e7eb;border-color:#9ca3af}@media (prefers-color-scheme:dark){:root:not([data-theme=light]):not([data-theme=dark]) .location-editor-btn.cancel{color:#f9fafb;background-color:#374151;border-color:#4b5563}:root:not([data-theme=light]):not([data-theme=dark]) .location-editor-btn.cancel:hover{color:#f9fafb;background-color:#4b5563;border-color:#6b7280}}:root[data-theme=dark] .location-editor-btn.cancel{color:#f9fafb;background-color:#374151;border-color:#4b5563}:root[data-theme=dark] .location-editor-btn.cancel:hover{color:#f9fafb;background-color:#4b5563;border-color:#6b7280}.location-editor-btn.detect{color:var(--color-text);border:1px solid var(--color-border);background-color:#0000}.location-editor-btn.detect:hover{background-color:#00000008}@media (prefers-color-scheme:dark){:root:not([data-theme=light]):not([data-theme=dark]) .location-editor-btn.detect{color:#f9fafb;background-color:#0000;border-color:#4b5563}:root:not([data-theme=light]):not([data-theme=dark]) .location-editor-btn.detect:hover{background-color:#ffffff0f;border-color:#6b7280}}:root[data-theme=dark] .location-editor-btn.detect{color:#f9fafb;background-color:#0000;border-color:#4b5563}:root[data-theme=dark] .location-editor-btn.detect:hover{background-color:#ffffff0f;border-color:#6b7280}.location-editor-error{font-size:var(--font-size-sm);color:#ef4444;min-height:1.25rem;margin-top:.5rem}.weather-alerts-section{margin-bottom:2rem}.weather-alerts-section h2{color:var(--color-text);margin:0 0 1rem;font-size:1.5rem;font-weight:700}.weather-alerts{flex-direction:column;gap:1rem;display:flex}.weather-alert{border-left:4px solid;border-radius:8px;overflow:hidden}.alert-toggle{text-align:left;cursor:pointer;background:0 0;border:none;width:100%;padding:1rem 1.25rem;font-family:inherit;transition:background-color .2s}.alert-toggle:hover{background-color:#0000000d}.alert-header{justify-content:space-between;align-items:center;display:flex}.alert-chevron{flex-shrink:0;transition:transform .2s}.weather-alert-extreme{background-color:#fee2e2;border-left-color:#dc2626}.weather-alert-extreme .alert-toggle,.weather-alert-extreme .alert-details{color:#7f1d1d}.weather-alert-severe{background-color:#fed7aa;border-left-color:#ea580c}.weather-alert-severe .alert-toggle,.weather-alert-severe .alert-details{color:#7c2d12}.weather-alert-moderate{background-color:#fef3c7;border-left-color:#f59e0b}.weather-alert-moderate .alert-toggle,.weather-alert-moderate .alert-details{color:#78350f}.weather-alert-minor,.weather-alert-unknown{background-color:#dbeafe;border-left-color:#3b82f6}.weather-alert-minor .alert-toggle,.weather-alert-minor .alert-details,.weather-alert-unknown .alert-toggle,.weather-alert-unknown .alert-details{color:#1e3a8a}@media (prefers-color-scheme:dark){:root:not([data-theme=light]):not([data-theme=dark]) .weather-alert-extreme{background-color:#7f1d1d;border-left-color:#fca5a5}:root:not([data-theme=light]):not([data-theme=dark]) .weather-alert-extreme .alert-toggle,:root:not([data-theme=light]):not([data-theme=dark]) .weather-alert-extreme .alert-details{color:#fee2e2}:root:not([data-theme=light]):not([data-theme=dark]) .weather-alert-severe{background-color:#7c2d12;border-left-color:#fdba74}:root:not([data-theme=light]):not([data-theme=dark]) .weather-alert-severe .alert-toggle,:root:not([data-theme=light]):not([data-theme=dark]) .weather-alert-severe .alert-details{color:#fed7aa}:root:not([data-theme=light]):not([data-theme=dark]) .weather-alert-moderate{background-color:#78350f;border-left-color:#fcd34d}:root:not([data-theme=light]):not([data-theme=dark]) .weather-alert-moderate .alert-toggle,:root:not([data-theme=light]):not([data-theme=dark]) .weather-alert-moderate .alert-details{color:#fef3c7}:root:not([data-theme=light]):not([data-theme=dark]) .weather-alert-minor,:root:not([data-theme=light]):not([data-theme=dark]) .weather-alert-unknown{background-color:#1e3a8a;border-left-color:#93c5fd}:root:not([data-theme=light]):not([data-theme=dark]) .weather-alert-minor .alert-toggle,:root:not([data-theme=light]):not([data-theme=dark]) .weather-alert-minor .alert-details,:root:not([data-theme=light]):not([data-theme=dark]) .weather-alert-unknown .alert-toggle,:root:not([data-theme=light]):not([data-theme=dark]) .weather-alert-unknown .alert-details{color:#dbeafe}}:root[data-theme=dark] .weather-alert-extreme{background-color:#7f1d1d;border-left-color:#fca5a5}:root[data-theme=dark] .weather-alert-extreme .alert-toggle,:root[data-theme=dark] .weather-alert-extreme .alert-details{color:#fee2e2}:root[data-theme=dark] .weather-alert-severe{background-color:#7c2d12;border-left-color:#fdba74}:root[data-theme=dark] .weather-alert-severe .alert-toggle,:root[data-theme=dark] .weather-alert-severe .alert-details{color:#fed7aa}:root[data-theme=dark] .weather-alert-moderate{background-color:#78350f;border-left-color:#fcd34d}:root[data-theme=dark] .weather-alert-moderate .alert-toggle,:root[data-theme=dark] .weather-alert-moderate .alert-details{color:#fef3c7}:root[data-theme=dark] .weather-alert-minor,:root[data-theme=dark] .weather-alert-unknown{background-color:#1e3a8a;border-left-color:#93c5fd}:root[data-theme=dark] .weather-alert-minor .alert-toggle,:root[data-theme=dark] .weather-alert-minor .alert-details,:root[data-theme=dark] .weather-alert-unknown .alert-toggle,:root[data-theme=dark] .weather-alert-unknown .alert-details{color:#dbeafe}.alert-header strong{font-size:1.125rem;font-weight:700}.alert-headline{margin-top:.5rem;font-size:.875rem;line-height:1.5}.alert-expires{opacity:.8;margin-top:.5rem;font-size:.75rem;font-weight:500}.alert-details{border-top:1px solid #0000001a;padding:0 1.25rem 1rem}.alert-description{white-space:pre-wrap;padding-top:1rem;font-size:.875rem;line-height:1.6}.current-weather-hero{color:#fff;text-shadow:0 2px 4px #0000004d;border-radius:12px;flex-direction:column;gap:1.5rem;padding:2rem;display:flex;position:relative;overflow:hidden;box-shadow:0 4px 20px #00000026}.current-weather-hero.light-bg{color:#1a1a1a;text-shadow:0 1px 2px #ffffff80}.current-weather-hero.light-bg .detail-item{background:#fff6}.current-weather-hero:before{content:"";pointer-events:none;background:linear-gradient(135deg,#ffffff1a 0%,#ffffff0d 100%);position:absolute;inset:0}.current-main{z-index:1;align-items:center;gap:1.5rem;display:flex;position:relative}.current-temp-display{flex-direction:column;gap:.25rem;display:flex}.weather-icon-display{filter:drop-shadow(0 2px 4px #00000059);font-size:3.5rem;line-height:1}.temp-large{font-size:3.5rem;font-weight:800;line-height:1}.condition-large{font-size:1.125rem;font-weight:500}.current-details-grid{z-index:1;grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:1rem;display:grid;position:relative}@media (width>=640px){.current-details-grid{grid-template-columns:repeat(4,1fr)}}@media (width>=1024px){.current-details-grid{grid-template-columns:repeat(7,1fr)}}.detail-item{text-align:center;flex-direction:column;gap:.25rem;display:flex}.detail-label{opacity:.9;text-transform:uppercase;letter-spacing:.5px;font-size:.75rem;font-weight:500}.detail-value{font-size:1.125rem;font-weight:700}.hourly-forecast-section{margin-top:2rem}.hourly-forecast-header{justify-content:space-between;align-items:center;margin-bottom:1rem;display:flex}.hourly-forecast-section h2{color:var(--color-text);margin:0;font-size:1.75rem;font-weight:700}.hourly-scroll-controls{gap:.5rem;display:none}@media (width>=768px){.hourly-scroll-controls{display:flex}}.hourly-scroll-btn{background:var(--color-background-alt);border:1px solid var(--color-border);cursor:pointer;width:36px;height:36px;color:var(--color-text);border-radius:6px;justify-content:center;align-items:center;transition:all .2s;display:flex}.hourly-scroll-btn:hover:not(:disabled){background:var(--color-primary);border-color:var(--color-primary);color:var(--color-black);transform:translateY(-1px)}.hourly-scroll-btn:active:not(:disabled){transform:translateY(0)}.hourly-scroll-btn:disabled{cursor:not-allowed;opacity:.3}.hourly-scroll-btn svg{flex-shrink:0;min-width:20px;min-height:20px;display:block;width:20px!important;height:20px!important}.hourly-forecast-container{scrollbar-width:thin;scrollbar-color:var(--color-border) transparent;cursor:grab;user-select:none;gap:.75rem;padding:1rem 0;display:flex;overflow-x:auto}.hourly-forecast-container:active{cursor:grabbing}.hourly-forecast-container::-webkit-scrollbar{height:8px}.hourly-forecast-container::-webkit-scrollbar-track{background:0 0}.hourly-forecast-container::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:4px}.hourly-forecast-container::-webkit-scrollbar-thumb:hover{background:var(--color-text-muted)}@media (width<=767px){.hourly-forecast-container{cursor:default}}.hourly-day-divider{flex-shrink:0;justify-content:center;align-items:center;min-width:100px;padding:0 1rem;display:flex;position:relative}.hourly-day-divider span{color:var(--color-text);background:var(--color-background);border:2px solid var(--color-primary);white-space:nowrap;text-transform:uppercase;letter-spacing:.5px;border-radius:20px;padding:.5rem 1rem;font-size:.875rem;font-weight:700}.hourly-item{background:var(--color-background-alt);border:1px solid var(--color-border);border-radius:8px;flex-direction:column;flex-shrink:0;align-items:center;gap:.5rem;min-width:80px;padding:1rem .75rem;transition:all .2s;display:flex}.hourly-item:hover{border-color:var(--color-primary);transform:translateY(-2px)}.hourly-now{border-color:var(--color-primary);background:linear-gradient(135deg,#6ad4fc26 0%,#6ad4fc14 100%)}.hourly-time{color:var(--color-text);font-size:.875rem;font-weight:600}.hourly-icon{filter:drop-shadow(0 1px 2px #0000004d);font-size:2rem;line-height:1}.hourly-temp{color:var(--color-text);font-size:1.125rem;font-weight:700}.hourly-precip{color:var(--color-link);font-size:.75rem;font-weight:600}.hourly-precip-empty{height:1rem}.forecast-section{margin-top:2rem}.forecast-section h2{color:var(--color-text);margin:0 0 1.5rem;font-size:2rem;font-weight:700}.forecast-grid{grid-template-columns:repeat(7,1fr);gap:1rem;display:grid}.forecast-card{background:var(--color-background-alt);border:1px solid var(--color-border);border-radius:12px;flex-direction:column;align-items:center;gap:.75rem;padding:1.25rem;transition:all .2s;display:flex}.forecast-card:hover{border-color:var(--color-primary);transform:translateY(-2px)}.forecast-day-header{text-align:center;flex-direction:column;align-items:center;gap:.25rem;display:flex}.forecast-day-name{color:var(--color-text);font-size:.875rem;font-weight:700}.forecast-date{color:var(--color-text-muted);font-size:.75rem;font-weight:500}.forecast-icon{filter:drop-shadow(0 1px 2px #00000040);font-size:2rem;line-height:1}.forecast-temps{align-items:baseline;gap:.25rem;font-size:1rem;font-weight:600;display:flex}.temp-high{color:var(--color-text)}.temp-divider{color:var(--color-text-muted);font-weight:400}.temp-low{color:var(--color-text-muted);font-weight:500}.forecast-condition{color:var(--color-text-light);text-align:center;font-size:.75rem;font-weight:500}.precipitation-chance{color:var(--color-link);align-items:center;gap:.375rem;font-size:.875rem;font-weight:600;display:flex}.precipitation-chance svg{flex-shrink:0;width:18px;height:18px}.weather-footer{border-top:1px solid var(--color-border);color:var(--color-text-muted);text-align:center;flex-direction:column;gap:.5rem;margin-top:2rem;padding-top:2rem;font-size:.875rem;display:flex}.weather-source a{color:var(--color-link);font-weight:500;text-decoration:none}.weather-source a:hover{text-decoration:underline}.weather-error{text-align:center;color:#dc2626;background:#fef2f2;border:1px solid #fca5a5;border-radius:8px;padding:2rem}.weather-loading{text-align:center;color:var(--color-text-muted);flex-direction:column;align-items:center;gap:1rem;padding:3rem;display:flex}.loading-spinner{border:3px solid var(--color-border);border-top:3px solid var(--color-link);border-radius:50%;width:32px;height:32px;animation:1s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.retry-button{background:var(--color-link);color:#fff;cursor:pointer;border:none;border-radius:6px;margin-top:1rem;padding:.75rem 1.5rem;font-size:.875rem;font-weight:600}.retry-button:hover{background:var(--color-link-hover)}@media (width<=1024px){.forecast-grid{grid-template-columns:repeat(4,1fr)}}@media (width<=767px){.weather-page{padding:1rem}h1{font-size:2rem}.current-weather-hero{gap:1rem;padding:1.25rem}.current-main{text-align:left;flex-direction:row;justify-content:center;gap:1rem}.weather-icon-display,.temp-large{font-size:2.5rem}.condition-large{font-size:1rem}.current-details-grid{grid-template-columns:repeat(2,1fr);gap:.75rem}.detail-item{text-align:center;background:#ffffff1a;border-radius:6px;flex-direction:column;gap:.25rem;padding:.75rem}.detail-label{font-size:.625rem}.detail-value{font-size:1rem}.hourly-forecast-section h2{font-size:1.25rem}.hourly-item{min-width:70px;padding:.75rem .5rem}.hourly-icon{font-size:1.75rem}.hourly-temp{font-size:1rem}.forecast-grid{grid-template-columns:repeat(2,1fr)}.forecast-section h2{font-size:1.5rem}.forecast-icon{font-size:2.5rem}.forecast-temps{font-size:1.125rem}}@media (width<=480px){.forecast-grid{grid-template-columns:1fr}.forecast-card{text-align:left;grid-template-columns:auto 1fr auto;align-items:center;gap:1rem;display:grid}.forecast-day-header{text-align:left;align-items:flex-start}.forecast-condition{display:none}}