:root{
  --bg:#0b0d12;
  --panel:#111520;
  --text:#e8ecf1;
  --muted:#9aa4b2;
  --accent:#7dd3fc;
  --line:#1f2937;
  --link:#93c5fd;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, "Hiragino Kaku Gothic ProN", "Noto Sans JP", Meiryo, sans-serif;
  background: radial-gradient(1200px 600px at 20% -10%, rgba(125,211,252,.18), transparent 60%),
              radial-gradient(900px 500px at 80% 0%, rgba(99,102,241,.12), transparent 55%),
              var(--bg);
  color:var(--text);
  line-height:1.6;
}
a{color:var(--link); text-decoration:none}
a:hover{text-decoration:underline}
.container{max-width:980px; margin:0 auto; padding:28px 18px 64px}
.header{display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 0 22px; border-bottom:1px solid var(--line)}
.brand{display:flex; flex-direction:column; gap:2px}
.brand .title{font-weight:800; letter-spacing:.02em; font-size:20px}
.brand .subtitle{color:var(--muted); font-size:13px}
.badge{font-size:12px; color:var(--muted); border:1px solid var(--line); padding:6px 10px; border-radius:999px; background:rgba(17,21,32,.7)}
.hero{padding:26px 0 10px}
h1{font-size:34px; margin:0 0 8px}
.lead{color:var(--muted); margin:0 0 16px; font-size:16px}
.panel{
  background:rgba(17,21,32,.72);
  border:1px solid var(--line);
  border-radius:16px;
  padding:18px;
  margin:14px 0;
  backdrop-filter: blur(6px);
}
.grid{display:grid; grid-template-columns:repeat(12,1fr); gap:14px}
.col6{grid-column: span 6}
.col12{grid-column: span 12}
@media (max-width:760px){ .col6{grid-column: span 12} h1{font-size:30px}}
.kicker{color:var(--accent); font-weight:700; letter-spacing:.08em; text-transform:uppercase; font-size:12px}
.list{margin:10px 0 0; padding-left:18px; color:var(--text)}
.list li{margin:6px 0}
.note{color:var(--muted); font-size:13px}
.footer{margin-top:26px; padding-top:18px; border-top:1px solid var(--line); color:var(--muted); font-size:12px}
.smallcaps{letter-spacing:.08em; text-transform:uppercase}
.code{font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Noto Sans Mono", monospace; font-size:12px; color:#c7d2fe}