.loc-stage{--ls-fg:#17284a;--ls-muted:#5b6b86;--ls-line:#d5e1f1;--ls-brand:#1e63c8;--ls-hud:rgba(255,255,255,0.88);--loc-head:72px;--ls-bar:0px}@media (max-width:1023px){.loc-stage{--ls-bar:3.5rem}}.loc-stage .ls-scrub{position:relative;height:520svh}.loc-stage .ls-stage{position:sticky;top:var(--loc-head);height:calc(100svh - var(--loc-head));overflow:hidden;background:linear-gradient(180deg,#8caed6,#95b5d9);outline:none}.loc-stage .ls-stage:focus-visible{box-shadow:inset 0 0 0 3px var(--ls-brand)}.loc-stage .ls-stage:after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(120% 90% at 50% 40%,transparent 55%,rgba(23,40,74,.1) 100%)}.loc-stage .ls-canvas,.loc-stage .ls-canvas canvas{position:absolute;inset:0;display:block;width:100%;height:100%}.loc-stage .ls-hint,.loc-stage .ls-hud,.loc-stage .ls-labels{transition:opacity .6s,visibility .6s}.loc-stage .ls-hint[data-off],.loc-stage:not([data-landed]) .ls-hint,.loc-stage:not([data-landed]) .ls-hud,.loc-stage:not([data-landed]) .ls-labels{opacity:0;visibility:hidden}.loc-stage .ls-labels{position:absolute;inset:0;pointer-events:none}.loc-stage .lb{position:absolute;left:0;top:0;transform:translate(-50%,-120%);white-space:nowrap;font-size:12px;font-weight:500;line-height:1.6;color:#17284a;background:rgba(255,255,255,.94);border:1px solid #c6d8ef;border-radius:999px;padding:4px 10px;box-shadow:0 2px 8px rgba(23,40,74,.08)}.loc-stage .lb.turn{background:#fff;border:2px solid #f0882e;color:#8a4f08;font-weight:700;padding:3px 10px}.loc-stage .lb.name{background:transparent;border:0;box-shadow:none;color:#3f4f6b;font-weight:600;padding:0;text-shadow:0 0 3px #fff,0 0 6px #fff,0 0 6px #fff}.loc-stage .lb.hq{background:#1e63c8;color:#fff;border-color:#1e63c8;font-weight:700;font-size:13px;padding:5px 12px}.loc-stage .lb.hq.arrived{animation:ls-pop .6s cubic-bezier(.2,1.4,.3,1)}.loc-stage .lb.zone{color:#6b7a94;font-weight:600;line-height:1;letter-spacing:.18em}.loc-stage .lb.road,.loc-stage .lb.zone{background:transparent;border:0;box-shadow:none;font-size:11px;padding:0}.loc-stage .lb.road{color:#5b6b86;text-shadow:0 0 3px #fff,0 0 6px #fff,0 0 6px #fff}.loc-stage .lb.poi{background:#fff3e0;border-color:#f0c98a;color:#7a4b0a}.loc-stage .ls-hint{position:absolute;left:50%;top:18px;transform:translateX(-50%);z-index:2;display:flex;gap:8px;align-items:center;font-size:12px;font-weight:600;line-height:1;color:var(--ls-brand);background:var(--ls-hud);border:1px solid var(--ls-line);border-radius:999px;padding:8px 14px;backdrop-filter:blur(8px);pointer-events:none;white-space:nowrap}.loc-stage .ls-hint svg{width:14px;height:14px;animation:ls-bob 1.2s ease-in-out infinite}.loc-stage .ls-hint-d{display:none}.loc-stage{scroll-margin-top:var(--loc-head)}.loc-stage .ls-close{position:absolute;left:max(10px,env(safe-area-inset-left,0px));top:10px;z-index:3;display:flex;gap:4px;align-items:center;min-height:40px;font-size:13px;font-weight:600;line-height:1;color:var(--ls-fg);background:var(--ls-hud);border:1px solid var(--ls-line);border-radius:999px;padding:0 14px 0 10px;backdrop-filter:blur(8px);cursor:pointer;box-shadow:0 2px 8px rgba(23,40,74,.08)}.loc-stage .ls-close:hover{border-color:var(--ls-brand);color:var(--ls-brand)}.loc-stage .ls-close:focus-visible{outline:2px solid var(--ls-brand);outline-offset:2px}.loc-stage .ls-close svg{width:16px;height:16px}.loc-stage .ls-credit{position:absolute;right:10px;top:10px;z-index:2;margin:0;font-size:10px;line-height:1.4;color:rgba(23,40,74,.75);background:rgba(255,255,255,.6);border-radius:6px;padding:2px 6px;pointer-events:none}.loc-stage .ls-hud{position:absolute;left:max(16px,env(safe-area-inset-left,0px));right:max(16px,env(safe-area-inset-right,0px));bottom:calc(var(--ls-bar) + max(16px, env(safe-area-inset-bottom, 0px)));display:flex;gap:12px;align-items:flex-end;justify-content:space-between;pointer-events:none}.loc-stage .ls-card{pointer-events:auto;color:var(--ls-fg);background:var(--ls-hud);backdrop-filter:blur(8px);border:1px solid var(--ls-line);border-radius:18px;padding:14px 16px 12px;max-width:440px;min-width:0;box-shadow:0 8px 30px rgba(23,40,74,.12);animation:ls-card-in .45s cubic-bezier(.2,.8,.2,1) both}.loc-stage .ls-card .top{display:flex;gap:14px;align-items:center}.loc-stage .ls-card .gl{width:56px;height:56px;border-radius:14px;background:var(--ls-brand);color:#fff;display:flex;align-items:center;justify-content:center;flex:none;box-shadow:0 6px 16px rgba(30,99,200,.35)}.loc-stage .ls-card .gl svg{width:34px;height:34px}.loc-stage .ls-card .col{min-width:0;flex:1}.loc-stage .ls-card .dist{font-size:30px;font-weight:700;line-height:1;font-variant-numeric:tabular-nums;letter-spacing:-.02em}.loc-stage .ls-card .dist small{font-size:13px;font-weight:600;color:var(--ls-muted);margin-left:5px;letter-spacing:0}.loc-stage .ls-card .t{font-weight:700;font-size:15px;line-height:1.3;margin-top:3px;word-break:keep-all}.loc-stage .ls-card .ph{flex:none;width:96px;height:auto;aspect-ratio:4/3;border-radius:10px;object-fit:cover;border:1px solid var(--ls-line);transition:transform .5s}.loc-stage .ls-card:hover .ph{transform:scale(1.03)}.loc-stage .ls-card .d{color:var(--ls-muted);font-size:13px;line-height:1.45;margin-top:10px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.loc-stage .ls-card .next{display:flex;justify-content:space-between;gap:12px;margin-top:10px;padding-top:9px;border-top:1px solid var(--ls-line);font-size:12px;color:var(--ls-muted);min-width:0}.loc-stage .ls-card .nt{font-weight:600;color:var(--ls-fg);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.loc-stage .ls-card .nd{flex:none}.loc-stage .ls-card .foot{display:flex;align-items:center;gap:10px;margin-top:8px;flex-wrap:wrap}.loc-stage .ls-card .steps{display:flex;align-items:center;flex:1;min-width:160px}.loc-stage .ls-card .dot{width:9px;height:9px;border-radius:50%;background:var(--ls-line);flex:none;border:2px solid var(--ls-hud);box-sizing:content-box;padding:0;cursor:pointer;position:relative}.loc-stage .ls-card .dot:after{content:"";position:absolute;inset:-14px}.loc-stage .ls-card .dot.on{background:var(--ls-brand)}.loc-stage .ls-card .dot:focus-visible{outline:2px solid var(--ls-brand);outline-offset:3px}.loc-stage .ls-card .steps b{flex:1;height:2px;background:var(--ls-line);position:relative;overflow:hidden}.loc-stage .ls-card .steps s{position:absolute;left:0;top:0;bottom:0;width:0;background:var(--ls-brand);text-decoration:none}.loc-stage .ls-card .ctl{display:flex;gap:4px;flex:none;margin-left:auto}.loc-stage .ls-card .ctl button{width:44px;height:44px;border-radius:12px;border:1px solid var(--ls-line);background:var(--ls-hud);color:var(--ls-brand);cursor:pointer;display:flex;align-items:center;justify-content:center}.loc-stage .ls-card .ctl button:disabled{opacity:.35;cursor:default}.loc-stage .ls-card .ctl button:focus-visible{outline:2px solid var(--ls-brand);outline-offset:2px}.loc-stage .ls-card .ctl button[aria-pressed=true]{background:var(--ls-brand);color:#fff}.loc-stage .ls-card .ctl svg{width:18px;height:18px;fill:currentColor}.loc-stage .ls-card .ctl [data-act=play]{display:none}.loc-stage .ls-mini{pointer-events:auto;background:var(--ls-hud);backdrop-filter:blur(8px);border:1px solid var(--ls-line);border-radius:14px;padding:8px;width:170px;box-shadow:0 8px 30px rgba(23,40,74,.12)}.loc-stage .ls-mini svg{display:block;width:100%;aspect-ratio:1/1.3;height:auto}.loc-stage .ls-mini-cap{font-size:10px;font-weight:500;line-height:1;color:var(--ls-muted);text-align:center;margin-top:6px;letter-spacing:.02em}@media (hover:hover) and (pointer:fine){.loc-stage .ls-scrub{height:calc(100svh - var(--loc-head))}.loc-stage .ls-hint-m{display:none}.loc-stage .ls-hint-d{display:inline}.loc-stage .ls-card .ctl [data-act=play]{display:flex}}@media (max-width:640px){.loc-stage .ls-hint{top:60px}.loc-stage .ls-hud{align-items:stretch}.loc-stage .ls-mini{display:none}.loc-stage .ls-card{max-width:none;padding:12px 14px 10px}.loc-stage .ls-card .ph{width:84px}.loc-stage .ls-card .dist{font-size:24px}.loc-stage .ls-card .gl{width:50px;height:50px}.loc-stage .ls-card .gl svg{width:30px;height:30px}}@keyframes ls-bob{50%{transform:translateY(4px)}}@keyframes ls-card-in{0%{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}@keyframes ls-pop{0%{transform:scale(.4);opacity:0}to{transform:scale(1);opacity:1}}