/* Smoked discs match Bilbo: neutral tint, a fine upper rim, soft depth. */
.glass-section{position:relative;isolation:isolate}
.bilbo-glass-field{position:absolute;inset:0;z-index:-1;overflow:clip;pointer-events:none}
.bilbo-bubble{position:absolute;display:block;width:var(--bubble-size,260px);aspect-ratio:1;border-radius:50%;left:var(--bubble-x,85%);top:var(--bubble-y,15%);opacity:var(--bubble-opacity,.9);transform:translate3d(calc(var(--bubble-drift,0px) + var(--bubble-push-x,0px)),calc(var(--bubble-rise,0px) + var(--bubble-push-y,0px)),0);background:radial-gradient(ellipse at 50% 18%,#45545330 8%,#45545325 24%,#2e38371a 52%,#171c1c0a 75%,#00000004),#ffffff0d;box-shadow:0 24px 65px -25px #00000029;pointer-events:none}
.bilbo-bubble::before{content:'';position:absolute;inset:0;border-radius:inherit;padding:1px;background:linear-gradient(158deg,#b4b9b9b3 0%,#a0a6a65c 19%,#ffffff0d 42%,transparent 65%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
.bilbo-bubble::after{content:'';position:absolute;inset:0;border-radius:inherit;background:radial-gradient(ellipse at 45% 7%,#e1e9e915,transparent 55%)}
.intro .bilbo-bubble:first-child{--bubble-x:80%;--bubble-y:-17%;--bubble-size:330px}
.intro .bilbo-bubble:last-child{--bubble-x:-7%;--bubble-y:72%;--bubble-size:170px;--bubble-opacity:.7}
.night .bilbo-glass-field .bilbo-bubble:first-child{--bubble-x:83%;--bubble-y:8%;--bubble-size:360px}
.night .bilbo-glass-field .bilbo-bubble:last-child{--bubble-x:51%;--bubble-y:65%;--bubble-size:125px}
.voice .bilbo-glass-field .bilbo-bubble:first-child{--bubble-x:78%;--bubble-y:1%;--bubble-size:280px}
.voice .bilbo-glass-field .bilbo-bubble:last-child{--bubble-x:-9%;--bubble-y:52%;--bubble-size:290px;--bubble-opacity:.65}
.prototype .bilbo-bubble:first-child{--bubble-x:-8%;--bubble-y:4%;--bubble-size:300px}
.prototype .bilbo-bubble:last-child{--bubble-x:83%;--bubble-y:72%;--bubble-size:190px}
.study-backdrop .bilbo-bubble{--bubble-x:87%;--bubble-y:18%;--bubble-size:280px;--bubble-opacity:.75}
/* Foreground lenses sample actual backdrop pixels, without image clones. */
.bilbo-bubble.bilbo-bubble-front{left:var(--bubble-safe-left,80%);z-index:4;opacity:1;overflow:hidden;isolation:auto;backface-visibility:hidden;background:radial-gradient(ellipse at 50% 12%,#4554531c,#2e38370d 55%,#171c1c05 78%),#ffffff05;box-shadow:inset 0 1px 1px #ffffff0d,0 12px 26px -14px #00000045;-webkit-backdrop-filter:blur(1px) saturate(1.05);backdrop-filter:blur(1px) saturate(1.05)}
.has-bilbo-refraction .bilbo-bubble-front.glass-visible{-webkit-backdrop-filter:url('#bilbo-glass-refraction') saturate(1.05);backdrop-filter:url('#bilbo-glass-refraction') saturate(1.05)}
.bilbo-bubble-front::before{background:linear-gradient(155deg,#d7dfdfb8,#e4eded5c 22%,#ffffff12 45%,transparent 60%,#ffffff16 94%)}
.bilbo-bubble-front::after{background:radial-gradient(ellipse at 50% 4%,#eff9f61c,transparent 50%);box-shadow:inset 2px 4px 14px -8px #ffffff40,inset -2px -3px 8px -6px #ffffff25}
.night-visual>.bilbo-bubble-front{--bubble-x:48%;--bubble-y:19%;--bubble-size:128px}
.voice-device-stack{position:relative}
.voice-device-stack>.bilbo-bubble-front{--bubble-x:61%;--bubble-y:45%;--bubble-size:96px}
.ob-route-lens{--bubble-x:55%;--bubble-y:18%;--bubble-size:120px}
@media(max-width:1100px){.night-visual>.bilbo-bubble-front{--bubble-x:48%;--bubble-y:19%;--bubble-size:120px}.voice-device-stack>.bilbo-bubble-front{--bubble-size:90px}}
@media(max-width:799px){
 .bilbo-bubble{width:calc(var(--bubble-size,260px) * .63);opacity:calc(var(--bubble-opacity,.9) * .9)}
 .intro .bilbo-bubble:first-child{--bubble-x:78%;--bubble-y:4%}
 .night .bilbo-glass-field .bilbo-bubble:first-child{--bubble-x:74%;--bubble-y:38%}.night .bilbo-glass-field .bilbo-bubble:last-child{--bubble-x:-10%;--bubble-y:81%}
 .voice .bilbo-glass-field .bilbo-bubble:first-child{--bubble-x:83%;--bubble-y:0%}.prototype .bilbo-bubble:last-child{--bubble-x:81%}.study-backdrop .bilbo-bubble{--bubble-x:78%;--bubble-y:45%}
 .bilbo-bubble.bilbo-bubble-front{width:var(--bubble-size);opacity:1}
 .night-visual>.bilbo-bubble-front{--bubble-x:47%;--bubble-y:20%;--bubble-size:86px}
 .voice-device-stack>.bilbo-bubble-front{--bubble-x:62%;--bubble-y:48%;--bubble-size:76px}
 .ob-route-lens{--bubble-x:52%;--bubble-y:16%;--bubble-size:86px}
}
@media(max-width:360px){.ob-route-lens,.night-visual>.bilbo-bubble-front{--bubble-size:76px}.voice-device-stack>.bilbo-bubble-front{--bubble-size:68px}}
@media(prefers-reduced-motion:reduce){.bilbo-bubble{transform:none}}
/* Travel lens sits in the scene foreground, above both the route and the plane. */
.ob-scene[data-ob-theme="travel"]>.ob-backdrop{z-index:0}
.ob-scene>.ob-route-lens{z-index:4;top:var(--bubble-safe-top,30%)}
