:root{--app-height:100vh;--safe-top:max(14px, env(safe-area-inset-top));--safe-bottom:env(safe-area-inset-bottom);--timeline-bg:rgba(145, 145, 145, 0.15)}body,html{width:100%;height:100%;min-height:100%;margin:0;padding:0;overflow:hidden;font-family:Inter,sans-serif;background-color:#000;overscroll-behavior:none;touch-action:pan-x pan-y}body{min-height:100vh;min-height:100svh;min-height:100dvh}#map{position:absolute;inset:0;width:100%;height:var(--app-height);min-height:100vh;min-height:100svh;min-height:100dvh}.glass-ui{backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);box-shadow:0 8px 32px rgba(0,0,0,.4)}#bottom-ui-container{position:fixed;bottom:0;left:0;right:0;z-index:10;padding-bottom:calc(15px + var(--safe-bottom));display:flex;flex-direction:column;align-items:center;gap:6px;pointer-events:none}#bottom-ui-container>*{pointer-events:auto}.map-controls{height:50px;padding:0 6px;border-radius:30px;display:flex;align-items:center;max-width:95vw;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;box-sizing:border-box}.map-controls::-webkit-scrollbar{display:none}.collapsible-buttons{display:flex;flex-direction:row;align-items:center;gap:8px;padding:0 4px;height:100%;box-sizing:border-box}.map-controls button{background-color:rgba(255,255,255,.08);color:#fff;border:none;width:40px;height:40px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.2s cubic-bezier(.4, 0, .2, 1);flex-shrink:0;font-weight:700;font-size:14px;margin:0}.map-controls button.active{background-color:#fff;color:#000}.map-controls button.lightning-active{background-color:gold;color:#000;box-shadow:0 0 10px rgba(255,215,0,.4)}.map-controls button.rain-notification-active{background-color:#38bdf8;color:#062033;box-shadow:0 0 12px rgba(56,189,248,.55)}.map-controls button.typhoon-active{background-color:#f97316;color:#fff;box-shadow:0 0 12px rgba(249,115,22,.55)}#typhoon-panel{position:fixed;left:50%;bottom:calc(82px + var(--safe-bottom));z-index:20;display:none;width:min(430px,calc(100vw - 28px));max-height:min(52vh,390px);padding:14px;border-radius:18px;color:#fff;box-sizing:border-box;transform:translateX(-50%);overflow-y:auto}#typhoon-panel.show{display:block}.typhoon-panel-title{margin:1px 32px 10px 1px;font-size:16px;font-weight:800;letter-spacing:.04em}.typhoon-panel-copy{color:rgba(255,255,255,.82);font-size:12px;line-height:1.55}.typhoon-card{padding:11px;border:1px solid rgba(255,255,255,.13);border-radius:13px;background:rgba(255,255,255,.075);box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}.typhoon-card+.typhoon-card{margin-top:9px}.typhoon-card-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:9px}.typhoon-card-name{color:#fff;font-size:14px;font-weight:800}.typhoon-card-time{flex:none;padding:3px 6px;border-radius:999px;color:#bae6fd;background:rgba(14,165,233,.16);font-size:10px;font-weight:700}.typhoon-position{margin-bottom:9px;color:#e8f7ff;font-size:12px;font-weight:650}.typhoon-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.typhoon-metric{min-width:0;padding:7px 8px;border-radius:9px;background:rgba(3,12,18,.22)}.typhoon-metric-label{display:block;margin-bottom:2px;color:rgba(255,255,255,.56);font-size:10px}.typhoon-metric-value{display:block;overflow:hidden;color:#fff;font-size:12px;font-weight:700;text-overflow:ellipsis;white-space:nowrap}.typhoon-intensity{margin-top:9px;padding-top:9px;border-top:1px solid rgba(255,255,255,.11)}.typhoon-intensity-title{margin-bottom:6px;color:rgba(255,255,255,.62);font-size:10px;font-weight:700;letter-spacing:.04em}.typhoon-intensity-event{display:flex;align-items:baseline;gap:6px;padding:4px 0;color:#dbeafe;font-size:11px}.typhoon-intensity-event time{flex:none;color:#93c5fd;font-variant-numeric:tabular-nums}.typhoon-intensity-dot{width:7px;height:7px;border-radius:50%;flex:none}.typhoon-panel-note{margin:9px 2px 0;color:rgba(255,255,255,.58);font-size:10px;line-height:1.45}.typhoon-focus-btn{display:none;width:100%;margin-top:9px;padding:8px 10px;border:0;border-radius:9px;color:#fff;background:rgba(249,115,22,.9);font:700 12px Inter,sans-serif;cursor:pointer}.typhoon-focus-btn.show{display:block}.typhoon-close-btn{position:absolute;top:8px;right:9px;width:26px;height:26px;border:0;border-radius:50%;color:rgba(255,255,255,.78);background:rgba(255,255,255,.1);font-size:20px;line-height:1;cursor:pointer}@media (min-width:768px){#typhoon-panel{top:20px;right:20px;bottom:auto;left:auto;width:min(390px,calc(100vw - 40px));max-height:calc(100vh - 40px);transform:none}}#install-app-btn{display:none}#install-app-btn.available{display:flex}.map-controls button svg{width:22px;height:22px;stroke-width:2.5}.capsule-wrapper{display:flex;align-items:center;border-radius:26px;border:1.2px solid transparent;padding:0;transition:.4s cubic-bezier(.25, 1, .5, 1);gap:0;max-width:44px;height:42px;overflow:hidden;white-space:nowrap;box-sizing:border-box}.capsule-wrapper.expanded{border-color:rgba(255,255,255,.35);background-color:rgba(255,255,255,.1);max-width:400px;padding:0 8px 0 2px;gap:4px}.sub-options-container{display:flex;flex-direction:row;gap:6px;transition:opacity .3s;opacity:0;pointer-events:none}.capsule-wrapper.expanded .sub-options-container{opacity:1;pointer-events:auto}#boundary-capsule.expanded{max-width:min(1000px,calc(100vw - 24px))}#boundary-options-container{overflow-x:auto;scrollbar-width:none}#boundary-options-container::-webkit-scrollbar{display:none}#boundary-options-container button{width:auto;min-width:max-content;height:32px;padding:0 10px;border-radius:16px;font-size:12px}#record-settings-panel{position:fixed;left:50%;bottom:calc(78px + var(--safe-bottom));z-index:30;width:min(360px,calc(100vw - 28px));padding:14px;border-radius:18px;box-sizing:border-box;color:#fff;display:none;flex-direction:column;gap:11px;transform:translateX(-50%)}#record-settings-panel.show{display:flex}#record-selection-box{position:absolute;z-index:20;display:none;box-sizing:border-box;border:2px solid #fff;background:rgba(0,122,255,.16);box-shadow:0 0 0 9999px rgba(0,0,0,.18);pointer-events:none}.record-settings-title{font-size:14px;font-weight:700}.record-settings-row{display:flex;align-items:center;gap:8px}.record-settings-label{width:42px;flex:0 0 42px;color:rgba(255,255,255,.7);font-size:12px}.record-settings-options{display:flex;flex:1;gap:5px}.record-settings-actions button,.record-settings-options button{flex:1;min-width:0;height:32px;padding:0 7px;border:1px solid rgba(255,255,255,.16);border-radius:9px;color:#fff;background:rgba(255,255,255,.08);font:inherit;font-size:12px;cursor:pointer}.record-settings-options button.active{color:#111;background:#fff;border-color:#fff;font-weight:700}.record-settings-summary{padding:9px 10px;border-radius:10px;background:rgba(0,0,0,.2);color:rgba(255,255,255,.82);font-size:12px;line-height:1.55}.record-settings-actions{display:flex;gap:7px}.record-settings-actions button{height:36px;font-weight:700}.record-settings-actions .record-start-btn{color:#111;background:#fff;border-color:#fff}.record-share-status-btn{width:100%;height:38px;border:1px solid rgba(255,255,255,.2);border-radius:10px;color:#111;background:#fff;font:700 13px Inter,sans-serif;cursor:pointer}.record-share-status-btn:disabled{opacity:.55;cursor:wait}#slider-container{width:85%;max-width:600px;padding:0;margin-bottom:8px;display:none}#progress-slider{appearance:none;-webkit-appearance:none;width:100%;height:4px;background:var(--timeline-bg);border-radius:2px;outline:0;cursor:pointer}#progress-slider::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:20px;height:20px;background:#fff;border-radius:50%;box-shadow:0 2px 10px rgba(0,0,0,.5);border:2px solid #333}.time-badge{position:absolute;top:calc(var(--safe-top) + 16px);left:50%;transform:translateX(-50%);padding:8px 14px;border-radius:20px;color:#fff;display:flex;font-weight:700;font-size:12px;letter-spacing:.5px;pointer-events:none;transition:.3s;max-width:calc(100vw - 32px);align-items:center}.time-row{display:flex;gap:10px;align-items:stretch;justify-content:center}.time-item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-width:62px;text-align:center}.time-item.dimmed{opacity:.42}.time-label{font-size:8px;opacity:.45;font-weight:400;text-transform:uppercase;line-height:1}.time-value{color:#fff;font-size:12px;line-height:1.1}.time-value.stale{color:#ff6b6b}.time-diff{font-size:10px;line-height:1;color:rgba(255,255,255,.8);white-space:nowrap}.time-diff.future{color:#ffd28c}.time-diff.past{color:#b9deff}.data-status-badge{position:absolute;top:calc(var(--safe-top) + 58px);left:50%;transform:translateX(-50%) translateY(-3px);padding:5px 11px;border-radius:18px;color:rgba(255,255,255,.92);display:flex;align-items:center;gap:7px;font-weight:700;font-size:11px;letter-spacing:.5px;white-space:nowrap;pointer-events:none;opacity:0;transition:opacity .2s,transform .2s}.data-status-badge.visible{opacity:.86;transform:translateX(-50%) translateY(0)}.data-status-spinner{width:11px;height:11px;border-radius:50%;border:2px solid rgba(255,255,255,.28);border-top-color:rgba(255,255,255,.95);animation:.8s linear infinite status-spin;box-sizing:border-box}@keyframes status-spin{to{transform:rotate(360deg)}}#place-search{position:fixed;top:calc(var(--safe-top) + 14px);left:14px;z-index:1001;width:43px;color:#fff}.place-search-row{display:flex;width:43px;height:43px;align-items:center;justify-content:center;padding:0;border-radius:50%;box-sizing:border-box}#place-search-input{display:none;width:100%;min-width:0;border:0;outline:0;color:#fff;background:0 0;font:500 15px/1.3 Inter,sans-serif}#place-search-input::placeholder{color:rgba(255,255,255,.65)}#place-search-btn{display:flex;flex:0 0 auto;align-items:center;justify-content:center;width:43px;height:43px;padding:0;border:0;border-radius:50%;color:#fff;background:0 0;line-height:1;cursor:pointer}#place-search-btn svg{width:20px;height:20px;stroke-width:2.6}#place-search.expanded{width:min(310px,calc(100vw - 28px))}#place-search.expanded .place-search-row{width:100%;height:auto;justify-content:initial;padding:6px 7px 6px 12px;border-radius:18px}#place-search.expanded #place-search-input{display:block}#place-search.expanded #place-search-btn{width:31px;height:31px;color:#111;background:#fff}#place-search.expanded #place-search-btn svg{width:17px;height:17px}#place-search-results{display:none;margin-top:6px;overflow:hidden;border-radius:14px}#place-search-results.show{display:block}.place-result{display:block;width:100%;padding:10px 12px;border:0;border-bottom:1px solid rgba(255,255,255,.1);color:#fff;background:rgba(23,23,27,.9);text-align:left;font:500 15px/1.45 Inter,sans-serif;cursor:pointer}.place-result:last-child{border-bottom:0}.place-result:hover{background:rgba(255,255,255,.16)}.place-search-attribution{padding:5px 10px;color:rgba(255,255,255,.6);background:rgba(23,23,27,.9);font-size:9px}@media (max-width:768px){#place-search{top:calc(var(--safe-top) + 8px);width:43px}#place-search .place-search-row{width:43px;height:43px;padding:0;justify-content:center;border-radius:50%;box-sizing:border-box}#place-search-input{display:none}#place-search-btn{width:43px;height:43px;color:#fff;background:0 0}#place-search.expanded{width:min(310px,calc(100vw - 28px))}#place-search.expanded .place-search-row{width:100%;height:auto;padding:6px 7px 6px 12px;border-radius:18px;justify-content:initial}#place-search.expanded #place-search-input{display:block}#place-search.expanded #place-search-btn{width:31px;height:31px;color:#111;background:#fff}.time-badge{top:calc(var(--safe-top) + 53px)}.data-status-badge{top:calc(var(--safe-top) + 91px)}}.user-location-marker{width:12px;height:12px;background-color:#007aff;border:2px solid #fff;border-radius:50%;box-shadow:0 0 8px rgba(0,122,255,.8);pointer-events:none}.landmark-pill{padding:6px 12px;border:1px solid rgba(15,23,42,.95);border-radius:999px;color:#0f172a;background:rgba(255,255,255,.96);box-shadow:0 2px 6px rgba(0,0,0,.32);font:700 17px/1 'Arial Unicode MS',sans-serif;white-space:nowrap;pointer-events:none}.landmark-pill.hidden,.marker-wrapper.location-marker-hidden{display:none}#recording-overlay{position:fixed;inset:0;width:100%;height:var(--app-height);background-color:rgba(0,0,0,.5);backdrop-filter:blur(5px);z-index:1000;display:none;justify-content:center;align-items:center}#recording-message{color:#e2e8f0;font-size:20px;font-weight:500;padding:20px 30px;border-radius:16px;border:1px solid rgba(255,255,255,.1);background-color:rgba(26,32,44,.8)}@media (max-width:480px){.map-controls{height:54px;max-width:calc(100vw - 12px)}.map-controls button{width:42px;height:42px}.capsule-wrapper{max-width:46px;height:44px}.capsule-wrapper.expanded{max-width:calc(100vw - 24px)}#slider-container{width:calc(100vw - 34px)}.time-badge{top:calc(var(--safe-top) + 10px);font-size:11px;padding:6px 10px}.time-row{gap:7px}.time-item{min-width:54px}.data-status-badge{top:calc(var(--safe-top) + 48px);font-size:10px}#recording-message{max-width:calc(100vw - 60px);text-align:center;font-size:17px}}#user-weather-card{position:fixed;left:12px;top:calc(var(--safe-top) + 70px);width:175px;padding:12px;border-radius:16px;z-index:1000;background:rgba(175,175,175,.123);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.15);box-shadow:0 8px 30px rgba(0,0,0,.5);display:flex;flex-direction:column;gap:10px;transform:translateX(calc(-100% - 40px));opacity:0;transition:transform .5s cubic-bezier(.16, 1, .3, 1),opacity .4s;pointer-events:none}#user-weather-card.show{transform:translateX(0);opacity:1;pointer-events:auto}.user-info-title{display:inline-block;background:rgba(0,0,0,.2);padding:3px 10px;border-radius:20px;font-size:10px;color:#fff;font-weight:700;letter-spacing:.8px;margin-bottom:8px;border:1px solid rgba(199,210,254,.3)}.user-info-section{display:flex;flex-direction:column;align-items:flex-start;gap:2px}#user-rain-eta{color:#4fd1c5;font-size:12px}.card-divider{height:1px;background:rgba(255,255,255,.1);margin:4px 0}.user-info-value{font-size:15px;font-weight:900;color:#fff;padding-left:4px}.glass-ui{background-color:rgba(28,28,30,.7);backdrop-filter:blur(25px);-webkit-backdrop-filter:blur(25px);border:1px solid rgba(255,255,255,.1)}#wind-arrow{color:#fff!important;font-weight:800;display:inline-block;font-size:16px;line-height:1;text-shadow:0 0 5px rgba(255,255,255,.5)}.close-card-btn{position:absolute;right:8px;top:8px;width:20px;height:20px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#fff;opacity:.3;font-size:14px}#alert-legend-panel{position:fixed;bottom:calc(100px + var(--safe-bottom));left:50%;transform:translateX(-50%);padding:6px 5px;display:none;flex-direction:row;gap:10px;z-index:1000;border-radius:12px;background-color:rgba(26,32,44,.8);backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);border:.5px solid rgba(255,255,255,.12);box-shadow:0 4px 15px rgba(0,0,0,.3)}.legend-row{display:flex;align-items:center;gap:5px;color:#fff;font-size:10px;font-weight:600}.color-dot{width:10px;height:10px;border-radius:2px}#user-alert-status{color:gold;font-size:16px;text-shadow:0 0 10px rgba(255,215,0,.3)}.user-info-section .user-info-title{transition:.3s}#place-search:not(.expanded){width:43px!important}#place-search:not(.expanded) .place-search-row{width:43px!important;height:43px!important;padding:0!important;justify-content:center!important;border-radius:50%!important}#place-search:not(.expanded) #place-search-input{display:none!important}#place-search:not(.expanded) #place-search-btn{width:43px!important;height:43px!important;color:#fff!important;background:0 0!important}