:root{--bg-canvas:#fff;--bg-muted:#f3f4f6;--bg-subtle:#f9fafb;--bg-card:#fff;--bg-card-hover:#f9fafb;--text-main:#111827;--text-muted:#6b7280;--text-subtle:#9ca3af;--text-inverse:#fff;--color-primary:#3b82f6;--color-primary-hover:#2563eb;--color-primary-bg:#eff6ff;--color-secondary:#10b981;--color-secondary-hover:#059669;--color-secondary-bg:#ecfdf5;--color-accent:#f59e0b;--color-accent-hover:#d97706;--color-accent-bg:#fffbeb;--color-danger:#ef4444;--color-danger-hover:#dc2626;--color-danger-bg:#fef2f2;--color-purple:#8b5cf6;--color-purple-bg:#f5f3ff;--border-flat:#e5e7eb;--border-thick:2px solid #e5e7eb;--border-focus:2px solid #3b82f6;--radius-sm:6px;--radius-md:8px;--radius-lg:12px;--radius-full:9999px;--anim-fast:.15s cubic-bezier(.4, 0, .2, 1);--anim-bounce:.2s cubic-bezier(.16, 1, .3, 1)}[data-theme=dark]{--bg-canvas:#0f172a;--bg-muted:#1e293b;--bg-subtle:#334155;--bg-card:#1e293b;--bg-card-hover:#334155;--text-main:#f8fafc;--text-muted:#94a3b8;--text-subtle:#64748b;--text-inverse:#0f172a;--color-primary:#3b82f6;--color-primary-hover:#60a5fa;--color-primary-bg:#3b82f626;--color-secondary:#10b981;--color-secondary-hover:#34d399;--color-secondary-bg:#10b98126;--color-accent:#f59e0b;--color-accent-hover:#fbbf24;--color-accent-bg:#f59e0b26;--color-danger:#ef4444;--color-danger-hover:#f87171;--color-danger-bg:#ef444426;--border-flat:#334155;--border-thick:2px solid #334155;--border-focus:2px solid #3b82f6}*{box-sizing:border-box;margin:0;padding:0;box-shadow:none!important;text-shadow:none!important}html,body{background-color:var(--bg-canvas);width:100%;max-width:100vw;color:var(--text-main);-webkit-font-smoothing:antialiased;font-family:Outfit,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.5;overflow-x:hidden}:focus-visible{outline:3px solid var(--color-primary)!important;outline-offset:2px!important}button,input,select,a{touch-action:manipulation;-webkit-tap-highlight-color:transparent;font-family:inherit}.app-container{width:100%;max-width:1200px;margin:0 auto;padding:1.5rem 1rem 4rem}@media (width>=640px){.app-container{padding:2rem 1.5rem 5rem}}@media (width>=1024px){.app-container{padding:2.5rem 2rem 6rem}}.flat-card{background-color:var(--bg-card);border:var(--border-thick);border-radius:var(--radius-lg);transition:transform var(--anim-fast), background-color var(--anim-fast), border-color var(--anim-fast);overflow:hidden}.flat-card:hover{border-color:var(--color-primary);transform:scale(1.015)}.flat-btn-primary{border-radius:var(--radius-md);background-color:var(--color-primary);color:#fff;cursor:pointer;min-height:44px;transition:transform var(--anim-fast), background-color var(--anim-fast);border:none;justify-content:center;align-items:center;gap:.5rem;padding:.65rem 1.25rem;font-size:.875rem;font-weight:700;display:inline-flex}.flat-btn-primary:hover{background-color:var(--color-primary-hover);transform:scale(1.05)}.flat-btn-secondary{border-radius:var(--radius-md);background-color:var(--bg-muted);min-height:44px;color:var(--text-main);border:var(--border-thick);cursor:pointer;transition:transform var(--anim-fast), background-color var(--anim-fast);justify-content:center;align-items:center;gap:.45rem;padding:.65rem 1rem;font-size:.85rem;font-weight:600;display:inline-flex}.flat-btn-secondary:hover{background-color:var(--bg-subtle);transform:scale(1.04)}.flat-btn-secondary.active{background-color:var(--color-primary-bg);border-color:var(--color-primary);color:var(--color-primary)}.header-wrapper{border-bottom:var(--border-thick);flex-direction:column;gap:1.25rem;margin-bottom:2rem;padding-bottom:1.5rem;display:flex}@media (width>=860px){.header-wrapper{flex-direction:row;justify-content:space-between;align-items:center}}.header-controls{flex-wrap:wrap;align-items:center;gap:.6rem;width:100%;display:flex}@media (width>=860px){.header-controls{width:auto}}.dashboard-grid-3{grid-template-columns:1fr;gap:1.5rem;margin-bottom:1.5rem;display:grid}@media (width>=680px){.dashboard-grid-3{grid-template-columns:repeat(2,1fr)}}@media (width>=1024px){.dashboard-grid-3{grid-template-columns:repeat(3,1fr)}}.dashboard-grid-2{grid-template-columns:1fr;gap:1.5rem;margin-bottom:1.5rem;display:grid}@media (width>=860px){.dashboard-grid-2{grid-template-columns:1fr 1.35fr}}.forecast-scroll-container{gap:.6rem;padding-bottom:.5rem;display:flex;overflow-x:auto}.forecast-item{text-align:center;border-radius:var(--radius-md);background-color:var(--bg-muted);border:var(--border-thick);transition:transform var(--anim-fast), background-color var(--anim-fast);flex:0 0 110px;padding:1rem .5rem}.forecast-item:hover{transform:scale(1.05)}@media (width>=768px){.forecast-scroll-container{grid-template-columns:repeat(7,1fr);display:grid;overflow-x:visible}.forecast-item{flex:none}}.map-wrapper{border-radius:var(--radius-md);border:var(--border-thick);width:100%;height:380px;overflow:hidden}@media (width>=640px){.map-wrapper{height:440px}}.leaflet-container{background-color:var(--bg-muted);width:100%;height:100%}.alert-banner{background-color:var(--color-danger-bg);border:2px solid var(--color-danger);border-radius:var(--radius-md);justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1.5rem;padding:1rem 1.25rem;display:flex}.pwa-banner{background-color:var(--color-primary-bg);border:2px solid var(--color-primary);border-radius:var(--radius-md);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.85rem;margin-bottom:1.5rem;padding:.85rem 1.25rem;display:flex}@media (width<=640px){.app-container{padding:.75rem .75rem 2rem}.flat-btn-primary,.flat-btn-secondary{min-height:42px}}.modal-overlay{-webkit-backdrop-filter:blur(6px);z-index:99999;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;background-color:#0f172abf;justify-content:center;align-items:center;width:100vw;height:100vh;padding:1rem;animation:.15s ease-out modalFadeIn;display:flex;position:fixed;inset:0}.modal-content{background-color:var(--bg-card);border:var(--border-thick);border-radius:var(--radius-lg);z-index:100000;flex-direction:column;width:100%;max-width:500px;max-height:90vh;animation:.18s cubic-bezier(.16,1,.3,1) modalScaleIn;display:flex;position:relative;overflow:hidden;box-shadow:0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a}@keyframes modalFadeIn{0%{opacity:0}to{opacity:1}}@keyframes modalScaleIn{0%{opacity:0;transform:scale(.96)translateY(8px)}to{opacity:1;transform:scale(1)translateY(0)}}