@font-face{font-family:Rounded;src:url('/fonts/mplus-rounded-400.woff') format('woff');font-weight:400;font-display:swap}@font-face{font-family:Rounded;src:url('/fonts/mplus-rounded-700.woff') format('woff');font-weight:700;font-display:swap}@font-face{font-family:Yusei;src:url('/fonts/yusei-magic-400.woff') format('woff');font-display:swap}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:110px}body{margin:0;color:#20252a;background:#fffcf6;font-family:Rounded,'Hiragino Kaku Gothic ProN','Yu Gothic',sans-serif;line-height:1.9}a{color:inherit;text-decoration:none}button,summary,a{-webkit-tap-highlight-color:transparent}a:focus-visible,summary:focus-visible{outline:3px solid var(--accent);outline-offset:5px}img{display:block;max-width:100%;height:auto}.skip{position:fixed;left:12px;top:-70px;background:white;padding:10px;z-index:100}.skip:focus{top:12px}.site-header{position:sticky;top:0;z-index:20;background:rgba(255,252,246,.96);border-bottom:1px solid #24282c22}.header-inner{max-width:1240px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:18px 36px}.brand{font-family:Yusei,sans-serif;white-space:nowrap;font-size:23px}.brand span{font-family:Rounded,sans-serif;display:block;font-size:9px;letter-spacing:.2em;line-height:1}.app-nav{display:flex;gap:22px;font-size:12px;font-weight:700;align-items:center}.app-nav a{white-space:nowrap;padding:4px 0}.app-nav a[aria-current=page]{border-bottom:2px solid var(--accent)}.container{max-width:1168px;margin:auto;padding:0 36px}.hero{display:grid;grid-template-columns:1.1fr 1fr;gap:46px;align-items:center;padding-top:65px;padding-bottom:72px}.eyebrow{display:flex;align-items:center;gap:11px;letter-spacing:.12em;text-transform:uppercase;font-size:11px;font-weight:700}.eyebrow:before{content:'';width:28px;height:2px;background:var(--accent)}.app-identity{display:flex;align-items:center;gap:12px;margin:24px 0}.app-identity img{width:45px;height:45px;border-radius:11px;box-shadow:0 3px 8px #20252a0d}.app-identity span{font-weight:700;font-size:19px}.hero h1{font-size:clamp(32px,4.2vw,56px);line-height:1.5;letter-spacing:-.055em;margin:24px 0}.hero h1 span{display:block}.hero h1 em{font-style:normal;color:var(--accent)}.lead{max-width:480px;font-size:16px;line-height:2.1;margin:24px 0 28px}.actions{display:flex;align-items:center;gap:24px;flex-wrap:wrap}.cta{display:inline-flex;align-items:center;justify-content:space-between;gap:28px;border-radius:12px;background:var(--ink);color:white;padding:15px 21px;font-size:14px;font-weight:700;min-height:56px;transition:transform .2s}.cta:hover{transform:translateY(-3px)}.cta svg{width:19px;height:19px;fill:currentColor}.text-link{border-bottom:1px solid #20252a80;font-size:13px;padding:5px 0}.store-note{font-size:10px;color:#616567;margin-top:15px;max-width:440px}.hero-art{background:var(--tint);border-radius:160px 160px 30px 30px;min-height:620px;display:flex;align-items:center;justify-content:center;position:relative;padding:42px 64px 65px;isolation:isolate}.hero-art:before{content:'';position:absolute;inset:18px;border:1px solid #fff9;border-radius:145px 145px 20px 20px;z-index:-1}.hero-art .shot{width:252px;border-radius:24px;box-shadow:0 20px 45px #172d3026;transform:rotate(3deg)}.hero-art .stamp{position:absolute;bottom:22px;left:30px;right:30px;text-align:center;font-size:10px;letter-spacing:.08em;color:#424b4e}.art-label{position:absolute;top:46px;left:24px;background:#fffcf6;padding:7px 15px;border-radius:20px;font-size:10px;transform:rotate(-8deg);z-index:1;border:1px solid #20252a15}.art-number{position:absolute;right:22px;top:10px;font-size:85px;font-weight:700;line-height:1;color:#fff9;z-index:-1}.section{padding-top:84px;padding-bottom:84px}.divider{border-top:1px solid #20252a26}.section-kicker{font-size:11px;color:var(--accent);letter-spacing:.18em;font-weight:700;margin:0 0 16px}.section h2{font-size:clamp(25px,3.2vw,39px);line-height:1.6;letter-spacing:-.035em;margin:0 0 26px}.section-intro{max-width:640px;color:#545a5c;margin:0 0 42px;font-size:14px}.value-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:34px}.value{border-top:2px solid var(--accent);padding-top:20px}.value b{color:var(--accent);font-size:12px;font-variant-numeric:tabular-nums}.value h3{font-size:19px;line-height:1.6;margin:14px 0}.value p{font-size:14px;color:#50585c;margin:0}.flow-band{background:var(--tint)}.flow-layout{display:grid;grid-template-columns:.85fr 1.15fr;gap:76px}.steps{list-style:none;margin:0;padding:0;counter-reset:steps}.steps li{display:grid;grid-template-columns:42px 1fr;gap:19px;padding:21px 0;border-top:1px solid #20252a26}.steps li:before{counter-increment:steps;content:'0' counter(steps);font-size:12px;border:1px solid #20252a4d;border-radius:50%;width:37px;height:37px;display:grid;place-items:center}.steps li h3{font-size:17px;margin:0 0 6px}.steps p{font-size:13px;margin:0;color:#4b5556}.screenshot-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;align-items:start}.screenshot-grid figure{margin:0;background:var(--tint);padding:24px 28px 18px;border-radius:22px}.screenshot-grid img{width:100%;max-width:260px;margin:auto;border-radius:12px;box-shadow:0 10px 25px #20252a13}.screenshot-grid figcaption{font-size:11px;text-align:center;margin-top:18px;line-height:1.8}.gallery-note{font-size:11px;color:#636969;margin-top:20px}.faq-layout{display:grid;grid-template-columns:.7fr 1.3fr;gap:60px}.faq details{border-top:1px solid #20252a33}.faq details:last-child{border-bottom:1px solid #20252a33}.faq summary{cursor:pointer;list-style:none;font-size:14px;font-weight:700;position:relative;padding:22px 30px 22px 0}.faq summary::-webkit-details-marker{display:none}.faq summary:after{content:'+';position:absolute;right:0;font-size:20px;top:17px;color:var(--accent)}.faq details[open] summary:after{content:'−'}.faq details p{font-size:13px;margin:0 0 24px;color:#50585c}.closing{padding:60px 36px;margin:0 0 70px;background:var(--ink);color:#fff;border-radius:25px;display:flex;align-items:center;justify-content:space-between;gap:30px}.closing h2{font-size:27px;line-height:1.6;margin:0 0 12px}.closing p{font-size:13px;color:#ffffffb3;margin:0}.closing .cta{background:var(--tint);color:#20252a;flex-shrink:0}.footer{border-top:1px solid #20252a26;padding:32px 0}.footer-inner{display:flex;justify-content:space-between;gap:25px;align-items:center}.footer-links{display:flex;gap:23px;flex-wrap:wrap;font-size:11px}.fineprint{color:#697071;font-size:10px;margin:25px 0 0}.related{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}.related a{display:flex;align-items:center;gap:8px;font-size:12px;background:#fff;padding:8px 12px;border:1px solid #20252a1a;border-radius:10px}.related img{width:25px;height:25px;border-radius:7px}.patchread .hero h1{font-family:Yusei,serif;font-weight:400;letter-spacing:.01em}.patchread .hero-art{border-radius:20px}.planpin .hero-art{border-radius:45% 45% 30px 30px}.frigy .hero-art{border-radius:45px}.sontaku .hero-art{border-radius:35px 145px 35px 35px}
@media(max-width:900px){.header-inner{padding:14px 24px;gap:22px}.app-nav{gap:18px;overflow-x:auto;scrollbar-width:thin}.hero{gap:28px;padding-top:38px}.hero-art{min-height:470px;padding:38px 32px 55px}.hero-art .shot{width:210px}.hero h1{font-size:37px}.container{padding:0 24px}.hero.container{padding-top:38px;padding-bottom:55px}.flow-layout,.faq-layout{gap:35px}.screenshot-grid{gap:16px}.screenshot-grid figure{padding:18px 14px}.value-grid{gap:24px}.section{padding-top:60px;padding-bottom:60px}.art-label{top:23px;left:8px}}
@media(max-width:640px){html{scroll-padding-top:125px}.header-inner{display:block;padding:12px 20px 9px}.brand{font-size:20px;display:flex;align-items:center;gap:10px}.brand span{font-size:8px}.app-nav{margin-top:10px;gap:21px;padding-bottom:2px;font-size:10px}.container{padding-left:22px;padding-right:22px}.hero{grid-template-columns:1fr;gap:28px}.hero.container{padding-top:28px;padding-bottom:42px}.hero h1{font-size:clamp(30px,8.6vw,45px);line-height:1.5;margin:18px 0}.app-identity{margin:20px 0 14px}.app-identity img{width:40px;height:40px}.app-identity span{font-size:17px}.lead{font-size:14px;line-height:2;margin:20px 0 23px}.actions{gap:18px}.cta{font-size:13px;gap:19px;padding:13px 17px;min-height:52px}.hero-art{min-height:0;padding:36px 50px 48px;border-radius:120px 120px 24px 24px;margin:4px 10px 0}.hero-art .shot{width:210px;border-radius:18px;transform:rotate(2deg)}.art-label{top:32px;left:8px}.art-number{font-size:70px}.hero-art .stamp{font-size:9px;bottom:13px}.section{padding-top:47px;padding-bottom:47px}.section h2{font-size:27px;margin-bottom:22px}.section-intro{font-size:13px;margin-bottom:29px}.value-grid{grid-template-columns:1fr;gap:28px}.value{display:grid;grid-template-columns:28px 1fr;column-gap:12px;padding-top:14px}.value b{grid-row:1/3;margin-top:4px}.value h3{font-size:18px;margin:0 0 7px}.value p{font-size:13px}.flow-layout,.faq-layout{grid-template-columns:1fr;gap:19px}.flow-layout .section-intro{margin-bottom:0}.steps li{padding:19px 0}.screenshot-grid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 0 17px;gap:16px}.screenshot-grid figure{flex:0 0 78%;scroll-snap-align:start;padding:21px 25px 15px}.screenshot-grid img{max-width:240px}.gallery-note{margin-top:5px}.closing{display:block;padding:31px 24px;margin-bottom:40px;border-radius:20px}.closing h2{font-size:24px}.closing .cta{margin-top:24px}.footer-inner{align-items:start;flex-direction:column;gap:23px}.footer-links{gap:18px}.related{gap:9px}.related a{font-size:11px}.faq summary{font-size:13px}.store-note{font-size:9px}.screenshot-grid figcaption{font-size:10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.cta{transition:none}.cta:hover{transform:none}}
.hero-art .screen-crop{position:relative;width:252px;aspect-ratio:var(--crop-ratio);overflow:hidden;border-radius:29px;box-shadow:0 20px 45px #172d3026;transform:rotate(3deg);background:var(--tint)}.screen-crop img{position:absolute;width:var(--crop-width);max-width:none;left:var(--crop-left);top:var(--crop-top);height:auto}.patchread .screen-crop{border-radius:30px 30px 0 0}.frigy .screen-crop{transform:rotate(-3deg)}@media(max-width:900px){.hero-art .screen-crop{width:210px}}@media(max-width:640px){.hero-art .screen-crop{width:210px;border-radius:24px}}

/* Page-local anchors reuse existing IDs; html scroll-padding accounts for the sticky header. */
.section-nav{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 25px}.section-nav a{display:inline-flex;align-items:center;justify-content:space-between;gap:18px;min-height:44px;border:1px solid #20252a33;border-radius:24px;padding:8px 16px;font-size:12px;font-weight:700;background:#fff}.section-nav a:hover{background:var(--tint)}.section-nav span{color:var(--accent)}#value-title,#how,#faq-title,#main{scroll-margin-top:20px}@media(max-width:640px){.section-nav{gap:8px;margin-bottom:22px}.section-nav a{padding:8px 13px;gap:14px}}

.brand{font-family:Rounded,sans-serif;font-weight:700;font-size:21px}.brand span{font-weight:400;letter-spacing:.05em;margin-top:5px}@media(max-width:640px){.header-inner .brand{display:block;font-size:19px}.brand span{font-size:9px}.footer .brand{font-size:20px}}
