/* Homepage-only instrument. The live terminal remains a separate page. */
.depth-lens .mascot-path{position:absolute;width:40%;left:30%;bottom:88px;pointer-events:none;animation:mascot-patrol 12s linear infinite}
.depth-lens .mascot-path .lens-mascot{position:relative;display:block;width:100%;height:auto;left:auto;bottom:auto;transform-origin:50% 90%;animation:mascot-gait .6s ease-in-out infinite,mascot-turn 12s steps(1,end) infinite}
@keyframes mascot-patrol{0%,100%{transform:translateX(0)}25%{transform:translateX(55%)}75%{transform:translateX(-55%)}}
@keyframes mascot-gait{0%,50%,100%{transform:translateY(0) rotate(0deg)}25%{transform:translateY(0) rotate(-1deg)}75%{transform:translateY(0) rotate(1deg)}}
@keyframes mascot-turn{0%{scale:1 1}25%{scale:-1 1}75%,100%{scale:1 1}}
@media(max-width:480px){.depth-lens .mascot-path{bottom:65px}}
.hero:has(.depth-lens){grid-template-columns:1fr 1.06fr;gap:48px;padding-top:52px;padding-bottom:48px;align-items:center}.depth-lens{position:relative;min-width:0;border:1px solid #36574a;background:#0a1515;border-radius:12px;box-shadow:0 25px 65px #0003;overflow:hidden}.lens-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 18px;border-bottom:1px solid var(--line);font:11px Mono;color:var(--green)}.lens-bar span{display:flex;align-items:center;gap:9px}.lens-bar i{width:6px;height:6px;background:var(--green);border-radius:50%}.lens-pause{padding:5px 8px;font:10px Mono;background:transparent;color:#b7cbc2;border-color:#36574a;min-height:30px}.lens-scene{height:330px;position:relative;background:radial-gradient(ellipse at 52% 55%,#19402b66,transparent 68%);overflow:hidden}.lens-coordinate,.lens-concept{position:absolute;top:18px;font:9px Mono;color:#b0c6bb}.lens-coordinate{left:18px}.lens-concept{right:18px}.depth-map{position:absolute;width:100%;height:100%;bottom:-2px}.layer{transition:opacity .45s ease,filter .45s ease;opacity:.65}.layer-observe{opacity:1}.depth-lens[data-step=model] .layer-model,.depth-lens[data-step=explain] .layer-output{opacity:1;filter:drop-shadow(0 0 7px #8bf7a359)}.depth-lens[data-step=model] .layer-observe,.depth-lens[data-step=explain] .layer-observe{opacity:.35}.lens-mascot{position:absolute;width:40%;height:auto;left:30%;bottom:88px;filter:drop-shadow(0 12px 12px #0007);pointer-events:none;animation:lens-hover 7s ease-in-out infinite}.lens-caption{position:absolute;bottom:20px;left:18px;font:9px Mono;letter-spacing:.06em;color:#b0c6bb}.lens-scan{animation:lens-scan 5s ease-in-out infinite;transform-box:fill-box;transform-origin:center}.signal{animation:lens-signal 4.5s ease-in-out infinite}.signal-b{animation-delay:-1.5s}.signal-c{animation-delay:-3s}.lens-controls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:0 18px;border:1px solid #36574a;border-radius:5px;overflow:hidden}.lens-controls button{border:0;border-radius:0;background:transparent;font:12px Mono;min-height:48px;padding:11px 6px}.lens-controls button+button{border-left:1px solid #36574a}.lens-controls small{font:10px Mono;display:inline-block;margin-right:7px;color:#b0c6bb}.lens-controls button[aria-pressed=true]{background:#8bf7a3;color:#0a1910}.lens-controls button[aria-pressed=true] small{color:#1d492b}.lens-controls button:hover:not([aria-pressed=true]){background:#163023}.lens-controls button:focus-visible{outline-offset:-4px}.lens-explanation{padding:21px 21px 16px;min-height:180px}.lens-tool{font:10px Mono;color:var(--green);margin:0 0 10px;overflow-wrap:anywhere}.lens-explanation h3{font-size:21px;letter-spacing:-.025em;margin:0 0 9px;line-height:1.2}.lens-detail{font-size:12px;line-height:1.7;color:#b0c6bb;margin:0;max-width:58ch}.lens-footer{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:13px 18px;border-top:1px solid var(--line)}.lens-footer span{font:8px/1.6 Mono;color:#a0b5b0;max-width:140px}.lens-footer a{font:11px Mono;color:var(--green)}.depth-lens[data-paused=true] *,.depth-lens[data-offscreen=true] *{animation-play-state:paused!important}@keyframes lens-hover{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}@keyframes lens-scan{0%,100%{transform:translate(-30px,15px);opacity:.3}50%{transform:translate(90px,-45px);opacity:.85}}@keyframes lens-signal{0%,100%{opacity:.35}40%{opacity:1}}@media(min-width:1450px){.hero:has(.depth-lens){padding-block:64px}}@media(max-width:900px){.hero:has(.depth-lens){grid-template-columns:1fr;gap:34px}.depth-lens{width:min(100%,620px);justify-self:center}.hero-copy{max-width:680px}.hero:has(.depth-lens) h1{max-width:660px}}@media(max-width:480px){.hero:has(.depth-lens){padding-top:35px}.lens-scene{height:265px}.lens-mascot{bottom:65px}.lens-coordinate,.lens-concept{font-size:7px;top:13px}.lens-coordinate{left:12px}.lens-concept{right:12px}.lens-controls{margin-inline:12px}.lens-controls button{font-size:10px;min-height:48px}.lens-controls small{margin-right:3px;font-size:9px}.lens-explanation{padding:19px 16px;min-height:200px}.lens-explanation h3{font-size:20px}.lens-footer{padding-inline:12px}.lens-footer a{font-size:10px}.lens-caption{font-size:8px;bottom:12px}}@media(prefers-reduced-motion:reduce){.depth-lens *{animation:none!important;transition:none!important}}