:root{--ink:#eaf5eb;--muted:#b2c9bb;--surface:#10231c;--panel:#172e25;--line:#3a5646;--accent:#c9f38c;--paper:#e6f0e8;--dark:#0c1a14}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--dark);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic",Arial,sans-serif;line-height:1.75}
a{color:inherit;text-decoration:none}a:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.shell{max-width:1190px;margin:0 auto;padding:0 30px}.mini-top{height:7px;background:linear-gradient(90deg,#b8f06f,#6db8b0,#a590e7)}
.site-header{background:#12271d;border-bottom:1px solid #33513e;position:relative;z-index:2}.navbox{min-height:88px;display:flex;align-items:center;gap:20px}.logo{display:flex;gap:13px;align-items:center;margin-right:auto}.mark{height:59px;width:56px;flex-shrink:0;border:1px solid #6d9b6a;border-radius:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#1b3626;color:#d4f3aa;font:800 16px/1.02 -apple-system,Arial,sans-serif;letter-spacing:.015em}.mark i{width:20px;height:1px;background:#809e77;margin:4px 0}.brandname{display:block;color:#eef5ee;font-size:13px;font-weight:750}.brandname small{display:block;font-size:9px;font-weight:650;color:#a6c4b0;letter-spacing:.09em}.navlinks{display:flex;align-items:center;gap:20px;font-size:12px;font-weight:750;color:#cdded1}.navlinks a:hover{color:#d8f3a5}.lang-controls{display:flex;border:1px solid #67876c;border-radius:30px;padding:3px;margin-left:4px}.lang-controls button{border:0;background:transparent;color:#d5e0d6;font-size:11px;font-weight:800;border-radius:20px;padding:7px 10px;cursor:pointer}.lang-controls button.on{color:#12251a;background:#c9f38c}
.kicker{color:var(--accent);font-size:12px;font-weight:800;letter-spacing:.17em}.hero{background:radial-gradient(circle at 80% 35%,#2a4030 0,transparent 43%),linear-gradient(155deg,#142b21,#0a1c15);border-bottom:1px solid #314738;padding:64px 0 70px}.crumb{font-size:12px;color:#9fbca9;display:flex;gap:8px;flex-wrap:wrap;margin-bottom:31px}.crumb a{text-decoration:underline;text-underline-offset:3px}.hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(340px,.93fr);align-items:center;gap:45px}.hero h1{font-size:clamp(32px,3.7vw,56px);line-height:1.32;letter-spacing:-.035em;margin:19px 0}.hero h1::after{content:".";color:var(--accent)}.lead{font-size:clamp(16px,1.8vw,21px);color:#c1ddc9;margin:0 0 18px}.page-meta{display:flex;gap:10px;flex-wrap:wrap;margin:24px 0}.tag{border:1px solid #67876b;border-radius:100px;padding:5px 13px;color:#d6e9d6;font-size:11px;font-weight:750}.primary-link{display:inline-flex;align-items:center;gap:8px;background:var(--accent);color:#142b1d;padding:12px 17px;border-radius:10px;font-size:12px;font-weight:850}.primary-link:hover{filter:brightness(1.07)}
.artframe{background:#10281e;border:1px solid #43684e;border-radius:18px;padding:10px;box-shadow:0 22px 65px #0005;overflow:hidden}.artframe img{width:100%;height:auto;display:block}.artcaption{font-size:10px;letter-spacing:.045em;color:#a9c4b0;padding:6px 10px 10px}
.section{padding:74px 0;border-bottom:1px solid #203e2b}.section.alt{background:#11271c}.sec-label{font-size:12px;letter-spacing:.17em;color:#b9e592;font-weight:850;margin-bottom:10px}.section h2{font-size:clamp(26px,3vw,37px);line-height:1.32;margin:0 0 25px}.bodycopy{max-width:850px;font-size:16px;color:#d8e8d9}.bodycopy p{margin:0 0 18px}.threecol{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.step{border:1px solid #3c5c48;background:#1a3426;border-radius:14px;padding:22px;min-height:153px}.step small{display:block;color:#b4e88d;font-size:11px;letter-spacing:.12em;font-weight:800}.step strong{display:block;margin-top:12px;font-size:16px;font-weight:720}.step-arrow{position:absolute}.figure-rec{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:26px}.reccard{background:#1a3024;border:1px dashed #789b78;border-radius:14px;padding:24px}.reccard .icon{font-size:22px;color:#c8eba0}.reccard h3{font-size:16px;margin:8px 0 9px}.reccard p{font-size:13px;color:#b7d0c1;margin:0}.reccard .mini{margin-top:14px;padding:9px 12px;border-radius:8px;background:#0f2318;color:#bcd9bd;font-size:11px}
.ref-intro{color:#bdd1c2;font-size:14px;margin:-8px 0 26px}.ref-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.paper{display:flex;gap:13px;background:#172f23;border:1px solid #395b43;padding:17px;border-radius:12px;min-width:0}.paper:hover{border-color:#82b57c;background:#1a3828}.paper-no{min-width:43px;font-size:11px;color:#b9e88d;font-family:ui-monospace,Menlo,monospace;padding-top:4px}.paper-body{min-width:0;overflow-wrap:anywhere}.paper h3{font-size:13px;line-height:1.54;font-weight:750;margin:0 0 8px}.paper .journal{font-size:11px;color:#bccabd;margin:0 0 9px}.paper a{font-size:11px;color:#c4ee98;text-decoration:underline;text-underline-offset:3px;overflow-wrap:anywhere}.paper a:hover{color:#fff}
.related{display:flex;flex-wrap:wrap;gap:12px}.related a{display:inline-flex;flex-direction:column;gap:2px;flex:1 1 160px;padding:17px;border-radius:12px;border:1px solid #416247;background:#1b3326}.related a:hover{border-color:#c4e99b}.related small{font-size:10px;color:#bdd49c}.related b{font-size:13px}.foot{background:#091910;padding:34px 0;color:#97b6a0;font-size:12px}.foot .shell{display:flex;gap:15px;justify-content:space-between;flex-wrap:wrap}
.l-en{display:none}html[data-lang=en] .l-ja{display:none}html[data-lang=en] .l-en{display:initial}html[data-lang=en] p.l-en{display:block}html[data-lang=en] .l-en.blk{display:block}html[data-lang=en] .l-en.grid{display:grid}html[data-lang=en] .l-en.flex{display:flex}
@media(max-width:850px){.hero-grid{grid-template-columns:1fr}.artframe{max-width:620px}.navlinks{gap:12px}.brandname small{display:none}.ref-grid{grid-template-columns:1fr}}
@media(max-width:650px){.shell{padding:0 20px}.navbox{min-height:77px;flex-wrap:wrap;gap:8px;padding-top:9px;padding-bottom:10px}.logo{margin-right:auto}.brandname{font-size:10px;max-width:185px}.navlinks{width:100%;order:3;justify-content:space-between;font-size:10px}.hero{padding:36px 0 45px}.hero-grid{gap:24px}.section{padding:48px 0}.threecol,.figure-rec{grid-template-columns:1fr}.step{min-height:0}.hero h1{font-size:33px}.mark{height:52px;width:50px}.ref-grid{grid-template-columns:1fr}.paper{padding:14px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
/* YAMADA research detail: two optional editable figures per page */
.research-figures{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:28px}
.research-figures:empty{display:none}.research-figures .research-figure{margin:0;min-width:0;overflow:hidden;border-radius:14px;background:#192f25;border:1px solid #3b6045;padding:12px}
.research-figures .research-figure img{display:block;width:100%;height:auto;max-height:490px;object-fit:contain;border-radius:9px;background:#eaf1eb}
.research-figures .research-figure figcaption{padding:12px 3px 3px;color:#c5d7c9;font-size:12px;overflow-wrap:anywhere}
.research-figures .fig-number{color:#c7e99f;font-weight:850;margin-right:8px;font-size:11px}
.approach-intro{max-width:850px;margin:-5px 0 22px;color:#d2e3d3;font-size:15px;white-space:pre-line}
@media(max-width:650px){.research-figures{grid-template-columns:1fr;gap:13px}}

/* A dedicated figure is available for each research approach. */
.approach-stack{display:grid;gap:18px;margin-top:22px}
.approach-card{min-width:0;display:grid;grid-template-columns:minmax(225px,.72fr) minmax(0,1.28fr);align-items:stretch;gap:20px;border:1px solid #3b6048;background:#193126;padding:16px;border-radius:16px}
.approach-card .step{margin:0;min-height:210px;display:flex;flex-direction:column;justify-content:center;background:#132a1e;border:1px solid #37533f}
.approach-card.without-figure{grid-template-columns:1fr}
.approach-card.without-figure .step{min-height:125px}
.approach-figure{margin:0;min-width:0;border:1px solid #41664d;padding:8px;background:#10251a;border-radius:12px}
.approach-figure img{display:block;width:100%;max-height:440px;aspect-ratio:3/2;object-fit:contain;background:#f0f4ed;border-radius:8px}
.approach-figure figcaption{padding:8px 4px 3px;color:#c2d8c5;font-size:12px;overflow-wrap:anywhere}
.approach-figure .fig-number{color:#d0f2a9;font-weight:850;margin-right:10px;font-size:11px}
@media(max-width:700px){.approach-card{grid-template-columns:1fr;padding:12px;gap:12px}.approach-card .step{min-height:110px}.approach-figure img{max-height:450px}}