*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg: #07111c;--surf: #0c1b28;--border: #152234;--text: #c8dde9;--muted: #3e607a;--dim: #0f2030;--good: #2dd4a0;--warn: #f2b134;--bad: #f26b6b;--accent: #38bdf8;--f-ui: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--f-num: ui-monospace, "SF Mono", "Segoe UI Mono", Menlo, Consolas, monospace}html,body{background:var(--bg);color:var(--text);font-family:var(--f-ui);font-size:14px;min-height:100dvh;-webkit-font-smoothing:antialiased}.topbar{position:sticky;top:0;z-index:20;background:#07111cf5;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--border);padding:12px 20px;padding-top:calc(12px + env(safe-area-inset-top,0px));display:flex;align-items:center;gap:20px;flex-wrap:wrap}.brand{font-weight:600;font-size:16px;letter-spacing:-.01em;color:var(--text);white-space:nowrap;flex-shrink:0}.brand:before{content:"";display:inline-block;width:8px;height:8px;margin-right:7px;border-radius:50%;background:var(--accent);vertical-align:middle}.icon-btn{flex-shrink:0;width:26px;height:26px;border-radius:50%;border:1px solid var(--border);background:none;color:var(--muted);font-family:var(--f-ui);font-size:14px;font-weight:600;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:border-color .12s,color .12s}.icon-btn:hover{border-color:var(--accent);color:var(--accent)}.icon-btn svg{width:15px;height:15px}#geo-btn.busy{color:var(--accent);border-color:var(--accent);animation:pulse 1s ease-in-out infinite}@keyframes pulse{50%{opacity:.4}}.search-wrap{position:relative;flex:1 1 180px;min-width:0}.help-dialog{width:min(520px,calc(100vw - 32px));max-height:calc(100dvh - 64px);padding:0;border:1px solid var(--border);border-radius:12px;background:var(--surf);color:var(--text);box-shadow:0 20px 60px #0000008c}.help-dialog::backdrop{background:#02080e99;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}.help-head{position:sticky;top:0;display:flex;align-items:center;justify-content:space-between;padding:16px 18px;background:var(--surf);border-bottom:1px solid var(--border)}.help-head h2{font-size:16px;font-weight:600}.help-close{background:none;border:none;color:var(--muted);font-size:24px;line-height:1;cursor:pointer;padding:0 4px}.help-close:hover{color:var(--text)}.help-body{padding:16px 18px 22px;font-size:13.5px;line-height:1.6}.help-body h3{font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--accent);margin:18px 0 6px;display:flex;align-items:center;gap:6px}.help-body p{margin-bottom:8px;color:var(--text)}.help-body ul{list-style:none;margin:6px 0 8px}.help-body li{margin-bottom:6px}.help-body .dot{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:4px;vertical-align:-1px}.help-body .dot.good{background:var(--good)}.help-body .dot.warn{background:var(--warn)}.help-body .dot.bad{background:var(--bad)}.help-arrow{width:15px;height:15px;fill:var(--accent)}#location-input{width:100%;background:transparent;border:none;border-bottom:1px solid var(--muted);color:var(--text);font-family:var(--f-ui);font-size:15px;padding:5px 24px 5px 0;outline:none;transition:border-color .15s}.clear-btn{position:absolute;top:3px;right:0;width:22px;height:22px;border:none;background:none;color:var(--muted);font-size:20px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center}.clear-btn:hover{color:var(--text)}#location-input::placeholder{color:var(--muted)}#location-input:focus{border-color:var(--accent)}.suggestions{position:absolute;top:calc(100% + 8px);left:0;right:0;background:var(--surf);border:1px solid var(--border);border-radius:8px;list-style:none;z-index:40;overflow:hidden;box-shadow:0 8px 28px #00000073}.suggestions li{padding:10px 14px;cursor:pointer;font-size:14px;transition:background .1s}.suggestions li:hover{background:var(--dim)}.suggestions .sub{color:var(--muted);font-size:12px;margin-left:6px}.suggestions .sug-head{padding:8px 14px 4px;font-size:10px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);cursor:default}.suggestions .sug-head:hover{background:none}.settings{display:flex;align-items:center;gap:20px;flex-shrink:0}.setting{display:flex;align-items:center;gap:8px;font-size:10px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}.stepper{display:flex;align-items:center;gap:5px}.stepper button{background:none;border:1px solid var(--border);color:var(--muted);width:22px;height:22px;border-radius:4px;cursor:pointer;font-size:15px;line-height:1;display:flex;align-items:center;justify-content:center;transition:border-color .12s,color .12s}.stepper button:hover{border-color:var(--accent);color:var(--accent)}.stepper-val{font-family:var(--f-num);font-size:14px;color:var(--text);min-width:16px;text-align:center}.hours{display:flex;align-items:center;gap:5px}.hours select{background:transparent;border:none;border-bottom:1px solid var(--border);color:var(--text);font-family:var(--f-num);font-size:13px;padding:2px 0;cursor:pointer;outline:none;-moz-appearance:none;appearance:none;-webkit-appearance:none;transition:border-color .12s}.hours select:focus{border-color:var(--accent)}.hours option{background:var(--surf)}.dash{color:var(--muted);font-size:12px}.sea-setting{flex-shrink:0}#sea-dir{-moz-appearance:none;appearance:none;-webkit-appearance:none;background:var(--dim) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%233e607a' stroke-width='2.5'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 7px center;background-size:12px;border:1px solid var(--border);border-radius:7px;color:var(--text);font-family:var(--f-ui);font-size:13px;min-height:30px;padding:4px 26px 4px 10px;cursor:pointer;outline:none;transition:border-color .12s}#sea-dir:focus,#sea-dir:hover{border-color:var(--accent)}#sea-dir option{background:var(--surf)}.content{max-width:900px;margin:0 auto;width:100%;padding:4px 20px 60px;display:flex;flex-direction:column}.hint,.loading{color:var(--muted);text-align:center;padding:52px 0;font-size:14px}.error{color:var(--bad);text-align:center;padding:44px 0;font-size:14px}.day-row{display:grid;grid-template-columns:60px 1fr 68px;align-items:center;gap:16px;padding:14px 0;border-bottom:1px solid var(--border)}.day-row:last-child{border-bottom:none}.day-label{display:flex;flex-direction:column;gap:3px}.day-label .dow{font-size:10px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);transition:color .15s}.day-row.is-today .dow{color:var(--accent)}.day-label .day-date{font-size:13px;font-weight:500;color:var(--text)}.timeline{display:flex;flex-direction:column;gap:5px;min-width:0;overflow:hidden}.bars-wrap{position:relative;height:56px}.bars{display:flex;align-items:flex-end;height:100%;gap:2px}.bar{flex:1 1 0;min-width:0;border-radius:2px 2px 0 0;min-height:3px}.bar.good{background:var(--good)}.bar.warn{background:var(--warn)}.bar.bad{background:var(--bad)}.bar-vals{display:flex;gap:2px}.bar-val{flex:1 1 0;min-width:0;text-align:center;font-family:var(--f-num);font-size:11px;font-weight:500;line-height:1;color:var(--text)}.hour-axis{display:flex;gap:2px}.hour-axis .bar-hour{flex:1 1 0;min-width:0;text-align:center;font-family:var(--f-num);font-size:9px;color:var(--muted);letter-spacing:-.02em}.bar-dirs{display:flex;gap:2px}.bar-dir{flex:1 1 0;min-width:0;display:flex;justify-content:center;color:var(--text)}.bar-dir svg{width:13px;height:13px;fill:currentColor;overflow:visible}.timeline.dense .bar-val{font-size:9px}.timeline.dense .hour-axis .bar-hour{font-size:8px}.legend{display:flex;flex-wrap:wrap;align-items:center;gap:6px 16px;padding:6px 2px 12px;margin-bottom:4px;border-bottom:1px solid var(--border);font-size:11px;color:var(--muted)}.legend .leg-lead{color:var(--text);font-weight:600}.legend .dot{display:inline-block;width:9px;height:9px;border-radius:2px;vertical-align:-1px;margin-right:4px}.legend .dot.good{background:var(--good)}.legend .dot.warn{background:var(--warn)}.legend .dot.bad{background:var(--bad)}.day-stats{text-align:right;display:flex;flex-direction:column;gap:3px}.day-stats .temp-avg{font-family:var(--f-num);font-size:15px;font-weight:500;color:var(--text)}.day-stats .temp-max{font-family:var(--f-num);font-size:10px;color:var(--muted)}.appfoot{text-align:center;padding:14px 20px calc(14px + env(safe-area-inset-bottom,0px))}.version{font-family:var(--f-num);font-size:10px;color:var(--muted);letter-spacing:.04em;opacity:.55}@media (max-width: 520px){.topbar{padding:10px 14px;padding-top:calc(10px + env(safe-area-inset-top,0px));gap:10px 12px}.settings{width:100%;flex-wrap:wrap;justify-content:space-between;gap:10px 12px}.content{padding:2px 14px 48px}.day-row{grid-template-columns:42px 1fr 46px;gap:8px;padding:11px 0}.bars-wrap{height:44px}.day-label .day-date{font-size:12px}.bars,.bar-vals,.hour-axis{gap:1px}.bar-val{font-size:9px}.bar-dir svg{width:12px;height:12px}.hour-axis .bar-hour,.timeline.dense .bar-val{font-size:8px}.timeline.dense .hour-axis .bar-hour{font-size:7px}.brand,.day-stats .temp-avg{font-size:14px}}@media (prefers-reduced-motion: reduce){.bar{transition:none}#geo-btn.busy{animation:none}}
