/* 文章のページ（プライバシーポリシーなど）の共通スタイル。ゲームと同じ方眼紙と色 */
:root{
  --bg:#edf0ec; --grid:#dde3dd; --surface:#ffffff;
  --ink:#2b1d14; --muted:#6d5a4c; --line:#d5cdc2; --accent:#9a5b2e;
  color-scheme: light;
}
@media (prefers-color-scheme: dark){
  :root{
    --bg:#16100c; --grid:#211813; --surface:#201712;
    --ink:#f3e8dc; --muted:#b9a593; --line:#3b2c22; --accent:#e0a36d;
    color-scheme: dark;
  }
}
*,*::before,*::after{box-sizing:border-box}
body{
  margin:0; color:var(--ink); background-color:var(--bg);
  background-image:linear-gradient(var(--grid) 1px, transparent 1px), linear-gradient(90deg, var(--grid) 1px, transparent 1px);
  background-size:24px 24px;
  font-family:var(--font-body); font-size:16px; line-height:1.8; overflow-wrap:anywhere;
}
.wrap{max-width:720px; margin:0 auto; padding:16px 16px 48px}
header{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:8px 16px; padding-bottom:10px; border-bottom:3px double var(--line)}
h1, h2, .back{font-family:var(--font-pixel); font-weight:400}
h1{font-size:1.5rem; margin:20px 0 12px}
h2{font-size:1.1rem; margin:24px 0 6px; color:var(--accent)}
h2:first-of-type{margin-top:12px}
p, li{margin:0 0 8px}
ul{padding-left:1.4em}
a{color:var(--accent)}
.back{text-decoration:none}
.panel{background:var(--surface); border:2px solid var(--line); padding:16px 20px}
.date{margin-top:20px; color:var(--muted); font-size:.9rem}
.langs{display:flex; flex-wrap:wrap; gap:2px 10px; font-size:.8rem}
.langs a{color:var(--muted)}
.langs a[aria-current]{color:var(--ink); font-weight:700; text-decoration:none}
.suggest{display:flex; flex-wrap:wrap; align-items:center; gap:4px 8px; margin-bottom:12px; padding:6px 10px; font-size:.9rem; background:var(--surface); border:2px solid var(--accent)}
.suggest[hidden]{display:none}
.suggest a{font-weight:700}
.suggest-close{margin-left:auto; padding:0 6px; font-size:1.1rem; line-height:1.2; background:none; border:0; color:var(--muted); cursor:pointer}
footer{margin-top:24px; padding-top:10px; border-top:3px double var(--line); font-size:.85rem}
footer .foot ul{list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:4px 16px}
footer .foot a[aria-current]{color:var(--ink); font-weight:700; text-decoration:none}
/* 本文の部品（運営者情報の表・注記・表・番号つきの手順） */
.info{display:grid; grid-template-columns:max-content 1fr; gap:4px 16px; margin:0 0 8px}
.info dt{color:var(--muted)}
.info dd{margin:0}
.note{color:var(--muted); font-size:.9rem}
.table{overflow-x:auto; margin:0 0 12px}
table{border-collapse:collapse; width:100%}
th, td{text-align:left; vertical-align:top; padding:6px 8px; border-bottom:1px solid var(--line)}
th{color:var(--muted); font-weight:400; white-space:nowrap}
h3{font-size:1rem; margin:16px 0 4px}
ol{padding-left:1.4em}
@media (max-width:480px){ .info{grid-template-columns:1fr} .info dt{margin-top:6px} }