/* メンズコア site: dark slate like the app's dark theme, one teal accent from the
   icon's rings, red only for the pelvic floor muscle. Noto Sans JP with proportional kana (palt) for
   Japanese (900 for headlines), Barlow Condensed for numbers and labels. */
:root{
  --bg:#0A0E11; --band:#10161A; --card:#141B20; --raise:#1A232A; --ink:#ECF1F3; --sub:#98A5AB; --faint:#66747B; --rule:#232D33;
  --primary:#2FB3AF; --primary-ink:#04110F; --primary-soft:#0F2A2B; --ok:#46C483; --warn:#E3A33B;
  --muscle:#E5383F; --muscle-light:#F26B62; --muscle-soft:#3A1E22;
  --sec-body:#16212A; --sec-line:#33454F; --sec-organ:#1F2C34; --sec-stroke:#71868F;
  --fig-cloth:#7F98A2; --fig-far:#4A5D66; --fig-skin:#E3B795; --fig-skinfar:#AE8A70; --fig-hair:#2E3236; --fig-halo:#131C22; --fig-mat:#2B3A42;
  --font:"Noto Sans JP","Hiragino Sans","Hiragino Kaku Gothic ProN","Noto Sans JP",Meiryo,system-ui,sans-serif;
  --cond:"Barlow Condensed","Noto Sans JP",sans-serif;
  --max:1120px; --col:720px;
  color-scheme:dark;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:120px}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.95 var(--font);font-weight:400;overflow-wrap:anywhere;-webkit-font-smoothing:antialiased;font-feature-settings:"palt";letter-spacing:.03em}
a{color:var(--primary);text-underline-offset:3px}
b,strong{font-weight:700}
:focus-visible{outline:2px solid var(--primary);outline-offset:3px;border-radius:4px}
img,svg{max-width:100%;height:auto;display:block}
.wrap{max-width:var(--max);margin:0 auto;padding-inline:16px}
.col{max-width:var(--col)}
.icon{width:20px;height:20px;flex:none;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.en{font-family:var(--cond);font-weight:600;letter-spacing:.14em;text-transform:uppercase}

/* header */
.site-head{position:sticky;top:0;z-index:10;background:rgb(10 14 17 / .88);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--rule)}
.bar{display:flex;align-items:center;justify-content:space-between;min-height:60px;gap:16px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink)}
.brand img{width:32px;height:32px;border-radius:8px}
.brand b{font-size:17px;font-weight:900;letter-spacing:.08em;display:block;line-height:1.2;white-space:nowrap}
.brand small{font:600 10px/1.3 var(--cond);letter-spacing:.24em;color:var(--sub);display:block;text-transform:uppercase}
.bar .btn{padding:8px 16px;font-size:14px;white-space:nowrap}
/* Longer taglines (most locales) keep to one line: tighter tracking, and hidden on the narrowest phones. */
.brand small.long{letter-spacing:.06em;white-space:nowrap}
@media (max-width:400px){.brand small.long{display:none}}
@media (max-width:340px){.bar .btn{padding:8px 10px}}
.bar-end{display:flex;align-items:center;gap:6px}
.bar .lang{font:600 13px/1 var(--cond);letter-spacing:.12em;color:var(--sub);text-decoration:none;padding:10px 8px;border-radius:8px}
.bar .lang:hover{color:var(--ink)}
.bar .lang:focus-visible{outline:2px solid var(--primary);outline-offset:2px}
.cats{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none;margin:0 -16px;padding:0 16px}
.cats::-webkit-scrollbar{display:none}
.cats a{flex:none;padding:9px 12px 11px;font-size:13.5px;font-weight:500;color:var(--sub);text-decoration:none;border-bottom:2px solid transparent;white-space:nowrap}
.cats a[aria-current],.cats a:hover{color:var(--ink);border-bottom-color:var(--primary)}

main{padding-block:0 80px}

/* type */
h1,h2,h3{text-wrap:balance;line-height:1.45;font-weight:900;letter-spacing:.01em}
h1{font-size:clamp(26px,6.6vw,38px);margin:8px 0 16px}
h2{font-size:clamp(21px,5.2vw,27px);margin:64px 0 18px;padding-top:18px;position:relative}
h2::before{content:"";position:absolute;left:0;top:0;width:36px;height:3px;background:var(--primary)}
.eyebrow+h2,.eyebrow+.section-head h2{padding-top:0}
.eyebrow+h2::before,.eyebrow+.section-head h2::before{display:none}
.eyebrow:has(+h2,+.section-head){display:block;padding-top:18px;border-top:0;position:relative}
.eyebrow:has(+h2,+.section-head)::before{content:"";position:absolute;left:0;top:0;width:36px;height:3px;background:var(--primary)}
h3{font-size:18px;font-weight:700;margin:32px 0 8px}
p{margin:0 0 1.15em}
ul,ol{padding-left:1.4em;margin:0 0 1.2em}
li{margin-bottom:.45em}
.sub{color:var(--sub)}
.num{font-variant-numeric:tabular-nums}
.eyebrow{display:inline-block;font:600 13px/1.4 var(--cond);letter-spacing:.14em;text-transform:uppercase;color:var(--primary)}
.eyebrow.jp{font-family:var(--font);font-weight:700;letter-spacing:.08em;font-size:13px}
.crumbs{font-size:12.5px;color:var(--faint);margin:20px 0 0}
.crumbs a{color:var(--faint);text-decoration:none}
.crumbs a:hover{color:var(--sub);text-decoration:underline}

/* numbered method heading (方法1｜…), for list-style articles */
.mh{display:grid;grid-template-columns:auto 1fr;gap:0 16px;align-items:center;margin:40px 0 14px;padding:14px 18px;background:var(--card);border:1px solid var(--rule);border-left:4px solid var(--primary);border-radius:4px 10px 10px 4px;font-size:18px;line-height:1.55}
.mh .k{font:700 13px/1.1 var(--cond);letter-spacing:.14em;color:var(--primary);text-transform:uppercase;text-align:center}
.mh .k i{display:block;font-style:normal;font-size:30px;letter-spacing:0;color:var(--ink)}
h3.mh{font-weight:900}

/* article header */
.art-head{padding-block:4px 6px}
.meta{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:12.5px;color:var(--sub);margin:0 0 16px}
.meta span{display:inline-flex;align-items:center;gap:5px}
.meta .icon{width:15px;height:15px}
.trustline{display:flex;gap:10px;align-items:flex-start;font-size:12.5px;line-height:1.75;color:var(--sub);background:var(--band);border:1px solid var(--rule);border-radius:8px;padding:10px 12px;margin:0 0 22px}
.trustline .icon{color:var(--primary);margin-top:2px}
.trustline a{color:var(--sub)}
.lead{font-size:16.5px;line-height:2.05}
.answer{border:1px solid var(--rule);border-radius:12px;background:var(--card);padding:16px 18px;margin:0 0 20px}
.answer>b{display:block;font:600 12px/1.4 var(--cond);letter-spacing:.2em;color:var(--primary);text-transform:uppercase;margin-bottom:6px}
.answer p{margin:0}
.cover{margin:20px 0 6px;background:var(--band);border:1px solid var(--rule);border-radius:12px;overflow:hidden}
.cover .pelvis,.cover .figure{width:100%;max-height:300px}
.cover .figure{aspect-ratio:200/96}

/* section tabs */
.tabs{position:sticky;top:61px;z-index:5;background:rgb(10 14 17 / .92);backdrop-filter:blur(10px);border-bottom:1px solid var(--rule);margin:22px -16px 0;padding:0 16px;display:flex;gap:2px;overflow-x:auto;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tabs a{flex:none;font-size:13.5px;color:var(--sub);text-decoration:none;padding:11px 10px;border-bottom:2px solid transparent;white-space:nowrap}
.tabs a:hover{color:var(--ink);border-bottom-color:var(--rule)}

/* buttons */
.actions{display:flex;flex-wrap:wrap;gap:10px;margin:24px 0}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:14px 24px;border-radius:999px;background:var(--primary);color:var(--primary-ink);font-weight:700;font-size:15px;text-decoration:none;border:1.5px solid var(--primary);line-height:1.4;letter-spacing:.06em;transition:filter .15s}
.btn:hover{filter:brightness(1.1)}
.btn.ghost,.btn.line{background:transparent;color:var(--ink);border-color:#3A4850}
.btn.ghost:hover,.btn.line:hover{border-color:var(--primary)}
.btn[aria-disabled="true"]{opacity:.5;pointer-events:none}

/* home hero */
.hero{display:grid;gap:32px;padding-block:36px 48px;align-items:center;position:relative}
@media (min-width:860px){.hero{grid-template-columns:1.1fr .9fr;padding-block:72px 80px}}
.hero h1{font-size:clamp(34px,9vw,60px);line-height:1.28;margin:14px 0 20px;letter-spacing:.01em}
.hero h1 em{font-style:normal;color:var(--primary)}
.hero .lead{color:var(--sub);max-width:31em;font-size:16.5px}
.checks{list-style:none;padding:0;margin:20px 0 0;display:grid;gap:8px}
.checks li{display:flex;gap:10px;align-items:flex-start;margin:0;font-size:14.5px;color:var(--sub)}
.checks .icon{color:var(--primary);margin-top:4px;width:18px;height:18px}
.stage{position:relative;display:flex;justify-content:center}
.rings{position:absolute;inset:50% auto auto 50%;width:min(130%,620px);aspect-ratio:1;transform:translate(-50%,-50%);pointer-events:none}
.rings circle{fill:none;stroke:var(--primary)}
.rings .r1{stroke-opacity:.08;stroke-width:1}
.rings .r2{stroke-opacity:.14;stroke-width:1}
.rings .r3{stroke-opacity:.28;stroke-width:1.5;transform-origin:50% 50%;animation:pulse 4.8s ease-in-out infinite}
@keyframes pulse{0%,100%{transform:scale(.96);stroke-opacity:.18}50%{transform:scale(1.04);stroke-opacity:.4}}
.phones{display:flex;justify-content:center;align-items:flex-start;gap:14px;position:relative}
.phone{width:min(46%,224px);border-radius:30px;padding:6px;background:#1E272D;box-shadow:0 0 0 1px #2C383F,0 30px 60px -20px rgb(0 0 0 / .8)}
.phone img{border-radius:24px;width:100%;aspect-ratio:560/1142;object-fit:cover}
.phone:nth-child(2){margin-top:48px}
.phone .light{display:none}

/* evidence strip (numbers from studies, each with its source) */
.evid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr));border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.evid>div{padding:22px 20px 20px;border-right:1px solid var(--rule)}
.evid>div:last-child{border-right:0}
@media (max-width:520px){.evid>div{border-right:0;border-bottom:1px solid var(--rule)}.evid>div:last-child{border-bottom:0}}
.evid .n{display:block;font:700 46px/1 var(--cond);color:var(--ink);letter-spacing:.01em}
.evid .n small{font-size:22px;color:var(--primary);margin-left:2px}
.evid b{display:block;font-size:14.5px;margin:10px 0 4px}
.evid span{display:block;font-size:12px;color:var(--faint);line-height:1.6}
.evid-note{font-size:12px;color:var(--faint);margin:10px 0 0}

/* bands and sections */
.band{background:var(--band);border-block:1px solid var(--rule);padding-block:8px 56px;margin-top:24px}
.band h2{margin-top:48px}
.section-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap}
.section-head a{font-size:14px;font-weight:700;text-decoration:none}
.grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr))}
.grid3{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr))}

/* concern cards (早漏 / ED) */
.worries{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr))}
.worry{display:grid;gap:8px;padding:24px 22px;border:1px solid var(--rule);border-radius:16px;background:linear-gradient(160deg,var(--raise),var(--card) 60%);text-decoration:none;color:var(--ink);position:relative;overflow:hidden}
.worry:hover{border-color:var(--primary)}
.worry .en{font-size:12px;color:var(--primary)}
.worry b{font-size:22px;font-weight:900;line-height:1.45}
.worry p{margin:0;font-size:14.5px;color:var(--sub);line-height:1.85}
.worry ul{margin:4px 0 0;padding:0;list-style:none;display:grid;gap:4px}
.worry li{margin:0;font-size:14px;padding-left:18px;position:relative}
.worry li::before{content:"";position:absolute;left:0;top:.75em;width:8px;height:2px;background:var(--primary)}
.worry .go{font-size:14px;font-weight:700;color:var(--primary);margin-top:6px}

/* topic cards with thumbnail */
.tcard{display:flex;flex-direction:column;background:var(--card);border:1px solid var(--rule);border-radius:14px;overflow:hidden;text-decoration:none;color:var(--ink);min-width:0}
.tcard:hover{border-color:var(--primary)}
.tcard .thumb{background:var(--band);aspect-ratio:16/9;display:flex;align-items:center;justify-content:center;overflow:hidden;border-bottom:1px solid var(--rule)}
.tcard .thumb svg{width:100%;height:100%}
.tcard .body{padding:14px 16px 18px;display:grid;gap:4px}
.tcard .tag{font-size:12px;color:var(--primary);font-weight:700;letter-spacing:.06em}
.tcard b{font-size:17px;line-height:1.55}
.tcard span.d{font-size:13.5px;color:var(--sub);line-height:1.75}

/* feature items */
.feature{display:grid;gap:6px;align-content:start}
.feature .ic{width:44px;height:44px;border-radius:50%;border:1px solid #2C4A4B;background:var(--primary-soft);color:var(--primary);display:flex;align-items:center;justify-content:center}
.feature .ic .icon{width:22px;height:22px}
.feature b{font-size:16px}
.feature p{margin:0;font-size:14px;color:var(--sub);line-height:1.85}

/* how it works (a real sequence) */
.flow{list-style:none;padding:0;margin:20px 0 0;display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr));counter-reset:f}
.flow li{counter-increment:f;margin:0;padding:18px 18px 20px;border:1px solid var(--rule);border-radius:14px;background:var(--card)}
.flow li::before{content:"STEP " counter(f);display:block;font:700 12px/1 var(--cond);letter-spacing:.2em;color:var(--primary);margin-bottom:10px}
.flow b{display:block;font-size:16px;margin-bottom:4px}
.flow span{font-size:14px;color:var(--sub);line-height:1.8}

/* how-to steps */
.steps{list-style:none;padding:0;counter-reset:s;margin:14px 0 22px}
.steps li{counter-increment:s;display:grid;grid-template-columns:36px 1fr;gap:0 12px;margin-bottom:14px}
.steps li::before{content:counter(s);font:700 16px/30px var(--cond);width:30px;height:30px;text-align:center;border-radius:50%;border:1.5px solid var(--primary);color:var(--primary);margin-top:2px}

/* rhythm chip */
.rhythm{display:inline-flex;flex-wrap:wrap;align-items:center;gap:4px 8px;font-size:13px;color:var(--sub)}
.rhythm .on{color:var(--muscle-light);font-weight:700}
.rhythm .seg{display:inline-flex;gap:2px}
.rhythm .seg i{width:5px;height:12px;border-radius:1px;background:var(--rule)}
.rhythm .seg.on i{background:var(--muscle)}

/* exercise cards */
.move{background:var(--card);border:1px solid var(--rule);border-radius:14px;padding:12px 14px 16px;display:flex;flex-direction:column;gap:6px;min-width:0;text-decoration:none;color:var(--ink)}
.move:hover{border-color:var(--primary)}
.move .figure{width:100%;aspect-ratio:200/120}
.move h3{margin:4px 0 0;font-size:17px}
.move p{margin:0;font-size:14px;color:var(--sub);line-height:1.75}
.move-full{margin:30px 0 0;padding-top:24px;border-top:1px solid var(--rule)}
.move-full h3{margin-top:0;font-size:20px}
.move-full .figure{width:100%;max-width:440px;aspect-ratio:200/120;background:var(--band);border-radius:12px}

/* study fact sheet */
.study{margin:16px 0 24px;border:1px solid var(--rule);border-radius:14px;overflow:hidden;background:var(--card)}
.study .head{padding:12px 16px;background:var(--raise);border-bottom:1px solid var(--rule)}
.study .head span{display:block;font-size:12px;color:var(--sub);font-weight:700;letter-spacing:.06em}
.study .head b{font-size:16px;line-height:1.6}
.study .head .rhythm{display:flex;gap:10px;margin-top:2px}.study .head .rhythm span{display:inline;font-weight:400;letter-spacing:0}
.stat{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));border-bottom:1px solid var(--rule)}
.stat div{padding:14px 16px;border-right:1px solid var(--rule)}
.stat div:last-child{border-right:0}
.stat .num{display:block;font:700 30px/1.2 var(--cond);color:var(--primary)}
.stat span{font-size:12px;color:var(--sub)}
.study dl{display:grid;grid-template-columns:auto 1fr;margin:0}
.study dt,.study dd{padding:10px 16px;border-bottom:1px solid var(--rule);margin:0;font-size:15px;line-height:1.75}
.study dt{font-size:13px;color:var(--sub);font-weight:700;white-space:nowrap}
.study dl > :nth-last-child(-n+2){border-bottom:0}

/* figures */
.panel{margin:22px 0;background:var(--band);border:1px solid var(--rule);border-radius:14px;padding:12px}
.panel figcaption{font-size:13px;color:var(--sub);padding:8px 4px 0}
.pair{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.pair .tag{font-weight:700;font-size:13px;text-align:center;margin:4px 0 0}
.pair .tag.on{color:var(--muscle-light)}
.trainer{background:var(--card);border:1px solid var(--rule);border-radius:16px;padding:14px 16px 18px;margin:0}
.phase{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-top:6px}
.phase b{font-size:20px;font-weight:900}
.phase[data-phase="hold"] b{color:var(--muscle-light)}
.phase .num{font:700 30px/1 var(--cond)}
.pbar{height:3px;border-radius:2px;background:var(--rule);overflow:hidden;margin-top:8px}
.pbar i{display:block;height:100%;width:0;background:var(--sub)}
.phase[data-phase="hold"]+.pbar i{background:var(--muscle)}
.trainer figcaption{font-size:13px;color:var(--sub);margin-top:10px}

/* tables */
.scroll{overflow-x:auto;margin:14px 0 22px;border:1px solid var(--rule);border-radius:12px}
table{border-collapse:collapse;width:100%;font-size:15px;min-width:460px}
th,td{padding:11px 14px;border-bottom:1px solid var(--rule);text-align:left;vertical-align:top;line-height:1.75}
tr:last-child td{border-bottom:0}
thead th{background:var(--raise);font-size:13px;color:var(--sub);white-space:nowrap}

/* checklist */
.check{list-style:none;padding:16px 18px;background:var(--band);border:1px solid var(--rule);border-radius:12px}
.check li{padding-left:30px;position:relative}
.check li::before{content:"";position:absolute;left:0;top:.45em;width:16px;height:16px;border:1.5px solid var(--primary);border-radius:3px}

/* faq */
.faq{border-top:1px solid var(--rule);margin:10px 0}
.faq details{border-bottom:1px solid var(--rule)}
.faq summary{cursor:pointer;list-style:none;padding:16px 36px 16px 36px;font-weight:700;font-size:16px;line-height:1.6;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::before{content:"Q";position:absolute;left:0;top:13px;font:700 22px/1 var(--cond);color:var(--primary);width:24px;text-align:center;padding-top:4px}
.faq summary::after{content:"";position:absolute;right:8px;top:23px;width:9px;height:9px;border-right:2px solid var(--sub);border-bottom:2px solid var(--sub);transform:rotate(45deg);transition:transform .2s}
.faq details[open] summary::after{transform:rotate(-135deg);top:27px}
.faq details p{margin:0 0 18px;padding-left:36px;color:#C9D2D6}

/* "see a doctor" box */
.care{margin:40px 0 0;border:1px solid #2C4A4B;border-radius:14px;overflow:hidden;background:var(--card)}
.care .h{display:flex;gap:8px;align-items:center;background:var(--primary-soft);color:var(--primary);font-weight:700;padding:10px 16px;font-size:15px;border-bottom:1px solid #2C4A4B}
.care .c{padding:12px 16px;font-size:14.5px;line-height:1.9;color:#C9D2D6}
.care ul{margin:0}

/* app promo */
.app{margin:48px 0 0;border-radius:18px;background:radial-gradient(120% 140% at 100% 0,#123234 0,var(--card) 55%);border:1px solid #24393B;display:grid;gap:18px;padding:24px 22px;align-items:center}
@media (min-width:640px){.app{grid-template-columns:1fr 150px}}
.app h2{margin:4px 0 0;padding:0;font-size:21px}
.app h2::before{display:none}
.app p{margin:8px 0 14px;font-size:14.5px;color:var(--sub)}
.app .phone{width:150px;justify-self:center}
.app .phone:nth-child(2){margin:0}

/* references */
.refs{font-size:12.5px;color:var(--sub);padding-left:1.4em}
.refs li{margin-bottom:8px}
.refs a{color:var(--sub);word-break:break-all}

.policy{border:1px solid var(--rule);border-radius:14px;padding:20px;display:grid;gap:18px;background:var(--card)}

/* footer */
.site-foot{background:#06090B;border-top:1px solid var(--rule);color:var(--sub);padding-block:40px 48px;font-size:13px}
.site-foot a{color:var(--ink);text-decoration:none;opacity:.8}
.site-foot a:hover{opacity:1;text-decoration:underline}
.foot-brand{display:flex;align-items:center;gap:10px;margin-bottom:24px;color:var(--ink)}
.foot-brand img{width:28px;height:28px;border-radius:7px}
.foot-brand b{font-weight:900;letter-spacing:.08em}
.foot-grid{display:grid;gap:24px;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));margin-bottom:28px}
.foot-grid b{display:block;margin-bottom:8px;font:600 12px/1.4 var(--cond);letter-spacing:.2em;text-transform:uppercase;color:var(--faint)}
.foot-grid ul{list-style:none;padding:0;margin:0}
.foot-grid li{margin-bottom:6px}
.site-foot p{line-height:1.85;margin:0 0 8px;color:var(--faint)}
.site-foot .langs{display:flex;flex-wrap:wrap;gap:4px 14px;align-items:baseline;margin-bottom:16px}
.site-foot .langs span{font:600 12px/1.4 var(--cond);letter-spacing:.2em;text-transform:uppercase}
.site-foot .langs b{color:var(--ink);font-weight:500}

/* pelvis drawing (classes from art/pelvis.js) */
.pv-body{fill:var(--sec-body);stroke:var(--sec-line);stroke-width:2.2;stroke-linejoin:round}
.pv-bone,.pv-organ{fill:var(--sec-organ);stroke:var(--sec-stroke);stroke-width:1.6;stroke-linejoin:round}
.pv-organ-fill{fill:var(--sec-organ)}
.pv-line{fill:none;stroke:var(--sec-stroke);stroke-width:1.8;stroke-linejoin:round}
.pv-glow{fill:var(--muscle);stroke:var(--muscle);stroke-linejoin:round}
.pv-muscle{fill:var(--pv-grad);stroke:var(--muscle);stroke-width:1}
.pv-sheen{fill:none;stroke:var(--muscle-light);stroke-width:2.2;stroke-linecap:round;opacity:.7}
.pv-tube{fill:none;stroke:var(--sec-stroke);stroke-width:6;stroke-linecap:round;stroke-linejoin:round}
.pv-tube-in{fill:none;stroke:var(--sec-organ);stroke-width:2.8;stroke-linecap:round;stroke-linejoin:round}
.pv-pull{stroke:var(--muscle);stroke-width:2.4;stroke-linecap:round}
.pv-mfill{fill:var(--muscle)}
.pv-cue{stroke:var(--ink);stroke-width:3.2;stroke-linecap:round;opacity:.8}
.pv-cuefill{fill:var(--ink);opacity:.8}
.pv-lab{stroke:var(--muscle);stroke-width:1.4}
.pv-text{fill:var(--muscle-light);font:700 16px var(--font)}

/* exercise figures (classes from art/figures.mjs) */
.fg-cloth{fill:var(--fig-cloth)}.fg-far{fill:var(--fig-far)}.fg-skin{fill:var(--fig-skin)}.fg-skinfar{fill:var(--fig-skinfar)}.fg-hair{fill:var(--fig-hair)}
.fg-halo{fill:var(--fig-halo)}.fg-mat{fill:var(--fig-mat)}.fg-prop{fill:var(--sub);opacity:.7}
.fg-dotbg,.fg-markbg{fill:var(--card)}.fg-dot{fill:var(--muscle)}
.fg-markbg{stroke:var(--warn);stroke-width:.9}.fg-mark{stroke:var(--warn);stroke-width:1.3;stroke-linecap:round;fill:none}

@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* link lists */
.rows{list-style:none;padding:0;margin:8px 0 0;border-top:1px solid var(--rule)}
.rows li{margin:0;border-bottom:1px solid var(--rule)}
.rows a{display:grid;grid-template-columns:1fr auto;gap:2px 16px;align-items:center;padding:15px 4px;text-decoration:none;color:var(--ink)}
.rows b{font-size:16px;line-height:1.6;color:var(--ink)}
.rows span{grid-column:1;color:var(--sub);font-size:13.5px;line-height:1.7}
.rows a::after{content:"";grid-row:1/3;grid-column:2;width:8px;height:8px;border-top:2px solid var(--primary);border-right:2px solid var(--primary);transform:rotate(45deg)}
.rows a:hover b{color:var(--primary)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.check.plain{display:block}

/* "try it now" card */
.try{display:grid;grid-template-columns:72px 1fr;gap:14px;align-items:center;margin:28px 0;padding:14px 16px;border:1px solid #2C4A4B;background:var(--card);border-radius:14px;text-decoration:none;color:var(--ink)}
.try b{display:block;color:var(--primary);font-size:16px}
.try span span{font-size:13.5px;color:var(--sub);line-height:1.75}
.try:hover{border-color:var(--primary)}
.try .thumb{width:72px;display:block;overflow:hidden}
.try .thumb svg{width:110px;max-width:none;margin-left:-22px}

/* /try/ session */
.trainer.session{margin-top:24px}
.reps{margin:8px 0 0;font-size:15px;color:var(--sub)}
.reps .num{font:700 24px/1 var(--cond);color:var(--ink)}
.trainer.session .actions{margin-top:12px}
.done{margin-top:20px;padding:18px 18px 6px;border-radius:14px;border:1px solid var(--rule);background:var(--card)}
.done-h{font-size:20px;font-weight:900;margin:0 0 6px;color:var(--ink)}

/* PR and ad slots */
.pr{margin:20px 0;border:1px solid var(--rule);border-radius:12px;padding:12px 16px;background:var(--card)}
.pr-h{margin:0 0 6px;font-size:14px;font-weight:700;display:flex;gap:8px;align-items:center}
.pr-label{font-size:11px;font-weight:700;border:1px solid var(--sub);color:var(--sub);border-radius:3px;padding:0 5px;line-height:1.6}
.pr a{display:grid;padding:10px 0;border-top:1px solid var(--rule);text-decoration:none;color:var(--ink)}
.pr a b{color:var(--primary)}
.pr a span{font-size:14px;color:var(--sub)}
.pr .sub{font-size:12px;margin:8px 0 0}
.slot{margin:20px 0;padding:16px;border:2px dashed var(--faint);border-radius:10px;text-align:center;font-size:14px;color:var(--sub);line-height:1.6}
.slot small{font-size:12px}

/* share row */
.share{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:40px 0 0;padding-top:18px;border-top:1px solid var(--rule)}
.share.early{margin:0 0 28px;padding:14px 0 0;border-top:0}
.share>span{font-size:13.5px;color:var(--sub);margin-right:4px}
.share a,.share button{font:inherit;font-size:13.5px;font-weight:700;padding:7px 16px;border-radius:999px;border:1px solid #3A4850;background:transparent;color:var(--ink);text-decoration:none;cursor:pointer}
.share a:hover,.share button:hover{border-color:var(--primary)}
[hidden]{display:none!important}

/* /check/ self-check */
.diag fieldset{border:0;padding:0;margin:28px 0 0}
.diag legend{font-weight:900;font-size:17px;margin-bottom:12px;padding:0}
.qs{display:grid;gap:8px}
.q{display:flex;gap:12px;align-items:flex-start;padding:13px 15px;border:1px solid var(--rule);border-radius:12px;cursor:pointer;font-size:15px;line-height:1.7;background:var(--card)}
.q input{width:20px;height:20px;margin:3px 0 0;flex:none;accent-color:var(--primary)}
.q:has(input:checked){border-color:var(--primary);background:var(--primary-soft)}
.diag .actions{margin-top:22px}
.diag-result{margin-top:32px;padding:22px 20px;border-radius:16px;border:1px solid var(--primary);background:radial-gradient(120% 120% at 100% 0,#123234 0,var(--card) 60%);scroll-margin-top:120px}
.res-kicker{margin:0;font:600 12px/1.4 var(--cond);letter-spacing:.2em;color:var(--primary);text-transform:uppercase}
.diag-result h2{margin:4px 0 10px;padding:0;font-size:24px}
.diag-result h2::before{display:none}
.res-lead{margin:0 0 14px;color:#C9D2D6}
.res-grid{display:grid;gap:12px}
@media (min-width:640px){.res-grid{grid-template-columns:1fr 1fr}}
.res-grid>div{background:var(--band);border:1px solid var(--rule);border-radius:12px;padding:12px 14px}
.res-grid>div>b{display:flex;gap:6px;align-items:center;font-size:15px}
.res-grid p{margin:6px 0 0;font-size:14.5px}
.res-notes{margin:14px 0 0;padding-left:20px;font-size:14px}
.res-notes li{margin:6px 0}
.diag-result .sub{font-size:12px;margin-top:12px}

/* three pillars */
.pillars{grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr))}
.pillar{display:flex;flex-direction:column;gap:4px;background:var(--card);border:1px solid var(--rule);border-radius:14px;padding:0 0 16px;overflow:hidden;text-decoration:none;color:var(--ink);min-width:0}
a.pillar:hover{border-color:var(--primary)}
.pillar svg{width:100%;height:132px;background:var(--band);margin-bottom:10px;border-bottom:1px solid var(--rule)}
.pillar>:not(svg){padding-inline:16px}
.pillar .tag{font-size:12px;color:var(--primary);font-weight:700;letter-spacing:.06em}
.pillar b.num{font:700 30px/1.15 var(--cond);letter-spacing:.01em}
.pillar .d{font-size:13.5px;color:var(--sub);line-height:1.75}
.pillar small{font-size:11.5px;color:var(--faint);margin:10px 16px 0;padding:8px 0 0;border-top:1px solid var(--rule)}
.panel .phones{padding:8px 0}
td:first-child{white-space:nowrap}
.scroll.fit table{min-width:0}

/* mobile dock: one calm call to action at the bottom of the screen */
.dock{position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:20;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 10px 10px 18px;border-radius:999px;background:rgb(20 27 32 / .94);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid #2C4A4B;box-shadow:0 12px 30px -10px rgb(0 0 0 / .7);text-decoration:none;color:var(--ink)}
.dock span{font-size:13px;color:var(--sub)}
.dock b{background:var(--primary);color:var(--primary-ink);border-radius:999px;padding:8px 16px;font-size:14px;white-space:nowrap}
@media (min-width:860px){.dock{display:none}}
@media (max-width:859px){.site-foot{padding-bottom:100px}}

/* Self-check in step mode: one question card, はい／いいえ, progress bar */
.diag.stepping legend{font-size:13px;font-weight:500;color:var(--sub)}
.step-bar{display:flex;align-items:center;gap:12px;margin-top:24px}
.step-bar .num{font:700 15px/1 var(--cond);color:var(--primary);min-width:48px}
.step-bar i{flex:1;height:4px;background:var(--rule);border-radius:4px;overflow:hidden}
.step-bar b{display:block;height:100%;width:0;background:var(--primary);transition:width .25s}
.diag.stepping .q{min-height:132px;align-items:center;padding:22px 20px;font-size:18px;font-weight:700;line-height:1.6;cursor:default;background:var(--card)}
.diag.stepping .q input{display:none}
.step-btns{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}
.step-btns .btn{justify-content:center;min-height:52px;font-size:17px}
.step-btns .back{grid-column:1/-1;justify-self:start;background:none;border:0;color:var(--sub);font:inherit;font-size:13px;padding:6px 0;cursor:pointer;text-decoration:underline}
.res-h{display:block;font-size:15px;margin:0 0 10px}
.res-map,.res-facts{margin-top:18px;background:var(--band);border:1px solid var(--rule);border-radius:12px;padding:14px}
.meter{display:grid;grid-template-columns:1fr auto;gap:4px 10px;align-items:center;margin:10px 0 0;font-size:13.5px}
.meter i{grid-column:1/-1;height:8px;background:var(--rule);border-radius:8px;overflow:hidden;order:3}
.meter i b{display:block;height:100%;border-radius:8px;background:var(--primary);transition:width .5s}
.meter em{font:700 13px/1 var(--cond);font-style:normal;letter-spacing:.04em;color:var(--primary)}
.meter[data-level="mid"] i b{background:#D9A441}.meter[data-level="mid"] em{color:#E2B55A}
.meter[data-level="high"] i b{background:#E06A55}.meter[data-level="high"] em{color:#EE8572}
.res-facts ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.res-facts li{border-left:2px solid var(--primary);padding-left:10px;font-size:14px}
.res-facts li b{display:block;font-size:13px;color:var(--sub);font-weight:500}
.res-grid{margin-top:18px}
.res-app{margin-top:22px;padding:20px 18px;border-radius:14px;background:var(--bg);border:1px solid var(--rule)}
.res-app-h{display:block;font-size:20px;font-weight:900;line-height:1.5;margin:4px 0 8px}
.res-app>p{font-size:14.5px}
.ticks{list-style:none;padding:0;margin:12px 0;display:grid;gap:6px}
.ticks li{position:relative;padding-left:24px;font-size:14.5px}
.ticks li::before{content:"";position:absolute;left:4px;top:.55em;width:10px;height:6px;border:solid var(--primary);border-width:0 0 2px 2px;transform:rotate(-45deg)}
.res-app-phones{display:grid;grid-template-columns:1fr 1fr;gap:12px;max-width:380px;margin:14px auto}
.res-app .stores{margin-top:8px}
.res-app .stores .btn{flex:1 1 200px;justify-content:center}
.res-app-phones .phone{width:auto;margin:0}
.res-facts summary{cursor:pointer;margin:0;list-style:none;display:block;padding-right:24px;position:relative}
.res-facts summary::-webkit-details-marker{display:none}
.res-facts summary::after{content:"＋";color:var(--primary);position:absolute;right:0;top:0}
.res-facts[open] summary::after{content:"－"}
.res-facts[open] ul{margin-top:10px}
.hook{margin:0 0 14px;font-size:17px;font-weight:700;line-height:1.6;color:var(--sub);border-left:3px solid var(--primary);padding-left:12px}

/* In-article banner: tag bubble, question headline, dark pill button */
.banner{position:relative;display:flex;gap:16px;align-items:center;margin:28px 0;padding:18px 18px;border-radius:16px;border:1px solid #23474A;background:linear-gradient(120deg,#0F2A2B 0%,#13252C 55%,#18232A 100%);color:var(--ink);text-decoration:none;overflow:hidden}
.banner:hover .b-btn{background:#fff;color:var(--primary-ink)}
.b-mark{flex:none;width:72px;height:72px;border-radius:50%;background:#0A1A1B;display:grid;place-items:center;box-shadow:0 0 0 1px #2B5557}
.b-mark .rings{position:static;width:56px;height:56px;opacity:1;transform:none;inset:auto}
.b-body{display:grid;gap:6px;min-width:0}
.b-tag{justify-self:start;font-size:12.5px;font-weight:700;color:var(--primary-ink);background:var(--primary);padding:3px 12px;border-radius:999px 999px 999px 4px}
.b-head{font-size:19px;font-weight:900;line-height:1.45;word-break:keep-all;overflow-wrap:anywhere}
.b-btn{justify-self:start;display:inline-flex;gap:10px;align-items:center;margin-top:4px;padding:9px 16px;border-radius:999px;background:#04090B;border:1px solid #2B3A40;font-size:13.5px;font-weight:700;transition:background .2s,color .2s}
.b-btn i{font-style:normal;font-size:18px;line-height:1;color:var(--primary)}
.banner .pr-label{position:absolute;top:8px;right:10px}
@media (max-width:420px){.b-mark{width:56px;height:56px}.b-mark .rings{width:44px;height:44px}.b-head{font-size:17px}}
.b-mark .rings circle{stroke-width:9}.b-mark .rings .r1{stroke-opacity:.35}.b-mark .rings .r2{stroke-opacity:.6}.b-mark .rings .r3{stroke-opacity:1;stroke-width:10}
.b-mark .rings circle{stroke-width:8}.b-mark .rings .r1{stroke-opacity:.45}.b-mark .rings .r2{stroke-opacity:.75}

/* Free alternative next to paid options */
.free-alt{margin:24px 0;padding:18px;border-radius:14px;border:1px solid var(--primary);background:linear-gradient(160deg,#0F2A2B 0%,var(--card) 70%)}
.free-h{display:block;font-size:18px;font-weight:900;margin:4px 0 6px}
.free-alt p{font-size:14.5px}
.free-alt .stores .btn{flex:1 1 200px;justify-content:center}

/* Latin-script locales (/en/ ...): Barlow reads best with tighter leading and no tracking. */
html:not(:lang(ja)) body{font-size:17px;line-height:1.65;letter-spacing:0;overflow-wrap:break-word;font-feature-settings:normal}
html:not(:lang(ja)) .lead{font-size:18px;line-height:1.6}
html:not(:lang(ja)) .care .c,html:not(:lang(ja)) .study dt,html:not(:lang(ja)) .study dd{line-height:1.55}
html:not(:lang(ja)) .btn{letter-spacing:.02em}
/* Locales without app screenshots yet show the pelvis diagram on the hero stage. */
.stage-art{position:relative;align-self:center;width:min(100%,460px)}

/* option comparison cards */
.compare{align-items:start}
.compare .study{margin:0}
.compare .study dl{grid-template-columns:1fr}
.compare .study dt{padding-bottom:0;border-bottom:0}
.compare .study dd{padding-top:2px}
.compare .study.us{border-color:var(--primary)}
.compare .study.us .head b{color:var(--primary)}

/* self-check: start pill pinned like the dock; questions open in a panel that fills the screen */
.diag-go{position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:20;justify-content:center;min-height:54px;font-size:16px;box-shadow:0 12px 30px -10px rgb(0 0 0 / .7);max-width:520px;margin:0 auto}
.diag-go[hidden]{display:none}
.diag.stepping:not(.open) fieldset,.diag.stepping:not(.open) .step-btns,.diag.stepping:not(.open) .step-bar{display:none}
.diag.open{position:fixed;inset:0;z-index:60;margin:0;background:var(--bg);display:flex;flex-direction:column;height:100vh;height:100dvh;padding:calc(14px + env(safe-area-inset-top)) 16px calc(16px + env(safe-area-inset-bottom));overflow-y:auto}
.diag.open > *{width:100%;max-width:560px;margin-inline:auto}
.diag.open .step-bar{margin-top:0}
.diag.open fieldset{flex:1;display:flex;flex-direction:column;justify-content:center;margin:16px auto}
.diag.open .q{min-height:0}
.diag.open .step-btns{margin-top:0}
.diag-close{background:none;border:1px solid var(--rule);border-radius:999px;color:var(--ink);width:40px;height:40px;font-size:22px;line-height:1;cursor:pointer;flex:none}
.diag-close:focus-visible,.diag-go:focus-visible{outline:2px solid var(--primary);outline-offset:2px}
html.diag-lock,html.diag-lock body{overflow:hidden}

/* self-check result: the options that fit this type */
.res-opts{margin-top:18px;background:var(--band);border:1px solid var(--rule);border-radius:12px;padding:14px}
.res-opts .sub{margin:-4px 0 10px;font-size:13px}
.res-opts ul{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.res-opts li{display:grid;gap:2px;padding:10px 12px;border:1px solid var(--rule);border-radius:10px;background:var(--card)}
.res-opts li b{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:15px}
.res-opts li>span{font-size:14px;color:var(--sub)}
.res-opts .free-tag{font-size:11.5px;font-weight:700;color:var(--primary);border:1px solid #2C4A4B;border-radius:999px;padding:1px 8px}
.diag.open legend{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.diag.open .q{font-size:20px}
