:root{color-scheme:dark;--bg:#090e19;--panel:#111a2b;--line:#2c3851;--text:#f1f4fb;--muted:#a6b3c9;--accent:#c1b6ff}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:16px/1.6 system-ui,sans-serif}header{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:18px max(20px,calc((100vw - 1200px)/2));border-bottom:1px solid var(--line)}a{color:var(--accent)}main{max-width:1200px;margin:auto;padding:30px 20px}h1{font-size:clamp(28px,4vw,44px);letter-spacing:-.05em;margin:8px 0}h2{margin:0 0 12px}h3{margin:12px 0 3px}.eyebrow{letter-spacing:.14em;color:var(--accent);font-size:12px}.muted,small{color:var(--muted)}.intro{max-width:760px;margin-bottom:30px}button,input,select,textarea{font:inherit;min-height:44px;border:1px solid var(--line);border-radius:9px;color:inherit;background:#172238;padding:9px 12px}button{cursor:pointer;font-weight:650}button:hover{border-color:var(--accent)}button:disabled{opacity:.4;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid #bcb0ff;outline-offset:3px}label{display:flex;flex-direction:column;gap:5px;font-size:14px}textarea{width:100%;resize:vertical}input,select{max-width:100%;min-width:0}.settings,#order{padding:22px;background:var(--panel);border:1px solid var(--line);border-radius:16px;margin:24px 0}summary{cursor:pointer;font-weight:700;min-height:44px}.fields,.filters{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;align-items:end}.check{flex-direction:row;align-items:center;min-height:44px;gap:10px}.check input{min-height:auto;width:18px;height:18px}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:18px}.card{background:var(--panel);border:1px solid var(--line);padding:16px;border-radius:16px;display:flex;flex-direction:column}.card p{font-size:14px;color:var(--muted);flex:1}.card small{font-size:12px}.card button{width:100%;margin-top:12px}.preview{aspect-ratio:16/9;position:relative;overflow:hidden;display:grid;place-items:center;background:radial-gradient(ellipse at 25% 10%,#343562,#0b1020 70%);border-radius:10px;perspective:600px;isolation:isolate}.preview span{position:relative;padding:7px 12px;background:#f5ce58;color:#141824;font-weight:800;border-radius:6px;max-width:90%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;animation:rise 4s infinite both}.preview img{position:absolute;width:100%;height:100%;object-fit:cover;opacity:.65;animation:zoom 8s infinite alternate}.preview i{position:absolute;width:40px;height:40px;border:2px solid #bcb0ff;left:14%;top:20%;border-radius:9px;animation:float 4s infinite alternate}.preview i:nth-of-type(2){left:73%;top:60%;animation-delay:-2s}.preview[data-kind=type] span{animation:pop 3s infinite}.preview[data-kind=ticker] span{animation:scroll 7s linear infinite;white-space:nowrap}.preview[data-kind=flip] span{animation:flip 5s infinite}.preview[data-kind=orbit] span{animation:orbit 6s linear infinite}.preview[data-kind=bars] i{border:0;background:#9781ed;width:35px;top:auto;bottom:20%;height:65%;transform-origin:bottom;animation:grow 4s infinite}.preview[data-kind=bars] i:nth-of-type(2){left:36%;height:35%}.preview[data-kind=bars] span{left:25%;font-size:20px}.preview[data-kind=split]{background:linear-gradient(90deg,#333859 50%,#7363a6 50%)}.preview[data-kind=wipe]:after{content:'';position:absolute;inset:-20%;background:#c1b6ff;transform:skewX(-20deg);animation:wipe 4s infinite}.preview[data-kind=stage]{background:conic-gradient(from 150deg at 50% 0%,#a090d733,transparent 35deg,#a090d755 55deg,transparent 80deg),#101327}.preview[data-kind=particles] i{border-radius:0;animation:burst 3s infinite}.preview[data-kind=lower] span{align-self:end;justify-self:start;margin:15px}.preview[data-kind=timer] i{width:95px;height:95px;left:calc(50% - 47px);top:calc(50% - 47px);border-radius:50%;border:6px solid #d6c4ff;border-top-color:transparent;animation:spin 4s linear infinite}.preview[data-kind=timer] i:nth-of-type(2){display:none}.preview[data-kind=route]:before{content:'';position:absolute;width:70%;height:2px;background:#bcb0ff;transform:rotate(-20deg)}.preview[data-kind=pins] i,.preview[data-kind=route] i{border-radius:50% 50% 50% 0;animation:pop 3s infinite}.preview[data-kind=steps] span{animation:step 5s infinite}.paused .preview *,.paused .preview:after{animation:none!important}.paused .preview[data-kind=wipe]:after{display:none}.offscreen.preview *,.offscreen.preview:after{animation-play-state:paused!important}.section-title,.actions{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}.actions{justify-content:flex-start;margin:16px 0}#scenes{padding-left:24px}#scenes li{padding:12px 4px;border-bottom:1px solid var(--line)}#scenes button{font-size:13px;margin:5px}#status{position:sticky;bottom:10px;background:#202c42;border-radius:10px;padding:12px}#status:empty{display:none}dialog{max-width:720px;width:calc(100% - 24px);max-height:90vh;overflow:auto;background:var(--panel);color:inherit;border:1px solid var(--line);border-radius:18px;padding:24px}dialog::backdrop{background:#02050bce}dialog .close{float:right}dialog .preview{max-height:210px;margin:15px auto}dialog label{margin-top:12px}footer{font-size:13px;color:var(--muted);padding:24px 0}@keyframes rise{0%,15%{opacity:0;transform:translateY(25px)}30%,80%{opacity:1;transform:none}100%{opacity:0}}@keyframes pop{0%,10%{transform:scale(.3);opacity:0}25%{transform:scale(1.12);opacity:1}40%,85%{transform:scale(1)}100%{opacity:0}}@keyframes zoom{to{transform:scale(1.2)}}@keyframes float{to{transform:translateY(20px) rotate(25deg)}}@keyframes scroll{from{transform:translateX(140%)}to{transform:translateX(-140%)}}@keyframes flip{0%,30%{transform:rotateY(0)}60%,80%{transform:rotateY(360deg)}100%{transform:rotateY(360deg)}}@keyframes orbit{from{transform:rotateY(0) translateZ(30px)}to{transform:rotateY(360deg) translateZ(30px)}}@keyframes grow{0%,10%{transform:scaleY(.1)}65%,100%{transform:scaleY(1)}}@keyframes wipe{0%,20%{left:-250%}70%,100%{left:250%}}@keyframes burst{from{transform:translateY(-70px) rotate(0);opacity:0}30%{opacity:1}to{transform:translateY(130px) rotate(300deg);opacity:0}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes step{0%{transform:translateX(-25px);opacity:0}30%,70%{transform:translateX(0);opacity:1}100%{transform:translateX(25px);opacity:0}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;scroll-behavior:auto!important}}@media(max-width:600px){header{font-size:13px;padding:12px;gap:8px}main{padding:20px 12px}.grid{grid-template-columns:1fr}.filters{grid-template-columns:1fr 1fr}.filters>label:first-child{grid-column:1/-1}.settings,#order{padding:16px}dialog{padding:16px}}
