/* Lens presentation. Scoped to the route/explore enhancer; sky is unchanged. */
.camera-guide.lens-camera {
  --lens-glass: linear-gradient(145deg,rgba(68,78,75,.78),rgba(19,27,25,.84));
  --lens-line: rgba(255,255,255,.24);
  --lens-shadow: 0 18px 46px rgba(0,0,0,.27),inset 0 1px 0 rgba(255,255,255,.24),inset 0 -1px 0 rgba(0,0,0,.12);
  --lens-controls-bottom: 175px;
  --lens-instruction-top: 181px;
  --lens-settings-bottom: 235px;
  --lime: #daff69;
}
.lens-camera [hidden] { display: none !important; }
.lens-camera button,.lens-camera a { -webkit-tap-highlight-color:transparent; }
.lens-camera button:focus-visible,.lens-camera a:focus-visible,.lens-camera input:focus-visible { outline:3px solid #daff69; outline-offset:4px; }
.lens-camera > .camera-guide__shade { background:linear-gradient(180deg,rgba(2,8,6,.30),transparent 29%,transparent 64%,rgba(2,8,6,.33)); }
.lens-camera > .camera-guide__header,
.lens-camera > .camera-guide__modes,
.lens-camera > .camera-guide__status,
.lens-camera > .camera-guide__route-card,
.lens-camera .explore-live-tools,
.lens-camera .awareness-camera__toolbar { transform:none; filter:none; }
.lens-camera > .camera-guide__header {
  z-index:40; top:calc(12px + var(--safe-top)); left:max(12px,var(--safe-left)); right:max(12px,var(--safe-right));
  width:auto; max-width:520px; min-height:58px; margin-inline:auto; padding:6px; gap:12px;
  grid-template-columns:44px minmax(0,1fr) 44px; border:1px solid var(--lens-line); border-radius:29px;
  background:var(--lens-glass); box-shadow:var(--lens-shadow); backdrop-filter:blur(24px) saturate(1.25); -webkit-backdrop-filter:blur(24px) saturate(1.25);
}
.lens-camera .camera-guide__header::after,.lens-camera .camera-guide__route-card::after { display:none; }
.lens-camera .camera-guide__icon-button { width:44px; height:44px; background:rgba(255,255,255,.09); border:1px solid rgba(255,255,255,.1); box-shadow:inset 0 1px 0 rgba(255,255,255,.15); }
.lens-camera .camera-guide__destination small { font-size:12px; letter-spacing:.015em; color:rgba(255,255,255,.66); margin:0; }
.lens-camera .camera-guide__destination strong { font-size:16px; line-height:1.6; color:#fff; }
.lens-camera > .camera-guide__modes {
  z-index:40; top:calc(84px + var(--safe-top)); right:12px; left:12px; width:max-content; max-width:calc(100% - 24px); margin-inline:auto;
  padding:4px; gap:3px; border-radius:25px; border:1px solid var(--lens-line); background:rgba(27,36,33,.73);
  backdrop-filter:blur(22px); -webkit-backdrop-filter:blur(22px); box-shadow:var(--lens-shadow);
}
.lens-camera .camera-guide__modes a { min-width:70px; min-height:36px; padding:7px 17px; font-size:14px; color:rgba(255,255,255,.8); border-radius:20px; }
.lens-camera .camera-guide__modes a[aria-current="page"] { color:#142014; background:linear-gradient(#f1ffd1,#daff69); box-shadow:0 2px 9px #0002,inset 0 1px 0 #fff9; }
.lens-camera:has(.camera-guide__modes) > .camera-guide__status,
.lens-camera > .awareness-camera__status {
  top:calc(141px + var(--safe-top)); right:16px; left:16px; width:max-content; max-width:calc(100% - 32px);
  margin-inline:auto; padding:6px 12px; min-height:30px; border:1px solid rgba(255,255,255,.14); border-radius:16px;
  background:rgba(13,23,19,.66); color:#f4faf6; font-size:12px; line-height:1.55; box-shadow:0 4px 18px #0002;
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); z-index:40;
}
.lens-camera .camera-guide__signal { width:6px; height:6px; animation:none; flex:none; }
.lens-camera > .camera-guide__scene,
.lens-camera > .explore-poi-layer,
.lens-camera > .spatial-ambient,
.lens-camera > .spatial-reticle,
.lens-camera > .spatial-context-chip { display:none; }

/* A single small canvas projects world polygons; text remains crisp DOM. */
.lens-world { position:absolute; inset:0; z-index:10; pointer-events:none; overflow:hidden; }
.lens-ground { display:block; width:100%; height:100%; }
.lens-signs { position:absolute; inset:0; z-index:14; pointer-events:none; overflow:hidden; }
.lens-chrome { position:absolute; inset:0; z-index:28; pointer-events:none; }
.lens-sign {
  --sign-scale:1; --sign-stem:42px; --sign-yaw:0deg; --sign-color:#d8edff;
  position:absolute; width:202px; height:85px; min-height:44px; padding:0; margin:0; text-align:right; direction:rtl;
  color:#f7fcf9; background:none; border:0; overflow:visible; cursor:pointer;
  transform:translate(-50%,-100%); pointer-events:auto; outline-offset:6px;
  transition:opacity .2s ease; will-change:transform;
}
.lens-sign[data-kind="hospital"] { --sign-color:#ffafb8; }
.lens-sign[data-kind="cafe"],.lens-sign[data-kind="food"] { --sign-color:#ffe0a2; }
.lens-sign[data-kind="education"] { --sign-color:#c7c1ff; }
.lens-sign[data-kind="shop"] { --sign-color:#9de5ff; }
.lens-sign[data-kind="park"] { --sign-color:#b1f7c0; }
.lens-sign[data-kind="history"] { --sign-color:#f1d7a5; }
.lens-sign.lens-sign--destination { --sign-color:#daff69; }
.lens-sign__face {
  position:relative; z-index:1; display:flex; align-items:center; gap:10px; height:85px; padding:11px 12px;
  border:1px solid rgba(255,255,255,.36); border-radius:20px; color:#f7fcf9;
  background:linear-gradient(130deg,rgba(81,92,87,.87),rgba(18,28,24,.90));
  box-shadow:0 14px 26px #0005,0 3px 0 rgba(13,22,18,.55),inset 0 1px 0 #fff3;
  backdrop-filter:blur(16px) saturate(1.2); -webkit-backdrop-filter:blur(16px) saturate(1.2);
  transform:perspective(700px) rotateY(var(--sign-yaw)) scale(var(--sign-scale)); transform-origin:center bottom;
  transition:background .2s ease; overflow:hidden;
}
.lens-sign__face::before { content:""; position:absolute; top:0; right:0; width:65%; height:1px; background:linear-gradient(90deg,transparent,#fff9); }
.lens-sign__face > i { width:34px; height:38px; flex:0 0 34px; display:grid; place-items:center; border-radius:12px; color:var(--sign-color); background:rgba(255,255,255,.07); }
.lens-sign svg { width:23px; height:23px; }
.lens-sign__face > span { display:flex; flex-direction:column; gap:1px; min-width:0; }
.lens-sign small { color:var(--sign-color); font-size:12px; line-height:1.4; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.lens-sign strong { font-size:15px; font-weight:650; line-height:1.55; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.lens-sign__distance { color:#d2dbd6; font-size:12px; line-height:1.5; }
.lens-sign__stem { position:absolute; top:100%; left:50%; height:var(--sign-stem); width:1px; background:linear-gradient(#f2ffee88,#f2ffee44); pointer-events:none; box-shadow:0 1px 3px #0009; }
.lens-sign__foot { position:absolute; left:50%; top:calc(100% + var(--sign-stem)); width:7px; height:7px; transform:translate(-50%,-50%); border:1px solid #fff; border-radius:50%; background:var(--sign-color); box-shadow:0 2px 7px #0009; pointer-events:none; }
.lens-sign--below .lens-sign__stem { top:calc(100% - var(--sign-stem)); height:calc(var(--sign-stem) - 85px * var(--sign-scale)); }
.lens-sign--below .lens-sign__foot { top:calc(100% - var(--sign-stem)); }
.lens-sign:hover .lens-sign__face,.lens-sign:focus-visible .lens-sign__face { background:linear-gradient(130deg,rgba(104,120,111,.95),rgba(30,45,37,.95)); }
.lens-sign:active .lens-sign__face { filter:brightness(1.15); }
.lens-instruction {
  position:absolute; top:var(--lens-instruction-top); left:16px; right:16px; width:max-content; max-width:min(390px,calc(100% - 32px));
  margin-inline:auto; display:flex; align-items:center; gap:13px; padding:12px 17px; border:1px solid rgba(255,255,255,.30); border-radius:24px;
  background:linear-gradient(140deg,rgba(50,65,55,.87),rgba(16,29,20,.88)); box-shadow:var(--lens-shadow); backdrop-filter:blur(22px); -webkit-backdrop-filter:blur(22px);
}
.lens-instruction__icon { width:43px; height:43px; flex:0 0 43px; border-radius:15px; display:grid; place-items:center; color:#daff69; background:#daff6917; }
.lens-instruction__icon svg { width:29px; height:29px; transition:transform .2s ease; }
.lens-instruction > span:last-child { display:grid; gap:3px; min-width:0; }
.lens-instruction strong { font-size:17px; line-height:1.55; font-weight:700; }
.lens-instruction small { font-size:13px; color:#d0dccf; line-height:1.5; }
.lens-instruction.is-arrived { border-color:#daff6988; }
.lens-tracking { position:absolute; left:18px; right:18px; bottom:calc(var(--lens-controls-bottom) + 61px); width:max-content; max-width:calc(100% - 36px); margin-inline:auto; padding:9px 14px; border:1px solid #ffffff26; border-radius:17px; background:rgba(18,27,23,.82); color:#eff7eb; font-size:13px; line-height:1.6; text-align:center; box-shadow:0 8px 24px #0003; }
.lens-controls { position:absolute; bottom:var(--lens-controls-bottom); left:12px; right:12px; width:max-content; margin-inline:auto; display:flex; align-items:center; gap:3px; padding:4px; background:rgba(25,35,30,.78); border:1px solid var(--lens-line); border-radius:27px; box-shadow:var(--lens-shadow); backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px); pointer-events:auto; }
.lens-controls button { display:grid; place-items:center; width:44px; height:44px; padding:10px; border:0; border-radius:50%; background:transparent; color:#f8fff6; }
.lens-controls svg { width:22px; height:22px; }
.lens-controls button[aria-pressed="true"],.lens-controls button[aria-expanded="true"] { background:#daff6929; color:#daff69; }
.lens-bearing { display:flex; align-items:center; justify-content:center; gap:8px; min-width:80px; padding:0 12px; border-inline:1px solid #ffffff1c; color:#e9f3e8; direction:ltr; }
.lens-bearing b { min-width:36px; font-size:13px; font-weight:500; }
.lens-bearing i { width:0; height:0; border-left:4px solid transparent; border-right:4px solid transparent; border-bottom:12px solid #daff69; }
.lens-settings,.lens-place-card { position:absolute; bottom:var(--lens-settings-bottom); left:14px; right:14px; width:auto; max-width:380px; margin-inline:auto; padding:19px; border:1px solid #ffffff40; border-radius:26px; background:rgba(26,38,31,.97); color:#f6fcf4; box-shadow:0 24px 70px #0007,inset 0 1px 0 #fff2; pointer-events:auto; max-height:65dvh; overflow:auto; z-index:70; }
.lens-settings header { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:8px; }
.lens-settings strong { font-size:16px; }
.lens-settings button { min-height:44px; color:#f4fff2; border:1px solid #ffffff30; border-radius:15px; background:#ffffff10; padding:8px 14px; font-size:14px; }
.lens-settings header button { width:44px; height:44px; font-size:24px; padding:0; }
.lens-settings label { display:grid; gap:9px; margin:17px 0; font-size:14px; }
.lens-settings label > span { display:flex; justify-content:space-between; gap:10px; }
.lens-settings input { width:100%; height:28px; accent-color:#daff69; direction:ltr; }
.lens-settings output { color:#daff69; }
.lens-settings p { font-size:13px; line-height:1.9; color:#bfcebf; margin:15px 0 0; }
.lens-settings button[aria-pressed="true"] { background:#daff6926; border-color:#daff6966; }
.lens-recent { display:grid; gap:6px; margin-top:12px; color:#c8d6c3; font-size:14px; }
.lens-recent a { display:block; padding:10px 12px; color:#ecffe0; border:1px solid #ffffff24; border-radius:12px; text-decoration:none; }
.lens-place-card > button { float:left; width:44px; height:44px; border-radius:50%; border:1px solid #ffffff30; color:#fff; background:#ffffff10; font-size:24px; }
.lens-place-card h2 { font-size:21px; line-height:1.6; margin:8px 0; }
.lens-place-card > small { font-size:13px; color:#daff69; }
.lens-place-card > p { font-size:14px; color:#d3dfce; }
.lens-place-card > div { display:flex; flex-wrap:wrap; gap:8px; }
.lens-place-card > div button,.lens-place-card > div a { padding:10px 14px; min-height:44px; font-size:14px; line-height:1.6; border:1px solid #ffffff30; border-radius:16px; background:#ffffff0d; color:#e9ffcc; text-decoration:none; }
.lens-beacon { position:absolute; --beacon-height:110px; width:0; height:0; transform:translate(-50%,0); pointer-events:none; }
.lens-beacon > i { position:absolute; bottom:0; left:-10px; width:20px; height:var(--beacon-height); background:linear-gradient(0deg,#daff6988,#daff6900); clip-path:polygon(45% 0,55% 0,100% 100%,0 100%); }
.lens-beacon > b { position:absolute; left:-20px; bottom:var(--beacon-height); width:40px; height:40px; border:1px solid #eeffc3b3; border-radius:50%; background:rgba(53,70,32,.89); color:#e8ffad; display:grid; place-items:center; box-shadow:0 5px 17px #0005; }
.lens-beacon svg { width:21px; height:21px; }
.lens-beacon__label { position:absolute; bottom:calc(var(--beacon-height) + 47px); left:0; transform:translateX(-50%); font-size:12px; white-space:nowrap; color:#f1ffd6; text-shadow:0 2px 5px #000; }
.lens-beacon::after { content:""; position:absolute; left:-14px; top:-5px; width:28px; height:10px; border:1px solid #eeffc3cc; border-radius:50%; background:#daff6940; box-shadow:0 2px 9px #0006; }
.lens-beacon.is-arrived > b { background:#daff69; color:#243017; }

.lens-camera > .camera-guide__route-card {
  z-index:40; top:auto; right:max(12px,var(--safe-right)); left:max(12px,var(--safe-left)); bottom:calc(12px + var(--safe-bottom)); margin-inline:auto;
  width:auto; max-width:520px; min-height:136px; max-height:min(28dvh,210px); padding:14px; gap:14px; border-radius:28px;
  grid-template-columns:100px minmax(0,1fr); border:1px solid var(--lens-line); background:var(--lens-glass); box-shadow:var(--lens-shadow);
  backdrop-filter:blur(24px); -webkit-backdrop-filter:blur(24px); overflow:auto;
}
.lens-camera > .camera-guide__route-card .camera-guide__radar { width:100px; max-width:100px; height:100px; min-width:0; border-radius:21px; box-shadow:inset 0 0 0 1px #ffffff30; }
.lens-camera .camera-guide__mini-map { border-radius:20px; filter:none; }
.lens-camera .camera-guide__route-copy { min-width:0; gap:4px; }
.camera-guide.lens-camera .camera-guide__route-copy > small { font-size:12px; color:#c5d2c8; line-height:1.5; }
.camera-guide.lens-camera .camera-guide__route-copy > strong { font-size:16px; line-height:1.6; color:#f3fff0; }
.camera-guide.lens-camera .camera-guide__route-copy > span { font-size:12px; line-height:1.7; color:#d4ded4; }
.lens-camera .camera-guide__verify-button { display:inline-flex; min-height:36px; padding:5px 9px; border-radius:12px; border:1px solid #ffffff26; background:#ffffff09; color:#edf9e7; font-size:12px; margin:3px 0 0; box-shadow:none; }
.lens-camera .camera-guide__verify-button svg { width:17px; height:17px; flex:none; }
.lens-camera .camera-guide__permission { z-index:100; border-radius:30px !important; background:linear-gradient(145deg,rgba(62,76,67,.96),rgba(16,27,21,.98)); color:#f5fff2; border:1px solid #ffffff4d; box-shadow:0 30px 90px #0008,inset 0 1px 0 #fff4; max-height:calc(100dvh - 34px); overflow:auto; }
.lens-camera .camera-guide__permission h1 { color:#f1ffdf; font-size:clamp(23px,5vw,31px); }
.lens-camera .camera-guide__permission p { color:#d2ded1; font-size:14px !important; line-height:1.9 !important; }
.lens-camera .camera-guide__permission .camera-guide__primary-button { background:linear-gradient(#edffc1,#daff69); color:#1b2b0e; border-radius:18px; box-shadow:0 8px 22px #0003; min-height:52px; font-size:16px; }
.lens-camera .camera-guide__permission::after { display:none; }
.lens-camera:not(.lens-started) > .spatial-action-rail,.lens-camera:not(.lens-started) .explore-toolbar,.lens-camera:not(.lens-started) .explore-live-tools { visibility:hidden; }
.lens-camera[data-explore-mode="around"] .explore-selector__box { display:none; }
.lens-camera[data-explore-mode="around"] .explore-selector { pointer-events:none; }
.lens-camera[data-explore-mode="around"] .explore-selector > p { display:none; }
.lens-camera .spatial-action-rail--explore { z-index:35; top:calc(190px + var(--safe-top)); right:12px; left:auto; padding:6px; border-radius:24px; background:rgba(26,36,30,.82); border:1px solid var(--lens-line); transform:none; box-shadow:var(--lens-shadow); }
.lens-camera .spatial-action-rail--explore button { width:48px; min-height:54px; border-radius:18px; color:#e5f0e1; }
.lens-camera .spatial-action-rail--explore button span { font-size:12px; }
.lens-camera .spatial-action-rail--explore button[aria-pressed="true"] { background:#daff6926; color:#e2ff97; }
.lens-camera .explore-live-tools { z-index:40; bottom:calc(86px + var(--safe-bottom)); right:12px; left:12px; max-width:520px; margin-inline:auto; border:1px solid var(--lens-line); border-radius:22px; padding:10px; background:var(--lens-glass); box-shadow:var(--lens-shadow); }
.lens-camera .explore-quality { font-size:12px; }
.lens-camera .explore-device-controls { display:flex; flex-wrap:wrap; gap:5px; }
.lens-camera .explore-device-controls button { font-size:12px; min-height:36px; padding:6px 9px; border-radius:12px; }
.lens-camera .explore-toolbar { z-index:40; bottom:calc(16px + var(--safe-bottom)); left:12px; right:12px; width:max-content; max-width:calc(100% - 24px); margin-inline:auto; transform:none; }
.lens-camera .explore-toolbar__scan { min-height:54px; border-radius:27px; padding:12px 30px; font-size:16px; background:linear-gradient(#edffc1,#daff69); color:#1b2b0e; border:1px solid #f5ffd5; box-shadow:0 8px 26px #0004; }
.lens-camera .awareness-sheet,.lens-camera .awareness-progress { z-index:90; }
.lens-camera.lens-focus > .camera-guide__modes { visibility:hidden; pointer-events:none; }
.lens-camera.lens-focus .spatial-action-rail { visibility:hidden; pointer-events:none; }
.lens-camera.lens-focus .camera-guide__route-copy > span { display:none; }
.lens-camera.lens-reduced * { animation:none !important; transition:none !important; }

@media (max-width:360px) {
  .lens-camera > .camera-guide__route-card { grid-template-columns:78px minmax(0,1fr); gap:10px; padding:12px; }
  .lens-camera > .camera-guide__route-card .camera-guide__radar { width:78px; height:78px; }
  .lens-camera .camera-guide__route-copy > strong { font-size:14px; }
  .lens-instruction strong { font-size:15px; }
  .lens-sign__face { gap:7px; padding:10px; }
  .lens-sign__face > i { width:26px; flex-basis:26px; }
}
@media (max-height:700px) and (orientation:portrait) {
  .lens-camera > .camera-guide__header { top:calc(7px + var(--safe-top)); min-height:52px; }
  .lens-camera > .camera-guide__modes { top:calc(71px + var(--safe-top)); }
  .lens-camera:has(.camera-guide__modes) > .camera-guide__status { top:calc(122px + var(--safe-top)); }
  .lens-camera > .camera-guide__route-card { min-height:112px; max-height:160px; }
  .lens-camera .camera-guide__route-copy > span { display:none; }
  .lens-instruction { padding:9px 14px; }
  .lens-instruction strong { font-size:15px; }
}
@media (orientation:landscape) and (max-height:600px) {
  .lens-camera > .camera-guide__header { width:280px; top:12px; right:12px; left:auto; margin:0; }
  .lens-camera > .camera-guide__modes { left:12px; right:auto; top:12px; margin:0; }
  .lens-camera:has(.camera-guide__modes) > .camera-guide__status { top:66px; left:12px; right:auto; max-width:310px; margin:0; }
  .lens-camera > .camera-guide__route-card { left:auto; right:12px; bottom:12px; width:300px; grid-template-columns:74px minmax(0,1fr); min-height:110px; max-height:170px; padding:12px; gap:12px; }
  .lens-camera > .camera-guide__route-card .camera-guide__radar { width:74px; height:74px; }
  .lens-camera .camera-guide__route-copy > span { display:none; }
  .lens-instruction { top:110px; left:12px; right:auto; max-width:270px; padding:9px 12px; }
  .lens-instruction strong { font-size:14px; }
  .lens-controls { bottom:14px !important; right:auto; left:14px; }
  .lens-tracking { bottom:76px; right:auto; left:14px; max-width:270px; }
  .lens-settings { bottom:76px; left:14px; right:auto; width:320px; max-height:calc(100dvh - 90px); }
  .lens-camera .spatial-action-rail--explore { top:90px; right:12px; }
  .lens-camera .explore-live-tools { left:auto; right:90px; bottom:12px; width:240px; }
  .lens-camera .explore-toolbar { right:12px; left:auto; bottom:12px; }
  .lens-camera .explore-toolbar__scan { min-width:54px; padding:12px; }
  .lens-camera .explore-toolbar__scan > span { display:none; }
}
@media (prefers-reduced-transparency:reduce) {
  .lens-camera { --lens-glass:#26332b; }
  .lens-sign__face,.lens-instruction,.lens-controls,.lens-camera > .camera-guide__modes { background:#26332b; backdrop-filter:none; -webkit-backdrop-filter:none; }
}
@media (prefers-reduced-motion:reduce) { .lens-camera * { animation:none !important; transition:none !important; } }

/* Opt-in development diagnostics; no production layout changes. */
.lens-perception-debug { position:absolute; direction:ltr; text-align:left; top:calc(var(--safe-top, 0px) + 185px); left:8px; max-width:calc(100% - 16px); padding:8px; margin:0; overflow:hidden; background:#071522d9; color:#dbf4ff; font:11px/1.5 monospace; pointer-events:none; }

/* Route camera V3: an open live view, grounded guidance and a real street map. */
.camera-guide.lens-navigation{--lens-glass:linear-gradient(145deg,#132a30db,#101c25e8);--lens-line:#a0e8e52e;--lens-shadow:0 12px 32px #07151b40;--lime:#73e9df}
.lens-navigation>.camera-guide__shade{background:linear-gradient(180deg,#08182170,transparent 30%,transparent 70%,#06121955)}
.lens-navigation>.camera-guide__header{min-height:54px;top:calc(8px + var(--safe-top));border-radius:22px;padding:4px 6px;background:#10232cce;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.lens-navigation .camera-guide__destination small{font-size:10px;color:#b9d3d8}
.lens-navigation .camera-guide__destination strong{font-size:14px}
.lens-navigation .camera-guide__icon-button{width:40px;height:40px;border-radius:15px}
.lens-navigation>.camera-guide__modes{top:calc(73px + var(--safe-top));padding:3px;background:#10232cb8;border-radius:18px}
.lens-navigation .camera-guide__modes a{min-width:65px;min-height:30px;padding:4px 12px;font-size:12px;border-radius:14px}
.lens-navigation .camera-guide__modes a[aria-current="page"]{background:#a5f4e8;color:#0b3234;box-shadow:none}
.lens-navigation:has(.camera-guide__modes)>.camera-guide__status{top:calc(116px + var(--safe-top));padding:4px 9px;min-height:24px;font-size:10px;max-width:calc(100% - 28px);background:#0a1e27ad}
.lens-navigation .lens-instruction{top:calc(160px + var(--safe-top));left:auto;right:12px;max-width:calc(100% - 166px);padding:10px 12px;gap:9px;border-radius:20px;background:#0d2531c9;box-shadow:0 8px 24px #07151b2b;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.lens-navigation .lens-instruction strong{font-size:15px;color:#f5fffe;line-height:1.65}
.lens-navigation .lens-instruction small{font-size:11px;color:#b7dadb}
.lens-navigation .lens-instruction__icon{background:#7cebdd20;color:#8ffff0;width:34px;height:40px;flex:0 0 34px;border-radius:12px}
.lens-navigation .lens-instruction__icon svg{width:25px;height:25px}
.lens-navigation .lens-controls{right:auto;left:12px;padding:4px;background:#0d2630d6;border-radius:20px;box-shadow:0 5px 20px #00151b33}
.lens-navigation .lens-controls button{width:40px;height:40px;min-width:40px;min-height:40px}
.lens-navigation .lens-bearing{min-width:45px;color:#c2efeb;font-size:10px}
.lens-navigation .lens-tracking{bottom:calc(var(--lens-controls-bottom) + 60px);max-width:calc(100% - 36px);padding:6px 11px;font-size:11px;border-radius:13px;background:#0b2430cc;color:#d8f4f1}
.lens-surface-switch{position:absolute;right:12px;bottom:var(--lens-controls-bottom);display:flex;align-items:center;gap:3px;pointer-events:auto;padding:4px;border:1px solid #a6e4e633;border-radius:19px;background:#0d2630d6;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 5px 20px #00151b33}
.lens-surface-switch button{min-height:40px;min-width:61px;border:0;border-radius:14px;padding:4px 10px;color:#d4e5e7;background:transparent;font:inherit;font-size:11px;cursor:pointer}
.lens-surface-switch button[aria-pressed="true"]{background:#9df1e4;color:#0c3a3b;font-weight:750;box-shadow:inset 0 1px 0 #fff6}
.lens-navigation:not(.lens-started) .lens-surface-switch,.lens-navigation:not(.lens-started) .camera-guide__weather{display:none}
.lens-navigation .camera-guide__weather{position:absolute;z-index:30;top:calc(160px + var(--safe-top));left:12px;width:140px;max-width:41%;padding:9px 11px;border:1px solid #a6e4e62e;border-radius:19px;background:#0d2531c9;color:#e7f9f8;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 8px 24px #07151b2b;pointer-events:none}
.camera-guide__weather-main{display:flex;align-items:center;gap:8px}
.camera-guide__weather-main>strong{font-size:27px;line-height:1.2;font-weight:700;direction:ltr;color:#f0fffd}
.camera-guide__weather-main>span{font-size:10px;line-height:1.6;max-height:34px;overflow:hidden;color:#c6e4e6}
.lens-navigation .camera-guide__weather .camera-guide__wind{position:static;transform:none;display:flex;gap:3px;align-items:center;padding:0;margin-top:5px;border:0;border-radius:0;box-shadow:none;background:transparent;color:#c9f2ef;font-size:11px;direction:ltr;white-space:nowrap}
.lens-navigation .camera-guide__weather .camera-guide__wind svg{width:18px;height:18px;stroke:#84f1e0;fill:none;stroke-width:1.8;transform-origin:center;flex:none}
.camera-guide__weather .camera-guide__wind small{font-size:8px;opacity:.7}
#windDirection{direction:rtl;font-size:9px;margin-left:auto}
#weatherMeta{display:block;font-size:8px;color:#99bfc6;margin-top:4px}
.lens-navigation>.camera-guide__route-card{grid-template-columns:142px minmax(0,1fr);padding:9px;gap:12px;min-height:150px;max-height:none;border-radius:24px;background:#102630e8;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);overflow:visible;border-color:#a0e8e52e;bottom:calc(10px + var(--safe-bottom))}
.lens-navigation>.camera-guide__route-card .camera-guide__radar{position:relative;width:142px;max-width:none;height:132px;border-radius:17px;overflow:hidden;background:#e3ebe7;box-shadow:0 0 0 1px #ffffff26;isolation:isolate}
.lens-navigation .camera-guide__mini-map{position:absolute;inset:0;width:100%;height:100%;border-radius:0;filter:none}
.lens-navigation .camera-guide__radar .camera-guide__compass{display:none}
.lens-navigation .camera-guide__radar .camera-guide__compass--north{display:block;top:7px;right:7px;left:auto;bottom:auto;transform:none;font:800 9px/20px system-ui;color:#133240;background:#ffffffd9;width:20px;height:20px;text-align:center;border-radius:6px;z-index:2}
.lens-navigation .camera-guide__heading-needle{display:none}
.camera-guide__map-credit{position:absolute;bottom:1px;right:1px;left:auto;padding:0 3px;background:#ffffffe6;color:#26424a;font:7px/13px system-ui;text-decoration:none;direction:ltr;z-index:3;white-space:nowrap}
.camera-guide__map-expand{position:absolute;top:6px;left:6px;z-index:4;width:29px;height:29px;min-height:29px;border:1px solid #fff;border-radius:8px;background:#ffffffe3;color:#203a45;font:21px/1 system-ui;cursor:pointer;box-shadow:0 2px 6px #17323a20}
.camera-guide__map-state{position:absolute;top:42px;left:6px;right:6px;z-index:2;background:#13313bd9;color:#effffe;border-radius:8px;text-align:center;padding:5px 4px;font-size:9px;line-height:1.6;pointer-events:none}
.lens-navigation .camera-guide__route-copy{gap:4px;align-content:center;justify-content:center}
.lens-navigation .camera-guide__route-copy>small{font-size:10px;color:#aacbd1}
.lens-navigation .camera-guide__route-copy>strong{font-size:14px;line-height:1.7;color:#f1fffb}
.lens-navigation .camera-guide__route-copy>span{font-size:10px;color:#b1d4d7;line-height:1.7;display:block}
.lens-navigation .camera-guide__verify-button{min-height:30px;padding:4px 7px;font-size:10px;border-radius:10px;background:#ffffff09;border-color:#9ee6e52e;color:#d6eeef}
.lens-navigation .camera-guide__verify-button svg{width:14px;height:14px}
.lens-navigation>.camera-guide__route-card.lens-map-expanded{grid-template-columns:1fr;gap:9px;max-height:60dvh;padding:10px}
.lens-navigation>.camera-guide__route-card.lens-map-expanded .camera-guide__radar{width:100%;height:220px}
.lens-navigation .lens-map-expanded .camera-guide__route-copy{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:7px}
.lens-navigation .lens-map-expanded .camera-guide__route-copy>small,.lens-navigation .lens-map-expanded .camera-guide__route-copy>span{display:none}
.lens-navigation .lens-map-expanded .camera-guide__route-copy>strong{flex:1;min-width:40%}
.lens-navigation .lens-settings{background:#102630f5;border-color:#a0e8e52e;color:#e1f2f0}
.lens-navigation .lens-settings input{accent-color:#74e3d7}
.lens-navigation.lens-focus .camera-guide__weather{opacity:.65}
@media(max-width:360px){.lens-navigation>.camera-guide__route-card{grid-template-columns:118px minmax(0,1fr);gap:9px}.lens-navigation>.camera-guide__route-card .camera-guide__radar{width:118px;height:126px}.lens-navigation .camera-guide__route-copy>strong{font-size:12px}.lens-navigation .camera-guide__route-copy>span{font-size:9px}.lens-navigation .camera-guide__weather{width:123px;padding:8px}.lens-navigation .lens-instruction{max-width:calc(100% - 148px);padding:9px}.lens-navigation .lens-instruction strong{font-size:13px}.lens-navigation .lens-instruction__icon{display:none}.lens-surface-switch button{min-width:54px;padding-inline:8px}}
@media(max-height:700px) and (orientation:portrait){.lens-navigation .lens-instruction,.lens-navigation .camera-guide__weather{top:calc(149px + var(--safe-top))}.lens-navigation>.camera-guide__route-card{min-height:137px}.lens-navigation>.camera-guide__route-card .camera-guide__radar{height:119px}.lens-navigation .camera-guide__route-copy>span{display:none}}
@media(orientation:landscape) and (max-height:600px){.lens-navigation>.camera-guide__header{width:270px;left:auto;right:10px;top:8px}.lens-navigation>.camera-guide__modes{top:8px;left:10px;right:auto}.lens-navigation:has(.camera-guide__modes)>.camera-guide__status{top:49px;left:10px;right:auto;max-width:310px}.lens-navigation .camera-guide__weather{top:83px;left:10px;width:135px}.lens-navigation .lens-instruction{top:73px;right:10px;left:auto;max-width:265px}.lens-navigation>.camera-guide__route-card{right:10px;left:auto;width:310px;grid-template-columns:124px minmax(0,1fr);min-height:136px;bottom:8px;padding:8px;gap:9px}.lens-navigation>.camera-guide__route-card .camera-guide__radar{width:124px;height:118px}.lens-navigation .lens-controls{left:10px;bottom:10px!important}.lens-navigation .lens-surface-switch{right:auto;left:200px;bottom:10px}.lens-navigation .lens-tracking{left:10px;right:auto;bottom:65px;max-width:320px}.lens-navigation>.camera-guide__route-card.lens-map-expanded{width:340px;max-height:calc(100dvh - 70px)}.lens-navigation>.camera-guide__route-card.lens-map-expanded .camera-guide__radar{height:180px}}
.lens-navigation .camera-guide__map-expand,.lens-navigation .camera-guide__map-credit{pointer-events:auto}
.lens-navigation .lens-beacon>b{background:#103d47e8;color:#c9fff4;border-color:#94f2e9a6;box-shadow:0 6px 18px #072a3140}
.lens-navigation .lens-beacon>i{background:linear-gradient(#b7fff5bb,#73e9df55);box-shadow:none}
.lens-navigation .lens-beacon__label{color:#ddfff8;font-size:10px;text-shadow:0 2px 7px #092329}
.lens-navigation .lens-beacon::after{background:#9dfff13b;border-color:#baffed99;box-shadow:0 2px 9px #072a3140}
.lens-navigation>.camera-guide__route-card .camera-guide__radar{pointer-events:auto}

.lens-navigation .lens-map-expanded .camera-guide__route-copy{flex-direction:row}
@media(orientation:landscape) and (max-height:600px) and (max-width:700px){.lens-navigation .lens-controls .lens-bearing{display:none}.lens-navigation .lens-surface-switch{left:120px}.lens-navigation>.camera-guide__route-card{width:44vw;grid-template-columns:104px minmax(0,1fr);gap:7px}.lens-navigation>.camera-guide__route-card .camera-guide__radar{width:104px}.lens-navigation .camera-guide__route-copy>strong{font-size:11px}.lens-navigation .camera-guide__route-copy>span{display:none}.lens-navigation .camera-guide__verify-button{font-size:9px;padding:3px 5px}}

.lens-navigation .camera-guide__permission{background:linear-gradient(145deg,#193b47fa,#0a202afa);border-color:#b1ece54d;color:#e7f9f8}
.lens-navigation .camera-guide__permission h1{color:#e5fff8}
.lens-navigation .camera-guide__permission p{color:#bad5d9}
.lens-navigation .camera-guide__permission .camera-guide__primary-button{background:linear-gradient(#c4fff2,#83e4d6);color:#103936}
.lens-navigation #windSpeed{font-size:11px;font-weight:700}