:root{color:#111827;background:#f7f8fb;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;-webkit-font-smoothing:antialiased}html,body,#root{width:100%;overflow-x:hidden}button,input{font:inherit}button{cursor:pointer}img,video{display:block;max-width:100%}.app-shell{min-height:100vh;background:linear-gradient(180deg,#fff,#f7f8fb 58%,#f4f6f8)}.topbar{position:sticky;top:0;z-index:20;display:grid;grid-template-columns:minmax(150px,1fr) auto minmax(150px,1fr);align-items:center;gap:24px;min-height:72px;padding:0 32px;border-bottom:1px solid #e3e7ee;background:#ffffffeb;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.brand{color:#05070b;font-size:23px;font-weight:850;letter-spacing:0}.brand span{color:#0aaa43}.stepper{display:flex;align-items:center;justify-content:center;min-width:420px;gap:14px;color:#667085;font-size:15px;font-weight:700}.step{display:flex;align-items:center;gap:10px;white-space:nowrap}.step span{display:grid;width:30px;height:30px;place-items:center;border-radius:999px;background:#8b96a6;color:#fff;font-size:14px;font-weight:850}.step.is-active{color:#08a13d}.step.is-active span{background:#08a13d}.step-line{width:116px;border-top:2px dashed #d1d7e0}.top-actions{display:flex;align-items:center;justify-content:flex-end;gap:12px}.ghost-button,.avatar-button,.icon-button,.source-menu,.source-tabs button,.thumb,.style-card,.package-option,.modal-close{border:1px solid #dce2ea;background:#fff;color:#172033}.ghost-button{min-height:40px;padding:0 16px;border-radius:8px;font-weight:700}.avatar-button{display:grid;width:39px;height:39px;place-items:center;border:0;border-radius:999px;background:#edf1f6;color:#1d2738;font-weight:850}.workspace{display:grid;grid-template-columns:minmax(620px,1fr) minmax(290px,330px) minmax(300px,360px);gap:18px;max-width:1640px;margin:0 auto;padding:28px 32px 42px}.primary-panel,.summary-panel,.video-panel{border:1px solid #dfe5ec;border-radius:8px;background:#ffffffe6;box-shadow:0 16px 40px #141f300d}.primary-panel{min-width:0;padding:24px}.url-section h1,.product-section h2,.style-section h2,.summary-panel h2,.video-panel h2,.checkout-modal h2{margin:0;color:#101828;letter-spacing:0}.url-section h1{font-size:28px;line-height:1.1;font-weight:850}.url-section p,.section-heading p,.video-panel-title p{margin:7px 0 0;color:#667085;font-size:15px;line-height:1.45}.url-row{display:grid;grid-template-columns:minmax(0,1fr) 184px;gap:16px;margin-top:22px}.url-input-wrap{display:flex;align-items:center;gap:12px;min-width:0;min-height:56px;padding:0 14px;border:1.5px solid #ccd5e1;border-radius:8px;background:#fff;color:#6b7280}.url-input-wrap:focus-within{border-color:#185cff;box-shadow:0 0 0 4px #185cff1a}.url-input-wrap input{width:100%;min-width:0;border:0;outline:0;color:#1f2937;background:transparent;font-size:15px}.icon-button{display:grid;width:34px;height:34px;flex:0 0 auto;place-items:center;border:0;border-radius:8px;color:#667085}.black-button{min-height:56px;border:0;border-radius:8px;background:#05070b;color:#fff;font-weight:800;box-shadow:0 12px 22px #05070b29}.black-button:disabled{cursor:not-allowed;background:#98a2b3;box-shadow:none}.product-section{margin-top:18px;padding-top:16px;border-top:1px solid #e7ebf0}.section-title-row,.video-panel-title{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;min-width:0}.inline-title{display:flex;align-items:center;gap:10px}.product-section h2,.style-section h2,.summary-panel h2,.video-panel h2{font-size:18px;line-height:1.2;font-weight:850}.ready-pill{display:inline-flex;align-items:center;gap:4px;min-height:24px;padding:0 10px;border-radius:999px;background:#dff8e6;color:#087a31;font-size:12px;font-weight:850}.source-menu{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 12px;border-radius:8px;color:#344054;font-weight:750}.product-preview-grid{display:grid;grid-template-columns:68px minmax(180px,.95fr) minmax(240px,1.05fr);gap:16px;margin-top:16px;align-items:stretch}.thumb-rail{display:grid;align-content:start;gap:9px}.thumb{overflow:hidden;width:68px;height:68px;padding:0;border-radius:8px;background:#f7f8fb}.thumb img{width:100%;height:100%;object-fit:cover}.thumb.is-selected{border-color:#08a13d;box-shadow:0 0 0 2px #08a13d2e}.hero-image{overflow:hidden;height:250px;border-radius:8px;background:#f1eee9}.hero-image img{width:100%;height:100%;object-fit:cover}.product-copy{min-width:0;padding:2px 0}.source-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px}.source-tabs button{display:inline-flex;align-items:center;gap:7px;min-height:36px;padding:0 12px;border-radius:8px;color:#344054;font-weight:760}.source-tabs button.is-selected{border-color:#185cff;color:#124ce0;background:#f2f6ff}.product-copy h3{margin:0;color:#111827;font-size:clamp(18px,1.4vw,22px);line-height:1.24;font-weight:850}.rating-row{display:flex;flex-wrap:wrap;align-items:center;gap:7px;margin-top:12px;color:#667085;font-size:14px}.stars{display:inline-flex;color:#f59e0b}.price{margin:12px 0;color:#101828;font-size:20px;font-weight:850}.benefit-list{display:grid;gap:9px;margin:0;padding:0;list-style:none;color:#526174;font-size:14px;line-height:1.35}.benefit-list li{display:grid;grid-template-columns:18px minmax(0,1fr);align-items:start;gap:8px}.benefit-list svg{color:#08a13d}.source-link{display:inline-flex;align-items:center;gap:7px;margin-top:16px;color:#1264d8;font-size:14px;font-weight:800;text-decoration:none}.style-section{margin-top:18px;padding-top:16px;border-top:1px solid #e7ebf0}.style-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:14px}.style-card{position:relative;display:grid;grid-template-rows:66px auto;gap:9px;min-height:148px;padding:12px;border-radius:8px;text-align:left;transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease,background .16s ease}.style-card:hover{transform:translateY(-1px);border-color:#bcc8d8}.style-card.is-selected{border-color:#08a13d;background:#f5fff8;box-shadow:0 0 0 2px #08a13d1f}.radio-dot,.package-radio{position:absolute;display:grid;width:20px;height:20px;place-items:center;border:1.5px solid #b7c0ce;border-radius:999px;background:#fff}.style-card .radio-dot{top:13px;left:13px}.style-card.is-selected .radio-dot,.package-option.is-selected .package-radio{border:6px solid #08a13d}.style-image{position:relative;overflow:hidden;border-radius:8px;background:#eff2f5}.style-image img{width:100%;height:100%;object-fit:cover}.play-chip{position:absolute;right:10px;bottom:10px;display:grid;width:38px;height:38px;place-items:center;border-radius:999px;background:#fff;color:#101828;box-shadow:0 6px 18px #1018282e}.style-copy{display:grid;gap:5px}.style-title{color:#101828;font-size:15px;font-weight:850}.style-desc{min-height:32px;color:#667085;font-size:12px;line-height:1.38}.style-accent{color:#0a7d34;font-size:11px;font-weight:850}.summary-panel,.video-panel{align-self:start;position:sticky;top:96px}.summary-panel{padding:28px 24px 24px}.package-list{display:grid;gap:14px;margin-top:22px}.package-option{position:relative;display:grid;grid-template-columns:30px minmax(0,1fr);gap:12px;min-height:72px;padding:16px;border-radius:8px;text-align:left}.package-option.is-selected{border-color:#08a13d;background:#f5fff8}.package-radio{position:static;margin-top:4px}.package-main{display:flex;flex-wrap:wrap;align-items:center;gap:10px;color:#344054}.package-main strong{color:#101828;font-size:19px}.package-main span{font-weight:780}.package-main em{padding:4px 8px;border-radius:999px;background:#08a13d;color:#fff;font-size:11px;font-style:normal;font-weight:850}.package-option small{grid-column:2;color:#667085;font-size:13px;line-height:1.35}.summary-divider{height:1px;margin:28px 0;background:#e5e9ef}.summary-list{display:grid;gap:22px;margin:0}.summary-list div{display:flex;align-items:center;justify-content:space-between;gap:16px}.summary-list dt{display:inline-flex;align-items:center;gap:10px;color:#667085;font-size:14px}.summary-list dd{margin:0;color:#344054;font-size:14px;font-weight:760;text-align:right}.guarantee-box{display:flex;align-items:flex-start;gap:12px;padding:15px;border:1px solid #cfe0f7;border-radius:8px;background:#f6fbff;color:#175cd3}.guarantee-box div{display:grid;gap:3px}.guarantee-box strong{font-size:14px}.guarantee-box span{color:#35649a;font-size:13px;line-height:1.35}.generate-button{display:inline-flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:58px;margin-top:22px;border:0;border-radius:8px;background:#08a13d;color:#fff;font-size:17px;font-weight:850;box-shadow:0 16px 30px #08a13d3d}.generate-button:hover{background:#079238}.secure-note{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;margin:15px 0 0;color:#667085;font-size:13px}.video-panel{padding:28px 24px 24px}.video-panel-title{align-items:flex-start;margin-bottom:12px}.video-panel-title h2 small{color:#667085;font-size:14px;font-weight:760}.video-panel-title span{flex:0 0 auto;min-width:44px;padding:6px 9px;border-radius:999px;background:#eff4ff;color:#124ce0;font-size:13px;font-weight:850;text-align:center}.phone-frame{overflow:hidden;width:min(100%,292px);margin:0 auto;border:1px solid #c9d1dc;border-radius:8px;background:#0b0d12;box-shadow:0 22px 48px #10182838}.phone-frame video{width:100%;aspect-ratio:9 / 16;object-fit:cover;background:#0b0d12}.preview-meta{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:18px;color:#344054;font-size:14px;font-weight:760}.preview-meta span{display:inline-flex;align-items:center;gap:7px;min-width:0}.preview-meta span:first-child{color:#0a7d34}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:60;display:grid;place-items:center;padding:24px;background:#0f172a6b}.checkout-modal{position:relative;width:min(440px,100%);padding:30px;border-radius:8px;background:#fff;box-shadow:0 24px 70px #0f172a47}.modal-close{position:absolute;top:16px;right:16px;display:grid;width:36px;height:36px;place-items:center;border-radius:8px}.modal-kicker{display:inline-flex;padding:5px 9px;border-radius:999px;background:#eaf8ef;color:#087a31;font-size:12px;font-weight:850}.checkout-modal h2{margin-top:18px;font-size:26px;line-height:1.16;font-weight:850}.checkout-modal p{margin:12px 0 0;color:#526174;font-size:15px;line-height:1.55}.modal-summary{display:flex;align-items:center;justify-content:space-between;margin-top:24px;padding:16px;border:1px solid #dfe5ec;border-radius:8px;color:#344054;font-weight:800}.modal-summary strong{color:#101828;font-size:22px}@media(max-width:1320px){.workspace{grid-template-columns:minmax(0,1fr) minmax(290px,330px)}.video-panel{position:static;grid-column:1 / -1}.video-panel{display:grid;grid-template-columns:minmax(260px,320px) minmax(0,1fr);align-items:center;gap:24px}.video-panel-title,.preview-meta{grid-column:2}.phone-frame{grid-row:1 / span 2;margin:0}}@media(max-width:980px){.topbar{grid-template-columns:1fr auto;gap:16px;padding:0 20px}.stepper{order:3;grid-column:1 / -1;min-width:0;width:100%;padding-bottom:14px}.step-line{flex:1;width:auto}.workspace{grid-template-columns:minmax(0,1fr);padding:20px}.summary-panel{position:static}.product-preview-grid{grid-template-columns:68px minmax(0,1fr)}.product-copy{grid-column:1 / -1}.style-grid{grid-template-columns:1fr}.style-card{grid-template-columns:minmax(120px,170px) minmax(0,1fr);grid-template-rows:auto;min-height:148px}.style-copy{align-content:center}.video-panel{display:block}.phone-frame{margin:16px auto 0}}@media(max-width:640px){.app-shell{max-width:100vw;overflow-x:hidden}.topbar{position:static}.brand{font-size:21px}.ghost-button{display:none}.stepper{justify-content:flex-start;overflow:visible;gap:8px;font-size:12px}.step span{width:26px;height:26px}.step{gap:6px}.step-line{flex:1 1 24px;max-width:34px;min-width:18px}.workspace{width:100%;max-width:100%;padding:14px}.primary-panel,.summary-panel,.video-panel{padding:18px}.section-title-row{flex-wrap:wrap;gap:10px;justify-content:flex-start}.source-menu{max-width:100%}.url-input-wrap input{overflow:hidden;text-overflow:ellipsis}.primary-panel,.url-row,.url-input-wrap,.product-copy{min-width:0;width:100%}.product-copy h3{overflow-wrap:anywhere}.url-section h1{font-size:24px}.url-row,.product-preview-grid{grid-template-columns:1fr}.thumb-rail{grid-template-columns:repeat(4,1fr)}.thumb{width:100%;height:68px}.style-card{grid-template-columns:1fr}.summary-list div,.preview-meta{align-items:flex-start;flex-direction:column}.checkout-modal{padding:24px}}
