:root{--bg:#fff;--panel:#f7f7f5;--text:#2b2b2b;--text-dim:#6b6b6b;--border:#e2e1dd;--accent:#238b45;--accent-bg:#e6f2ea;--danger:#b3261e;--rain:#2f6fb0;--temp:#d1731f;--sans:system-ui, "Segoe UI", Roboto, sans-serif;font:15px/1.45 var(--sans);color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased}*{box-sizing:border-box}body{margin:0}#root{height:100svh}.layout{height:100svh;display:flex}.sidebar{background:var(--panel);border-right:1px solid var(--border);flex:0 0 340px;width:340px;height:100%;padding:20px;overflow-y:auto}.sidebar header h1{color:var(--accent);margin:0;font-size:26px}.tagline{color:var(--text-dim);margin:4px 0 0;font-size:13px}.sidebar section{margin-top:22px}.sidebar h2{text-transform:uppercase;letter-spacing:.06em;color:var(--text-dim);justify-content:space-between;align-items:center;margin:0 0 8px;font-size:13px;display:flex}.species-buttons,.mode-toggle{flex-wrap:wrap;gap:6px;display:flex}.species-buttons button,.mode-toggle button{border:1px solid var(--border);background:var(--bg);cursor:pointer;color:var(--text);border-radius:7px;flex:auto;padding:7px 10px;font-size:13px}.species-buttons{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));display:grid}.species-buttons button{text-align:left;align-items:center;gap:7px;line-height:1.15;display:flex}.species-buttons button svg{background:var(--accent-bg);border-radius:50%;padding:2px}.species-buttons button.active,.mode-toggle button.active{background:var(--accent-bg);border-color:var(--accent);color:var(--accent);font-weight:600}.species-buttons button.active svg{background:var(--bg)}.btn{border:1px solid var(--border);background:var(--bg);cursor:pointer;width:100%;color:var(--text);border-radius:7px;margin-bottom:6px;padding:8px 10px;font-size:13px}.btn.primary{background:var(--accent-bg);border-color:var(--accent);color:var(--accent);font-weight:600}.btn:disabled{opacity:.55;cursor:default}.legend-bar{border:1px solid var(--border);border-radius:7px;height:14px}.legend-scale{color:var(--text-dim);justify-content:space-between;margin-top:3px;font-size:11px;display:flex}.caveat{color:var(--text-dim);margin-top:10px;font-size:12px}.hint{color:var(--text-dim);margin-top:8px;font-size:12px}.banner-degraded{color:var(--danger);background:#fbeae9;border:1px solid #f0c4c1;border-radius:7px;margin-top:8px;padding:8px 10px;font-size:12px}.explain{background:var(--bg);border:1px solid var(--border);border-radius:9px;padding:12px}.explain .close{cursor:pointer;color:var(--text-dim);background:0 0;border:none;font-size:18px;line-height:1}.index-line{align-items:baseline;gap:4px;margin:0 0 10px;display:flex}.index-value{color:var(--accent);font-size:30px;font-weight:700}.index-unit{color:var(--text-dim);font-size:14px}.status{color:var(--danger);align-self:center;margin-left:auto;font-size:11px}.facts{gap:4px;margin:0 0 10px;display:grid}.facts>div{grid-template-columns:96px 1fr;gap:6px;font-size:12px;display:grid}.facts dt{color:var(--text-dim);margin:0}.facts dd{color:var(--text);margin:0}.facts .muted{color:var(--text-dim)}.facts-sep{text-transform:uppercase;letter-spacing:.06em;color:var(--text-dim);margin:4px 0 6px;font-size:11px}.factor{grid-template-columns:120px 1fr;align-items:center;gap:6px;margin-bottom:5px;font-size:12px;display:grid}.factor-label{color:var(--text-dim)}.factor-bar{background:var(--border);border-radius:4px;height:8px;overflow:hidden}.factor-bar>span{background:var(--accent);height:100%;display:block}.factor-note{color:var(--danger);grid-column:1/-1;font-style:italic}.weather-history{margin:0 0 10px}.weather-history svg{width:100%;height:auto;display:block}.wh-rain{fill:var(--rain)}.wh-temp{stroke:var(--temp);stroke-width:1.6px;stroke-linejoin:round;stroke-linecap:round}.wh-soak{fill:var(--accent);opacity:.13}.wh-axis-line{stroke:var(--border);stroke-width:1px}.wh-axis{fill:var(--text-dim);font-size:8px}.wh-legend{color:var(--text-dim);flex-wrap:wrap;gap:4px 12px;margin:2px 0 0;font-size:11px;display:flex}.wh-key{align-items:center;display:inline-flex}.wh-key:before{content:"";border-radius:2px;width:10px;height:3px;margin-right:5px;display:inline-block}.wh-key-rain:before{background:var(--rain)}.wh-key-temp:before{background:var(--temp)}.wh-key-soak:before{background:var(--accent);opacity:.3;height:10px}.sidebar footer{border-top:1px solid var(--border);margin-top:24px;padding-top:14px}.map-pane{flex:auto;height:100%;position:relative}.map-loader{z-index:1000;background:var(--bg);border:1px solid var(--border);color:var(--text);pointer-events:none;border-radius:20px;align-items:center;gap:8px;padding:6px 14px;font-size:13px;display:flex;position:absolute;top:12px;left:50%;transform:translate(-50%);box-shadow:0 2px 8px #0000002e}.spinner{border:2px solid var(--border);border-top-color:var(--accent);border-radius:50%;width:14px;height:14px;animation:.7s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.map{width:100%;height:100%}.leaflet-tooltip.zone-tip{padding:4px 8px;font-size:12px;line-height:1.3}.zone-tip-score{font-weight:700}.spot-popup{flex-direction:column;gap:8px;min-width:200px;display:flex}.spot-popup label{color:var(--text-dim);flex-direction:column;gap:3px;font-size:12px;display:flex}.spot-popup select,.spot-popup textarea{font:inherit;border:1px solid var(--border);border-radius:6px;padding:5px;font-size:13px}.spot-popup-actions{gap:6px;display:flex}.spot-popup-actions button{border:1px solid var(--border);cursor:pointer;background:var(--accent-bg);color:var(--accent);border-radius:6px;flex:1;padding:6px;font-weight:600}.spot-popup-actions button.danger{color:var(--danger);background:#fbeae9;border-color:#f0c4c1}.spot-alert{border-left:4px solid var(--border);color:var(--text);padding:4px 8px;font-size:12px}.spot-alert-high{border-left-color:#1a9641}.spot-alert-medium{border-left-color:#f39c12}.spot-alert-head strong{font-size:15px}.spot-alert-line{color:var(--text-dim);margin-top:2px}.spot-alert-days{gap:3px;margin-top:6px;display:flex}.spot-alert-days .day{text-align:center;height:58px;color:var(--text-dim);flex-direction:column;flex:1;justify-content:flex-end;align-items:stretch;font-size:10px;display:flex}.spot-alert-days .day-bar{background:var(--border);border-radius:2px 2px 0 0;margin:1px 0}.spot-alert-days .day.best{color:var(--accent);font-weight:700}.spot-alert-days .day.best .day-bar{background:var(--accent)}.observations-add{gap:4px;display:flex}.observations-add input{min-width:0;font:inherit;border:1px solid var(--border);border-radius:6px;flex:1;padding:4px;font-size:12px}.observations-add button{border:1px solid var(--border);cursor:pointer;background:var(--accent-bg);color:var(--accent);border-radius:6px;padding:4px 8px;font-size:12px;font-weight:600}.observations-add button.secondary{background:var(--bg);color:var(--text-dim)}.observations-list{max-height:160px;margin:6px 0 0;padding:0;font-size:12px;list-style:none;overflow-y:auto}.observations-list li{border-bottom:1px solid var(--border);padding:3px 0}.obs-found{color:var(--accent);font-weight:700}.obs-blank{color:var(--text-dim);font-weight:700}.obs-remove{float:right;cursor:pointer;color:var(--text-dim);background:0 0;border:none}.obs-cond{color:var(--text-dim);font-size:11px}.token-form{align-items:flex-end;gap:6px;margin-top:8px;display:flex}.token-form label{color:var(--text-dim);flex-direction:column;flex:1;gap:3px;font-size:12px;display:flex}.token-form input{font:inherit;border:1px solid var(--border);border-radius:6px;padding:5px}.token-form button{border:1px solid var(--border);background:var(--accent-bg);color:var(--accent);cursor:pointer;border-radius:6px;padding:6px 10px;font-weight:600}.spot-list{margin:10px 0 0;padding:0;font-size:13px;list-style:none}.spot-list li{border-bottom:1px solid var(--border)}.spot-list-btn{width:100%;font:inherit;color:inherit;text-align:left;cursor:pointer;background:0 0;border:none;grid-template-columns:14px 1fr auto;align-items:center;column-gap:6px;padding:6px 2px;display:grid}.spot-list-btn:hover{background:var(--accent-bg)}button.link{font:inherit;color:var(--accent);cursor:pointer;background:0 0;border:none;padding:0;text-decoration:underline}.spot-dot{background:var(--bg);border:3px solid;border-radius:50%;width:12px;height:12px}.spot-list-name{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.spot-list-status{font-weight:600}.spot-list-detail{color:var(--text-dim);grid-column:2/4;font-size:11px}@media (width<=720px){.layout{flex-direction:column}.sidebar{border-right:none;border-bottom:1px solid var(--border);flex-basis:auto;width:100%;height:auto;max-height:45svh}}