:root{--primary-color: #4CAF50;--secondary-color: #2196F3;--danger-color: #f44336;--warning-color: #ff9800;--bg-color: #f8f9fa;--panel-bg: rgba(255, 255, 255, .95);--text-main: #2c3e50;--text-sub: #576574;--border-color: #dcdde1;--shadow: 0 4px 15px rgba(0, 0, 0, .1)}body,html{margin:0;padding:0;height:100%;width:100%;font-family:Inter,Noto Sans JP,sans-serif;color:var(--text-main);overflow:hidden}#map{height:100%;width:100%;background:#fff}.modal-body canvas,.popup-chart-container canvas{display:block;width:100%!important;height:100%!important}.app-header{position:absolute;top:20px;left:20px;z-index:1000;background:var(--panel-bg);padding:10px 15px;border-radius:12px;box-shadow:var(--shadow);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border-left:5px solid var(--primary-color);transition:all .3s ease}.title-group{display:flex;align-items:center;gap:15px}.icon-main{font-size:36px;color:var(--primary-color)}.app-header h1{margin:0;font-size:18px;font-weight:700}.subtitle{margin:2px 0 0;font-size:12px;color:var(--text-sub)}.header-qr-code{display:none;margin-left:auto;align-items:center;cursor:pointer}@media(min-width:640px){.header-qr-code{display:flex}}.side-panel{position:absolute;top:100px;left:20px;z-index:1000;width:280px;max-height:calc(100% - 140px);background:var(--panel-bg);padding:0;border-radius:12px;box-shadow:var(--shadow);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);overflow:visible;transition:transform .3s ease,left .3s ease,width .3s ease;display:flex;flex-direction:column}.side-panel-content{padding:20px;flex:1;overflow-y:auto;box-sizing:border-box;border-radius:12px}.side-panel.collapsed{transform:translate(-100%);left:0}.panel-toggle{position:absolute;top:10px;right:-40px;width:36px;height:36px;background:var(--panel-bg);border:1px solid var(--border-color);border-radius:0 8px 8px 0;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:4px 0 10px #0000001a;z-index:1001;color:var(--text-main);transition:all .2s}.panel-toggle:hover{background:var(--secondary-color);color:#fff}.side-panel.collapsed .panel-toggle{right:-40px}.side-panel.collapsed .graph-tooltip-inner{transform:rotate(5deg);transform-origin:bottom center}.side-panel.collapsed .panel-toggle i{transform:rotate(180deg)}.panel-section{margin-bottom:25px}.panel-section:last-child{margin-bottom:0}.panel-row{display:flex;gap:15px;margin-bottom:25px}.panel-section.half-width{flex:1;min-width:0;margin-bottom:0}.section-title{font-size:14px;font-weight:700;margin:0 0 12px;display:flex;align-items:center;gap:8px;color:var(--text-main);border-bottom:1px solid var(--border-color);padding-bottom:5px}.section-title i{color:var(--secondary-color)}.date-controls{display:flex;flex-direction:column;gap:12px}.date-nav{display:flex;align-items:center;gap:8px}.date-picker-wrapper{flex:1}.btn-date-nav{background:#f1f2f6;border:1px solid var(--border-color);border-radius:6px;width:36px;height:36px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--text-main);transition:all .2s}.btn-date-nav:hover{background:var(--secondary-color);color:#fff;border-color:var(--secondary-color)}.styled-date-input{width:100%;padding:8px;border:1px solid var(--border-color);border-radius:6px;font-family:inherit;font-size:14px;outline:none;transition:border-color .2s;box-sizing:border-box}.styled-date-input:focus{border-color:var(--secondary-color)}.quick-dates{display:flex;gap:8px;flex-wrap:wrap}.btn-quick-date{flex:1;min-width:60px;padding:6px 4px;font-size:11px;background:#f1f2f6;border:1px solid var(--border-color);border-radius:4px;cursor:pointer;color:var(--text-sub);transition:all .2s;font-weight:600}.btn-quick-date:hover{background:#e1e2e6;color:var(--text-main)}.btn-quick-date.active{background:var(--secondary-color);color:#fff;border-color:var(--secondary-color)}.map-type-controls{display:flex;gap:8px}.btn-map-type{flex:1;padding:8px 4px;font-size:12px;background:#f1f2f6;border:1px solid var(--border-color);border-radius:6px;cursor:pointer;color:var(--text-sub);transition:all .2s;font-weight:600}.btn-map-type:hover{background:#e1e2e6;color:var(--text-main)}.btn-map-type.active{background:var(--secondary-color);color:#fff;border-color:var(--secondary-color)}.mode-controls{display:flex;justify-content:center}.toggle-group{display:flex;background:#e1e2e6;border-radius:8px;padding:3px;width:100%;box-sizing:border-box}.toggle-group input[type=radio]{display:none}.toggle-group label{flex:1;text-align:center;padding:6px 0;font-size:12px;font-weight:600;color:var(--text-sub);cursor:pointer;border-radius:6px;transition:all .2s ease}.toggle-group input[type=radio]:checked+label{background:#fff;color:var(--secondary-color);box-shadow:0 1px 3px #0000001a}.toggle-group.disabled{opacity:.6;pointer-events:none;filter:grayscale(100%)}.legend-list{display:flex;flex-direction:column;gap:8px;margin-bottom:12px}.legend-note{font-size:11px;color:var(--text-sub);line-height:1.4;margin:0;font-style:italic}.legend-item{display:flex;align-items:center;gap:10px;font-size:13px}.label-group{display:flex;flex-direction:column;gap:1px}.label-sub{font-size:10px;color:var(--text-sub)}.dot{width:12px;height:12px;border-radius:50%;border:1px solid rgba(0,0,0,.1)}.info-text{font-size:12px;line-height:1.6;color:var(--text-sub);margin:0}.credit-list{display:flex;flex-direction:column;gap:8px;font-size:13px;color:#555;margin-bottom:12px}.credit-item{display:flex;flex-direction:column}.credit-label{font-weight:600;font-size:11px;color:#888;margin-bottom:2px}.credit-item a{color:var(--primary-color);text-decoration:none}.credit-item a:hover{text-decoration:underline}.link-list{display:flex;flex-direction:column;gap:8px}.ref-link{font-size:13px;color:var(--secondary-color);text-decoration:none;display:flex;align-items:center;gap:5px;opacity:0;transition:opacity .3s}#crosshair{position:absolute;top:50%;left:50%;width:20px;height:20px;transform:translate(-50%,-50%);pointer-events:none;z-index:450;transition:opacity .2s}#crosshair:before,#crosshair:after{content:"";position:absolute;background-color:#00000080}#crosshair:before{top:9px;left:0;width:100%;height:2px}#crosshair:after{left:9px;top:0;height:100%;width:2px}.ref-link:hover{opacity:.8;text-decoration:underline}.modal{display:none;position:fixed;z-index:2000;left:0;top:0;width:100%;height:100%;background-color:#00000080;align-items:center;justify-content:center;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}.modal.show{display:flex}.modal-content{background-color:#fff;margin:5% auto;padding:30px;border-radius:16px;width:90%;max-width:800px;max-height:90vh;overflow-y:auto;box-shadow:0 8px 32px #0003;position:relative;animation:modalSlideIn .3s ease-out}.modal-body{flex:1;min-height:300px;height:400px;margin-top:20px;position:relative}.loading-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:#fffc;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:10;border-radius:8px}.loading-overlay.hidden{display:none}.notification-warning{font-size:13px;color:#ff6b00;background:#fff3e0;padding:10px 12px;border-radius:6px;border-left:3px solid #ff9800;margin-bottom:15px;line-height:1.5}.spinner{width:40px;height:40px;border:4px solid #f3f3f3;border-top:4px solid var(--secondary-color);border-radius:50%;animation:spin 1s linear infinite;margin-bottom:10px}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.loading-overlay p{margin:0;font-size:14px;color:var(--text-sub);font-weight:600}.close-btn{position:absolute;right:20px;top:15px;font-size:24px;cursor:pointer;color:var(--text-sub)}.leaflet-popup-content-wrapper{border-radius:12px;box-shadow:var(--shadow)}.leaflet-popup-content{margin:15px;width:320px!important}.popup-chart-container{width:100%;height:250px;background-color:#f8f9fa;border-radius:8px;margin-top:10px}.popup-header{font-weight:700;margin-bottom:10px;display:flex;justify-content:space-between;align-items:center;font-size:14px}.btn-trend{background-color:var(--secondary-color);color:#fff;border:none;padding:6px 12px;border-radius:6px;cursor:pointer;font-size:11px;font-weight:600}.graph-tooltip{background:transparent;border:none;box-shadow:none}.graph-tooltip:before{display:none}.graph-tooltip-inner{transform:rotate(5deg);transform-origin:bottom center}@media(max-width:600px){.modal-content{margin:2% auto;padding:20px;width:95%;max-height:95vh}.info-panel{width:100%;right:0;border-radius:0;max-height:50vh}.info-panel.collapsed{transform:translateY(calc(100% - 50px))}.info-panel h2{font-size:18px}.pollen-value{font-size:28px}.btn-toggle-panel{padding:8px 16px;font-size:13px}.leaflet-popup-content{margin:10px!important;width:220px!important}.popup-chart-container{height:180px!important}.popup-header{font-size:13px}.btn-trend,.btn-notification{padding:5px 10px;font-size:10px}.close-btn{z-index:10001;position:relative}.app-header{top:10px;left:10px;width:calc(100% - 20px);padding:8px 12px;box-sizing:border-box;transition:transform .3s ease,opacity .3s ease;z-index:999}.app-header h1{font-size:14px}.app-header .subtitle{font-size:10px}.app-header .menu-link{font-size:12px!important}.side-panel{top:90px;left:10px;width:calc(100% - 20px);max-height:calc(100% - 70px);padding:0;box-sizing:border-box}.side-panel-content{padding:15px}.side-panel.collapsed{transform:translate(-100%);left:0}.side-panel.collapsed~.app-header{transform:translate(-100%);opacity:0;pointer-events:none}.panel-toggle{top:10px;right:10px;width:36px;height:40px;border-radius:8px;background:#ffffffe6}.side-panel.collapsed .panel-toggle{right:-36px;border-radius:0 8px 8px 0}.leaflet-popup-content{width:280px!important}.popup-chart-container{height:200px}.header-qr-code{display:none!important}}.btn-toggle-weather{width:100%;padding:8px 4px;background:#f1f2f6;border:1px solid var(--border-color);border-radius:6px;cursor:pointer;color:var(--text-sub);font-size:12px;font-weight:600;transition:all .2s}.btn-toggle-weather:hover{background:#e1e2e6;color:var(--text-main)}.btn-toggle-weather.active{background:var(--secondary-color);color:#fff;border-color:var(--secondary-color)}.btn-toggle-weather i{margin-right:6px}.weather-info{display:flex;gap:15px;padding:12px;background:linear-gradient(135deg,#667eea15,#764ba215);border-radius:8px;margin-bottom:12px}.weather-item{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--text-main)}.weather-item i{font-size:16px;color:var(--secondary-color)}.weather-marker{display:flex;flex-direction:row;align-items:center;gap:4px;background:#ffffffd9;padding:2px 8px;border-radius:15px;box-shadow:0 2px 6px #0000001a;border:1px solid rgba(102,126,234,.4);pointer-events:none;white-space:nowrap}.weather-icon{font-size:16px;display:flex;align-items:center}.weather-temp{font-size:12px;font-weight:700;color:var(--text-main)}.custom-weather-icon{background:transparent!important;border:none!important}#wind-canvas{pointer-events:none;z-index:400}.toast{position:fixed;bottom:20px;left:50%;transform:translate(-50%);background-color:#4caf50f2;color:#fff;padding:12px 24px;border-radius:8px;box-shadow:0 4px 12px #0000004d;z-index:10000;display:flex;align-items:center;gap:8px;font-size:14px;animation:toast-in .3s ease-out;max-width:90%;white-space:pre-line}.toast-warning{background-color:#ff5722f2;box-shadow:0 4px 12px #ff572266}.toast-info{background-color:#4caf50f2}@keyframes toast-in{0%{transform:translate(-50%,20px);opacity:0}to{transform:translate(-50%);opacity:1}}.toast.fade-out{animation:toast-out .3s ease-in forwards}@keyframes toast-out{0%{transform:translate(-50%);opacity:1}to{transform:translate(-50%,20px);opacity:0}}.notification-modal-content{max-width:500px}.notification-desc{font-size:14px;color:var(--text-main);line-height:1.6;margin-bottom:20px;background:#f8f9fa;padding:15px;border-radius:8px;border-left:4px solid var(--secondary-color)}.notification-settings{display:flex;flex-direction:column;gap:20px;margin-bottom:25px}.setting-group{display:flex;flex-direction:column;gap:8px}.setting-group label{font-weight:600;font-size:14px;color:var(--text-main)}.target-city-name{font-size:16px;font-weight:700;color:var(--primary-color);padding:5px 0}.input-wrapper{display:flex;align-items:center;gap:10px}.input-wrapper input[type=number]{width:80px;padding:8px;border:1px solid var(--border-color);border-radius:6px;font-size:16px;text-align:right}.input-wrapper .unit{font-size:14px;color:var(--text-main)}.setting-hint{font-size:12px;color:var(--text-sub);margin:0}.checkbox-label{display:flex;align-items:center;gap:10px;cursor:pointer;font-weight:600;font-size:14px;color:var(--text-main)}.checkbox-label input[type=checkbox]{width:18px;height:18px;cursor:pointer}.checkbox-label span{-webkit-user-select:none;user-select:none}.notification-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:20px;border-top:1px solid var(--border-color);padding-top:20px}.close-btn{position:absolute;top:15px;right:15px;font-size:28px;font-weight:700;color:var(--text-sub);cursor:pointer;transition:color .2s;z-index:10}.close-btn:hover{color:var(--text-main)}.btn-primary,.btn-secondary,.btn-danger{padding:10px 20px;border-radius:6px;font-size:14px;font-weight:600;cursor:pointer;border:none;display:flex;align-items:center;gap:8px;transition:all .2s}.btn-primary{background-color:var(--primary-color);color:#fff}.btn-primary:hover{background-color:#43a047}.btn-secondary{background-color:#f1f2f6;color:var(--text-main)}.btn-secondary:hover{background-color:#e1e2e6}.btn-danger{background-color:#ffebee;color:var(--danger-color)}.btn-danger:hover{background-color:#ffcdd2}.btn-notification{background-color:#ff9800;color:#fff;border:none;padding:6px 12px;border-radius:6px;cursor:pointer;font-size:11px;font-weight:600;margin-left:5px}.btn-notification:hover{background-color:#f57c00}.registered-location-card{background:linear-gradient(135deg,#4caf5015,#2196f315);border:1px solid rgba(76,175,80,.2);border-radius:8px;padding:12px;margin-top:5px}.location-info{display:flex;justify-content:space-between;align-items:center;gap:10px}.city-name{font-weight:700;font-size:15px;color:var(--primary-color);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.location-actions{display:flex;gap:5px;flex-shrink:0}.btn-icon{background:#fff;border:1px solid var(--border-color);border-radius:6px;width:32px;height:32px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--text-sub);transition:all .2s}.btn-icon:hover{background:var(--secondary-color);color:#fff;border-color:var(--secondary-color)}.hidden{display:none}.toast{position:fixed;bottom:20px;left:50%;transform:translate(-50%);background:#000c;color:#fff;padding:12px 24px;border-radius:8px;z-index:10000;display:flex;align-items:center;gap:10px;font-size:14px;box-shadow:0 4px 12px #0003;animation:toastFadeIn .3s forwards;white-space:pre-wrap;text-align:center;line-height:1.5}.toast.fade-out{animation:toastFadeOut .3s forwards}.toast-info{border-left:4px solid var(--secondary-color)}.toast-warning{border-left:4px solid var(--warning-color)}@keyframes toastFadeIn{0%{opacity:0;transform:translate(-50%,20px)}to{opacity:1;transform:translate(-50%)}}@keyframes toastFadeOut{0%{opacity:1;transform:translate(-50%)}to{opacity:0;transform:translate(-50%,-20px)}}.update-notice{position:absolute;top:20px;right:20px;z-index:999;background:#fff;padding:15px 20px;border-radius:12px;box-shadow:0 8px 30px #00000026;border-left:5px solid #ff9800;max-width:300px;animation:slideInRight .5s cubic-bezier(.18,.89,.32,1.28)}.update-notice:after{content:"";position:absolute;top:20px;right:-10px;border-width:10px 0 10px 10px;border-style:solid;border-color:transparent transparent transparent white;display:none}.notice-content{display:flex;align-items:flex-start;gap:15px}.notice-icon{font-size:24px;color:#ff9800;margin-top:2px;animation:swing 2s infinite ease-in-out}.notice-text{flex:1}.notice-title{margin:0 0 5px;font-weight:700;font-size:14px;color:var(--text-main)}.notice-message{margin:0;font-size:13px;color:var(--text-sub);line-height:1.5}.notice-message .highlight{color:#d35400;font-weight:700;background:#fff3e0;padding:0 2px}.notice-hide-check{display:flex;align-items:center;gap:6px;margin-top:10px;font-size:12px;color:var(--text-sub);cursor:pointer;-webkit-user-select:none;user-select:none}.notice-hide-check input{cursor:pointer}.notice-close{background:none;border:none;color:#999;cursor:pointer;padding:0;font-size:16px;transition:color .2s;margin-top:-5px;margin-right:-5px}.notice-close:hover{color:#666}@keyframes slideInRight{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}@keyframes swing{0%{transform:rotate(0)}10%{transform:rotate(15deg)}20%{transform:rotate(-10deg)}30%{transform:rotate(5deg)}40%{transform:rotate(-5deg)}50%{transform:rotate(0)}to{transform:rotate(0)}}@media(max-width:600px){.update-notice{inset:auto 10px 90px;max-width:none;box-sizing:border-box}}