:root{--purple:#4f46e5;--purple-dark:#312e81;--purple-soft:#eef2ff;--navy:#253b80;--teal:#1b9187;--orange:#f2a13a;--pink:#d83f8c;--ink:#252733;--muted:#6c7080;--line:#e4deeb;--bg:#faf9fc;--white:#fff;--shadow:0 18px 50px rgba(54,27,83,.11)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:92px}body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-size:16px;line-height:1.65}.shell{width:min(1280px,calc(100% - 40px));margin-inline:auto}button,input{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer}.site-header{height:72px;padding:0 max(24px,calc((100% - 1280px)/2));display:flex;align-items:center;justify-content:space-between;background:#312e81;border-bottom:1px solid rgba(255,255,255,.2);position:sticky;top:0;z-index:50}.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:#fff;font-weight:800}.brand img{height:40px;width:auto;object-fit:contain}.open-app{background:#fde047;color:#111827;text-decoration:none;border-radius:999px;padding:10px 18px;font-weight:750;font-size:.9rem}.intro{display:grid;grid-template-columns:.92fr 1.08fr;gap:58px;padding-block:70px 62px;align-items:center}.eyebrow,.nav-label,.tip-label{margin:0 0 13px;color:var(--purple);font-size:.78rem;font-weight:850;letter-spacing:.11em}.intro h1{font-size:clamp(2.7rem,5vw,4.85rem);line-height:1.02;letter-spacing:-.055em;margin:0;color:var(--purple-dark)}.intro h1 span{color:var(--purple)}.lead{font-size:1.13rem;color:var(--muted);max-width:640px;margin:24px 0}.search-box{height:58px;display:flex;align-items:center;gap:13px;padding:0 14px 0 18px;background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:0 10px 30px rgba(49,46,129,.06);transition:.2s}.search-box:focus-within{border-color:var(--purple);box-shadow:0 0 0 4px rgba(79,70,229,.1)}.search-box svg{width:23px;fill:none;stroke:var(--purple);stroke-width:2}.search-box input{min-width:0;flex:1;border:0;outline:0;background:transparent;font-size:1rem;color:var(--ink)}kbd{border:1px solid var(--line);border-bottom-width:2px;border-radius:7px;padding:3px 8px;color:var(--muted);font-size:.72rem;background:var(--bg)}.quick-paths{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:14px}.quick-paths button{position:relative;text-align:left;min-height:104px;padding:17px 16px 15px 55px;border:1px solid var(--line);border-radius:16px;background:#fff;color:var(--ink);transition:.2s}.quick-paths button:hover{transform:translateY(-2px);border-color:var(--purple);box-shadow:0 12px 25px rgba(49,46,129,.08)}.quick-paths button>span{position:absolute;left:16px;top:18px;width:28px;height:28px;display:grid;place-items:center;border-radius:9px;background:var(--purple-soft);color:var(--purple);font-size:.72rem;font-weight:850}.quick-paths b,.quick-paths small{display:block}.quick-paths b{font-size:.93rem;line-height:1.3}.quick-paths small{font-size:.76rem;color:var(--muted);margin-top:5px}.quick-paths .primary{background:var(--purple);color:#fff;border-color:var(--purple)}.quick-paths .primary>span{background:rgba(255,255,255,.17);color:#fff}.quick-paths .primary small{color:rgba(255,255,255,.76)}.video-card{background:#fff;border:1px solid var(--line);border-radius:24px;overflow:hidden;box-shadow:var(--shadow)}.video-topline{height:50px;padding:0 18px;display:flex;align-items:center;justify-content:space-between;color:var(--muted);font-size:.73rem;font-weight:800;letter-spacing:.06em}.video-topline span:first-child{color:var(--purple)}.video-card video{display:block;width:100%;aspect-ratio:16/9;background:#130d19}.video-chapters{display:flex;gap:6px;padding:12px;overflow:auto}.video-chapters button{flex:0 0 auto;border:0;background:var(--purple-soft);color:var(--purple-dark);font-size:.73rem;font-weight:750;padding:7px 10px;border-radius:999px}.video-chapters button:hover,.video-chapters button.active{background:var(--purple);color:#fff}.workspace{display:grid;grid-template-columns:210px minmax(0,1fr) 230px;gap:26px;align-items:start;padding-bottom:110px}.step-nav{position:sticky;top:96px}.step-nav nav{display:grid;gap:4px}.step-nav nav a{position:relative;display:flex;align-items:center;gap:10px;min-height:45px;padding:8px 10px;color:var(--muted);text-decoration:none;border-radius:11px;font-size:.86rem;font-weight:700;transition:.18s}.step-nav nav a span{width:26px;height:26px;display:grid;place-items:center;border-radius:8px;background:#fff;border:1px solid var(--line);font-size:.7rem;color:var(--purple)}.step-nav nav a:hover,.step-nav nav a.active{background:var(--purple-soft);color:var(--purple-dark)}.step-nav nav a.active:before{content:"";position:absolute;left:-9px;width:4px;height:25px;border-radius:9px;background:var(--purple)}.step-nav nav a.done span{background:var(--teal);border-color:var(--teal);color:#fff}.nav-progress{margin-top:22px;padding:16px;background:#fff;border:1px solid var(--line);border-radius:14px}.nav-progress>div:first-child{display:flex;justify-content:space-between;font-size:.75rem}.nav-progress strong{color:var(--purple)}.progress-track{height:7px;background:var(--purple-soft);border-radius:99px;margin:10px 0 8px;overflow:hidden}.progress-track i{display:block;width:0;height:100%;background:linear-gradient(90deg,var(--purple),#60a5fa);border-radius:inherit;transition:.3s}.nav-progress small{display:block;color:var(--muted);font-size:.68rem}.guide-column{min-width:0}.mobile-step-nav{display:none}.guide-card{background:#fff;border:1px solid var(--line);border-radius:19px;margin-bottom:13px;overflow:hidden;scroll-margin-top:94px;transition:box-shadow .2s,border-color .2s}.guide-card[open]{border-color:rgba(79,70,229,.42);box-shadow:0 15px 40px rgba(49,46,129,.07)}.guide-card summary{list-style:none;display:grid;grid-template-columns:54px minmax(0,1fr) auto;gap:15px;align-items:center;padding:19px 20px;cursor:pointer;user-select:none}.guide-card summary::-webkit-details-marker{display:none}.step-number{width:48px;height:48px;display:grid;place-items:center;border-radius:14px;background:var(--purple-soft);color:var(--purple);font-weight:900}.summary-copy strong,.summary-copy span{display:block}.summary-copy strong{font-size:1.03rem;color:var(--purple-dark)}.summary-copy span{font-size:.79rem;color:var(--muted);margin-top:2px}.summary-meta{display:flex;align-items:center;gap:10px}.duration{font-size:.72rem;color:var(--muted);background:var(--bg);padding:5px 8px;border-radius:999px}.chevron{width:31px;height:31px;display:grid;place-items:center;border-radius:50%;background:var(--purple-soft);color:var(--purple);font-size:1.1rem;transition:.2s}.guide-card[open] .chevron{transform:rotate(45deg);background:var(--purple);color:#fff}.guide-content{border-top:1px solid var(--line);padding:25px}.outcome{display:flex;gap:12px;align-items:flex-start;background:linear-gradient(135deg,var(--purple-soft),#fff);padding:16px 18px;border-radius:14px;margin-bottom:22px}.outcome b{color:var(--purple-dark)}.outcome span{color:var(--muted);font-size:.9rem}.content-grid{display:grid;grid-template-columns:minmax(0,1fr) 255px;gap:22px}.instruction h3{font-size:.82rem;letter-spacing:.08em;color:var(--purple);margin:0 0 11px}.instruction ol{margin:0;padding:0;list-style:none;counter-reset:steps}.instruction ol li{counter-increment:steps;position:relative;padding:0 0 16px 42px}.instruction ol li:before{content:counter(steps);position:absolute;left:0;top:0;width:27px;height:27px;display:grid;place-items:center;border-radius:8px;background:var(--purple-dark);color:#fff;font-size:.72rem;font-weight:850}.instruction ol li b{color:var(--purple-dark)}.media-box{border-radius:15px;overflow:hidden;background:var(--bg);border:1px solid var(--line)}.media-box img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;cursor:zoom-in}.media-box figcaption{padding:10px 12px;color:var(--muted);font-size:.74rem}.tip-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px}.mini-note{padding:13px 14px;border-radius:12px;background:#f5f8ff;border:1px solid #dce4fb;font-size:.8rem;color:#46506d}.mini-note.warning{background:#fff8ed;border-color:#f7dfb8;color:#785426}.mini-note b{display:block;margin-bottom:3px}.step-actions{display:flex;flex-wrap:wrap;gap:9px;padding-top:20px;margin-top:20px;border-top:1px solid var(--line)}.step-actions button{border:0;border-radius:10px;padding:10px 13px;font-size:.8rem;font-weight:800}.watch-step{background:var(--purple);color:#fff}.mark-done{background:var(--purple-soft);color:var(--purple-dark)}.mark-done.is-done{background:#e5f6f3;color:#12675f}.copy-link{background:var(--bg);color:var(--muted)}.problem-box{margin-top:13px;padding:15px;background:#fff8ed;border:1px solid #f7dfb8;border-radius:12px;font-size:.84rem}.problem-box[hidden]{display:none}.faq-list{display:grid;gap:8px}.faq-list details{border:1px solid var(--line);border-radius:11px;padding:12px 14px}.faq-list summary{font-weight:750;cursor:pointer}.faq-list p{margin:8px 0 2px;color:var(--muted)}.tips-column{position:relative}.sticky-tip{position:sticky;top:96px}.tip-card{background:var(--purple-dark);color:#fff;border-radius:19px;padding:21px}.tip-card h2{font-size:1.45rem;line-height:1.18;margin:8px 0 16px}.tip-icon{font-size:1.4rem;color:#e5c9ff}.tip-card .tip-label{color:#d9c3ec}.tip-card ul{padding-left:18px;margin:0;color:rgba(255,255,255,.78);font-size:.8rem}.tip-card.compact{margin-top:13px;background:#fff;color:var(--ink);border:1px solid var(--line)}.tip-card.compact .tip-label{color:var(--purple)}.tip-card.compact a{display:flex;justify-content:space-between;color:var(--purple-dark);font-size:.84rem;font-weight:800;text-decoration:none}.search-state{background:var(--purple-soft);color:var(--purple-dark);padding:12px 15px;border-radius:12px;margin-bottom:12px;font-size:.85rem}.no-results{text-align:center;background:#fff;border:1px dashed var(--line);padding:42px;border-radius:18px}.no-results p{color:var(--muted)}.no-results button{border:0;background:var(--purple);color:#fff;border-radius:10px;padding:10px 14px}.image-lightbox{position:fixed;inset:0;z-index:100;background:rgba(22,12,31,.88);display:grid;place-items:center;padding:40px}.image-lightbox[hidden]{display:none}.image-lightbox img{max-width:min(1200px,92vw);max-height:88vh;border-radius:12px}.image-lightbox button{position:absolute;right:24px;top:18px;background:#fff;color:var(--purple-dark);border:0;width:42px;height:42px;border-radius:50%;font-size:1.6rem}
.product-switcher{position:sticky;top:72px;z-index:40;background:rgba(250,249,252,.94);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.product-switcher-inner{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding-block:11px}
.product-switcher button{display:flex;align-items:center;gap:12px;min-height:64px;padding:9px 13px;text-align:left;border:1px solid var(--line);border-radius:15px;background:#fff;color:var(--ink);transition:.2s}
.product-switcher button:hover{border-color:rgba(79,70,229,.55);transform:translateY(-1px)}
.product-switcher button.active{border-color:var(--purple);background:linear-gradient(135deg,var(--purple-dark),var(--purple));color:#fff;box-shadow:0 10px 24px rgba(49,46,129,.18)}
.product-switcher button>span:last-child,.product-switcher b,.product-switcher small{display:block}.product-switcher b{font-size:.88rem;line-height:1.2}.product-switcher small{font-size:.7rem;color:var(--muted);margin-top:3px}.product-switcher button.active small{color:rgba(255,255,255,.72)}
.product-icon{flex:0 0 auto;width:36px;height:36px;display:grid;place-items:center;border-radius:11px;background:var(--purple-soft);color:var(--purple);font-weight:900}.product-switcher button.active .product-icon{background:rgba(255,255,255,.16);color:#fff}
.intro{padding-block:54px 52px}.intro h1{font-size:clamp(2.55rem,4.5vw,4.35rem)}
.step-nav,.sticky-tip{top:174px}.guide-card{scroll-margin-top:174px}
.video-stage{background:#130d19}.portrait-stage{display:grid;place-items:center;padding:18px;background:radial-gradient(circle at 50% 25%,#8f61bf 0,#3d2058 42%,#190d24 100%)}
.video-card .portrait-stage video{width:auto;max-width:100%;height:min(610px,64vh);aspect-ratio:884/1920;object-fit:contain;border-radius:19px;box-shadow:0 18px 55px rgba(0,0,0,.35)}
.phone-shot{background:linear-gradient(155deg,#eee8f5,#faf9fc);padding-top:10px}.media-box.phone-shot img{height:440px;aspect-ratio:auto;object-fit:contain;cursor:zoom-in}
.media-box{position:relative}.zoom-hint,.image-step{position:absolute;z-index:2;top:10px;right:10px;padding:5px 9px;border-radius:999px;background:rgba(36,19,51,.82);color:#fff;font-size:.66rem;font-weight:800;backdrop-filter:blur(8px)}.image-step{left:10px;right:auto}.media-gallery{min-width:0}.media-gallery .media-box{margin:0}.media-gallery .is-hidden{display:none}.gallery-controls{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;margin-top:10px}.gallery-controls>button{border:1px solid var(--line);background:#fff;color:var(--purple-dark);border-radius:10px;padding:8px 11px;font-size:.75rem;font-weight:800}.gallery-controls>div{display:flex;justify-content:center;gap:6px}.gallery-controls [data-gallery-dot]{width:8px;height:8px;padding:0;border:0;border-radius:50%;background:#d9cde7}.gallery-controls [data-gallery-dot].active{width:22px;border-radius:99px;background:var(--purple)}.step-pager{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:18px;padding-top:16px;border-top:1px dashed var(--line)}.step-pager button,.step-pager a{border:0;border-radius:10px;padding:10px 13px;background:var(--purple-soft);color:var(--purple-dark);font:inherit;font-size:.8rem;font-weight:850;text-decoration:none}.step-pager .next-step,.step-pager a{background:var(--purple-dark);color:#fff}
.tip-card[hidden]{display:none}
.main-links{display:flex;align-items:center;gap:18px;margin-left:auto;margin-right:18px}.main-links a,.main-links button{border:0;background:none;text-decoration:none;color:#fff;font:inherit;font-size:.82rem;font-weight:800;padding:4px;cursor:pointer}.main-links a:hover,.main-links button:hover{color:#fff;background:rgba(255,255,255,.1);border-radius:6px;}
@media(max-width:1080px){.main-links{display:none}.intro{grid-template-columns:1fr;gap:30px}.intro-copy{max-width:800px}.workspace{grid-template-columns:190px minmax(0,1fr)}.tips-column{display:none}.intro-visual{max-width:900px}.content-grid{grid-template-columns:1fr 230px}}
@media(max-width:760px){html{scroll-padding-top:76px}.shell{width:min(100% - 24px,680px)}.site-header{height:62px;padding:0 14px}.brand img{height:34px;width:auto}.brand span{font-size:.82rem}.open-app{font-size:.76rem;padding:8px 12px}.intro{padding-block:35px 34px;gap:25px}.intro h1{font-size:2.45rem}.lead{font-size:1rem;margin:18px 0}.search-box{height:54px}.search-box kbd{display:none}.quick-paths{grid-template-columns:1fr}.quick-paths button{min-height:84px}.video-topline{font-size:.65rem}.video-chapters{padding:9px}.workspace{display:block;width:100%;padding-bottom:70px}.step-nav{display:none}.mobile-step-nav{position:sticky;top:62px;z-index:20;display:flex;gap:7px;overflow:auto;background:#312e81;backdrop-filter:blur(10px);padding:10px 12px;border-block:1px solid var(--line);margin-bottom:10px}.mobile-step-nav a{flex:0 0 auto;width:36px;height:36px;display:grid;place-items:center;border-radius:10px;text-decoration:none;background:#fff;border:1px solid var(--line);color:var(--purple);font-weight:850;font-size:.75rem}.mobile-step-nav a.active{background:var(--purple);color:#fff}.guide-column{width:calc(100% - 24px);margin:auto}.guide-card summary{grid-template-columns:43px minmax(0,1fr) auto;padding:15px 14px;gap:11px}.step-number{width:42px;height:42px}.summary-copy strong{font-size:.92rem}.summary-copy span{font-size:.72rem}.duration{display:none}.guide-content{padding:17px 14px}.content-grid{grid-template-columns:1fr}.media-box,.media-gallery{order:-1}.media-box img{aspect-ratio:16/10}.tip-row{grid-template-columns:1fr}.step-actions button{flex:1 1 45%}.step-pager{position:sticky;bottom:10px;z-index:5;padding:10px;background:rgba(255,255,255,.94);border:1px solid var(--line);border-radius:14px;box-shadow:0 12px 30px rgba(49,46,129,.13);backdrop-filter:blur(12px)}.image-lightbox{padding:15px}}
.compare-stage{position:relative;aspect-ratio:4/3;overflow:hidden;background:#eee}.compare-stage>img,.compare-after img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.compare-after{position:absolute;inset:0 auto 0 0;width:52%;overflow:hidden}.compare-after img{width:255px;max-width:none}.compare-stage input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;z-index:5}.compare-stage i{position:absolute;left:52%;top:0;bottom:0;width:3px;background:#fff;box-shadow:0 0 0 1px rgba(49,46,129,.25);transform:translateX(-1px);pointer-events:none}.compare-stage i:after{content:'↔';position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:38px;height:38px;display:grid;place-items:center;border-radius:50%;background:var(--purple);color:#fff;font-style:normal;font-weight:850;box-shadow:0 5px 18px rgba(0,0,0,.2)}.before-label,.after-label{position:absolute;top:10px;z-index:4;background:rgba(49,46,129,.85);color:#fff;border-radius:999px;padding:4px 8px;font-size:.62rem;font-weight:800;pointer-events:none}.before-label{right:9px}.after-label{left:9px}
@media(max-width:760px){
  html{scroll-padding-top:148px}.main-links{display:none}.product-switcher{top:62px}.product-switcher-inner{width:100%;gap:5px;padding:7px 8px}.product-switcher button{justify-content:center;gap:5px;min-height:55px;padding:7px 5px;border-radius:12px;text-align:center}.product-switcher .product-icon{width:28px;height:28px;border-radius:8px;font-size:.78rem}.product-switcher b{font-size:.72rem;line-height:1.12}.product-switcher small{display:none}.intro{padding-block:28px 32px}.intro h1{font-size:2.18rem}.eyebrow{font-size:.68rem}.mobile-step-nav{top:131px}.guide-card{scroll-margin-top:185px}.portrait-stage{padding:12px}.video-card .portrait-stage video{height:min(600px,63vh);border-radius:15px}.media-box.phone-shot img{height:min(540px,60vh);aspect-ratio:auto;object-fit:contain}.video-topline span:first-child{max-width:70%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}
