/* Bühne „blick“: V1-Animation (appfrags/blick.css), umgestellt auf V2 mit werkzeuge/v2-generator/buehnen-umstellen.mjs.
   Nicht von Hand ändern, sondern das Skript anpassen und neu laufen lassen. Farben und Rahmen: website.css (.v1-buehne). */
.ap-blick-stage{position:relative;width:100%;height:340px;overflow:hidden;display:flex;align-items:center;justify-content:center;perspective:1100px}
.ap-blick-world{position:relative;transform-style:preserve-3d}
.ap-blick-scene{position:relative;width:300px;height:262px;transform-style:preserve-3d;transform:rotateX(9deg) rotateY(-15deg);animation:ap-blick-sway 42s var(--ease,ease-in-out) infinite}
@keyframes ap-blick-sway{0%,100%{transform:rotateX(9deg) rotateY(-15deg)}50%{transform:rotateX(12.5deg) rotateY(2deg)}}
.ap-blick-aura{position:absolute;left:44%;top:44%;width:340px;height:340px;transform:translate(-50%,-50%) translateZ(-160px);border-radius:50%;filter:blur(12px);background:radial-gradient(circle,color-mix(in srgb,var(--accent) 36%,transparent),color-mix(in srgb,var(--accent) 12%,transparent) 44%,transparent 70%);animation:ap-blick-breathe 18s ease-in-out infinite}
.ap-blick-aura--cool{left:66%;top:60%;width:230px;height:230px;background:radial-gradient(circle,color-mix(in srgb,var(--accent2) 28%,transparent),transparent 66%);animation-duration:22.5s;animation-direction:reverse}
@keyframes ap-blick-breathe{0%,100%{opacity:.7;transform:translate(-50%,-50%) translateZ(-160px) scale(1)}50%{opacity:1;transform:translate(-50%,-50%) translateZ(-160px) scale(1.1)}}
.ap-blick-deck{position:absolute;left:50%;top:50%;width:0;height:0;transform-style:preserve-3d}
.ap-blick-panel{position:absolute;left:0;top:0;width:var(--w,230px);aspect-ratio:16/10;transform-style:preserve-3d;transform:translate(-50%,-50%) translate3d(var(--x,0),var(--y,0),var(--z,0)) rotateY(var(--ry,0)) rotateX(var(--rx,0));border-radius:16px;padding:14px;box-sizing:border-box;background:linear-gradient(150deg,color-mix(in srgb,var(--accent) 16%,transparent),transparent 52%),linear-gradient(320deg,color-mix(in srgb,var(--accent2) 13%,transparent),transparent 58%),var(--glass);backdrop-filter:blur(8px) saturate(140%);-webkit-backdrop-filter:blur(8px) saturate(140%);box-shadow:0 34px 66px -30px rgba(4,6,16,.6),inset 0 1px 0 var(--glasshi)}
.ap-blick-panel--front{--x:8px;--y:26px;--z:64px;--w:230px;z-index:3}
.ap-blick-panel--mid{--x:-108px;--y:-34px;--z:-24px;--w:150px;--ry:20deg;--rx:2deg;opacity:.94}
.ap-blick-panel--back{--x:120px;--y:-58px;--z:-100px;--w:130px;--ry:-17deg;--rx:-3deg;opacity:.8;filter:blur(.4px)}
.ap-blick-edge{position:absolute;inset:0;border-radius:16px;pointer-events:none;border:1px solid color-mix(in srgb,var(--accent) 20%,var(--glassbrd));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent2) 12%,transparent),inset 0 0 22px color-mix(in srgb,var(--accent) 10%,transparent)}
.ap-blick-rows{display:flex;flex-direction:column;gap:8px}
.ap-blick-rows span{height:6px;border-radius:4px;background:color-mix(in srgb,var(--ink) 20%,transparent)}
.ap-blick-rows span:nth-child(1){width:72%}
.ap-blick-rows span:nth-child(2){width:52%;opacity:.7}
.ap-blick-rows span:nth-child(3){width:38%;height:16px;margin-top:6px;border-radius:6px;border:1px solid color-mix(in srgb,var(--accent) 34%,var(--glassbrd));background:color-mix(in srgb,var(--accent) 12%,transparent)}
.ap-blick-grid{position:absolute;inset:0;opacity:.5;background-image:linear-gradient(color-mix(in srgb,var(--accent) 16%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--accent2) 14%,transparent) 1px,transparent 1px);background-size:22px 22px;-webkit-mask-image:radial-gradient(circle at 50% 46%,#000 58%,transparent 100%);mask-image:radial-gradient(circle at 50% 46%,#000 58%,transparent 100%)}
.ap-blick-sheen{position:absolute;top:-40%;left:-60%;width:55%;height:180%;pointer-events:none;border-radius:16px;overflow:hidden;background:linear-gradient(90deg,transparent,color-mix(in srgb,#fff 33%,transparent),transparent);transform:rotate(16deg) translateX(0);animation:ap-blick-sheen 15s ease-in-out infinite}
.ap-blick-panel--mid .ap-blick-sheen{animation-delay:2.7s}
.ap-blick-panel--back .ap-blick-sheen{animation-delay:5.1s}
@keyframes ap-blick-sheen{0%,66%{transform:rotate(16deg) translateX(0);opacity:0}70%{opacity:.85}86%{opacity:.85}100%{transform:rotate(16deg) translateX(360%);opacity:0}}
.ap-blick-el{position:absolute;border-radius:8px;opacity:.3;border:1px solid color-mix(in srgb,var(--accent) 40%,var(--glassbrd));background:color-mix(in srgb,var(--accent) 13%,transparent)}
.ap-blick-el::after{content:"";position:absolute;inset:-1px;border-radius:8px;pointer-events:none;box-shadow:0 2px 13px color-mix(in srgb,var(--accent) 62%,transparent),0 0 22px color-mix(in srgb,var(--accent2) 26%,transparent);opacity:0}
.ap-blick-el--1{top:16%;left:10%;width:40%;height:20%;animation:ap-blick-lit 18s ease-in-out 0s infinite}
.ap-blick-el--2{top:44%;left:50%;width:36%;height:20%;animation:ap-blick-lit 18s ease-in-out 5.4s infinite}
.ap-blick-el--3{top:70%;left:12%;width:38%;height:18%;animation:ap-blick-lit 18s ease-in-out 10.8s infinite}
.ap-blick-el--1::after{animation:ap-blick-litglow 18s ease-in-out 0s infinite}
.ap-blick-el--2::after{animation:ap-blick-litglow 18s ease-in-out 5.4s infinite}
.ap-blick-el--3::after{animation:ap-blick-litglow 18s ease-in-out 10.8s infinite}
@keyframes ap-blick-lit{0%{opacity:.3;transform:scale(1)}3%,21%{opacity:1;transform:scale(1.05)}27%,100%{opacity:.3;transform:scale(1)}}
@keyframes ap-blick-litglow{0%{opacity:0}3%,21%{opacity:1}27%,100%{opacity:0}}
.ap-blick-scan{position:absolute;left:0;top:0;width:250px;height:46px;transform:translate(-50%,-50%) translate(8px,0) translateZ(66px);pointer-events:none;background:linear-gradient(to bottom,transparent,color-mix(in srgb,var(--accent) 22%,transparent) 78%,transparent);border-top:2px solid color-mix(in srgb,var(--accent2) 85%,#fff);filter:drop-shadow(0 0 12px color-mix(in srgb,var(--accent2) 55%,transparent));-webkit-mask-image:radial-gradient(120% 100% at 50% 50%,#000 56%,transparent 100%);mask-image:radial-gradient(120% 100% at 50% 50%,#000 56%,transparent 100%);animation:ap-blick-scan 9.75s ease-in-out infinite}
@keyframes ap-blick-scan{0%{transform:translate(-50%,-50%) translate(8px,-98px) translateZ(66px);opacity:0}14%{opacity:.95}86%{opacity:.95}100%{transform:translate(-50%,-50%) translate(8px,98px) translateZ(66px);opacity:0}}
.ap-blick-reticle{position:absolute;left:0;top:0;width:96px;height:40px;border-radius:9px;border:1.5px solid color-mix(in srgb,var(--accent) 82%,#fff);box-shadow:0 0 16px color-mix(in srgb,var(--accent) 48%,transparent),inset 0 0 12px color-mix(in srgb,var(--accent) 14%,transparent);animation:ap-blick-reticle 18s ease-in-out infinite}
.ap-blick-corner{position:absolute;width:11px;height:11px;border:2px solid color-mix(in srgb,var(--accent2) 60%,var(--accent))}
.ap-blick-corner--tl{top:-3px;left:-3px;border-right:0;border-bottom:0;border-radius:4px 0 0 0}
.ap-blick-corner--tr{top:-3px;right:-3px;border-left:0;border-bottom:0;border-radius:0 4px 0 0}
.ap-blick-corner--bl{bottom:-3px;left:-3px;border-right:0;border-top:0;border-radius:0 0 0 4px}
.ap-blick-corner--br{bottom:-3px;right:-3px;border-left:0;border-top:0;border-radius:0 0 4px 0}
.ap-blick-lock{position:absolute;inset:-3px;border-radius:11px;border:1.5px solid color-mix(in srgb,var(--accent2) 70%,transparent);opacity:0;animation:ap-blick-lock 18s ease-in-out infinite}
@keyframes ap-blick-lock{0%,26%{opacity:0;transform:scale(1.25)}31%{opacity:.9;transform:scale(1)}40%,100%{opacity:0;transform:scale(1)}}
.ap-blick-tick{position:absolute;left:50%;top:50%;width:5px;height:5px;border-radius:50%;transform:translate(-50%,-50%);background:color-mix(in srgb,var(--accent2) 90%,#fff);box-shadow:0 0 8px color-mix(in srgb,var(--accent2) 70%,transparent)}
@keyframes ap-blick-reticle{0%{transform:translate(-50%,-50%) translateZ(64px) translate(-38px,-10px) scale(1);opacity:1}24%{transform:translate(-50%,-50%) translateZ(64px) translate(-38px,-10px) scale(1)}30%{transform:translate(-50%,-50%) translateZ(64px) translate(49px,30px) scale(1.06)}34%{transform:translate(-50%,-50%) translateZ(64px) translate(49px,30px) scale(1)}55%{transform:translate(-50%,-50%) translateZ(64px) translate(49px,30px) scale(1)}60%{transform:translate(-50%,-50%) translateZ(64px) translate(-36px,66px) scale(1.06)}64%{transform:translate(-50%,-50%) translateZ(64px) translate(-36px,66px) scale(1)}88%{transform:translate(-50%,-50%) translateZ(64px) translate(-36px,66px) scale(1)}94%{transform:translate(-50%,-50%) translateZ(64px) translate(-38px,-10px) scale(1.04)}100%{transform:translate(-50%,-50%) translateZ(64px) translate(-38px,-10px) scale(1)}}
.ap-blick-lens{position:absolute;left:50%;top:50%;width:80px;height:80px;transform-style:preserve-3d;transform:translate(-50%,-50%) translate(92px,-80px) translateZ(158px);animation:ap-blick-hover 13.5s ease-in-out infinite}
@keyframes ap-blick-hover{0%,100%{transform:translate(-50%,-50%) translate(92px,-80px) translateZ(158px)}50%{transform:translate(-50%,-50%) translate(84px,-90px) translateZ(180px)}}
.ap-blick-beam{position:absolute;left:50%;top:64%;width:120px;height:200px;transform:translateX(-50%) rotate(200deg);transform-origin:50% 0;pointer-events:none;background:conic-gradient(from 180deg at 50% 0,transparent 168deg,color-mix(in srgb,var(--accent2) 20%,transparent) 180deg,transparent 192deg);-webkit-mask-image:linear-gradient(#000,transparent 78%);mask-image:linear-gradient(#000,transparent 78%);filter:blur(2px);opacity:.7;animation:ap-blick-beam 9.75s ease-in-out infinite}
@keyframes ap-blick-beam{0%,100%{opacity:.35}45%,55%{opacity:.8}}
.ap-blick-ring{position:absolute;inset:-9px;border-radius:50%;border:1px solid color-mix(in srgb,var(--accent2) 40%,transparent);box-shadow:0 0 18px color-mix(in srgb,var(--accent) 30%,transparent);animation:ap-blick-ringpulse 6.75s ease-in-out infinite}
@keyframes ap-blick-ringpulse{0%,100%{opacity:.5;transform:scale(1)}50%{opacity:.9;transform:scale(1.06)}}
.ap-blick-ticksdial{position:absolute;inset:-7px;border-radius:50%;background:conic-gradient(from 0deg,color-mix(in srgb,var(--accent2) 70%,transparent) 0 3deg,transparent 3deg 30deg);-webkit-mask:radial-gradient(circle,transparent 60%,#000 61%,#000 74%,transparent 75%);mask:radial-gradient(circle,transparent 60%,#000 61%,#000 74%,transparent 75%);opacity:.8;animation:ap-blick-spin 30s linear infinite}
@keyframes ap-blick-spin{to{transform:rotate(360deg)}}
.ap-blick-glass{position:absolute;inset:0;border-radius:50%;display:grid;place-items:center;overflow:hidden;background:radial-gradient(circle at 42% 34%,color-mix(in srgb,#fff 40.8%,transparent),color-mix(in srgb,var(--accent) 30%,transparent) 44%,color-mix(in srgb,var(--card) 62%,transparent) 74%);border:1px solid color-mix(in srgb,var(--accent2) 45%,var(--glassbrd));backdrop-filter:blur(3px) saturate(150%);-webkit-backdrop-filter:blur(3px) saturate(150%);box-shadow:0 20px 38px -14px rgba(4,6,16,.6),0 0 44px color-mix(in srgb,var(--accent) 36%,transparent),inset 0 1px 3px rgba(255,255,255,.3),inset 0 0 15px color-mix(in srgb,var(--accent2) 24%,transparent)}
.ap-blick-iris{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 44% 40%,color-mix(in srgb,var(--accent) 26%,transparent),color-mix(in srgb,var(--accent) 72%,transparent) 74%);box-shadow:inset 0 0 13px color-mix(in srgb,var(--accent) 56%,transparent)}
.ap-blick-pupil{width:18px;height:18px;border-radius:50%;background:radial-gradient(circle at 42% 36%,#fff,color-mix(in srgb,var(--accent2) 60%,#fff) 30%,var(--accent) 70%,color-mix(in srgb,var(--accent) 55%,#000));box-shadow:0 0 14px color-mix(in srgb,var(--accent2) 60%,transparent);animation:ap-blick-pulse 5.7s ease-in-out infinite}
@keyframes ap-blick-pulse{0%,100%{transform:scale(1);opacity:.9}50%{transform:scale(1.2);opacity:1}}
.ap-blick-cross{position:absolute;background:color-mix(in srgb,var(--accent2) 55%,transparent)}
.ap-blick-cross--h{left:12%;right:12%;height:1px;top:50%}
.ap-blick-cross--v{top:12%;bottom:12%;width:1px;left:50%}
.ap-blick-sweep{position:absolute;top:-30%;left:-40%;width:36%;height:160%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.33),transparent);transform:rotate(18deg);animation:ap-blick-lenssweep 10.5s ease-in-out infinite}
@keyframes ap-blick-lenssweep{0%,60%{transform:rotate(18deg) translateX(0);opacity:0}66%{opacity:.9}82%{opacity:.9}100%{transform:rotate(18deg) translateX(320%);opacity:0}}
.ap-blick-glint{position:absolute;top:13%;left:19%;width:28px;height:15px;border-radius:50%;background:linear-gradient(120deg,rgba(255,255,255,.54),transparent 70%);filter:blur(1px);transform:rotate(-24deg)}
.ap-blick-mote{position:absolute;left:50%;top:50%;width:6px;height:6px;border-radius:50%;filter:blur(.5px);background:radial-gradient(circle,color-mix(in srgb,var(--accent2) 90%,#fff),transparent 70%);--mt:translate(0,0);transform:var(--mt)}
.ap-blick-mote--1{--mt:translate(-142px,-40px) translateZ(96px);animation:ap-blick-drift 22.5s ease-in-out infinite}
.ap-blick-mote--2{width:4px;height:4px;background:radial-gradient(circle,color-mix(in srgb,var(--accent) 90%,#fff),transparent 70%);--mt:translate(132px,72px) translateZ(30px);animation:ap-blick-drift 28.5s ease-in-out -6s infinite}
.ap-blick-mote--3{width:5px;height:5px;--mt:translate(60px,-112px) translateZ(-40px);animation:ap-blick-drift 34.5s ease-in-out -13.5s infinite}
.ap-blick-mote--4{width:3px;height:3px;background:radial-gradient(circle,color-mix(in srgb,var(--accent) 90%,#fff),transparent 70%);--mt:translate(-96px,104px) translateZ(50px);animation:ap-blick-drift 25.5s ease-in-out -9s infinite}
@keyframes ap-blick-drift{0%,100%{opacity:.35;transform:var(--mt) translateY(0)}50%{opacity:.9;transform:var(--mt) translateY(-14px)}}
.ap-blick-floor{position:absolute;left:50%;top:88%;width:290px;height:78px;transform:translate(-50%,-50%) translateZ(-40px) rotateX(78deg);background:radial-gradient(closest-side,rgba(4,6,16,.32),transparent 72%);filter:blur(6px)}
.v1-buehne .ap-blick-aura{opacity:1}
.v1-buehne .ap-blick-panel{box-shadow:0 34px 66px -22px rgba(0,0,0,.74),inset 0 1px 0 var(--glasshi)}
.v1-buehne .ap-blick-edge{border-color:color-mix(in srgb,var(--accent) 32%,var(--glassbrd));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent2) 16%,transparent),inset 0 0 24px color-mix(in srgb,var(--accent) 16%,transparent)}
.v1-buehne .ap-blick-glass{box-shadow:0 20px 38px -12px rgba(0,0,0,.62),0 0 52px color-mix(in srgb,var(--accent) 48%,transparent),inset 0 1px 3px rgba(255,255,255,.204),inset 0 0 17px color-mix(in srgb,var(--accent2) 32%,transparent)}
.v1-buehne .ap-blick-floor{background:radial-gradient(closest-side,rgba(0,0,0,.55),transparent 72%)}
@media (prefers-reduced-motion:reduce){.ap-blick-scene,.ap-blick-aura,.ap-blick-sheen,.ap-blick-el,.ap-blick-el::after,.ap-blick-scan,.ap-blick-reticle,.ap-blick-lock,.ap-blick-lens,.ap-blick-beam,.ap-blick-ring,.ap-blick-ticksdial,.ap-blick-pupil,.ap-blick-sweep,.ap-blick-mote{animation:none!important}
.ap-blick-scene{transform:rotateX(10deg) rotateY(-11deg)}
.ap-blick-scan{opacity:.9;transform:translate(-50%,-50%) translate(8px,4px) translateZ(66px)}
.ap-blick-reticle{transform:translate(-50%,-50%) translateZ(64px) translate(49px,30px) scale(1)}
.ap-blick-el--2{opacity:1}
.ap-blick-el--2::after{opacity:1}
.ap-blick-beam{opacity:.6}
.ap-blick-mote{opacity:.7}}
@media (max-width:600px){.ap-blick-stage{height:300px}
.ap-blick-world{transform:scale(.7)}}
