/* キクダケの公開ページ（サポート・規約など）の見た目。スマホで読みやすいことを優先 */
:root {
  --ink: #1c1f2a; --sub: #5a6070; --line: #d5d8e0; --soft: #f3f4f8;
  --brand: #e8651f; /* アイコンの「朝日のオレンジ」 */
  --link: #b8480e; --bg: #ffffff; --card: #fafbfd;
}
@media (prefers-color-scheme: dark) {
  :root { --ink: #eceef3; --sub: #a8adba; --line: #3a3e4a; --soft: #23262e; --link: #ff9a5c; --bg: #16181d; --card: #1d2026; }
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--bg); color: var(--ink);
  font-family: -apple-system, BlinkMacSystemFont, "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", "Noto Sans JP", sans-serif;
  font-size: 16px; line-height: 1.8; overflow-wrap: anywhere;
}
a { color: var(--link); }
header.site { border-bottom: 4px solid var(--brand); padding: 12px 16px; }
header.site a { color: var(--brand); font-weight: 700; font-size: 20px; text-decoration: none; }
main { max-width: 760px; margin: 0 auto; padding: 8px 16px 32px; }
h1 { font-size: 24px; line-height: 1.4; margin: 20px 0 8px; }
h2 { font-size: 18px; margin: 28px 0 8px; padding: 4px 0 4px 10px; border-left: 5px solid var(--brand); background: var(--soft); }
h3 { font-size: 16px; margin: 18px 0 6px; }
p { margin: 6px 0 10px; }
ol, ul { padding-left: 1.4em; margin: 6px 0 12px; }
li { margin: 4px 0; }
.meta { color: var(--sub); font-size: 14px; margin-bottom: 12px; }
.small { color: var(--sub); font-size: 14px; }
.point, .card { border: 1px solid var(--line); border-radius: 10px; padding: 10px 14px; margin: 12px 0; background: var(--card); }
.blank { background: #fff3b0; color: #1c1f2a; padding: 0 4px; border-radius: 3px; }
.table { overflow-x: auto; margin: 8px 0 14px; }
table { width: 100%; border-collapse: collapse; font-size: 14px; }
th, td { border: 1px solid var(--line); padding: 8px; vertical-align: top; text-align: left; }
th { background: var(--soft); }
/* スマホでは、2列の表（項目｜内容）を縦に並べて読みやすくする */
@media (max-width: 560px) {
  table.stack, table.stack tbody, table.stack tr, table.stack th, table.stack td { display: block; width: 100% !important; }
  table.stack tr { border: 1px solid var(--line); border-radius: 8px; margin-bottom: 10px; overflow: hidden; }
  table.stack th, table.stack td { border: none; }
}
details { border: 1px solid var(--line); border-radius: 10px; padding: 10px 14px; margin: 10px 0; background: var(--card); }
summary { font-weight: 700; cursor: pointer; }
footer.site { border-top: 1px solid var(--line); padding: 16px; text-align: center; color: var(--sub); font-size: 14px; }
footer.site nav a { display: inline-block; margin: 4px 8px; }
