*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%;margin:0;padding:0;touch-action:none;overflow:hidden;position:fixed;width:100%}body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;background-color:#f5f9f8;color:#2c3e3b}#app{height:100%;display:flex;flex-direction:column;touch-action:none}header{background:linear-gradient(135deg,#2d4f4c 0,#3a615c 100%);color:#fff;padding:1.25rem 2rem;box-shadow:0 2px 8px rgba(0,0,0,0.2);position:fixed;top:0;left:0;right:0;z-index:1001;min-height:fit-content;touch-action:none}.header-content{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;max-width:100%;gap:2rem}.header-left{display:flex;align-items:center;gap:.75rem;grid-column:1;justify-self:start}.header-center{display:flex;flex-direction:column;gap:.25rem;align-items:center;grid-column:2;justify-self:center}.header-right{display:flex;align-items:center;grid-column:3;justify-self:end;position:relative}header h1{font-size:1.75rem;margin:0;display:flex;align-items:center;gap:.5rem}header h1 .icon{font-size:1.5rem}header p{font-size:.95rem;opacity:.9;margin:0}.month-label{font-size:1rem;font-weight:500}.month-select{background:white;color:#2c3e3b;border:none;padding:.5rem 2rem .5rem 1rem;border-radius:6px;font-size:1rem;cursor:pointer;box-shadow:0 2px 4px rgba(0,0,0,0.1);appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%234a7d78' d='M6 9L1 4h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .75rem center;min-width:150px}.month-select:hover{box-shadow:0 3px 6px rgba(0,0,0,0.15)}.hamburger-menu{background:none;border:none;cursor:pointer;padding:.5rem;display:flex;flex-direction:column;gap:5px;z-index:1001}.hamburger-menu span{display:block;width:28px;height:3px;background-color:#fff;border-radius:2px;transition:transform .3s ease,opacity .3s ease}.hamburger-menu:hover span{background-color:#b8d4d0}.hamburger-menu.active span:nth-child(1){transform:translateY(8px) rotate(45deg)}.hamburger-menu.active span:nth-child(2){opacity:0}.hamburger-menu.active span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}.dropdown-menu{position:absolute;top:calc(100%+1rem);right:0;background:white;border-radius:8px;box-shadow:0 4px 12px rgba(0,0,0,0.15);min-width:200px;opacity:0;visibility:hidden;transform:translateY(-10px);transition:transform .3s ease,opacity .3s ease,visibility .3s ease;z-index:1000;overflow:hidden}.dropdown-menu.active{opacity:1;visibility:visible;transform:translateY(0)}.dropdown-link{display:block;color:#2c3e3b;text-decoration:none;padding:1rem 1.5rem;font-size:1rem;font-weight:500;transition:background-color .2s;border-bottom:1px solid #e5e5e5}.dropdown-link:last-child{border-bottom:none}.dropdown-link:hover{background-color:#f0f4f3}main{padding:0;margin:0;height:100vh;overflow:hidden;display:flex;flex-direction:column;padding-top:85px}.map-container-fullscreen{position:relative;width:100%;height:100%;flex:1;overflow:hidden}.map{width:100%;height:100%;background:#f5f9f8;position:relative;z-index:1;touch-action:manipulation}.climate-preferences-sidebar{position:absolute;top:30px;left:70px;background:rgba(255,255,255,0.97);border-radius:12px;box-shadow:0 4px 20px rgba(0,0,0,0.15);z-index:1001;backdrop-filter:blur(10px);transition:transform .3s ease,opacity .3s ease,width .3s ease}.climate-preferences-sidebar.collapsed{width:auto}.climate-preferences-sidebar:not(.collapsed){width:280px;max-height:calc(100vh - 115px);overflow-y:auto}.preferences-close-btn{display:none!important}.preferences-toggle.desktop-toggle{background:linear-gradient(135deg,#4a7d78 0,#5d8f87 100%);color:#fff;border:none;padding:.75rem 1rem;border-radius:12px;cursor:pointer;display:flex;align-items:center;gap:.5rem;font-size:.95rem;font-weight:600;width:100%;transition:transform .2s,box-shadow .2s;box-shadow:0 2px 8px rgba(0,0,0,0.15)}.preferences-toggle.mobile-toggle{display:none}.preferences-toggle:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,0.2)}.toggle-icon{font-size:1.2rem}.preferences-content{display:none;padding:.75rem;padding-top:.5rem;height:100%}.climate-preferences-sidebar:not(.collapsed) .preferences-content{display:block;height:100%}.climate-preferences-sidebar h3{font-size:.85rem;margin:0 0 .4rem 0;color:#2c3e3b;font-weight:600}.preference-section{margin-bottom:.75rem;padding-bottom:.25rem;border-bottom:1px solid #d4e3e1}.preference-section:last-child{border-bottom:none;margin-bottom:0;padding-bottom:0}.preference-section h3{position:relative;display:inline-block}.info-btn{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;margin-left:6px;padding:0;background:transparent;border:none;cursor:pointer;color:#6b7280;transition:color .2s ease;vertical-align:middle;position:relative}.info-btn:hover{color:#2d4f4c}.info-btn svg{display:block}.info-tooltip{display:none;position:absolute;left:0;top:calc(100%+8px);background:white;border:1px solid #d4e3e1;border-radius:8px;box-shadow:0 4px 12px rgba(0,0,0,0.15);z-index:1000;min-width:250px;max-width:300px}.info-tooltip.show{display:block}.info-tooltip-content{padding:12px 16px;font-size:.875rem;line-height:1.5}.info-tooltip-content strong{display:block;margin-bottom:8px;color:#2d4f4c;font-size:.9rem}.info-tooltip-content ul{list-style:none;padding:0;margin:0}.info-tooltip-content li{padding:4px 0;color:#2c3e3b}.info-tooltip-content li strong{display:inline;margin-bottom:0;font-weight:600;color:#2d4f4c}.display-mode-section{margin-bottom:.75rem}.display-mode-section h2{font-size:.95rem;font-weight:600;margin-bottom:.5rem;color:#2d4f4c}.mode-buttons{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}.mode-btn-overall{grid-column:1 / 3;padding:.4rem .3rem;flex-direction:row}.mode-btn{background:white;border:2px solid #d4e3e1;border-radius:8px;padding:.4rem .3rem;cursor:pointer;transition:transform .2s,box-shadow .2s;font-size:.8rem;font-weight:500;color:#2c3e3b;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.15rem}.mode-btn .icon{font-size:1.1rem}.mode-btn:hover{border-color:#4a7d78;background:#e8f2f0;transform:translateY(-1px);box-shadow:0 2px 4px rgba(0,0,0,0.1)}.mode-btn.active{background:#4a7d78;border-color:#4a7d78;color:white}.current-month{background:#e8f2f0;padding:.75rem;border-radius:6px;text-align:center;font-weight:600;color:#4a7d78;margin:0}.dual-slider{position:relative;height:28px;margin-top:.3rem}.dual-slider input[type="range"]{position:absolute;width:100%;height:6px;background:transparent;pointer-events:none;-webkit-appearance:none;appearance:none;outline:none}.dual-slider input[type="range"]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;border-radius:50%;background:#5d8f87;cursor:pointer;pointer-events:all;box-shadow:0 2px 6px rgba(0,0,0,0.2);border:2px solid white;position:relative;z-index:3;margin-top:-6px}.dual-slider input[type="range"]::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:#5d8f87;cursor:pointer;pointer-events:all;box-shadow:0 2px 6px rgba(0,0,0,0.2);border:2px solid white;margin-top:-6px}.temp-slider{position:relative}.temp-label{position:absolute;font-size:11px;font-weight:600;color:#2c3e3b;pointer-events:none;z-index:100;top:15px;width:24px;text-align:center}.temp-min-label{left:0}.temp-max-label{left:0}.dual-slider input[type="range"]::-webkit-slider-runnable-track{width:100%;height:6px;background:#d4e3e1;border-radius:3px}.dual-slider input[type="range"]::-moz-range-track{width:100%;height:6px;background:#d4e3e1;border-radius:3px}.dual-slider input[type="range"]:first-child{z-index:1}.dual-slider input[type="range"]:last-child{z-index:2}.safety-slider{width:calc(100% - 20px);margin:.5rem 10px;height:8px;-webkit-appearance:none;appearance:none;background:linear-gradient(to right,#fff 0,#fff 25%,#ffeb3b 25%,#ffeb3b 50%,#ff9800 50%,#ff9800 75%,#f44336 75%,#f44336 100%);border-radius:4px;outline:none}.safety-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;background:#2c5f4f;border:3px solid white;border-radius:50%;cursor:pointer;box-shadow:0 2px 4px rgba(0,0,0,0.2)}.safety-slider::-moz-range-thumb{width:20px;height:20px;background:#2c5f4f;border:3px solid white;border-radius:50%;cursor:pointer;box-shadow:0 2px 4px rgba(0,0,0,0.2)}.safety-labels{display:flex;justify-content:space-between;font-size:.7rem;color:#666;margin-top:.25rem}.safety-labels span{flex:1;text-align:center}.legend-overlay{position:absolute;top:30px;left:50%;transform:translateX(-50%);background:rgba(255,255,255,0.95);padding:.65rem 1.5rem;border-radius:25px;box-shadow:0 2px 12px rgba(0,0,0,0.15);z-index:1000;backdrop-filter:blur(10px)}#legend-content-horizontal{display:flex;align-items:center;gap:.5rem;font-size:.85rem}.legend-item{display:flex;align-items:center;gap:.75rem}.legend-colors{display:flex;gap:.5rem;align-items:stretch}.legend-color{padding:.25rem .75rem;border-radius:12px;font-size:.8rem;color:white;font-weight:500;display:flex;align-items:center;justify-content:center;min-height:28px}.info-message-overlay{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);background:rgba(255,255,255,0.95);padding:.75rem 2rem;border-radius:25px;box-shadow:0 2px 12px rgba(0,0,0,0.15);z-index:1000;backdrop-filter:blur(10px);font-size:.95rem;color:#666}.temp-unit-buttons-sidebar{display:flex;gap:.5rem;margin-top:.3rem}.temp-unit-btn{flex:1;padding:.5rem .8rem;border:2px solid #ddd;background:white;border-radius:8px;cursor:pointer;font-size:.95rem;font-weight:600;color:#666;transition:transform .2s,box-shadow .2s}.temp-unit-btn:hover{border-color:#4a7d78;color:#4a7d78;transform:translateY(-1px);box-shadow:0 2px 4px rgba(0,0,0,0.1)}.temp-unit-btn.active{background:#4a7d78;color:white;border-color:#4a7d78}.clear-cache-btn{width:100%;padding:.75rem;background:linear-gradient(135deg,#667eea 0,#764ba2 100%);color:white;border:none;border-radius:8px;cursor:pointer;font-size:.95rem;font-weight:600;transition:transform .3s,box-shadow .3s;display:flex;align-items:center;justify-content:center;gap:.5rem;margin-top:.5rem}.clear-cache-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(102,126,234,0.4)}.clear-cache-btn:active{transform:translateY(0)}.clear-cache-btn .icon{font-size:1.1rem;display:inline-block;transition:transform .3s}.clear-cache-btn:hover .icon{transform:rotate(180deg)}.cache-status{text-align:center;padding:.5rem;margin-top:.5rem;border-radius:6px;font-size:.85rem;font-weight:500}.cache-status.success{background:#d1fae5;color:#065f46}.cache-status.info{background:#dbeafe;color:#1e40af}.weather-details-overlay{position:absolute;top:20px;right:20px;background:rgba(255,255,255,0.95);padding:1.5rem;border-radius:8px;box-shadow:0 2px 12px rgba(0,0,0,0.2);z-index:1000;backdrop-filter:blur(10px);max-width:320px;max-height:calc(100vh - 140px);overflow-y:auto;display:block}.weather-details-section{background:rgba(255,255,255,0.95);padding:1.5rem;border-radius:8px;box-shadow:0 2px 12px rgba(0,0,0,0.2);backdrop-filter:blur(10px);max-width:100%;position:relative;display:none}.weather-details-section h2,.weather-details-overlay h2{font-size:1.1rem;margin-bottom:1rem;color:#4a7d78}.weather-details-section .close-btn,.weather-details-overlay .close-btn{position:absolute;top:10px;right:10px;background:none;border:none;font-size:24px;cursor:pointer;color:#999;padding:0;width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:50%;line-height:30px}.weather-details-section .close-btn:hover,.weather-details-overlay .close-btn:hover{background:#f0f0f0;color:#333}.preferences-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:rgba(0,0,0,0.5);z-index:999;display:none;pointer-events:none}.preferences-overlay.active{pointer-events:all}.map .leaflet-container{background:#e8f4f8}.map .leaflet-tile-pane{filter:brightness(0.95) contrast(1.05)}.leaflet-control-zoom{margin-top:30px!important;margin-left:10px!important}.leaflet-popup-content-wrapper{text-align:center}.leaflet-popup-content{margin:10px 14px;line-height:1.6}.leaflet-popup-content strong{display:block;margin-bottom:4px}.leaflet-tooltip{text-align:center}.leaflet-control-attribution{background-color:rgba(255,255,255,0.8);font-size:.75rem}.leaflet-interactive{outline:none!important}.leaflet-interactive:focus{outline:none!important}svg path{outline:none!important}.custom-pin{background:transparent;border:none}.custom-pin svg{filter:drop-shadow(0 2px 4px rgba(0,0,0,0.3))}#weatherInfo{font-size:.9rem;line-height:1.8}@media(max-width:768px){header{padding:1rem 1.5rem}.header-content{display:flex;flex-direction:column;gap:.75rem;align-items:stretch}.header-center{order:1;display:flex;flex-direction:column;align-items:flex-start;text-align:left;flex:1}.header-right{order:1;position:absolute;top:1rem;right:1.5rem}.header-left{order:2;display:flex;align-items:center;gap:.5rem;justify-content:flex-start;width:100%}header h1{font-size:1rem;max-width:calc(100vw - 120px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}header p{font-size:.8rem}.header-left{display:none!important}.map-container-fullscreen{height:calc(100vh - var(--header-height,80px));min-height:400px;margin-top:0;border-top:none}main{padding-top:var(--header-height,80px);background:transparent}.preferences-overlay.active{display:block}.legend-overlay{z-index:998}.climate-preferences-sidebar{position:fixed;top:var(--header-height,80px);bottom:0;left:0;width:300px;height:auto;z-index:1002;border-radius:0;transform:translateX(0);transition:transform .3s ease;overflow-y:auto}.climate-preferences-sidebar.collapsed{transform:translateX(-100%);width:300px;overflow:visible}.preferences-close-btn{display:flex!important;position:absolute;top:10px;right:10px;background:none;border:none;font-size:24px;cursor:pointer;color:#999;padding:0;width:30px;height:30px;align-items:center;justify-content:center;border-radius:50%;line-height:30px;z-index:10}.preferences-close-btn:hover{background:#f0f0f0;color:#333}.climate-preferences-sidebar.collapsed .preferences-close-btn{display:none!important}.preferences-toggle.desktop-toggle{display:none!important}.preferences-toggle.mobile-toggle{position:fixed!important;left:0!important;top:200px!important;width:32px!important;height:60px!important;padding:0!important;border-radius:0 8px 8px 0!important;justify-content:center;align-items:center;background:white!important;box-shadow:2px 2px 8px rgba(0,0,0,0.3)!important;border:1px solid #ddd!important;z-index:9999!important;transition:opacity .3s ease,left .3s ease!important;flex-direction:column;gap:.25rem;display:flex!important;transform:none!important;opacity:1!important;visibility:visible!important;pointer-events:all!important;cursor:pointer}body:has(.climate-preferences-sidebar:not(.collapsed)) .preferences-toggle.mobile-toggle{opacity:0!important;pointer-events:none!important}.toggle-icon{font-size:1.2rem;margin:0;color:#2c3e3b;transform:rotate(0deg);transition:transform .3s ease;display:inline-block!important}body:has(.climate-preferences-sidebar:not(.collapsed)) .toggle-icon{transform:rotate(180deg)}.toggle-text{display:none!important}.mode-btn .icon{display:none!important}.preference-section{margin-bottom:.25rem;padding-bottom:.25rem}.preferences-content{height:100%!important;display:flex!important;flex-direction:column;padding-bottom:2rem}.weather-details-overlay{display:none!important}.weather-details-section{display:block;position:fixed;bottom:0;left:0;right:0;width:100%;max-width:100%;height:70vh;padding:1.5rem;padding-top:3rem;padding-bottom:2rem;margin:0;border-radius:12px 12px 0 0;box-shadow:0 -4px 20px rgba(0,0,0,0.2);overflow-y:auto;z-index:10000;background:white;transform:translateY(calc(70vh - 120px));transition:transform .3s ease;touch-action:pan-y}.weather-details-section.expanded{transform:translateY(0);height:calc(100vh - var(--header-height,80px));border-radius:0}.mobile-month-selector{display:block!important;padding:.75rem;border-bottom:1px solid #d4e3e1}.mobile-month-selector label{display:block;font-size:.85rem;font-weight:600;color:#2c3e3b;margin-bottom:.5rem}.mobile-month-selector select{width:100%;background:white;color:#2c3e3b;border:1px solid #d4e3e1;padding:.65rem;border-radius:6px;font-size:1rem}.preferences-toggle,.mode-btn,.temp-unit-btn,.close-btn{min-height:44px;min-width:44px}input[type="range"]::-webkit-slider-thumb{width:22px;height:22px}input[type="range"]::-moz-range-thumb{width:22px;height:22px}.legend-overlay{top:10px;left:50%;transform:translateX(-50%);max-width:calc(100vw - 20px);padding:.75rem}#legend-content-horizontal{flex-direction:column;align-items:center;text-align:center}.legend-item{flex-direction:column;gap:.25rem}.info-message-overlay{font-size:.85rem;padding:.6rem .8rem;max-width:calc(100vw - 20px)}}