/* 規約などのページ（legal/*.html）の共通の見た目。色は guide.html と同じ */
:root {
  --bg: #0e1020; --panel: rgba(24, 28, 52, 0.9); --line: rgba(232, 196, 106, 0.3);
  --text: #ece8f6; --muted: #a9a6c2; --gold: #e8c46a; --gold-soft: #f5e3b0;
  --font: 'M PLUS Rounded 1c', 'Hiragino Maru Gothic ProN', system-ui, sans-serif; --font-en: 'Cinzel', serif;
}
* { box-sizing: border-box; }
body { margin: 0; background: radial-gradient(ellipse at top, #22204a 0%, var(--bg) 55%) fixed; color: var(--text); font-family: var(--font); line-height: 1.8; font-size: 15px; }
a { color: var(--gold-soft); }
header.top { position: sticky; top: 0; z-index: 10; display: flex; align-items: center; gap: 14px; padding: 10px max(16px, env(safe-area-inset-right)) 10px max(16px, env(safe-area-inset-left)); background: rgba(12, 14, 30, 0.92); border-bottom: 1px solid var(--line); backdrop-filter: blur(6px); }
.brand { font-family: var(--font-en); font-weight: 800; color: var(--gold-soft); letter-spacing: 2px; white-space: nowrap; text-decoration: none; }
.back { margin-left: auto; padding: 6px 14px; border-radius: 999px; border: 1px solid var(--line); text-decoration: none; font-weight: 800; white-space: nowrap; font-size: 13px; }
main { max-width: 820px; margin: 0 auto; padding: 24px max(16px, env(safe-area-inset-right)) 48px max(16px, env(safe-area-inset-left)); }
h1 { font-size: 24px; margin: 0 0 6px; color: var(--gold-soft); }
h2 { font-size: 18px; margin: 32px 0 10px; padding-bottom: 6px; border-bottom: 1px solid var(--line); color: var(--gold-soft); }
p { margin: 0 0 10px; }
ol, ul { margin: 0 0 10px; padding-left: 1.5em; }
li { margin-bottom: 4px; }
.lead { color: var(--muted); }
.table-wrap { overflow-x: auto; border-radius: 14px; border: 1px solid var(--line); background: var(--panel); margin: 12px 0; }
table { border-collapse: collapse; width: 100%; font-size: 14px; }
th, td { padding: 12px 14px; text-align: left; border-bottom: 1px solid rgba(255, 255, 255, 0.07); vertical-align: top; }
tr:last-child th, tr:last-child td { border-bottom: none; }
th { width: 30%; min-width: 120px; color: var(--gold-soft); font-weight: 800; background: rgba(0, 0, 0, 0.2); }
td.num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
thead th { width: auto; }
/* 運営者が書き込む所。公開前にすべて書き換える */
.fill { background: rgba(255, 90, 106, 0.2); color: #ffb3bb; border-radius: 4px; padding: 0 4px; font-weight: 700; }
.dates { margin-top: 32px; color: var(--muted); font-size: 13px; text-align: right; }
nav.legal-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 16px; margin-top: 40px; padding-top: 16px; border-top: 1px solid var(--line); font-size: 13px; }
nav.legal-links a { color: var(--muted); }
nav.legal-links a[aria-current="page"] { color: var(--gold-soft); text-decoration: none; font-weight: 800; }
/* 項目と内容の表（table.kv）は、スマホでは項目の下に内容を並べる */
@media (max-width: 560px) {
  table.kv th, table.kv td { display: block; width: 100%; }
  table.kv th { border-bottom: none; padding-bottom: 4px; }
  table.kv td { padding-top: 4px; }
}
