/**
 * index.html 以外のページで使う土台（2026-08-11）。
 *
 * **index.html はわざと1ファイルのままにしてある**（そのまま人に渡せる形を残したい）。
 * こちらは付随のページ用。色や文字の決め方は index.html と揃えてある。
 */
:root{
  --bg:#0b0d12; --ink:#e8ecf4; --dim:#8b93a3; --line:rgba(255,255,255,.09);
  --line2:rgba(255,255,255,.16); --glass:rgba(255,255,255,.045);
  --cyan:#5cc8ff; --violet:#a78bfa; --ok:#3ecf8e; --warn:#f0b429;
  --grad:linear-gradient(115deg,#5cc8ff 0%,#7aa7ff 45%,#a78bfa 100%);
}
*{box-sizing:border-box}
body{
  margin:0;background:var(--bg);color:var(--ink);line-height:1.9;
  font-family:-apple-system,"Hiragino Sans","Yu Gothic UI","Segoe UI",sans-serif;
  font-size:16px;
  background-image:
    radial-gradient(900px 520px at 12% -6%,rgba(92,200,255,.10),transparent 62%),
    radial-gradient(760px 480px at 106% 4%,rgba(167,139,250,.10),transparent 60%);
  background-attachment:fixed;
}
.wrap{max-width:760px;margin:0 auto;padding:0 22px}
a{color:var(--cyan)}
h1{font-size:clamp(24px,4.2vw,34px);font-weight:800;letter-spacing:-.01em;margin:0 0 10px}
h2{font-size:clamp(18px,2.8vw,22px);font-weight:800;margin:40px 0 10px}
h3{font-size:16px;font-weight:700;margin:24px 0 6px}
p,li{color:#c9d2e0}
.lead{color:var(--dim)}
.dim{color:var(--dim)}
small,.note{font-size:13px;color:#6d7585}
.glass{background:var(--glass);border:1px solid var(--line);border-radius:16px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 12px 34px rgba(0,0,0,.34);
  padding:22px 24px;margin:18px 0}
.brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none}
.brand span{font-weight:800;font-size:17px;background:var(--grad);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
header.top{padding:34px 0 6px}
main{padding:10px 0 30px}
footer{padding:44px 0 66px;color:#6d7585;font-size:13px;border-top:1px solid var(--line);margin-top:40px}
table{width:100%;border-collapse:collapse;font-size:14.5px;margin:14px 0}
th,td{padding:11px 10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
th{color:var(--dim);font-weight:600;font-size:13px}
ul{padding-left:1.2em}
li{margin:6px 0}
code{background:rgba(255,255,255,.06);padding:2px 6px;border-radius:5px;font-size:13.5px}
.back{display:inline-block;margin-top:8px;font-size:14px}

/**
 * キーボードで辿る人に、いまどこに居るかを見せる（2026-08-11）。
 * **マウスで押したときには出さない**（:focus ではなく :focus-visible）。
 */
a:focus-visible,button:focus-visible,input:focus-visible{
  outline:2px solid var(--cyan);outline-offset:3px;border-radius:6px;
}

/* 動きを減らす設定の人には、送るときの淡い切り替えも出さない */
@media (prefers-reduced-motion: reduce){
  *{animation-duration:.01ms !important;transition-duration:.01ms !important}
}