:root{--accent:#8254F0;--gradient:linear-gradient(135deg,#665CF2,#9E4DED);--ink:#282331;--muted:#676170;--paper:#faf9fc;--line:#e5e0ed;--violet-ink:#6134b9;color:var(--ink);background:var(--paper);font-family:"Pretendard Variable",Pretendard,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-synthesis:none;scroll-padding-top:130px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0}html[lang=ko]{word-break:keep-all}html[lang=ja]{font-family:"Pretendard JP Variable","Pretendard JP",-apple-system,"Hiragino Sans",sans-serif}html[lang=zh-Hans]{font-family:"Noto Sans SC",-apple-system,"PingFang SC",sans-serif}h1,h2,h3,p,figure{margin:0}h1,h2,h3,p,a,button,summary{overflow-wrap:anywhere}h1,h2,h3{letter-spacing:-.045em;text-wrap:balance}h1{font-size:clamp(36px,4.4vw,66px);line-height:1.14;font-weight:700}h2{font-size:clamp(30px,3.5vw,48px);line-height:1.2;font-weight:650}h3{font-size:24px;line-height:1.3}p{line-height:1.75}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer;color:inherit}img{display:block;max-width:100%;height:auto}button,a,summary{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid var(--accent);outline-offset:5px}button{touch-action:manipulation}figure{min-width:0}::selection{background:#e3d7fd}.wrap{width:min(1180px,calc(100% - 80px));margin-inline:auto}.skip{position:fixed;left:20px;top:-100px;background:white;padding:12px;z-index:100}.skip:focus{top:12px}.header{position:sticky;top:0;z-index:20;border-bottom:1px solid #e5e0edcc;background:#faf9fcf2;backdrop-filter:blur(18px)}.header-inner{display:flex;align-items:center;gap:24px;min-height:88px}.brand{display:flex;align-items:center;gap:10px;flex:none;font-size:21px;letter-spacing:-.04em}.brand img{width:36px;border-radius:9px}.section-nav{display:flex;gap:22px;font-size:13px;margin-right:auto}.section-nav a:hover,.lang a:hover{color:var(--violet-ink)}.lang{display:flex;gap:12px;font-size:12px;align-items:center}.lang [aria-current=page]{color:var(--violet-ink);text-decoration:underline;text-underline-offset:5px}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:13px 23px;border:0;border-radius:100px;font-size:15px;font-weight:600;line-height:1.4;text-align:center}.pri{background:var(--gradient);color:white}.dark{background:var(--ink);color:white}.sm{font-size:12px;padding:11px 16px;min-height:42px}.store{flex:none}.text-link{font-size:15px;color:var(--violet-ink);font-weight:600;display:inline-flex;gap:10px;align-items:center}.text-link:hover{text-decoration:underline;text-underline-offset:5px}.hero{display:grid;grid-template-columns:1fr 1.05fr;gap:56px;align-items:center;padding-block:100px 92px}.eyebrow{font-size:13px;font-weight:650;color:var(--violet-ink);margin-bottom:22px;letter-spacing:.015em}.lede{font-size:19px;line-height:1.75;color:var(--muted);margin-top:24px;max-width:620px}.hero .lede{max-width:400px}.actions{display:flex;align-items:center;gap:22px;flex-wrap:wrap;margin-top:32px}.platforms{font-size:13px;color:var(--muted);margin-top:20px}.hero-demo{padding:12px;background:white;border:1px solid var(--line);border-radius:20px;box-shadow:0 24px 60px -40px #49307066}.media-stack{position:relative;isolation:isolate;overflow:hidden}.media-stack img{width:100%;height:auto}.media-stack .after-layer{position:absolute;inset:0;width:100%;height:100%;object-fit:fill}.comparison{border-radius:11px}.comparison .after-layer{opacity:1;transition:opacity 1.2s ease}.comparison[data-state=before] .after-layer{opacity:0}figcaption{font-size:12px;line-height:1.65;color:var(--muted);margin-top:16px}.hero-demo figcaption{padding:2px 6px 6px}.demo-controls{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap;margin-top:14px}.segmented{display:flex;padding:3px;border-radius:100px;background:#f1eef6}.segmented button{background:transparent;border:0;border-radius:100px;padding:9px 15px;font-size:12px}.segmented button[aria-pressed=true]{background:white;box-shadow:0 1px 4px #3120411a}.play-control{background:none;border:0;padding:10px 4px;font-size:12px;text-decoration:underline;text-underline-offset:4px}.facts-band{border-block:1px solid var(--line);background:#f2eef9}.fact-grid{display:flex;justify-content:space-between;gap:25px;padding-block:24px;flex-wrap:wrap}.fact-grid p{font-size:13px;font-weight:550}.section{padding-block:112px}.section-number{font-variant-numeric:tabular-nums;color:#83758f;margin-right:16px}.reveal-section{display:grid;grid-template-columns:1fr 1fr;gap:100px;align-items:center}.section-copy{max-width:490px}.reveal-actions{margin-top:30px}.caption{font-size:12px;color:var(--muted);margin-top:14px}.reveal-demo{max-width:400px;width:100%;justify-self:center;background:#f1f0f5;padding:14px;border:1px solid var(--line);border-radius:22px}.reveal-demo .media-stack{border-radius:10px}.reveal-demo .after-layer{opacity:0}.reveal-demo [data-revealed=true] .after-layer{opacity:1}.reveal-demo figcaption{text-align:center;margin-top:12px}.surface{background:#f0edf5}.section-head{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:end;margin-bottom:55px}.section-head .lede{margin-top:0}.styles-layout{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:center}.picker-figure{border:1px solid var(--line);background:#faf9fc;padding:20px;border-radius:18px}.picker-figure img{width:100%;border-radius:8px}.style-buttons{display:grid;grid-template-columns:1fr 1fr;gap:10px}.style-buttons button{background:transparent;text-align:left;border:1px solid #cfc5df;padding:17px 20px;border-radius:12px;font-size:16px}.style-buttons button[aria-pressed=true]{border-color:var(--accent);background:#fff;color:var(--violet-ink);box-shadow:0 0 0 1px var(--accent)}.style-notes{min-height:118px;padding:24px 0}.style-notes p{font-size:18px;line-height:1.65}.style-note[hidden]{display:none}.technical-section{background:white}.technical-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:90px}.technical-intro img{width:64px;height:64px;margin-top:30px;border-radius:15px}.technical-intro .lede{font-size:18px}.technical-list{border-top:1px solid var(--line)}details{border-bottom:1px solid var(--line)}summary{cursor:pointer;list-style:none;display:grid;grid-template-columns:1fr 28px;gap:16px;align-items:center;padding:26px 0}summary::-webkit-details-marker{display:none}summary:after{content:'+';font-weight:400;font-size:25px;line-height:1;color:var(--violet-ink);text-align:center}details[open]>summary:after{content:'−'}summary strong{font-size:19px;line-height:1.45;font-weight:600;display:block;letter-spacing:-.025em}summary small{display:block;font-size:14px;line-height:1.6;color:var(--muted);margin-top:7px}.detail-body{padding:0 0 30px}.detail-body p{font-size:15px;line-height:1.85;color:var(--muted);margin:0 0 17px}.detail-body figure{margin-block:24px}.detail-body img{width:100%;border:1px solid var(--line);border-radius:12px}.detail-body figcaption{margin-top:8px}.technical-list details{scroll-margin-top:125px}.math-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:22px 0}.math-facts div{padding:18px 10px;background:#f5f2fb;border-radius:10px;text-align:center}.math-facts b{font-size:26px;color:var(--violet-ink);display:block;line-height:1.3}.math-facts span{font-size:12px;color:var(--muted)}.export-grid{display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:110px}.history-figure{width:min(100%,300px);justify-self:center}.history-figure img{border:1px solid var(--line);border-radius:18px}.file-facts{display:grid;gap:0;margin-top:32px}.file-facts p{font-size:14px;padding:14px 0;border-bottom:1px solid #d9d1e4}.mac-figure{background:#ebe8f1;padding:28px;border-radius:20px;max-width:1000px;margin-inline:auto}.mac-figure img{width:100%;border-radius:6px}.mac-figure figcaption{text-align:center}.pricing-intro{text-align:center;max-width:750px;margin:0 auto 48px}.pricing-intro .lede{max-width:none}.price-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.price-card{background:#faf9fc;border:1px solid var(--line);padding:30px 26px;border-radius:18px;display:flex;flex-direction:column;min-width:0}.price-card.pro{background:#e9e0fb;border-color:#cab5f3}.price-card h3{font-size:21px}.price-sub{font-size:13px;line-height:1.6;color:var(--muted);margin-top:12px;min-height:42px}.amount{font-size:30px;letter-spacing:-.04em;margin-top:24px;line-height:1.4}.yearly{font-size:18px;color:var(--violet-ink);margin-top:10px}.tiers{display:grid;gap:7px;font-size:14px;margin-top:18px}.tier{display:flex;justify-content:space-between;gap:10px}.price-card ul{font-size:14px;line-height:1.8;padding-left:18px;margin-block:24px}.price-card li{margin-bottom:10px}.price-card li::marker{color:var(--accent)}.price-note,.subscription-note{font-size:12px;line-height:1.8;color:var(--muted)}.price-note{margin-top:auto;padding-top:20px;border-top:1px solid #ddd4ea}.subscription-note{padding-bottom:20px}.purchase-notes{margin-block:26px}.purchase-notes p{font-size:13px;color:var(--muted)}.faq-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:90px}.faq-grid summary{font-size:18px;line-height:1.55}.faq-grid details:first-child{border-top:1px solid var(--line)}.faq-grid details>p{font-size:15px;line-height:1.85;padding-bottom:25px;color:var(--muted)}.docs-section{background:#ece7f5;padding-block:64px}.docs-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:100px}.docs-grid h2{font-size:27px}.docs-grid p{font-size:14px;margin-block:20px;color:var(--muted);max-width:530px}.email{font-size:14px;text-decoration:underline;text-underline-offset:4px}.docs-grid nav{display:flex;flex-direction:column;justify-content:center;gap:0}.docs-grid nav a{display:flex;justify-content:space-between;gap:14px;font-size:15px;padding:15px 0;border-bottom:1px solid #d8cfe5}.footer{padding-block:36px 24px;background:#faf9fc}.footer-top{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:30px}.fine{font-size:11px;color:var(--muted);line-height:1.9;margin-block:5px}.family{border-top:1px solid var(--line);margin-top:30px;padding-top:24px;display:flex;gap:26px;justify-content:space-between}.family p{font-size:12px;color:var(--muted)}.family nav{display:flex;flex-wrap:wrap;gap:12px 18px;font-size:12px}.family [aria-current]{color:var(--violet-ink)}
/* R5: full scene and timeline; every outline uses the measured source face box. */
/* R5b: fit the landscape reveal; stack this section on tablets. */
@media(min-width:601px){#reveal-demo{max-width:540px}}
@media(min-width:601px) and (max-width:900px){#reveal{grid-template-columns:1fr}}
#reveal-stage{aspect-ratio:11/8;touch-action:pan-x pan-y pinch-zoom}
#reveal-stage .reveal-layer{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
#reveal-stage .reveal-layer[hidden]{display:none}
#reveal .reveal-people{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
#reveal .reveal-person{min-height:44px;padding:12px 16px;border:1px solid var(--line);border-radius:12px;background:transparent;font-size:15px;line-height:1.4}
#reveal .reveal-person[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:white}
#reveal .reveal-person:disabled{opacity:.55;cursor:default}
#reveal .face-hit{position:absolute;left:var(--cx);top:var(--cy);width:max(44px,var(--w));height:max(44px,var(--h));transform:translate(-50%,-50%);border:0;background:transparent;padding:0;z-index:2;border-radius:0}
#reveal .face-hit:focus-visible{outline:none}
#reveal .face-outline{position:absolute;left:var(--x);top:var(--y);width:var(--w);height:var(--h);pointer-events:none;z-index:3;box-shadow:inset 0 0 0 2px var(--accent);opacity:0}
#reveal .face-hit:hover+.face-outline,#reveal .face-hit:focus-visible+.face-outline,#reveal .face-hit[aria-pressed=true]+.face-outline{opacity:1}
#reveal-status{display:grid}
#reveal-status [data-reveal-caption]{grid-area:1/1}
#reveal-status [aria-hidden=true]{visibility:hidden}
#reveal-demo>.play-control{min-height:44px;width:100%}
.link-arrow{width:16px;height:16px;flex:none}
.picker-capture{position:relative;isolation:isolate}
/* Real picker crop: 992 x 504 at 2x. Segments span x=55..937, y=83..158. */
.picker-highlight{position:absolute;left:5.55%;top:16.47%;width:22.23%;height:14.88%;border:2px solid var(--accent);border-radius:999px;pointer-events:none;transition:transform .55s ease;box-shadow:0 0 0 2px #fff9}
#styles-demo[data-style="1"] .picker-highlight{transform:translateX(100%)}
#styles-demo[data-style="2"] .picker-highlight{transform:translateX(200%)}
#styles-demo[data-style="3"] .picker-highlight{transform:translateX(300%)}
.style-selector>.play-control{display:block;margin:0 0 18px}
.reveal-demo>.play-control{display:block;margin:6px auto 0}
.style-result-slots:empty{display:none}
.style-result-slots img{width:100%;border-radius:12px}
/* Reserve the longest localized explanation, so selecting a style cannot move the page. */
.style-notes{display:grid}.style-note{grid-area:1/1;align-self:start}.style-note[hidden]{display:block;visibility:hidden}
@media(min-width:1100px){.technical-intro{position:sticky;top:138px;align-self:start}}
@media(max-width:1180px){.section-nav{display:none}.header .lang{margin-left:auto}.hero{gap:35px}.reveal-section,.technical-grid,.export-grid,.faq-grid,.docs-grid{gap:55px}}
@media(max-width:900px){.wrap{width:calc(100% - 48px)}.hero{grid-template-columns:1fr;padding-block:65px;gap:45px}.hero-copy{max-width:650px}.hero-demo{max-width:760px;width:100%}.hero .lede{max-width:570px}.hero h1{font-size:clamp(36px,6vw,58px)}.section{padding-block:80px}.section-head{gap:35px}.reveal-section{gap:35px}.styles-layout{gap:35px}.technical-grid{grid-template-columns:1fr;gap:40px}.technical-intro{max-width:650px}.technical-intro img{display:none}.price-grid{grid-template-columns:1fr}.price-card{display:block}.price-sub{min-height:0}.price-card ul{columns:2;column-gap:40px}.price-card li{break-inside:avoid}.price-card .price-note{margin-top:20px}.faq-grid{grid-template-columns:1fr;gap:32px}.family{flex-direction:column;gap:12px}.file-facts{margin-top:20px}}
@media(max-width:600px){:root{scroll-padding-top:130px}.wrap{width:calc(100% - 36px)}.header-inner{display:grid;grid-template-columns:1fr auto;gap:10px 8px;padding-block:12px;min-height:104px}.header .brand{font-size:19px}.header .brand img{width:32px}.header .store{grid-column:2;grid-row:1;font-size:12px;padding:9px 13px;max-width:190px;min-height:40px}.header .lang{grid-column:1/-1;grid-row:2;margin:0;justify-content:space-between;gap:9px;font-size:12px;padding-top:4px}.hero{padding-block:52px;gap:35px}.hero h1{font-size:clamp(31px,7.7vw,45px);letter-spacing:-.05em}.hero .eyebrow{font-size:11px;margin-bottom:18px}.lede{font-size:17px;margin-top:20px}.actions{gap:20px;margin-top:26px}.btn{font-size:14px;padding:12px 20px}.hero-demo{padding:8px;border-radius:15px}.hero-demo figcaption{font-size:11px}.segmented button,.play-control{font-size:11px}.segmented button{padding:8px 11px}.fact-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px 18px;padding-block:22px}.fact-grid p{font-size:12px}.section{padding-block:64px}.reveal-section,.section-head,.styles-layout,.export-grid,.docs-grid{grid-template-columns:1fr;gap:32px}.section-head{margin-bottom:32px}.section-head .lede{margin-top:0}.reveal-demo{max-width:360px}.reveal-section .section-copy{max-width:none}.eyebrow{margin-bottom:16px}.section-number{margin-right:10px}h2{font-size:31px}.style-buttons button{font-size:15px;padding:15px}.style-notes{min-height:105px;padding:22px 0}.style-notes p{font-size:17px}.picker-figure{padding:12px}.technical-grid{gap:32px}summary{padding-block:23px;gap:12px}summary strong{font-size:17px}summary small{font-size:13px}.detail-body p{font-size:14px}.history-figure{width:min(100%,280px)}.mac-figure{padding:10px;border-radius:12px}.mac-figure figcaption{font-size:11px}.price-card{padding:26px 22px}.price-card ul{columns:auto}.price-card li{margin-bottom:8px}.pricing-intro{text-align:left;margin-bottom:32px}.amount{font-size:30px}.docs-section{padding-block:48px}.footer-top{align-items:flex-start;flex-direction:column}.footer .lang{flex-wrap:wrap;gap:18px}.fine{font-size:10px}.family nav{font-size:11px}.docs-grid p,.email{font-size:13px}.math-facts{gap:6px}.math-facts div{padding:13px 6px}.math-facts b{font-size:24px}.math-facts span{font-size:11px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.play-control,.style-selector>.play-control,.reveal-demo>.play-control{display:none}}

/* R2: bring the real picker closer to its controls on compact screens. */
@media(max-width:600px){.styles-layout{gap:20px}.picker-figure{padding:8px}.style-notes{padding-block:18px;min-height:96px}.technical-list summary small{font-size:14px}.detail-body p{font-size:15px}}

/* R3: aligned app results, separate crossfade, and real block crops. */
.style-visuals,.style-selector{min-width:0}.style-visuals{display:grid;gap:16px}.style-stage{position:relative;isolation:isolate;overflow:hidden;border-radius:12px;background:#eee;aspect-ratio:20/11}.style-stage img{width:100%;height:auto;display:block}.style-result-layer{position:absolute;inset:0;opacity:0;transition:opacity .65s ease;pointer-events:none}.style-result-layer[data-active=true]{opacity:1}.style-stage[data-view=before] .style-result-layer{opacity:0}.style-visuals .picker-figure{padding:10px;max-width:360px;width:100%;justify-self:center}.style-visuals .picker-figure figcaption{margin-top:8px}.strength-control{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:18px;font-size:13px}.strength-control>span{margin-right:6px}.strength-control button{min-width:44px;min-height:44px;border:1px solid var(--line);border-radius:9px;background:transparent;padding:8px}.strength-control button[aria-pressed=true]{background:white;border-color:var(--accent);color:var(--violet-ink)}.style-view-controls{width:fit-content;margin-bottom:12px}.style-view-controls button{min-height:44px;min-width:44px}.block-results{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.block-results figure{margin:8px 0}.block-results figcaption{display:flex;justify-content:space-between;gap:4px;flex-wrap:wrap}.block-results b{color:var(--violet-ink)}.block-results span{font-variant-numeric:tabular-nums}.detail-body .block-caption{font-size:12px;margin-top:8px}

/* R6: an intact editor screen beside its explanation, scoped to section 02. */
#frame-review{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:80px;align-items:center;margin-top:72px;padding-top:72px;border-top:1px solid var(--line)}
#frame-review .frame-review-copy{max-width:470px;min-width:0}
#frame-review h3{font-size:clamp(26px,3vw,36px);line-height:1.25}
#frame-review .frame-review-areas{display:grid;gap:14px;margin-top:26px;font-size:16px;color:var(--muted)}
#frame-review .frame-review-figure{width:min(100%,404px);justify-self:center}
#frame-review .frame-review-screen{padding:12px;background:#faf9fc;border:1px solid var(--line);border-radius:22px;box-shadow:0 24px 60px -40px #49307066}
#frame-review img{width:100%;height:auto;border-radius:10px}
#frame-review figcaption{padding-inline:12px;text-align:center}
@media(max-width:900px){#frame-review{grid-template-columns:minmax(0,1fr);gap:32px;margin-top:56px;padding-top:56px}#frame-review .frame-review-copy{max-width:620px}}
@media(max-width:600px){#frame-review{margin-top:40px;padding-top:40px}#frame-review .frame-review-screen{padding:10px}#frame-review .frame-review-areas{font-size:15px}}