.device{position:absolute;-webkit-user-select:none;user-select:none;touch-action:none;pointer-events:none}.device-chrome,.device-controls{pointer-events:auto}.device-chrome{position:relative;box-sizing:border-box;transform-origin:0 0;backface-visibility:hidden;-webkit-backface-visibility:hidden;will-change:transform}.device-screen{position:absolute;overflow:hidden;background:#fff;backface-visibility:hidden;-webkit-backface-visibility:hidden}.device-iframe{display:block;border:0;background:#fff;position:absolute;left:0;top:0;transform:translateY(var(--scroll-top, 0px)) scale(var(--iframe-scale, 1));transform-origin:0 0;pointer-events:auto;will-change:transform;backface-visibility:hidden;-webkit-backface-visibility:hidden}.device-screenshot{display:block;border:0;position:absolute;left:0;top:0;transform:translateY(var(--scroll-top, 0px)) scale(var(--iframe-scale, 1));transform-origin:0 0;pointer-events:none;will-change:transform;backface-visibility:hidden;-webkit-backface-visibility:hidden;image-rendering:auto}.device-loading{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#f4f4f4;z-index:3}.device-spinner{width:32px;height:32px;border:3px solid #ccc;border-top-color:#333;border-radius:50%;animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.device-error{position:absolute;top:0;right:0;bottom:0;left:0;display:none;align-items:center;justify-content:center;text-align:center;padding:16px;background:#f8f0f0;color:#a33;font-size:13px;z-index:3}.device-iphone .device-chrome{width:430px;height:884px;background:#0b0b0b;border-radius:58px;padding:20px;box-shadow:inset 0 0 0 2px #1f1f1f,0 30px 60px -20px #0000008c}.device-iphone .device-chrome:before{content:"";position:absolute;right:-3px;top:200px;width:4px;height:90px;background:#0b0b0b;border-radius:0 2px 2px 0}.device-iphone .device-screen{top:20px;left:20px;width:390px;height:844px;border-radius:40px}.device-iphone .device-screen:after{content:"";position:absolute;top:12px;left:50%;transform:translate(-50%);width:120px;height:32px;background:#000;border-radius:20px;z-index:5;pointer-events:none}.device-ipad .device-chrome{width:880px;height:1240px;background:linear-gradient(#d8dadd,#b4b7bb);border-radius:38px;padding:30px;box-shadow:inset 0 1px #ffffff8c,inset 0 -1px #0000001f,inset 0 0 0 1px #0000002e,0 30px 60px -20px #0000008c}.device-ipad .device-screen{top:30px;left:30px;width:820px;height:1180px;border-radius:10px;box-shadow:0 0 0 4px #0a0a0a}.device-macbook .device-chrome{width:1410px;height:900px;padding:32px 65px 14px;background:linear-gradient(#dcdde0,#b8babe);border-radius:18px 18px 6px 6px;box-shadow:inset 0 1px #ffffff8c,inset 0 -1px #00000026,inset 0 0 0 1px #0000002e,0 40px 80px -30px #0009}.device-macbook .device-screen{top:32px;left:65px;width:1280px;height:800px;border-radius:2px;box-shadow:0 0 0 5px #0a0a0a}.device-macbook .device-chrome:after{content:"";position:absolute;left:-60px;right:-60px;bottom:-14px;height:20px;background:linear-gradient(#cfcfcf,#8a8a8a);border-radius:0 0 16px 16px;box-shadow:0 12px 20px -10px #00000080}.device-imac .device-chrome{width:2000px;height:1170px;padding:40px;background:linear-gradient(#dcdde0,#b0b2b6);border-radius:14px 14px 6px 6px;box-shadow:inset 0 1px #ffffff8c,inset 0 -1px #00000026,inset 0 0 0 1px #0000002e,0 40px 80px -30px #0009}.device-imac .device-screen{top:40px;left:40px;width:1920px;height:1080px;border-radius:2px;box-shadow:0 0 0 6px #0a0a0a}.device-imac .device-chrome:after{content:"";position:absolute;bottom:-100px;left:50%;transform:translate(-50%);width:260px;height:100px;background:linear-gradient(#d4d4d4,#9a9a9a);clip-path:polygon(20% 0,80% 0,100% 100%,0 100%)}.device-imac .device-chrome:before{content:"";position:absolute;bottom:-116px;left:50%;transform:translate(-50%);width:420px;height:18px;background:linear-gradient(#e5e5e5,#9a9a9a);border-radius:8px;z-index:-1}.device-pc .device-chrome{width:1760px;height:1130px;padding:30px 40px 50px;background:#111;border-radius:10px;box-shadow:0 40px 80px -30px #0009}.device-pc .device-screen{top:30px;left:40px;width:1680px;height:1050px;border-radius:2px}.device-pc .device-chrome:after{content:"";position:absolute;bottom:-90px;left:50%;transform:translate(-50%);width:440px;height:20px;background:linear-gradient(#2a2a2a,#111);border-radius:6px}.device-pc .device-chrome:before{content:"";position:absolute;bottom:-90px;left:50%;transform:translate(-50%);width:80px;height:90px;background:linear-gradient(#2a2a2a,#111)}.device-custom .device-chrome{background:transparent;background-repeat:no-repeat;background-size:contain;box-shadow:none;filter:drop-shadow(0 24px 30px rgba(0,0,0,.45))}.device-custom .device-screen{border-radius:0;background:#fff}.device-controls{position:absolute;bottom:calc(100% + 8px);left:0;display:none;gap:8px 10px;align-items:center;flex-wrap:wrap;max-width:900px;background:#111;color:#fff;padding:8px 10px;border-radius:8px;font-size:13px;line-height:1;z-index:10;box-shadow:0 8px 24px #00000080}.device-controls:after{content:"";position:absolute;left:0;right:0;top:100%;height:16px}.device:hover .device-controls{display:flex}.device.controls-hidden .device-controls{display:none!important}.device-controls button{background:#222;border:1px solid #333;color:#eee;padding:4px 9px;border-radius:5px;cursor:pointer;font:inherit}.device-controls button:hover{background:#2aff00;color:#111;border-color:#2aff00}.device-controls .rect-edit,.device-controls .rot-edit,.device-controls .size-edit,.device-controls .anim-edit{display:inline-flex;gap:6px;align-items:center;padding:0 6px;border-left:1px solid #333;border-right:1px solid #333;margin:0 2px}.device-controls .anim-edit select{background:#222;border:1px solid #444;color:#fff;padding:4px 6px;border-radius:4px;font:inherit;font-size:12px}.device-controls .anim-edit input[type=number]{width:56px;background:#222;border:1px solid #444;color:#fff;padding:4px 6px;border-radius:4px;font:inherit;font-size:12px;-moz-appearance:textfield}.device-controls .anim-edit input[type=number]::-webkit-outer-spin-button,.device-controls .anim-edit input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.device-controls .rot-edit{border-right:none}.device-controls .rect-edit label,.device-controls .rot-edit label,.device-controls .size-edit label{display:inline-flex;align-items:center;gap:4px;color:#bbb;font-size:12px}.device-controls .rect-edit input[type=number],.device-controls .rot-edit input[type=number],.device-controls .size-edit input[type=number]{width:64px;background:#222;border:1px solid #444;color:#fff;padding:4px 6px;border-radius:4px;font:inherit;font-size:13px;-moz-appearance:textfield}.device-controls .rect-edit input[type=number]::-webkit-outer-spin-button,.device-controls .rect-edit input[type=number]::-webkit-inner-spin-button,.device-controls .rot-edit input[type=number]::-webkit-outer-spin-button,.device-controls .rot-edit input[type=number]::-webkit-inner-spin-button,.device-controls .size-edit input[type=number]::-webkit-outer-spin-button,.device-controls .size-edit input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.device-controls input[type=number]:focus,.device-controls input[type=color]:focus,.device-controls select:focus{outline:1px solid #2aff00;outline-offset:0}:root{--bg: #0e0f12;--panel: #17191f;--panel-2: #1f0b3b;--border: #35215a;--text: #e8eaf0;--text-dim: #a4a9b5;--accent: #2aff00;--accent-ink: #0a0a0a}*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;font-size:14px}#app{display:grid;grid-template-columns:var(--sn-width, 280px) 1fr;grid-template-rows:1fr auto;height:100vh;overflow:hidden}button,input,select{font:inherit;color:inherit}.sidenav{grid-row:1 / 3;grid-column:1;display:flex;flex-direction:column;background:#160431;border-right:1px solid var(--border);z-index:10;min-height:0}.sn-brand{padding:14px 14px 12px;border-bottom:1px solid var(--border);flex:0 0 auto}.brand-logo{width:100%;max-width:200px;height:auto;display:block}.sn-scroll{flex:1 1 auto;overflow-y:auto;overflow-x:hidden;min-height:0}.sn-section{border-bottom:1px solid var(--border)}.sn-title{display:block;padding:10px 32px 10px 14px;font-size:11px;text-transform:uppercase;letter-spacing:.8px;color:var(--text-dim);cursor:pointer;-webkit-user-select:none;user-select:none;list-style:none;position:relative;font-weight:600}.sn-title::-webkit-details-marker{display:none}.sn-title:after{content:"";position:absolute;right:16px;top:50%;width:7px;height:7px;border-right:2px solid var(--text-dim);border-bottom:2px solid var(--text-dim);transform:translateY(-70%) rotate(-45deg);transition:transform .15s ease-out}.sn-section[open]>.sn-title:after{transform:translateY(-30%) rotate(45deg)}.sn-title:hover{color:var(--text);background:#ffffff08}.sn-body{padding:4px 14px 14px;display:flex;flex-direction:column;gap:10px}.sn-body .tb-group{flex-wrap:wrap;gap:6px;align-items:center}.sn-body select{background:var(--panel-2);border:1px solid var(--border);color:var(--text);padding:5px 8px;border-radius:6px;font:inherit;font-size:13px}.sn-body select:focus{outline:none;border-color:var(--accent)}.sn-body select option{background:var(--panel-2);color:var(--text)}.sn-body .tb-url{flex-direction:column;align-items:stretch}.sn-body .tb-url input[type=url]{width:100%;min-width:0}.sn-body .tb-url>*{width:100%}.sn-body .tb-url .tb-btn{justify-content:center}.sn-row{display:flex;align-items:center;gap:6px;width:100%}.sn-body .tb-canvas{flex-direction:column;align-items:stretch}.sn-body .tb-canvas>select,.sn-body .tb-canvas>.tb-btn{width:100%}.sn-body .tb-canvas input[type=number]{flex:1}.sn-body input[type=range]{width:100%;min-width:0}.sn-actions{flex:0 0 auto;padding:12px 14px;border-top:1px solid var(--border);display:flex!important;flex-direction:column;gap:6px}.sn-actions .tb-btn{width:100%;justify-content:center}.tb-group{display:flex;align-items:center;gap:6px}.tb-label{font-size:11px;text-transform:uppercase;color:var(--text-dim);letter-spacing:.8px;margin-right:4px}.tb-url input[type=url]{background:var(--panel-2);border:1px solid var(--border);border-radius:6px;padding:6px 10px;width:320px;color:var(--text);outline:none}.tb-url input[type=url]:focus{border-color:var(--accent)}.tb-btn{background:var(--panel-2);border:1px solid var(--border);color:var(--text);padding:6px 10px;border-radius:6px;cursor:pointer;display:inline-flex;align-items:center;gap:6px}.tb-btn:hover{border-color:var(--accent);color:var(--accent)}.tb-primary{background:var(--accent);color:var(--accent-ink);border-color:var(--accent);font-weight:600}.tb-primary:hover{color:var(--accent-ink);background:#45ff22}.tb-action{background:var(--accent);color:var(--accent-ink);border-color:var(--accent);font-weight:700;letter-spacing:.3px}.tb-action:hover{background:#45ff22;color:var(--accent-ink)}.tb-chip{background:var(--panel-2);border:1px solid var(--border);color:var(--text);padding:6px 10px;border-radius:999px;cursor:pointer;display:inline-flex;align-items:center;gap:6px}.tb-chip em{font-style:normal;background:var(--accent);color:var(--accent-ink);font-size:11px;padding:0 5px;border-radius:999px}.tb-chip.is-on{border-color:var(--accent);color:var(--accent)}.tb-chip-custom{border-style:dashed}.tb-bg input[type=color]{width:32px;height:32px;padding:0;border:1px solid var(--border);background:transparent;border-radius:6px;cursor:pointer}.tb-scroll input[type=range],.tb-frame-opts input[type=range]{width:120px}.tb-canvas select,.tb-scroll select{background:var(--panel-2);border:1px solid var(--border);color:var(--text);padding:5px 8px;border-radius:6px}.tb-canvas input[type=number]{width:64px;background:var(--panel-2);border:1px solid var(--border);color:var(--text);padding:5px 6px;border-radius:6px;-moz-appearance:textfield}.tb-canvas input[type=number]::-webkit-outer-spin-button,.tb-canvas input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.tb-x{color:var(--text-dim);font-size:12px}.tb-yt-controls,.tb-image-controls,.tb-gradient-controls{display:inline-flex;gap:6px;flex-wrap:wrap;align-items:center}.tb-yt-controls[hidden],.tb-image-controls[hidden],.tb-gradient-controls[hidden]{display:none}.tb-progress{position:relative;width:80px;height:16px;background:var(--panel-2);border:1px solid var(--border);border-radius:4px;overflow:hidden;display:inline-flex;align-items:center;justify-content:center}.tb-progress-bar{position:absolute;left:0;top:0;bottom:0;width:0%;background:var(--accent);opacity:.35;transition:width .08s linear}.tb-progress-pct{position:relative;font-size:11px;font-variant-numeric:tabular-nums;color:var(--text);z-index:1}.text-layer{position:absolute;cursor:move;-webkit-user-select:none;user-select:none;touch-action:none}.text-layer .text-body{display:block;word-wrap:break-word;white-space:pre-wrap;min-height:1em;outline:none;caret-color:#2aff00}.text-layer .text-body[contenteditable=true]{cursor:text;outline:2px dashed rgba(42,255,0,.7);outline-offset:4px}.text-controls{position:absolute;bottom:calc(100% + 8px);left:0;display:none;gap:8px 10px;align-items:center;flex-wrap:wrap;max-width:780px;background:#111;color:#fff;padding:8px 10px;border-radius:8px;font-size:12px;line-height:1;z-index:20;box-shadow:0 8px 24px #00000080}.text-controls:after{content:"";position:absolute;left:0;right:0;top:100%;height:20px}.text-layer:hover .text-controls{display:flex}.text-controls label{display:inline-flex;align-items:center;gap:4px;color:#bbb;font-size:12px}.text-controls select,.text-controls input[type=number]{background:#222;border:1px solid #444;color:#fff;padding:4px 6px;border-radius:4px;font:inherit;font-size:12px}.text-controls input[type=number]{width:60px;-moz-appearance:textfield}.text-controls input[type=number]::-webkit-outer-spin-button,.text-controls input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.text-controls input[type=color]{width:32px;height:24px;padding:0;border:1px solid #444;border-radius:4px;background:transparent}.text-controls button{background:#222;border:1px solid #444;color:#fff;padding:4px 8px;border-radius:4px;cursor:pointer;font:inherit}.text-controls button:hover{background:#2aff00;color:#111;border-color:#2aff00}.text-controls .anim-edit,.text-controls .bg-edit{display:inline-flex;gap:6px;align-items:center;padding:0 6px;border-left:1px solid #333;margin-left:4px}.text-controls .bg-edit input[type=range]{width:70px}.text-controls .bg-edit input[type=color]{width:28px;height:22px;padding:0;border:1px solid #444;border-radius:4px;background:transparent}.tb-chip-text,.tb-chip-image{border-style:dashed;color:#2aff00;border-color:#2aff00;cursor:pointer}.tb-chip-text:hover,.tb-chip-image:hover{background:#2aff00;color:#111}.image-layer{position:absolute;cursor:move;-webkit-user-select:none;user-select:none;touch-action:none}.image-layer .image-body-wrap{display:inline-block}.image-layer img.image-body{display:block;pointer-events:none;-webkit-user-select:none;user-select:none;-webkit-user-drag:none}.image-controls{position:absolute;bottom:calc(100% + 8px);left:0;display:none;gap:8px 10px;align-items:center;flex-wrap:wrap;max-width:780px;background:#111;color:#fff;padding:8px 10px;border-radius:8px;font-size:12px;line-height:1;z-index:20;box-shadow:0 8px 24px #00000080}.image-controls:after{content:"";position:absolute;left:0;right:0;top:100%;height:20px}.image-layer:hover .image-controls{display:flex}.image-controls label{display:inline-flex;align-items:center;gap:4px;color:#bbb;font-size:12px}.image-controls select,.image-controls input[type=number]{background:#222;border:1px solid #444;color:#fff;padding:4px 6px;border-radius:4px;font:inherit;font-size:12px}.image-controls input[type=number]{width:62px;-moz-appearance:textfield}.image-controls input[type=number]::-webkit-outer-spin-button,.image-controls input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.image-controls input[type=range]{width:80px}.image-controls button{background:#222;border:1px solid #444;color:#fff;padding:4px 8px;border-radius:4px;cursor:pointer;font:inherit}.image-controls button:hover{background:#2aff00;color:#111;border-color:#2aff00}.image-resize-handle,.text-resize-handle{position:absolute;width:22px;height:22px;margin:-11px 0 0 -11px;background:var(--accent);border:2px solid #0a0a0a;border-radius:50%;box-shadow:0 2px 8px #000000b3;cursor:nwse-resize;z-index:12;opacity:0;pointer-events:none;transition:opacity .12s ease-out}.image-layer:hover .image-resize-handle,.text-layer:hover .text-resize-handle{opacity:1;pointer-events:auto}body.ui-hidden .image-resize-handle,body.ui-hidden .text-resize-handle{display:none}.image-controls .anim-edit{display:inline-flex;gap:6px;align-items:center;padding:0 6px;border-left:1px solid #333;margin-left:4px}@keyframes anim-fade{0%{opacity:0}to{opacity:1}}@keyframes anim-pop{0%{opacity:0;transform:scale(.2)}60%{opacity:1;transform:scale(1.08)}to{opacity:1;transform:scale(1)}}@keyframes anim-slide-left{0%{opacity:0;transform:translate(-480px)}to{opacity:1;transform:translate(0)}}@keyframes anim-slide-right{0%{opacity:0;transform:translate(480px)}to{opacity:1;transform:translate(0)}}@keyframes anim-slide-up{0%{opacity:0;transform:translateY(480px)}to{opacity:1;transform:translateY(0)}}@keyframes anim-slide-down{0%{opacity:0;transform:translateY(-480px)}to{opacity:1;transform:translateY(0)}}@keyframes anim-diag-tl{0%{opacity:0;transform:translate(-380px,-380px)}to{opacity:1;transform:translate(0)}}@keyframes anim-diag-tr{0%{opacity:0;transform:translate(380px,-380px)}to{opacity:1;transform:translate(0)}}@keyframes anim-diag-bl{0%{opacity:0;transform:translate(-380px,380px)}to{opacity:1;transform:translate(0)}}@keyframes anim-diag-br{0%{opacity:0;transform:translate(380px,380px)}to{opacity:1;transform:translate(0)}}.anim-fade{animation:anim-fade var(--anim-duration, .7s) cubic-bezier(.2,.7,.2,1) var(--anim-delay, 0ms) both}.anim-pop{animation:anim-pop var(--anim-duration, .7s) cubic-bezier(.2,.7,.2,1.2) var(--anim-delay, 0ms) both}.anim-slide-left{animation:anim-slide-left var(--anim-duration, .7s) cubic-bezier(.2,.7,.2,1) var(--anim-delay, 0ms) both}.anim-slide-right{animation:anim-slide-right var(--anim-duration, .7s) cubic-bezier(.2,.7,.2,1) var(--anim-delay, 0ms) both}.anim-slide-up{animation:anim-slide-up var(--anim-duration, .7s) cubic-bezier(.2,.7,.2,1) var(--anim-delay, 0ms) both}.anim-slide-down{animation:anim-slide-down var(--anim-duration, .7s) cubic-bezier(.2,.7,.2,1) var(--anim-delay, 0ms) both}.anim-diag-tl{animation:anim-diag-tl var(--anim-duration, .7s) cubic-bezier(.2,.7,.2,1) var(--anim-delay, 0ms) both}.anim-diag-tr{animation:anim-diag-tr var(--anim-duration, .7s) cubic-bezier(.2,.7,.2,1) var(--anim-delay, 0ms) both}.anim-diag-bl{animation:anim-diag-bl var(--anim-duration, .7s) cubic-bezier(.2,.7,.2,1) var(--anim-delay, 0ms) both}.anim-diag-br{animation:anim-diag-br var(--anim-duration, .7s) cubic-bezier(.2,.7,.2,1) var(--anim-delay, 0ms) both}.tb-value{font-variant-numeric:tabular-nums;color:var(--text-dim);font-size:12px;min-width:36px;text-align:right}.tb-check{display:inline-flex;align-items:center;gap:4px;color:var(--text-dim)}.tb-switch{position:relative;display:inline-block;width:36px;height:20px}.tb-switch input{opacity:0;width:0;height:0}.tb-switch span{position:absolute;cursor:pointer;top:0;right:0;bottom:0;left:0;background:#333;border-radius:999px;transition:.15s}.tb-switch span:before{content:"";position:absolute;height:14px;width:14px;left:3px;bottom:3px;background:#fff;border-radius:999px;transition:.15s}.tb-switch input:checked+span{background:var(--accent)}.tb-switch input:checked+span:before{transform:translate(16px)}.stage-wrap{grid-row:1;grid-column:2;position:relative;overflow:auto;background:#0b0c10;padding:40px;min-width:0;min-height:0;display:flex;justify-content:safe center;align-items:safe center}.stage{position:relative;flex-shrink:0;overflow:hidden;box-shadow:0 0 0 2px #2aff0059,0 0 0 1px #ffffff26,0 20px 80px #0000008c}.device:hover,.text-layer:hover,.image-layer:hover{z-index:9999!important}.stage-bg{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;background-color:#000;background-size:cover;background-position:center;background-repeat:no-repeat;z-index:0;transform-origin:center center}.stage-bg.is-gradient{background-size:100% 100%;background-position:0 0}@keyframes bg-anim-ken-burns{0%{transform:scale(1) translate(0)}to{transform:scale(1.18) translate(-3%,-2%)}}.stage-bg.bg-anim-ken-burns{animation:bg-anim-ken-burns 36s ease-in-out infinite alternate}@keyframes bg-anim-zoom-in{0%{transform:scale(1)}to{transform:scale(1.22)}}.stage-bg.bg-anim-zoom-in{animation:bg-anim-zoom-in 30s ease-in-out infinite alternate}@keyframes bg-anim-zoom-out{0%{transform:scale(1.22)}to{transform:scale(1)}}.stage-bg.bg-anim-zoom-out{animation:bg-anim-zoom-out 30s ease-in-out infinite alternate}@keyframes bg-anim-drift{0%{transform:scale(1.08) translate(-2%)}to{transform:scale(1.08) translate(2%)}}.stage-bg.bg-anim-drift{animation:bg-anim-drift 28s ease-in-out infinite alternate}@keyframes bg-anim-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.stage-bg.bg-anim-pulse{animation:bg-anim-pulse 6s ease-in-out infinite}@keyframes bg-anim-shift{0%{filter:hue-rotate(0deg)}to{filter:hue-rotate(360deg)}}.stage-bg.bg-anim-shift{animation:bg-anim-shift 20s linear infinite}.stage-bg.is-transparent{background-image:linear-gradient(45deg,#333 25%,transparent 25%),linear-gradient(-45deg,#333 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#333 75%),linear-gradient(-45deg,transparent 75%,#333 75%);background-size:24px 24px;background-position:0 0,0 12px,12px -12px,-12px 0;background-color:#222}.stage-bg-video{position:absolute;width:100%;height:100%;object-fit:cover;cursor:grab}.stage-bg-video:active{cursor:grabbing}.stage-bg-youtube{position:absolute;top:0;bottom:0;aspect-ratio:16 / 9;left:50%;transform:translate(-50%);pointer-events:none;overflow:hidden}.stage-bg-youtube iframe{width:100%;height:100%;border:0;display:block}.stage.no-shadow .device-chrome,.stage.no-shadow .device-chrome:before,.stage.no-shadow .device-chrome:after{box-shadow:none!important}.stage.no-shadow .device-custom .device-chrome{filter:none!important}.stage-devices{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1}.status{grid-row:2;grid-column:2;background:var(--panel);border-top:1px solid var(--border);color:var(--text-dim);padding:6px 14px;font-size:12px;display:flex;gap:14px;flex-wrap:wrap;align-items:center;justify-content:center;text-align:center}.status a{color:var(--accent);text-decoration:none}.status a:hover{text-decoration:underline}.status .status-link{background:transparent;border:none;color:var(--accent);font:inherit;cursor:pointer;padding:0;text-decoration:underline}.status .status-link:hover{color:#45ff22}.status .status-sep{color:var(--border)}.status .status-helper code{background:#ffffff0f;border:1px solid var(--border);padding:0 5px;border-radius:3px;font-family:ui-monospace,SF Mono,Menlo,Consolas,monospace;font-size:11px;color:var(--text)}.status .status-helper a{white-space:nowrap;font-weight:600}.install-modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000b8;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);display:flex;align-items:center;justify-content:center;z-index:9999;animation:installModalFadeIn .12s ease-out}@keyframes installModalFadeIn{0%{opacity:0}to{opacity:1}}.install-modal{position:relative;background:#1f0b3b;color:var(--text);border:1px solid #35215a;border-radius:12px;padding:28px 32px 32px;max-width:600px;width:calc(100% - 40px);max-height:calc(100vh - 80px);overflow-y:auto;box-shadow:0 30px 80px #000000b3;font-size:14px;line-height:1.5}.install-modal h2{margin:0 0 10px;font-size:22px;color:var(--accent);font-weight:800}.install-modal h3{margin:0 0 8px;font-size:15px;color:var(--text)}.install-modal p{margin:0 0 14px;color:var(--text-dim)}.install-modal-lede{color:var(--text)}.install-modal-close{position:absolute;top:12px;right:14px;background:transparent;border:none;color:var(--text-dim);font-size:20px;cursor:pointer;width:32px;height:32px;border-radius:6px;display:inline-flex;align-items:center;justify-content:center}.install-modal-close:hover{background:#ffffff1a;color:var(--text)}.install-modal-steps{padding-left:22px;margin:0 0 22px}.install-modal-steps li{margin-bottom:14px;color:var(--text)}.install-modal-steps small{display:block;margin-top:6px;color:var(--text-dim);font-size:12px}.install-modal-steps code{background:#00000059;padding:1px 6px;border-radius:4px;font-size:12px}.install-modal-steps a{color:var(--accent)}.install-modal-copyrow{display:flex;gap:6px;margin:8px 0 4px}.install-modal-copyrow input{flex:1;background:#00000059;border:1px solid #35215a;color:var(--text);padding:8px 10px;border-radius:6px;font-family:ui-monospace,SF Mono,Menlo,monospace;font-size:12px}.install-modal-copy{background:var(--accent);color:var(--accent-ink);border:none;padding:8px 14px;border-radius:6px;font:inherit;font-size:12px;font-weight:700;cursor:pointer;min-width:90px}.install-modal-copy:hover,.install-modal-copy.is-copied{background:#45ff22}.install-modal-alt{margin-top:20px;padding:16px;background:#00000040;border-left:3px solid var(--accent);border-radius:6px}.install-modal-alt p{margin:0;font-size:13px}.device-resize-handle{position:absolute;width:22px;height:22px;margin:-11px 0 0 -11px;background:var(--accent);border:2px solid #0a0a0a;border-radius:50%;box-shadow:0 2px 8px #000000b3;cursor:nwse-resize;z-index:12;opacity:0;pointer-events:auto;transition:opacity .12s ease-out,transform .1s ease-out}.device:hover .device-resize-handle{opacity:1;transform:scale(1.1)}body.ui-hidden .device-resize-handle{display:none}body.ui-hidden #app{grid-template-columns:0 1fr}body.ui-hidden .sidenav,body.ui-hidden .status{display:none!important}#restoreUiBtn{position:fixed;top:50%;left:0;transform:translateY(-50%);z-index:10000;background:var(--accent);color:var(--accent-ink);border:none;padding:18px 10px 18px 12px;border-radius:0 12px 12px 0;font:inherit;font-weight:800;font-size:13px;letter-spacing:.6px;cursor:pointer;box-shadow:4px 0 18px #000000a6,0 0 0 1px #0a0a0a66;writing-mode:vertical-rl;text-orientation:mixed;transition:padding-left .12s ease-out,box-shadow .12s ease-out}#restoreUiBtn:hover{padding-left:16px;box-shadow:6px 0 22px #000000b3,0 0 0 1px #0a0a0a66}.sn-hamburger{display:none;position:fixed;top:12px;left:12px;width:42px;height:42px;padding:10px 8px;background:#160431;border:1px solid var(--border);border-radius:8px;color:var(--text);cursor:pointer;z-index:40;box-shadow:0 8px 20px #0009;flex-direction:column;justify-content:space-between;align-items:stretch}.sn-hamburger span{display:block;height:2px;background:currentColor;border-radius:2px}.sn-hamburger:hover{border-color:var(--accent);color:var(--accent)}.sn-backdrop{display:none;position:fixed;top:0;right:0;bottom:0;left:0;background:#0000008c;z-index:20;opacity:0;transition:opacity .18s ease-out}body.sidenav-open .sn-backdrop{opacity:1}@media (max-width: 900px){:root{--sn-width: 240px}.stage-wrap{padding:16px}}@media (max-width: 700px){#app{grid-template-columns:0 1fr}.sidenav{position:fixed;left:0;top:0;bottom:0;width:280px;max-width:86vw;z-index:30;transform:translate(-100%);transition:transform .22s ease-out;box-shadow:12px 0 32px #0000008c}body.sidenav-open .sidenav{transform:translate(0)}.sn-hamburger{display:flex}.sn-backdrop{display:block;pointer-events:none}body.sidenav-open .sn-backdrop{pointer-events:auto}body.ui-hidden .sn-hamburger,body.ui-hidden .sn-backdrop{display:none!important}.stage-wrap{padding:10px 10px 10px 64px}}@media (max-width: 600px){.sn-brand{padding:10px 10px 8px}.brand-logo{max-width:160px}.sn-title{padding:9px 28px 9px 12px}.sn-body{padding:4px 12px 12px}.stage{transform-origin:top left}.status{font-size:11px;padding:5px 10px;flex-wrap:wrap;gap:6px}}