:root{
  --bg:#fbf8f5; --paper:#ffffff; --ink:#211c33; --soft:#5d566f; --faint:#8a83a0;
  --pink:#ff3d9a; --pink-deep:#e21d7e; --peri:#6f7bf0; --lime:#7bbf2a;
  --line:#ece6ef; --chip:#fdeef6;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0; color:var(--ink); background:var(--bg); font-family:'Inter',system-ui,sans-serif; font-size:19px; line-height:1.75; -webkit-font-smoothing:antialiased}
a{color:var(--pink-deep)}
.wrap{max-width:720px; margin:0 auto; padding:0 24px}
.nav{max-width:1040px; margin:0 auto; padding:20px 24px; display:flex; align-items:center; justify-content:space-between}
.brand{display:flex; align-items:center; gap:10px; text-decoration:none; color:var(--ink); font-family:'Fraunces'; font-weight:700; font-size:19px}
.brand .dot{width:24px; height:24px; border-radius:50%; background:radial-gradient(circle at 30% 30%, #fff, var(--pink) 48%, var(--peri) 95%)}
.nav a.back{font-size:14px; color:var(--soft); text-decoration:none; font-weight:500}
.nav a.back:hover{color:var(--pink-deep)}
.hero{padding:30px 0 6px}
.kicker{display:inline-block; font-weight:700; font-size:12.5px; letter-spacing:1.6px; text-transform:uppercase; color:var(--pink-deep); background:var(--chip); padding:6px 13px; border-radius:999px}
h1{font-family:'Fraunces'; font-weight:700; font-size:clamp(32px,5.6vw,50px); line-height:1.08; letter-spacing:-.01em; margin:18px 0 14px}
.byline{display:flex; align-items:center; gap:12px; margin:18px 0 6px}
.byline img{width:46px; height:46px; border-radius:50%; object-fit:cover; border:2px solid #fff; box-shadow:0 2px 10px rgba(120,90,160,.18)}
.byline .who{font-size:15px; line-height:1.35}
.byline .who b{color:var(--ink)}
.byline .who span{color:var(--soft)}
.rule{height:4px; border:0; margin:26px 0 6px; border-radius:4px; background:linear-gradient(90deg,var(--pink),var(--peri),var(--lime))}
.disclosure{margin:24px 0; padding:14px 18px; font-size:15px; color:var(--soft); background:#fff; border:1px solid var(--line); border-left:4px solid var(--peri); border-radius:12px}
.note{margin:24px 0; padding:16px 18px; font-size:17px; color:var(--ink); background:var(--chip); border:1px solid #f6d6e6; border-radius:14px; line-height:1.6}
.note strong{color:var(--pink-deep)}
p{margin:18px 0}
strong{color:var(--ink)}
h2{font-family:'Fraunces'; font-weight:600; font-size:clamp(24px,4vw,32px); line-height:1.18; margin:44px 0 6px; letter-spacing:-.01em}
figure{margin:30px 0}
figure img{width:100%; border-radius:18px; display:block}
figure.portrait{text-align:center}
figure.portrait img{width:auto; max-width:min(100%,460px); margin:0 auto}
figcaption{font-size:14px; color:var(--soft); margin-top:8px; text-align:center}
ul.checks{list-style:none; padding:0; margin:18px 0}
ul.checks li{position:relative; padding:9px 0 9px 32px}
ul.checks li:before{content:"\2713"; position:absolute; left:0; top:11px; color:#fff; background:var(--pink); width:20px; height:20px; border-radius:50%; font-size:12px; text-align:center; line-height:20px; font-weight:700}
ul.checks li strong{color:var(--ink)}
.pick{background:#fff; border:1px solid var(--line); border-radius:16px; padding:18px 20px; margin:16px 0; box-shadow:0 6px 18px rgba(120,90,160,.05)}
.pick h3{margin:0 0 4px; font-family:'Fraunces'; font-weight:600; font-size:20px}
.pick p{margin:6px 0 10px; color:var(--soft); font-size:16.5px}
.pick a.buy{font-weight:700; color:var(--pink-deep); font-size:15px}
.pull{font-family:'Fraunces'; font-weight:600; font-size:25px; line-height:1.35; color:var(--ink); border-left:4px solid var(--pink); padding:4px 0 4px 22px; margin:34px 0}
.cta{margin:34px 0; padding:30px 26px; border-radius:22px; text-align:center; color:#fff; background:linear-gradient(135deg,#ff5aa8,#7b6ff0)}
.cta h3{color:#fff; margin:0 0 6px; font-size:23px; font-family:'Fraunces'}
.cta p{color:rgba(255,255,255,.92); margin:6px auto 14px; max-width:460px}
.btn{display:inline-block; font-weight:700; font-size:17px; color:var(--pink-deep); background:#fff; text-decoration:none; padding:14px 30px; border-radius:999px; box-shadow:0 10px 24px rgba(0,0,0,.16)}
.btn:hover{transform:translateY(-1px)}
.cta .fine{display:block; margin-top:12px; font-size:13px; color:rgba(255,255,255,.8)}
.faq details{border-bottom:1px solid var(--line); padding:16px 0}
.faq summary{cursor:pointer; font-weight:700; font-size:18px; list-style:none; display:flex; justify-content:space-between; gap:14px}
.faq summary::-webkit-details-marker{display:none}
.faq summary:after{content:"+"; color:var(--pink-deep); font-weight:700}
.faq details[open] summary:after{content:"\2013"}
.faq details p{margin:12px 0 2px; color:var(--soft); font-size:17px}
.author{display:flex; gap:18px; align-items:center; margin:44px 0 10px; padding:22px; background:#fff; border:1px solid var(--line); border-radius:20px}
.author img{width:78px; height:78px; border-radius:50%; object-fit:cover; flex:none}
.author .b h4{margin:0 0 4px; font-family:'Fraunces'; font-size:19px}
.author .b p{margin:0; font-size:15px; color:var(--soft); line-height:1.55}
.author .b a{font-weight:600}
.readnext{margin:40px 0 10px; padding:22px 24px; border-radius:20px; background:linear-gradient(135deg,#fdeef6,#eef0ff); border:1px solid var(--line)}
.readnext .rn-label{font-weight:700; font-size:12px; letter-spacing:1.4px; text-transform:uppercase; color:var(--peri)}
.readnext h3{font-family:'Fraunces'; font-weight:600; font-size:21px; margin:8px 0 6px; color:var(--ink)}
.readnext p{margin:0 0 12px; color:var(--soft); font-size:16px}
.readnext a.rn-go{display:inline-block; font-weight:700; font-size:15px; color:var(--pink-deep)}
.src{font-size:14px; color:var(--soft); margin:26px 0}
.src a{color:var(--soft)}
footer{margin:44px 0 50px; padding-top:22px; border-top:1px solid var(--line); color:var(--soft); font-size:14px; text-align:center}
footer a{color:var(--peri); text-decoration:none; font-weight:600}