.lockr-scene{--lockr-w:280px;display:inline-block;position:relative}.lockr-scene .lockr{width:var(--lockr-w);height:var(--lockr-w);z-index:2;transform-origin:50% 70%;display:block;position:relative}@keyframes lockr-breathe{0%,to{transform:translateY(0)}50%{transform:translateY(-4px)}}@keyframes lockr-peek{0%,70%,to{transform:rotate(0)translate(0)}78%{transform:rotate(-6deg)translate(-4px)}86%{transform:rotate(0)translate(0)}}.lockr-idle .lockr{animation:4.2s ease-in-out infinite lockr-breathe,9s ease-in-out infinite lockr-peek}.scene-hero{--lockr-w:260px;width:calc(var(--lockr-w)*1.6);height:420px;position:relative}.scene-hero .lockr-clip{z-index:2;position:absolute;top:0;left:50%;transform:translate(-50%)}.scene-hero .laptop{width:calc(var(--lockr-w)*1.5);z-index:3;position:absolute;bottom:8px;left:50%;transform:translate(-50%)}.scene-hero .laptop-screen{background:var(--bg-1);border:1px solid var(--border-2);font-family:var(--font-mono);color:var(--fg-2);border-radius:8px 8px 2px 2px;height:92px;padding:10px 12px 12px;font-size:10px;line-height:1.6;overflow:hidden}.scene-hero .laptop-base{background:linear-gradient(#2a2a2a,#0f0f0f);border-radius:0 0 14px 14px;width:108%;height:6px;margin-left:-4%;box-shadow:0 4px 20px #00000080}[data-theme=light] .scene-hero .laptop-base{background:linear-gradient(#d4d4d4,#b4b4b4);box-shadow:0 4px 20px #0000002e}.scene-hero .code-line{opacity:0;white-space:nowrap;animation:.4s forwards codetype;display:block;overflow:hidden}.scene-hero .code-line.c1{color:var(--brand-orange);animation-delay:.2s}.scene-hero .code-line.c2{animation-delay:1.2s}.scene-hero .code-line.c3{color:var(--success);animation-delay:2.2s}.scene-hero .code-line.c4{color:var(--brand-orange);animation-delay:3.4s}.scene-hero .code-line.c5{animation-delay:4.4s}@keyframes codetype{0%{opacity:0;max-width:0}to{opacity:1;max-width:100%}}.scene-hero .caret{background:var(--brand-orange);vertical-align:middle;width:6px;height:11px;margin-left:2px;animation:1s steps(2,end) infinite caret-blink;display:inline-block}@keyframes caret-blink{50%{opacity:0}}.scene-hero .ping{z-index:4;background:var(--bg-2);border:1px solid var(--border-2);color:var(--fg-1);white-space:nowrap;border-radius:6px;align-items:center;gap:6px;padding:6px 10px;font-size:10px;display:flex;position:absolute;box-shadow:0 4px 18px #00000080}[data-theme=light] .scene-hero .ping{box-shadow:0 4px 18px #0000001a}.scene-hero .ping:before{content:"";background:var(--brand-orange);border-radius:50%;width:5px;height:5px;animation:1.6s ease-in-out infinite ll-live-pulse}.scene-hero .ping.p1{animation:6s ease-in-out infinite ping-float;top:12%;right:-22%}.scene-hero .ping.p2{animation:6s ease-in-out 1.5s infinite ping-float;top:38%;left:-28%}.scene-hero .ping.p3{animation:6s ease-in-out 3s infinite ping-float;top:64%;right:-18%}@keyframes ping-float{0%,to{opacity:1;transform:translateY(0)}50%{opacity:.95;transform:translateY(-8px)}}.ll-hero-grid{pointer-events:none;background-image:linear-gradient(#ffffff06 1px,#0000 1px),linear-gradient(90deg,#ffffff06 1px,#0000 1px);background-size:64px 64px;position:absolute;inset:0;-webkit-mask-image:radial-gradient(70% 60% at 50% 30%,#000 30%,#0000 80%);mask-image:radial-gradient(70% 60% at 50% 30%,#000 30%,#0000 80%)}[data-theme=light] .ll-hero-grid{background-image:linear-gradient(#00000008 1px,#0000 1px),linear-gradient(90deg,#00000008 1px,#0000 1px)}@keyframes wave-arm{0%,to{transform:rotate(-3deg)}50%{transform:rotate(8deg)}}.ll-mascot-wave{transform-origin:50% 80%;animation:2.4s ease-in-out infinite wave-arm}@keyframes ll-dashflow{to{stroke-dashoffset:-120px}}
