:root{color-scheme:light;--paper:#f8f8f3;--ink:#262923;--muted:#63675d;--line:#d4d7ca;--accent:#97462e;--wash:#e9ece1}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:28px}
body{margin:0;background:var(--paper);color:var(--ink);font:15px/1.85 -apple-system,BlinkMacSystemFont,"Helvetica Neue","Hiragino Kaku Gothic ProN",Meiryo,sans-serif}
a{color:inherit;text-decoration-color:#9a9f90;text-underline-offset:5px}
a:hover{color:var(--accent)}
button,select{font:inherit}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:5px}
button{cursor:pointer}
.wrap{max-width:1200px;margin:auto;padding:0 52px}
.topbar{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:24px 0;border-bottom:1px solid var(--ink)}
.brand{display:flex;align-items:center;gap:10px;font-weight:600;text-decoration:none}
.brand picture,.brand img{display:block}.brand img{width:30px;height:30px}
.topbar nav{display:flex;align-items:center;gap:26px;font-size:12px}
.languages{display:flex;gap:10px;border-left:1px solid var(--line);padding-left:24px}
.languages[hidden]{display:none}
.languages button{border:0;background:none;padding:2px;color:var(--muted);font-size:12px}
.languages button[aria-pressed="true"]{color:var(--ink);text-decoration:underline;text-underline-offset:5px}
.hero{display:grid;grid-template-columns:1fr 1.04fr;align-items:center;gap:40px;padding:72px 0 58px}
.eyebrow{font-size:10px;font-weight:600;letter-spacing:.16em;color:var(--accent);margin:0 0 22px}
/* Both names share a grid cell, reserving the wider name without layout shifts. */
.title-block{margin-bottom:24px}
.title-block h1{display:grid;width:max-content;max-width:100%;margin-bottom:10px;line-height:1.25}
.title-word{grid-area:1/1;display:block}
.title-kanji{opacity:0;font-family:"Hiragino Mincho ProN","Yu Mincho",serif;letter-spacing:.1em;font-weight:400}
#motion-toggle{font-size:10px;border:0;background:none;color:var(--muted);padding:4px 0;text-decoration:underline;text-underline-offset:4px}
.is-animated .title-latin{animation:title-latin 12s infinite}
.is-animated .title-kanji{animation:title-kanji 12s infinite}
.is-paused .title-word{animation-play-state:paused}
@keyframes title-latin{0%,42%,100%{opacity:1;transform:translateY(0)}48%,92%{opacity:0;transform:translateY(-.12em)}96%{opacity:0;transform:translateY(.12em)}}
@keyframes title-kanji{0%,42%,100%{opacity:0;transform:translateY(.12em)}50%,90%{opacity:1;transform:translateY(0)}96%{opacity:0;transform:translateY(-.12em)}}
h1{font-size:clamp(72px,8vw,112px);line-height:1;letter-spacing:-.065em;font-weight:500;margin:0 0 30px}
.lead{font-size:clamp(23px,2.4vw,30px);line-height:1.65;letter-spacing:.015em;max-width:440px;margin:0 0 18px;font-weight:500}
.intro{color:var(--muted);max-width:370px;font-size:14px}
.lead{text-wrap:balance;white-space:pre-line}
html[lang="ja"] .lead{text-wrap:initial}
.button{display:inline-flex;align-items:center;justify-content:space-between;gap:32px;padding:13px 22px;background:var(--ink);color:white;text-decoration:none;font-size:14px}
.button:hover{background:var(--accent);color:white}
.hero .button{margin-top:20px}
.small{font-size:12px;color:var(--muted)}
.hero .small{margin:12px 0 0}
figure{margin:0;min-width:0}
.hero picture,.hero img{width:100%;display:block}.hero img{height:auto}
figcaption{display:flex;justify-content:space-between;gap:16px;color:var(--muted);font-size:10px;margin-top:12px}
.factline{display:grid;grid-template-columns:repeat(3,1fr);padding:22px 0;border-block:1px solid var(--line);gap:24px}
.factline p{margin:0;font-size:12px;color:var(--muted)}
.factline strong{display:block;font-size:14px;color:var(--ink);font-weight:500;margin-bottom:3px}
.section{padding:78px 0;border-bottom:1px solid var(--line)}
.section-head{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:end;margin-bottom:40px}
h2{font-weight:500;font-size:32px;letter-spacing:-.035em;line-height:1.5;margin:0;max-width:540px}
.section-head>p{color:var(--muted);font-size:14px;margin:0;max-width:420px}
p{margin:0 0 16px}
.feature-list{margin-left:22%;border-top:1px solid var(--ink)}
.feature{display:grid;grid-template-columns:40px 1fr 1.25fr;gap:24px;padding:28px 0;border-bottom:1px solid var(--line);align-items:baseline}
.number{font-size:11px;color:var(--accent);font-variant-numeric:tabular-nums}
h3{margin:0;font-size:20px;font-weight:500;line-height:1.6}
.feature p{font-size:14px;color:var(--muted);margin:0}
.engine-support{margin-top:30px;padding:24px;border:1px solid var(--line)}
.engine-title{margin:0 0 15px;font-size:11px;font-weight:600;letter-spacing:.08em;color:var(--accent)}
.engine-support dl{margin:0;border-top:1px solid var(--line)}
.engine-support dl>div{display:grid;grid-template-columns:180px 1fr;gap:24px;padding:17px 0;border-bottom:1px solid var(--line)}
.engine-support dt{font-size:13px}.engine-support dd{font-size:13px}.engine-support dd strong,.engine-support dd span{display:block}.engine-support dd strong{margin-bottom:4px;color:var(--ink);font-weight:500}
.compatibility{background:var(--wash);margin-top:64px;padding:40px}
.compatibility .eyebrow{margin-bottom:12px}
.compatibility h2{font-size:29px}
.compat-intro{display:grid;grid-template-columns:1fr 1fr;gap:40px;margin-bottom:30px}
.compat-intro p{font-size:14px;color:var(--muted);margin:0}
.status-list{border-top:1px solid #b8bfae;margin:0}
.status-row{display:grid;grid-template-columns:130px 1fr;gap:30px;padding:18px 0;border-bottom:1px solid #cbd0c1;font-size:14px}
dt{font-weight:500}dd{margin:0;color:var(--muted)}
.status-row:last-child dt{color:var(--accent)}
.compat-links{display:flex;flex-wrap:wrap;gap:14px 26px;margin:25px 0 0;font-size:12px}
.install{margin-top:74px;background:var(--ink);color:#f8f8f3;padding:50px}
.install .eyebrow{color:#c9cebd}
.install .section-head{grid-template-columns:1.25fr 1fr;align-items:start}
.release-meta{font-size:13px;color:#d5dacd}
.release-meta p{margin:0 0 5px}
.install .button{background:var(--paper);color:var(--ink);margin-top:20px}
.install .button:hover{background:#d9ddcc}
.install a:not(.button):hover{color:white}
.release-status{font-size:12px;color:#c9cebd;min-height:1.8em}
.steps{list-style:none;counter-reset:step;display:grid;grid-template-columns:repeat(3,1fr);gap:30px;padding:28px 0 0;margin:34px 0 0;border-top:1px solid #606657}
.steps li{counter-increment:step}
.steps li::before{content:"0" counter(step);display:block;font-size:12px;color:#c9cebd;margin-bottom:15px}
.steps h3{font-size:17px;margin-bottom:8px}
.steps p{font-size:13px;color:#d5dacd;margin:0}
.security{margin-top:30px;border-top:1px solid #606657;padding-top:20px;font-size:13px}
summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:22px;align-items:baseline}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";font-size:20px;font-weight:400;flex-shrink:0}
details[open]>summary::after{content:"−"}
.security p{margin:16px 0 0;color:#d5dacd;max-width:800px}
.security pre{padding:14px 16px;border:1px solid #606657;white-space:pre-wrap;overflow-wrap:anywhere}
.faq{display:grid;grid-template-columns:.85fr 1.4fr;gap:70px}
.questions details{padding:19px 0;border-top:1px solid var(--line)}
.questions details:last-child{border-bottom:1px solid var(--line)}
.questions summary{font-size:15px;font-weight:500}
.questions p{font-size:14px;color:var(--muted);margin:15px 0 0}
.experiments{display:flex;gap:36px;justify-content:space-between;align-items:baseline;margin-top:28px;font-size:12px;color:var(--muted)}
.experiments p{margin:0;max-width:750px}
footer{padding:40px 0 28px}
.footer-top{display:flex;justify-content:space-between;align-items:baseline;gap:30px;margin-bottom:30px}
.footer-top strong{font-size:26px;font-weight:500;letter-spacing:-.045em}
.footer-top nav{display:flex;flex-wrap:wrap;gap:24px;font-size:12px}
.credits{font-size:11px;color:var(--muted);max-width:900px}
.bottom{display:flex;justify-content:space-between;gap:24px;border-top:1px solid var(--line);padding-top:20px;margin-top:25px;font-size:10px;color:var(--muted)}
code{font-size:.95em;overflow-wrap:anywhere}
[hidden]{display:none!important}
@media(max-width:800px){
.wrap{padding:0 24px}.topbar{gap:16px;flex-wrap:wrap}.topbar nav{gap:14px;flex-wrap:wrap}.languages{flex-wrap:wrap}.languages{padding-left:16px}.nav-feature{display:none}
.hero{grid-template-columns:1fr;padding:46px 0 35px;gap:34px}.hero figure{max-width:540px;width:100%;margin:auto}h1{font-size:82px}.lead{font-size:26px}
.factline{gap:15px}.factline strong{font-size:12px}.factline p{font-size:11px}
.section{padding:48px 0}.section-head{grid-template-columns:1fr;gap:20px;margin-bottom:28px}h2{font-size:28px}
.feature-list{margin:0}.feature{grid-template-columns:25px 1fr;gap:10px 16px}.feature p{grid-column:2}h3{font-size:19px}
.engine-support{padding:20px}.engine-support dl>div{grid-template-columns:1fr;gap:5px}
.compatibility{margin-top:42px;padding:25px}.compat-intro{grid-template-columns:1fr;gap:18px}.status-row{grid-template-columns:1fr;gap:6px}
.install{margin-top:42px;padding:28px 24px}.install .section-head{grid-template-columns:1fr;gap:26px}.steps{grid-template-columns:1fr;gap:25px;margin-top:24px}.steps li{position:relative;padding-left:35px}.steps li::before{position:absolute;left:0;top:2px}.steps h3{margin-bottom:5px}
.faq{grid-template-columns:1fr;gap:28px}.experiments{flex-direction:column;gap:12px}
.footer-top{align-items:start;flex-direction:column;gap:15px}.footer-top nav{gap:16px}
}
@media(max-width:380px){.wrap{padding:0 18px}.topbar nav{gap:12px}.brand{font-size:14px}.languages{padding-left:10px;gap:7px}h1{font-size:72px}.factline{grid-template-columns:1fr}.factline strong{display:inline;margin-right:10px}.compatibility{padding:20px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.is-animated .title-word{animation:none}.title-latin{opacity:1;transform:none}.title-kanji{opacity:0;transform:none}#motion-toggle{display:none}}