.transition-page{background:#071019;color:#e5edf0;min-height:100vh;margin:0;font:400 16px/1.5 var(--font-body)}.transition-main{max-width:1200px;margin:auto;padding:36px 30px 70px}.transition-main header{display:flex;align-items:center;justify-content:space-between;gap:20px}.transition-main h1{font:800 58px/1 var(--font-head);margin:0}.transition-main>p{color:#b4c7d0;margin:20px 0 25px}.transition-screen{position:relative;aspect-ratio:16/9;overflow:hidden;background:#14222d}.transition-scene{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#152e3c;border:1px solid #a37c3c}.transition-scene.next{background:#20353c}.transition-scene>span:first-child{font:900 clamp(32px,6vw,90px)/1 var(--font-head);letter-spacing:-.02em}.demo-description{margin-top:20px;color:#bacbd1}.transition-screen video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}.transition-actions{display:flex;align-items:center;flex-wrap:wrap;gap:22px;padding:24px 0}.transition-actions button{min-height:44px}.transition-actions>span{color:#bacbd1;font-size:14px}.transition-instructions{max-width:72ch;border-top:1px solid #3c515e;padding-top:22px}.transition-instructions h2{font:800 30px/1 var(--font-head);margin:0 0 20px}.transition-instructions li{padding-left:6px;margin-bottom:9px}.transition-instructions p{color:#bacbd1}.motion-note{display:none}@media(max-width:760px){.transition-main{padding:26px 18px 45px}.transition-main header{align-items:flex-start;flex-direction:column}.transition-main h1{font-size:44px}.demo-description{font-size:12px;margin-top:12px}.transition-actions{gap:16px}.transition-actions>span{width:100%}}@media(prefers-reduced-motion:reduce){.motion-note{display:block}}
.transition-actions button{border:0;border-radius:7px;padding:12px 22px;background:#d9a44e;color:#0b131b;font:800 18px/1.2 var(--font-head);cursor:pointer}.transition-actions button:hover{background:#f0c879}.transition-actions button:active{background:#c79746}.transition-actions button:disabled{background:#3c515e;color:#bacbd1;cursor:wait}

.static-preview-toggle{display:flex;align-items:center;gap:8px;color:#bacbd1;font-size:14px}.static-preview-toggle input{width:18px;height:18px;accent-color:#d9a44e;margin:0}