.device-preview-page{--violet:#6757e8;--mint:#00b894;--ink:#27283d;--muted:#707286;--border:#e2e0ec;background:#fff;color:var(--ink)}
.preview-hero{position:relative;overflow:hidden;padding:38px 0 68px;background:radial-gradient(circle at 8% 12%,rgba(0,184,148,.11),transparent 24%),radial-gradient(circle at 92% 10%,rgba(103,87,232,.15),transparent 29%),linear-gradient(180deg,#fcfbff,#f6f4fc)}
.orb{position:absolute;border-radius:50%;pointer-events:none}.orb-one{top:240px;left:-110px;width:220px;height:220px;border:34px solid rgba(103,87,232,.055)}.orb-two{top:690px;right:-56px;width:136px;height:136px;background:rgba(0,184,148,.065)}
.intro{position:relative;max-width:900px;margin:0 auto 34px;text-align:center}.crumbs{display:flex;justify-content:center;gap:9px;margin-bottom:20px;color:#9899a9;font-size:.78rem}.crumbs a{color:var(--violet);font-weight:800}.intro .eyebrow{display:inline-flex;align-items:center;gap:8px;padding:7px 11px;border:1px solid rgba(103,87,232,.13);border-radius:999px;background:rgba(255,255,255,.7);color:#65677c;font-size:.7rem;font-weight:850;text-transform:uppercase;letter-spacing:.1em;box-shadow:0 6px 18px rgba(55,46,105,.05)}.intro .eyebrow i{width:7px;height:7px;border-radius:50%;background:var(--mint);box-shadow:0 0 0 4px rgba(0,184,148,.12)}.intro h1{margin:17px auto 14px;font-size:clamp(2.45rem,6vw,4.6rem);line-height:1.01;letter-spacing:-.06em}.lead{max-width:790px}.trust-row{display:flex;flex-wrap:wrap;justify-content:center;gap:12px 28px;margin-top:20px;color:#77798d;font-size:.76rem;font-weight:750}.trust-row span:before{content:"";display:inline-block;width:6px;height:6px;margin-right:8px;border-radius:50%;background:var(--mint)}
.preview-studio{position:relative;overflow:hidden;border:1px solid rgba(218,215,231,.98);border-radius:26px;background:#fff;box-shadow:0 34px 90px rgba(48,40,100,.15)}.studio-topbar{display:flex;align-items:center;gap:18px;min-height:68px;padding:12px 18px;border-bottom:1px solid var(--border);background:#fcfbff}.studio-status{display:flex;align-items:center;min-width:205px;gap:10px}.studio-status strong,.studio-status small{display:block}.studio-status strong{font-size:.82rem}.studio-status small{margin-top:3px;color:#9293a5;font-size:.65rem}.status-dot{width:8px;height:8px;border-radius:50%;background:var(--mint);box-shadow:0 0 0 5px rgba(0,184,148,.11)}.view-switch{display:flex;justify-content:center;flex:1;gap:5px}.view-switch button{display:flex;align-items:center;gap:7px;min-height:38px;padding:0 13px;border:1px solid var(--border);background:#fff;color:#707185;font-size:.68rem;font-weight:850}.view-switch button:first-child{border-radius:10px 0 0 10px}.view-switch button:last-child{margin-left:-6px;border-radius:0 10px 10px 0}.view-switch button.active{position:relative;z-index:1;border-color:#c6c0ed;background:#efedff;color:var(--violet)}.surprise-button{display:flex;align-items:center;gap:7px;min-height:38px;padding:0 13px;border:0;border-radius:10px;background:linear-gradient(135deg,#312b60,#5946b7);color:#fff;font-size:.67rem;font-weight:850;box-shadow:0 8px 20px rgba(60,45,140,.17)}.surprise-button:hover{transform:translateY(-1px);filter:brightness(1.06)}
.studio-grid{display:grid;grid-template-columns:minmax(0,1.22fr) minmax(330px,.78fr);min-height:760px}.stage-panel{min-width:0;padding:20px;border-right:1px solid var(--border);background:#f8f7fc}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}.panel-heading>div{display:flex;align-items:center;gap:10px}.panel-heading strong,.panel-heading small{display:block}.panel-heading strong{font-size:.82rem}.panel-heading small{margin-top:3px;color:#9293a5;font-size:.66rem}.step-number{display:grid;flex:0 0 31px;height:31px;place-items:center;border-radius:9px;background:#ece9ff;color:var(--violet);font-size:.65rem;font-weight:900}.live-pill{display:flex;align-items:center;gap:6px;padding:6px 9px;border:1px solid rgba(0,184,148,.18);border-radius:999px;background:#edf9f6;color:#087966;font-size:.62rem;font-weight:900}.live-pill i{width:6px;height:6px;border-radius:50%;background:var(--mint);animation:pulse 1.8s infinite}
.preview-stage{position:relative;display:grid;min-height:620px;place-items:center;overflow:hidden;padding:34px;border-radius:21px;isolation:isolate;transition:background .35s}.preview-stage:before,.preview-stage:after{content:"";position:absolute;z-index:-1;border-radius:50%;filter:blur(2px);opacity:.68}.preview-stage:before{top:-15%;right:-9%;width:270px;height:270px;border:46px solid rgba(255,255,255,.15)}.preview-stage:after{bottom:-15%;left:-8%;width:220px;height:220px;background:rgba(255,255,255,.11)}.preview-stage.theme-aurora{background:linear-gradient(140deg,#6858e9 0%,#8170ec 42%,#18ad9c 100%)}.preview-stage.theme-citrus{background:linear-gradient(135deg,#ff7a59 0%,#f7c74b 50%,#e35caa 100%)}.preview-stage.theme-midnight{background:radial-gradient(circle at 75% 15%,#5147a2,transparent 32%),linear-gradient(140deg,#15162f,#242450 64%,#0c766f)}.preview-stage.theme-paper{background:radial-gradient(circle at 15% 20%,#fff,transparent 30%),linear-gradient(135deg,#f4efe3,#d9d4e7);--device-edge:#d7d1dc}.single-preview{display:grid;width:100%;height:100%;place-items:center;perspective:1400px}.device-wrap{position:relative;display:grid;place-items:center;max-width:100%;transform:scale(var(--preview-scale,.72));transition:transform .38s cubic-bezier(.2,.9,.2,1)}.device-shell{position:relative;overflow:hidden;background:#171820;box-shadow:0 34px 70px rgba(21,18,50,.38),0 0 0 1px rgba(255,255,255,.24) inset;transition:width .38s cubic-bezier(.2,.9,.2,1),height .38s cubic-bezier(.2,.9,.2,1),border-radius .3s,padding .3s}.device-screen{position:relative;width:100%;height:100%;overflow:hidden;background:#fff}.device-screen iframe,.device-screen>img{display:block;width:100%;height:100%;border:0;background:#fff}.device-screen>img{object-fit:cover;object-position:top}.device-wrap[data-device="phone"] .device-shell{width:286px;height:618px;padding:9px;border-radius:42px}.device-wrap[data-device="phone"] .device-screen{border-radius:34px}.device-wrap[data-device="tablet"] .device-shell{width:444px;height:592px;padding:12px;border-radius:29px}.device-wrap[data-device="tablet"] .device-screen{border-radius:18px}.device-wrap[data-device="laptop"] .device-shell{width:680px;height:425px;padding:12px 12px 16px;border-radius:20px 20px 10px 10px}.device-wrap[data-device="laptop"] .device-screen{border-radius:10px}.device-wrap[data-device="desktop"] .device-shell{width:700px;height:394px;padding:12px 12px 19px;border-radius:18px}.device-wrap[data-device="desktop"] .device-screen{border-radius:8px}.phone-island{display:none;position:absolute;top:17px;left:50%;z-index:5;width:76px;height:20px;border-radius:999px;background:#111218;transform:translateX(-50%)}.device-wrap[data-device="phone"] .phone-island{display:block}.laptop-base{display:none;width:760px;height:18px;margin-top:-2px;border-radius:2px 2px 22px 22px;background:linear-gradient(180deg,#d9dae1,#f6f6f8 35%,#a7a9b3);box-shadow:0 13px 18px rgba(27,25,51,.22)}.laptop-base:before{content:"";display:block;width:115px;height:5px;margin:auto;border-radius:0 0 8px 8px;background:#afb0b8}.device-wrap[data-device="laptop"] .laptop-base{display:block}.desktop-stand{display:none;width:210px;height:115px;margin-top:-1px}.desktop-stand i{display:block;width:76px;height:83px;margin:auto;background:linear-gradient(90deg,#a9abb4,#e6e7eb 50%,#a6a8b1)}.desktop-stand b{display:block;width:210px;height:17px;border-radius:50% 50% 8px 8px;background:linear-gradient(#d8d9df,#989aa5);box-shadow:0 12px 18px rgba(20,20,44,.2)}.device-wrap[data-device="desktop"] .desktop-stand{display:block}
.sample-site{width:100%;height:100%;overflow:hidden;background:#faf8f4;color:#252638;font-family:Arial,sans-serif}.sample-nav{display:flex;align-items:center;justify-content:space-between;height:9%;padding:0 5%;font-size:clamp(5px,.72vw,10px);font-weight:700}.sample-logo{display:flex;align-items:center;gap:.4em;font-size:1.15em}.sample-logo i{width:1.1em;height:1.1em;border-radius:40% 60% 50% 45%;background:#6c5ce7;box-shadow:.45em .25em 0 #ffb563}.sample-nav>b{padding:.65em 1em;border-radius:999px;background:#282a40;color:#fff}.sample-hero{position:relative;display:flex;height:68%;flex-direction:column;align-items:center;justify-content:center;padding:4%;text-align:center;background:radial-gradient(circle at 50% 42%,#efe8ff 0 22%,transparent 45%)}.sample-hero:before,.sample-hero:after{content:"";position:absolute;border-radius:50%}.sample-hero:before{top:13%;left:10%;width:10%;aspect-ratio:1;background:#f9c75d}.sample-hero:after{right:10%;bottom:15%;width:13%;aspect-ratio:1;border:1em solid #88d6cb}.sample-hero small{color:#6958dd;font-size:clamp(4px,.62vw,9px);font-weight:800;letter-spacing:.13em}.sample-hero h2{margin:.25em 0;font:700 clamp(19px,4.5vw,64px)/.94 Georgia,serif;letter-spacing:-.055em}.sample-hero h2 em{color:#6c5ce7;font-weight:400}.sample-hero p{max-width:50%;margin:0 0 1.1em;color:#6f7080;font-size:clamp(5px,.75vw,11px);line-height:1.5}.sample-hero button{padding:.85em 1.15em;border:0;border-radius:999px;background:#25273d;color:#fff;font-size:clamp(5px,.68vw,10px);font-weight:700}.sample-hero button span{margin-left:.8em}.sample-cards{display:grid;height:23%;grid-template-columns:repeat(3,1fr);gap:3%;padding:0 5% 4%}.sample-cards i{border-radius:10px;background:linear-gradient(135deg,#dcd5f8,#fbf9ff)}.sample-cards i:nth-child(2){background:linear-gradient(135deg,#bee9df,#effbf9)}.sample-cards i:nth-child(3){background:linear-gradient(135deg,#f9deb1,#fff9ed)}.device-wrap[data-device="phone"] .sample-nav>span:nth-child(2){display:none}.device-wrap[data-device="phone"] .sample-hero p{max-width:76%}.device-wrap[data-device="phone"] .sample-cards{grid-template-columns:1fr 1fr}.device-wrap[data-device="phone"] .sample-cards i:last-child{display:none}
.screen-loader{position:absolute;inset:0;z-index:7;display:grid;place-content:center;gap:10px;background:rgba(255,255,255,.94);color:#77798d;text-align:center;font-size:11px;font-weight:800}.screen-loader i{width:24px;height:24px;margin:auto;border:3px solid #e5e2fa;border-top-color:var(--violet);border-radius:50%;animation:spin .75s linear infinite}.stage-tip{position:absolute;right:14px;bottom:12px;padding:7px 9px;border:1px solid rgba(255,255,255,.2);border-radius:9px;background:rgba(21,19,48,.45);color:rgba(255,255,255,.78);font-size:.59rem;font-weight:750;backdrop-filter:blur(8px)}.stage-tip kbd{padding:2px 5px;border:1px solid rgba(255,255,255,.25);border-radius:4px;background:rgba(255,255,255,.12);color:#fff;font:800 .58rem inherit}.stage-tip b{margin:0 4px}.stage-footer{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:13px;color:#85869a;font-size:.67rem;font-weight:750}.stage-footer>span{display:flex;align-items:center;gap:7px}.privacy-dot{width:7px;height:7px;border-radius:50%;background:var(--mint)}.stage-footer button{display:flex;align-items:center;gap:7px;min-height:34px;padding:0 10px;border:1px solid var(--border);border-radius:9px;background:#fff;color:#626479;font-size:.64rem;font-weight:850}
.compare-preview{width:100%;height:100%;align-content:center}.compare-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.compare-card{overflow:hidden;border:1px solid rgba(255,255,255,.26);border-radius:15px;background:rgba(23,21,54,.26);box-shadow:0 18px 34px rgba(30,24,80,.18);backdrop-filter:blur(10px)}.compare-label{display:flex;align-items:center;justify-content:space-between;padding:9px 11px;color:#fff;font-size:.6rem;font-weight:850}.compare-label small{color:rgba(255,255,255,.65);font-size:.55rem}.mini-device{display:grid;height:218px;place-items:center;padding:11px;background:rgba(255,255,255,.09)}.mini-shell{position:relative;overflow:hidden;padding:5px;border-radius:10px;background:#171820;box-shadow:0 13px 24px rgba(19,17,40,.32)}.mini-shell .mini-screen{width:100%;height:100%;overflow:hidden;border-radius:6px;background:#fff}.mini-screen iframe,.mini-screen img{width:100%;height:100%;border:0;object-fit:cover;object-position:top}.mini-screen .sample-site{font-size:5px}.compare-card[data-device="phone"] .mini-shell{width:91px;height:190px;border-radius:15px}.compare-card[data-device="tablet"] .mini-shell{width:139px;height:185px}.compare-card[data-device="laptop"] .mini-shell{width:244px;height:153px}.compare-card[data-device="desktop"] .mini-shell{width:252px;height:142px}
.controls-panel{padding:20px;background:#fff}.controls-panel>.panel-heading{padding-bottom:14px;border-bottom:1px solid var(--border)}.reset-button{min-height:34px;padding:0 10px;border:1px solid var(--border);border-radius:9px;background:#fff;color:#747588;font-size:.64rem;font-weight:850}.control-section{padding:15px 0;border-bottom:1px solid var(--border)}.control-title{display:block;margin-bottom:9px;color:#55576b;font-size:.67rem;font-weight:850}.source-tabs{display:grid;grid-template-columns:1fr 1fr;padding:3px;border-radius:10px;background:#f1eff7}.source-tabs button{min-height:34px;border:0;border-radius:8px;background:transparent;color:#858698;font-size:.65rem;font-weight:850}.source-tabs button.active{background:#fff;color:var(--violet);box-shadow:0 4px 12px rgba(54,43,120,.1)}.source-panel{margin-top:10px}.source-panel>label:not(.upload-box){display:block;margin-bottom:6px;color:#7a7b8d;font-size:.6rem;font-weight:800}.url-field{display:flex;gap:7px}.url-field input{min-width:0;flex:1;height:40px;padding:0 10px;border:1px solid var(--border);border-radius:10px;outline:0;color:#3e4054;font-size:.68rem}.url-field input:focus{border-color:var(--violet);box-shadow:0 0 0 3px rgba(103,87,232,.1)}.url-field button,.apply-size{min-height:40px;padding:0 12px;border:0;border-radius:10px;background:#373060;color:#fff;font-size:.64rem;font-weight:850}.source-panel>small{display:block;margin-top:7px;color:#9a9aaa;font-size:.57rem;line-height:1.45}.upload-box{display:flex;align-items:center;gap:9px;min-height:56px;padding:8px 10px;border:1px dashed #bcb6db;border-radius:11px;background:#faf9ff;cursor:pointer}.upload-box input{position:absolute;width:1px;height:1px;opacity:0}.upload-box>span:first-of-type{display:grid;flex:0 0 32px;height:32px;place-items:center;border-radius:8px;background:#ece9ff;color:var(--violet);font-size:.9rem;font-weight:900}.upload-box strong,.upload-box small{display:block}.upload-box strong{font-size:.67rem}.upload-box small{margin-top:3px;color:#9192a4;font-size:.57rem}.sample-link{margin-top:7px;padding:0;border:0;background:transparent;color:var(--violet);font-size:.59rem;font-weight:850}.control-heading{display:flex;align-items:center;justify-content:space-between}.rotate-button{display:flex;align-items:center;gap:5px;margin-top:-3px;padding:5px 7px;border:1px solid var(--border);border-radius:8px;background:#fff;color:#77788c;font-size:.59rem;font-weight:850}.device-picker{display:grid;grid-template-columns:1fr 1fr;gap:7px}.device-picker button{display:flex;align-items:center;gap:9px;min-width:0;min-height:53px;padding:8px;border:1px solid var(--border);border-radius:11px;background:#fff;color:#77798c;text-align:left}.device-picker button:hover,.device-picker button.active{border-color:#c3bdec;background:#f3f1ff;color:var(--violet);box-shadow:0 5px 14px rgba(75,61,150,.07)}.device-picker strong,.device-picker small{display:block}.device-picker strong{font-size:.65rem}.device-picker small{margin-top:2px;color:#9b9cac;font-size:.54rem}.device-icon{position:relative;display:block;flex:0 0 26px;height:26px}.device-icon:before{content:"";position:absolute;border:2px solid currentColor}.device-icon.phone:before{top:1px;left:8px;width:11px;height:22px;border-radius:4px}.device-icon.tablet:before{top:0;left:5px;width:16px;height:23px;border-radius:4px}.device-icon.laptop:before{top:4px;left:2px;width:21px;height:14px;border-radius:3px}.device-icon.laptop:after{content:"";position:absolute;left:0;bottom:4px;width:26px;height:3px;border-radius:0 0 5px 5px;background:currentColor}.device-icon.desktop:before{top:1px;left:1px;width:23px;height:16px;border-radius:3px}.device-icon.desktop:after{content:"";position:absolute;left:9px;bottom:2px;width:9px;height:7px;border-bottom:2px solid currentColor;border-left:2px solid transparent;border-right:2px solid transparent}.dimension-fields{display:grid;grid-template-columns:1fr 12px 1fr;align-items:end;gap:6px}.dimension-fields>b{padding-bottom:10px;color:#aaaaba;font-size:.7rem}.dimension-fields label>span:first-child{display:block;margin-bottom:5px;color:#8a8b9d;font-size:.57rem;font-weight:750}.dimension-fields label>span:last-child{display:flex;align-items:center;height:37px;padding:0 7px;border:1px solid var(--border);border-radius:9px;color:#a1a1af;background:#fbfbfd;font-size:.58rem}.dimension-fields input{min-width:0;width:100%;border:0;outline:0;background:transparent;color:#4b4d60;font-size:.65rem;font-weight:800}.apply-size{width:100%;min-height:35px;margin-top:8px;background:#f0edff;color:var(--violet)}.theme-picker{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.theme-picker button{height:35px;border:3px solid #fff;border-radius:10px;box-shadow:0 0 0 1px var(--border)}.theme-picker button.active{box-shadow:0 0 0 2px var(--violet)}.theme-picker .aurora{background:linear-gradient(135deg,#6757e8,#00b894)}.theme-picker .citrus{background:linear-gradient(135deg,#ff7a59,#f5c84c,#e35caa)}.theme-picker .midnight{background:linear-gradient(135deg,#17182f,#4e46a2,#08766d)}.theme-picker .paper{background:linear-gradient(135deg,#fffdf7,#d8d2e5)}.zoom-section label>span{display:flex;align-items:center;justify-content:space-between;margin-bottom:7px;color:#57596e;font-size:.65rem}.zoom-section output{color:var(--violet);font-weight:850}.zoom-section input{width:100%;height:4px;accent-color:var(--violet)}.compare-callout{display:grid;grid-template-columns:42px 1fr;gap:10px;margin-top:15px;padding:13px;border-radius:15px;background:linear-gradient(135deg,#29244e,#44368d);color:#fff}.compare-callout>span{display:grid;height:42px;place-items:center;border-radius:11px;background:rgba(255,255,255,.12);font-size:.73rem;font-weight:900}.compare-callout strong,.compare-callout small{display:block}.compare-callout strong{font-size:.68rem}.compare-callout small{margin-top:4px;color:rgba(255,255,255,.62);font-size:.57rem;line-height:1.4}.compare-callout button{grid-column:1/-1;min-height:36px;border:0;border-radius:9px;background:linear-gradient(135deg,#7c6bed,#9a78ed);color:#fff;font-size:.64rem;font-weight:900}.privacy-note{margin:15px 0 0;text-align:center;color:#85869a;font-size:.74rem}
.content-section{padding:74px 0;background:#fff}.content-section.alt{background:#f8f7fc}.content{max-width:1000px}.content-intro{max-width:785px}.section-kicker{color:var(--violet);font-size:.68rem;font-weight:900;text-transform:uppercase;letter-spacing:.11em}.content h2{margin:10px 0 14px;color:var(--ink);font-size:clamp(1.65rem,3vw,2.35rem);letter-spacing:-.04em}.content p{color:#66687c;line-height:1.75}.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:34px}.feature-grid article,.tip-card,.how-to li{border:1px solid var(--border);border-radius:18px;background:#fff;box-shadow:0 10px 30px rgba(52,42,120,.055)}.feature-grid article{padding:22px}.feature-grid article>span,.how-to li>span{display:grid;width:34px;height:34px;place-items:center;border-radius:10px;background:#efedff;color:var(--violet);font-size:.69rem;font-weight:900}.feature-grid h3{margin:16px 0 7px;font-size:1rem}.feature-grid p{margin:0;font-size:.86rem}.how-to{display:grid;grid-template-columns:.8fr 1.2fr;gap:50px;align-items:start}.how-to ol{display:grid;gap:10px;padding:0;margin:0;list-style:none}.how-to li{display:flex;gap:15px;padding:18px}.how-to li>span{flex:0 0 34px}.how-to h3{margin:1px 0 5px;font-size:.91rem}.how-to li p{margin:0;font-size:.83rem}.prose-content{max-width:880px}.tip-card{display:flex;align-items:center;gap:20px;margin-top:28px;padding:22px}.tip-card>span{display:grid;flex:0 0 90px;height:74px;place-items:center;border-radius:18px;background:linear-gradient(135deg,#ece9ff,#dff8f1);color:var(--violet);font:900 .75rem ui-monospace,SFMono-Regular,Consolas,monospace}.tip-card h3{margin:0 0 5px;font-size:1rem}.tip-card p{margin:0;font-size:.86rem}.faq{display:grid;gap:10px;margin-top:24px}.faq details{border:1px solid var(--border);border-radius:14px;background:#fff}.faq summary{padding:17px 20px;cursor:pointer;color:#35374d;font-size:.91rem;font-weight:800}.faq details p{margin:0;padding:0 20px 18px;font-size:.86rem}.try-heading{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:24px}.try-heading h2{margin-bottom:5px}.try-heading p{margin:0}.try-heading>a{color:var(--violet);font-size:.82rem;font-weight:850;white-space:nowrap}.try-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.try-card{display:flex;align-items:center;gap:13px;padding:17px;border:1px solid var(--border);border-radius:16px;background:#fff;color:#34364c;box-shadow:0 8px 24px rgba(52,42,120,.05);transition:.2s}.try-card:hover{border-color:#c9c3ef;transform:translateY(-3px);box-shadow:0 14px 30px rgba(52,42,120,.1)}.try-icon{display:grid;flex:0 0 47px;height:47px;place-items:center;border-radius:13px;background:#efedff;color:var(--violet);font-size:.62rem;font-weight:900}.try-card strong,.try-card small{display:block}.try-card strong{font-size:.84rem}.try-card small{margin-top:4px;color:#85869a;font-size:.71rem}.toast{position:fixed;left:50%;bottom:28px;z-index:80;padding:11px 16px;border-radius:999px;background:#20213a;color:#fff;font-size:.76rem;font-weight:800;box-shadow:0 12px 35px rgba(31,33,58,.25);opacity:0;transform:translate(-50%,20px);pointer-events:none;transition:.25s}.toast.show{opacity:1;transform:translate(-50%,0)}.sparkle-layer{position:fixed;inset:0;z-index:75;overflow:hidden;pointer-events:none}.sparkle-layer i{position:absolute;top:-18px;width:8px;height:12px;border-radius:3px;animation:sparkle-fall 1.2s ease-in forwards}.stage-panel.presentation{position:fixed;inset:0;z-index:70;display:flex;flex-direction:column;padding:18px;background:#111224}.stage-panel.presentation .panel-heading{color:#fff}.stage-panel.presentation .preview-stage{flex:1;min-height:0}.stage-panel.presentation .stage-footer{color:#ccc}.stage-panel.presentation .stage-footer button{border-color:#45465b;background:#292a3c;color:#fff}
@keyframes pulse{50%{opacity:.45;transform:scale(.78)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes sparkle-fall{to{opacity:.08;transform:translate(var(--drift),105vh) rotate(680deg)}}
@media(max-width:1060px){.studio-topbar{align-items:flex-start;flex-wrap:wrap}.view-switch{order:3;justify-content:flex-start;flex-basis:100%}.studio-grid{grid-template-columns:1fr}.stage-panel{border-right:0;border-bottom:1px solid var(--border)}.preview-stage{min-height:610px}.feature-grid{grid-template-columns:1fr}.how-to{grid-template-columns:1fr}.try-grid{grid-template-columns:1fr}}
@media(max-width:700px){.preview-hero{padding:28px 0 52px}.preview-studio{border-radius:19px}.studio-topbar,.stage-panel,.controls-panel{padding:14px}.studio-status{min-width:0}.preview-stage{min-height:530px;padding:18px 8px}.compare-grid{gap:8px}.compare-card[data-device="laptop"] .mini-shell,.compare-card[data-device="desktop"] .mini-shell{width:145px}.mini-device{height:178px;padding:6px}.compare-card[data-device="phone"] .mini-shell{width:72px;height:150px}.compare-card[data-device="tablet"] .mini-shell{width:105px;height:140px}.compare-card[data-device="laptop"] .mini-shell{height:91px}.compare-card[data-device="desktop"] .mini-shell{height:82px}.stage-tip{display:none}.stage-footer{align-items:flex-start;flex-direction:column}.device-picker{grid-template-columns:1fr 1fr}.content-section{padding:56px 0}.try-heading,.tip-card{align-items:flex-start;flex-direction:column}.tip-card>span{width:90px;flex-basis:60px}.intro h1{font-size:clamp(2.35rem,13vw,3.6rem)}}
@media(max-width:430px){.preview-stage{min-height:470px}.compare-grid{grid-template-columns:1fr 1fr}.compare-label{padding:7px}.mini-device{height:143px}.compare-card[data-device="phone"] .mini-shell{width:58px;height:121px}.compare-card[data-device="tablet"] .mini-shell{width:83px;height:111px}.compare-card[data-device="laptop"] .mini-shell{width:112px;height:71px}.compare-card[data-device="desktop"] .mini-shell{width:116px;height:66px}.device-picker{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.device-preview-page *{scroll-behavior:auto!important}.device-wrap,.preview-stage,.surprise-button,.try-card,.toast{transition:none}.live-pill i,.screen-loader i,.sparkle-layer i{animation:none}}