.reference-tracking{--dial-size:min(72vw, 36dvh, 440px);--map-edge:55dvh;--dock-height:80px;--dock-bottom:max(14px,env(safe-area-inset-bottom));--morph-duration:.62s;--morph-ease:cubic-bezier(.22,1,.36,1);color:#fff;background:#000;width:100%;height:100dvh;position:fixed;inset:0;overflow:hidden}.reference-map{clip-path:inset(0 0 42%);width:100%;height:100%;transition:clip-path var(--morph-duration) var(--morph-ease);background:#293d43;position:absolute;inset:0}.reference-map-shade{pointer-events:none;background:linear-gradient(#00000018,#0000 60%,#00000030);height:58%;position:absolute;inset:0 0 auto}.reference-top-actions{inset:max(24px,env(safe-area-inset-top)) 20px auto;z-index:6;pointer-events:none;justify-content:space-between;display:flex;position:absolute}.reference-action{color:#fff;pointer-events:auto;background:#202122;border-radius:50%;flex:0 0 44px;place-items:center;width:44px;height:44px;transition:background .18s;display:grid;box-shadow:0 2px 8px #0003}.reference-action:hover:not(:disabled){background:#343638}.reference-action:disabled{color:#7c7e80}.reference-panel{top:var(--map-edge);width:100%;height:calc(100dvh - var(--map-edge));z-index:3;transition:top var(--morph-duration) var(--morph-ease),width var(--morph-duration) var(--morph-ease),height var(--morph-duration) var(--morph-ease),border-radius var(--morph-duration) var(--morph-ease),background var(--morph-duration) ease,box-shadow var(--morph-duration) ease;background:#000;border-radius:0;position:absolute;left:50%;transform:translate(-50%)}.reference-dial{width:var(--dial-size);height:var(--dial-size);top:calc(var(--dial-size) / -2);transition:top var(--morph-duration) var(--morph-ease),width var(--morph-duration) var(--morph-ease),height var(--morph-duration) var(--morph-ease),border-radius var(--morph-duration) var(--morph-ease),background var(--morph-duration) ease,box-shadow var(--morph-duration) ease;background:#000;border-radius:50%;position:absolute;left:50%;transform:translate(-50%);box-shadow:0 0 0 10px #000}.reference-ring{width:var(--dial-size);height:var(--dial-size);opacity:1;transition:opacity .25s ease,transform var(--morph-duration) var(--morph-ease),left var(--morph-duration) var(--morph-ease);position:absolute;top:50%;left:50%;overflow:visible;transform:translate(-50%,-50%)scale(1)}.reference-ring-segment{fill:none;stroke:#151515;stroke-width:18px;stroke-linecap:round}.reference-ring-segment.current{stroke:#ffbd21}.reference-ring-segment.complete{stroke:var(--brand)}.reference-ring-texture{fill:none;stroke:url(#ring-hatching);stroke-width:18px;stroke-linecap:round}.reference-ring-inner{fill:none;stroke:#111;stroke-width:1.5px}.reference-dial-content{text-align:center;width:80%;transition:left var(--morph-duration) var(--morph-ease),width var(--morph-duration) var(--morph-ease),gap var(--morph-duration) var(--morph-ease);flex-direction:column;justify-content:center;align-items:center;gap:8px;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.reference-eta{font-size:calc(var(--dial-size) * .165);letter-spacing:-2px;white-space:nowrap;transition:font-size var(--morph-duration) var(--morph-ease),letter-spacing var(--morph-duration) var(--morph-ease);font-weight:950;line-height:1.12}.reference-dial-content>span{font-size:calc(var(--dial-size) * .059);color:#b4b4b4;transition:font-size var(--morph-duration) var(--morph-ease);font-weight:500;line-height:1.45}.reference-empty-title{font-size:calc(var(--dial-size) * .065);font-weight:800;line-height:1.3}.reference-complete-icon{color:var(--brand)}.reference-side-actions{top:calc(var(--dial-size) * .35);left:max(16px,calc(50% - var(--dial-size) / 2 - 54px));right:max(16px,calc(50% - var(--dial-size) / 2 - 54px));justify-content:space-between;display:flex;position:absolute}.reference-status{top:calc(var(--dial-size) / 2 + 36px);text-align:center;max-width:480px;margin:auto;position:absolute;left:24px;right:24px}.reference-destination{color:#aaa;text-overflow:ellipsis;white-space:nowrap;font-size:13px;line-height:1.5;overflow:hidden}.reference-status h1{letter-spacing:-.3px;margin:8px 0 9px;font-size:19px;font-weight:850;line-height:1.3}.reference-description{color:#c6c6c6;font-size:14px;line-height:1.5}.reference-freshness{color:#91999c;background:0 0;justify-content:center;align-items:center;gap:6px;max-width:100%;min-height:28px;margin:16px auto 0;padding:4px;font-size:10px;line-height:1.4;display:inline-flex}.reference-freshness.is-stale{color:#c7a577}.reference-freshness .spinner{width:13px;height:13px}.reference-live-dot{background:var(--brand);border-radius:50%;width:5px;height:5px}.reference-return{color:#fff;background:#222;border-radius:22px;margin-top:18px;padding:10px 20px;font-size:13px}.reference-error{color:#efb7aa;margin-top:10px;font-size:12px}.reference-toast{z-index:10;color:#fff;background:#25282b;border-radius:14px;width:max-content;max-width:calc(100% - 40px);padding:12px 18px;font-size:12px;position:absolute;top:82px;left:50%;transform:translate(-50%);box-shadow:0 4px 20px #0003}.reference-tracking .trip-dialog{color:#fff;background:#17191b;border-color:#2c3033}.reference-tracking .trip-dialog .icon-button{color:#fff;background:#2c3033}.reference-tracking .trip-dialog .trip-message{color:#c6cdd0;background:#25282b}.reference-tracking .trip-dialog .trip-details>div>div>span{color:#a5afb5}.reference-map .map-controls{bottom:30px;right:18px}.reference-map .map-controls button{color:#fff;background:#202122;border-color:#34383a;border-radius:50%;box-shadow:0 2px 8px #0003}.reference-map .map-zoom{background:#202122}.reference-map .map-zoom button{border-radius:0}.reference-map .map-loading{color:#cad4d6;background:#202122;top:82px;bottom:auto}.reference-map .map-error{color:#d4e0e2;background:#263b40}.reference-map .maplibregl-ctrl-bottom-right{bottom:0}.map-dark .maplibregl-ctrl-attrib{color:#d2dedf;background:#152b32d9!important}.map-dark .maplibregl-ctrl-attrib a{color:#d2dedf}.map-dark .maplibregl-ctrl-attrib-button{filter:invert()}.marker-destination.marker-dark{background:var(--brand);border:0;border-radius:50% 50% 50% 0;width:46px;height:46px;transform:rotate(-45deg);box-shadow:0 3px 12px #0003}.marker-destination.marker-dark .pin-dot{background:#172d36;border-radius:50%;width:17px;height:17px}.marker-onni.marker-dark{border:3px solid #fff;box-shadow:0 0 0 7px #00a9c622,0 3px 12px #0004}.reference-map-open{z-index:2;cursor:zoom-in;background:0 0;width:100%;height:58%;position:absolute;inset:0 0 auto}.reference-map-open:focus-visible{outline:3px solid var(--brand);outline-offset:-5px}.reference-tracking:not(.map-expanded) .reference-map .map-controls{display:none}.reference-tracking:not(.map-expanded) .reference-map .maplibregl-ctrl-bottom-right{z-index:4;top:78px;bottom:auto;right:16px}.reference-tracking:not(.map-expanded) .reference-map .maplibregl-ctrl-attrib{font-size:9px}.reference-tracking.map-expanded .reference-map{clip-path:inset(0)}.reference-map-caption{z-index:5;left:50%;bottom:max(34px,env(safe-area-inset-bottom));background:#202122;border-radius:24px;align-items:center;gap:8px;max-width:calc(100% - 120px);padding:10px 15px;font-size:12px;display:flex;position:absolute;transform:translate(-50%);box-shadow:0 3px 12px #0003}.reference-map-caption span{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}@media (min-width:760px){.reference-top-actions{top:28px;left:32px;right:32px}.reference-action{flex-basis:48px;width:48px;height:48px}.reference-status h1{font-size:23px}.reference-description{font-size:16px}.reference-destination{font-size:14px}}@media (max-height:680px) and (orientation:portrait){.reference-tracking{--map-edge:52dvh;--dial-size:min(66vw,33dvh)}.reference-status{top:calc(var(--dial-size) / 2 + 28px)}.reference-status h1{margin:6px 0;font-size:17px}.reference-description{font-size:12px}.reference-freshness{margin-top:9px}.reference-side-actions{top:calc(var(--dial-size) * .37)}.reference-destination{font-size:12px}.reference-top-actions{top:18px}}@media (max-height:500px) and (orientation:landscape){.reference-tracking{--dial-size:min(54dvh,240px)}.reference-map{clip-path:inset(0 45% 0 0)}.reference-map-shade{display:none}.reference-panel{width:45%;height:100dvh;top:0;left:77.5%}.reference-dial{top:16px}.reference-status{top:calc(var(--dial-size) + 28px);left:12px;right:12px}.reference-status h1{margin:4px 0;font-size:17px}.reference-description{font-size:12px}.reference-destination{font-size:11px}.reference-freshness{margin-top:5px;font-size:9px}.reference-side-actions{top:calc(var(--dial-size) - 20px);left:12px;right:12px}.reference-action{flex-basis:38px;width:38px;height:38px}.reference-top-actions{top:12px;left:12px;right:12px}.reference-tracking:not(.map-expanded) .reference-map .maplibregl-ctrl-bottom-right{top:60px;bottom:auto;right:calc(45% + 12px)}.reference-tracking.map-expanded .reference-map{clip-path:inset(0)}}.marker-destination.marker-dark{box-shadow:none;background:0 0;border-radius:0}.destination-pin{background:var(--brand);border-radius:50% 50% 50% 0;place-items:center;width:44px;height:44px;display:grid;transform:rotate(-45deg);box-shadow:0 3px 12px #0003}@media (max-height:500px) and (orientation:landscape){.reference-map-open{width:55%;height:100%!important}}html.tracking-viewport,body.tracking-viewport{overscroll-behavior:none;height:100%;overflow:hidden}.reference-tracking{overscroll-behavior:none;isolation:isolate}.reference-map-shade{opacity:1;transition:opacity .35s}.reference-tracking.map-expanded .reference-map-shade{opacity:0}.reference-eta-label>span{display:block}.reference-eta-kind{opacity:1;max-height:2em;transition:max-height var(--morph-duration) var(--morph-ease),opacity .22s ease;overflow:hidden}.reference-side-actions,.reference-status{opacity:1;transition:opacity .26s ease .1s,transform .5s var(--morph-ease);transform:translateY(0)}.reference-dock-caption{opacity:0;pointer-events:none;transition:opacity .24s ease,transform var(--morph-duration) var(--morph-ease);min-width:0;position:absolute;top:50%;left:140px;right:65px;transform:translateY(calc(10px - 50%))}.reference-dock-caption strong,.reference-dock-caption>span{text-overflow:ellipsis;white-space:nowrap;display:block;overflow:hidden}.reference-dock-caption strong{font-size:12px;font-weight:800;line-height:1.5}.reference-dock-caption>span{color:#aeb8bc;margin-top:3px;font-size:11px;line-height:1.5}.reference-dock-expand{color:#fff;opacity:0;pointer-events:none;width:42px;height:42px;transition:opacity .22s ease,transform var(--morph-duration) var(--morph-ease),background .15s ease;background:#2b3236;border-radius:14px;place-items:center;display:grid;position:absolute;top:50%;right:12px;transform:translateY(calc(8px - 50%))scale(.8)}.reference-dock-expand:hover{background:#3b474d}.reference-tracking.map-expanded .reference-panel{top:calc(100dvh - var(--dock-height) - var(--dock-bottom));width:min(480px,100% - 24px);height:var(--dock-height);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#15191df5;border-radius:22px;box-shadow:0 10px 40px #0006,0 0 0 1px #ffffff10}.reference-tracking.map-expanded .reference-dial{pointer-events:none;background:0 0;border-radius:22px;width:100%;height:100%;top:0;box-shadow:0 0 #0000}.reference-tracking.map-expanded .reference-ring{opacity:0;left:72px;transform:translate(-50%,-50%)scale(.15)}.reference-tracking.map-expanded .reference-dial-content{gap:1px;width:124px;left:72px}.reference-tracking.map-expanded .reference-eta{letter-spacing:-.6px;font-size:24px}.reference-tracking.map-expanded .reference-dial-content>span{font-size:10px}.reference-tracking.map-expanded .reference-eta-kind{opacity:0;max-height:0}.reference-tracking.map-expanded .reference-empty-title{font-size:13px}.reference-tracking.map-expanded .reference-dial-content>svg{width:18px;height:18px}.reference-tracking.map-expanded .reference-side-actions,.reference-tracking.map-expanded .reference-status{opacity:0;pointer-events:none;transition-delay:0s;transform:translateY(24px)}.reference-tracking.map-expanded .reference-dock-caption{opacity:1;transition-delay:.18s;transform:translateY(-50%)}.reference-tracking.map-expanded .reference-dock-expand{opacity:1;pointer-events:auto;transition-delay:.18s;transform:translateY(-50%)scale(1)}.reference-tracking.map-expanded .reference-map .map-controls{bottom:calc(var(--dock-height) + var(--dock-bottom) + 18px)}.reference-detail-done{color:#fff;background:#2b3236;border-radius:12px;min-height:40px;padding:10px 15px;font-size:13px;font-weight:750}.reference-tracking .trip-dialog{overscroll-behavior:contain}@media (max-width:360px){.reference-dock-caption{left:122px;right:58px}.reference-tracking.map-expanded .reference-dial-content{width:110px;left:63px}.reference-dock-expand{width:38px;height:38px;right:9px}.reference-tracking.map-expanded .reference-eta{font-size:22px}.reference-dock-caption strong{font-size:11px}.reference-dock-caption>span{font-size:10px}}@media (prefers-reduced-motion:reduce){.reference-tracking{--morph-duration:1ms}.reference-tracking *{transition-delay:0s!important}}.reference-tracking.map-expanded .reference-map .maplibregl-ctrl-bottom-right{bottom:calc(var(--dock-height) + var(--dock-bottom) + 6px);left:12px;right:auto}
