:root{--bg:#0b0f1a;--card:#121827;--line:#232c40;--ink:#e9edf5;--sub:#9aa3b5;--gold:#ffd34d;--red:#ff5a64;--blue:#4aa3ff}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:radial-gradient(1200px 600px at 70% -10%,#1d2340 0,transparent 60%),var(--bg);color:var(--ink);
  font:16px/1.75 "Noto Sans JP","Hiragino Sans","Yu Gothic UI",system-ui,sans-serif}
a{color:var(--gold)}
.wrap{max-width:920px;margin:0 auto;padding:0 20px}
header{border-bottom:1px solid var(--line);position:sticky;top:0;background:rgba(11,15,26,.88);backdrop-filter:blur(8px);z-index:5}
header .wrap{display:flex;align-items:center;gap:16px;height:60px}
.brand{font:italic 900 22px/1 system-ui,sans-serif;letter-spacing:.02em;color:var(--ink);text-decoration:none;white-space:nowrap}
.brand i{font-style:normal;color:var(--gold)}
nav{margin-left:auto;display:flex;gap:14px;align-items:center;font-size:14px}
nav a{color:var(--sub);text-decoration:none}nav a:hover{color:var(--ink)}
.lang{display:flex;border:1px solid var(--line);border-radius:6px;overflow:hidden}
.lang button{background:none;border:0;color:var(--sub);padding:3px 10px;font:inherit;cursor:pointer}
.lang button.on{background:var(--gold);color:#1a1300;font-weight:700}
.hero{padding:72px 0 48px;text-align:center}
.hero .kicker{display:inline-block;font:italic 800 13px/1 system-ui;letter-spacing:.3em;color:var(--gold);margin-bottom:14px}
.hero h1{font-size:clamp(34px,6vw,58px);line-height:1.15;margin:0 0 16px;font-weight:900}
.hero h1 b{color:var(--gold)}
.hero p{color:var(--sub);max-width:640px;margin:0 auto 26px}
.btn{display:inline-block;padding:11px 22px;border-radius:8px;background:var(--red);color:#fff;font-weight:800;text-decoration:none}
.btn.ghost{background:none;border:1px solid var(--line);color:var(--ink);margin-left:8px}
.vs{font:italic 900 28px/1 system-ui;color:#5d6677;margin:0 10px}
section{padding:36px 0;border-top:1px solid var(--line)}
section h2{font-size:24px;margin:0 0 18px}
section h2 small{display:block;font:italic 800 12px/1.6 system-ui;letter-spacing:.25em;color:var(--gold)}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}
.card{background:var(--card);border:1px solid var(--line);border-left:3px solid var(--gold);border-radius:8px;padding:16px 18px}
.card h3{margin:0 0 6px;font-size:17px}
.card p{margin:0;color:var(--sub);font-size:14.5px}
.doc h1{font-size:30px;margin:48px 0 6px}
.doc .date{color:var(--sub);font-size:14px;margin-bottom:28px}
.doc h2{font-size:19px;margin:30px 0 8px;border-left:3px solid var(--gold);padding-left:10px}
.doc p,.doc li{color:#d6dbe5}
.note{color:var(--sub);font-size:14px}
footer{border-top:1px solid var(--line);padding:26px 0 40px;color:var(--sub);font-size:13.5px}
footer .wrap{display:flex;flex-wrap:wrap;gap:8px 18px}
footer a{color:var(--sub)}
[data-l="en"]{display:none}
html.en [data-l="ja"]{display:none}
html.en [data-l="en"]{display:revert}
@media (max-width:560px){nav a.hide-s{display:none}.btn.ghost{margin:10px 0 0}}