.stage{height:480px;position:relative;perspective:1100px;--accent:#d1a187;--accent-rgb:209,161,135;--duration:18s;overflow:hidden}.scene{width:270px;height:215px;position:absolute;left:50%;top:50%;margin-left:-135px;margin-top:-107px;transform-style:preserve-3d;animation:turn var(--duration) cubic-bezier(.45,0,.2,1) infinite}.sheet{position:absolute;inset:0;border:1px solid #bdb9b1;border-radius:7px;background:rgba(38,41,42,.92);transform-style:preserve-3d;backface-visibility:visible;box-shadow:0 0 0 1px rgba(0,0,0,.12);overflow:hidden}.top{animation:lift-top var(--duration) cubic-bezier(.45,0,.2,1) infinite}.middle{animation:lift-middle var(--duration) cubic-bezier(.45,0,.2,1) infinite}.bottom{animation:lift-bottom var(--duration) cubic-bezier(.45,0,.2,1) infinite}.toolbar{height:33px;border-bottom:1px solid #777a70;display:flex;gap:8px;align-items:center;padding:0 16px}.toolbar i{display:block;width:6px;height:2px;background:#bdb9b1}.lines{padding:23px 23px;display:grid;gap:15px}.line{height:1px;background:#bdb9b1;opacity:.75}.line:nth-child(1){width:61%}.line:nth-child(2){width:96%}.line:nth-child(3){width:83%}.line:nth-child(4){width:55%}.line:nth-child(5){width:78%}.line:nth-child(6){width:91%}.beam{position:absolute;inset:0;transform:translateY(-84%);animation:scan 4.6s cubic-bezier(.45,0,.55,1) infinite;pointer-events:none}.beam:before{content:"";position:absolute;left:0;right:0;top:50%;height:42px;transform:translateY(-50%);background:linear-gradient(transparent,rgba(var(--accent-rgb),.13),transparent)}.beam:after{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:var(--accent);box-shadow:0 0 12px rgba(var(--accent-rgb),.6)}.middle .beam{animation-delay:-1.3s}.bottom .beam{animation-delay:-2.6s}.surface{position:absolute;inset:33px 0 0;opacity:.22;background:repeating-linear-gradient(90deg,transparent 0 26px,rgba(var(--accent-rgb),.25) 26px 27px),repeating-linear-gradient(0deg,transparent 0 26px,rgba(var(--accent-rgb),.25) 26px 27px)}.ghosts{position:absolute;inset:45px 24px 24px;display:flex;justify-content:space-between;color:var(--accent);font:10px/1.65 monospace;opacity:.25}.ghosts span{writing-mode:vertical-rl;letter-spacing:6px;animation:code 7s linear infinite}.ghosts span:nth-child(2n){animation-direction:reverse;animation-delay:-2s}.floor{position:absolute;left:15%;right:15%;bottom:15%;height:40px;background:radial-gradient(ellipse,rgba(0,0,0,.28),transparent 70%);filter:blur(8px);transform:scaleX(.9);animation:shadow var(--duration) ease-in-out infinite}.corner{position:absolute;width:15px;height:15px;border-color:var(--accent);opacity:.55}.corner.a{left:40px;top:55px;border-left:1px solid;border-top:1px solid}.corner.b{right:40px;bottom:55px;border-right:1px solid;border-bottom:1px solid}.matrix{--accent:#82d8b0;--accent-rgb:130,216,176;background:radial-gradient(ellipse at 50% 50%,#293b34,transparent 68%)}.matrix .sheet{background:rgba(21,38,31,.7);border-color:#79998a}.matrix .top{box-shadow:0 0 24px rgba(80,190,130,.06)}.matrix .beam:after{height:2px;box-shadow:0 0 5px var(--accent),0 0 28px rgba(var(--accent-rgb),.45)}.xray{--accent:#bbd3bf;--accent-rgb:187,211,191;--duration:20s}.xray .sheet{border-radius:0;background:rgba(32,35,36,.75);border-color:#b8c0b9}.xray .beam:before{height:18px}.xray .line{opacity:.4}.copper{--duration:22s;background:radial-gradient(ellipse at 50% 50%,rgba(209,161,135,.06),transparent 70%)}.copper .sheet{border-color:#a78c7c;background:rgba(38,41,42,.92)}.copper .beam:before{height:95px;background:linear-gradient(transparent,rgba(var(--accent-rgb),.20),transparent)}.copper .beam:after{box-shadow:0 0 10px var(--accent),0 0 30px rgba(var(--accent-rgb),.5)}.deep{--accent:#8bc7c7;--accent-rgb:139,199,199;--duration:20s;background:radial-gradient(ellipse at 50% 50%,#2a3c3c,transparent 72%)}.deep .sheet{background:rgba(25,39,39,.65);border-color:#789d9d}.deep .scene{width:255px;height:215px;margin-left:-127px}.deep .beam:before{height:65px}.deep .surface{opacity:.34}.particles{position:absolute;inset:60px 65px;background-image:radial-gradient(rgba(var(--accent-rgb),.6) .7px,transparent .7px);background-size:37px 41px;opacity:.2;mask-image:radial-gradient(ellipse,#000,transparent 65%);animation:particles 14s linear infinite}@keyframes turn{0%,28%{transform:translateY(0) rotateX(0) rotateY(0) rotateZ(0)}42%,78%{transform:translateY(16px) rotateX(58deg) rotateY(0) rotateZ(-35deg)}94%,100%{transform:translateY(0) rotateX(0) rotateY(0) rotateZ(0)}}@keyframes lift-top{0%,32%{transform:translateZ(0)}48%,76%{transform:translateZ(77px)}92%,100%{transform:translateZ(0)}}@keyframes lift-middle{0%,32%{transform:translateZ(-2px);opacity:0}42%{opacity:1}48%,76%{transform:translateZ(0);opacity:1}90%,100%{transform:translateZ(-2px);opacity:0}}@keyframes lift-bottom{0%,32%{transform:translateZ(-3px);opacity:0}42%{opacity:1}48%,76%{transform:translateZ(-77px);opacity:1}90%,100%{transform:translateZ(-3px);opacity:0}}@keyframes scan{0%,100%{transform:translateY(-40%)}50%{transform:translateY(40%)}}@keyframes code{0%{transform:translateY(-15px);opacity:.15}50%{opacity:.5}100%{transform:translateY(15px);opacity:.15}}@keyframes shadow{0%,28%,94%,100%{transform:scaleX(.85);opacity:.5}48%,76%{transform:scaleX(1.25);opacity:.9}}@keyframes particles{to{background-position:37px 82px}}.hero>.stage{width:100%;height:360px;min-width:0;align-self:center}.motion-toggle{position:absolute;bottom:3px;right:8px;padding:5px 10px;border:1px solid #686a63;background:#26292a;color:#bdb9b1;font:12px/1.5 'DM Sans',sans-serif;z-index:4}.stage.motion-paused *,.stage.motion-offscreen *{animation-play-state:paused!important}@media(max-width:800px){.hero>.stage{height:330px}}@media(prefers-reduced-motion:reduce){.stage *{animation:none!important}.stage .scene{transform:translateY(16px) rotateX(58deg) rotateZ(-35deg)}.stage .top{transform:translateZ(77px)}.stage .middle{opacity:1;transform:translateZ(0)}.stage .bottom{opacity:1;transform:translateZ(-77px)}.stage .motion-toggle{display:none}}