/* 配色沿用 sso.ra2b.it 登入頁的「兔子村」主題：暖紙底、陶土紅。 */
:root {
  --paper: #f6f0e7;
  --card: #fffdf9;
  --ink: #382e29;
  --ink-soft: #5c4b42;
  --muted: #8a766b;
  --line: #e7dbcf;
  --accent: #a8482e;
  --serif: "Noto Serif TC", "Songti TC", "Source Han Serif TC", Georgia, serif;
  --sans: "Noto Sans TC", "PingFang TC", "Microsoft JhengHei", system-ui, sans-serif;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root {
    --paper: #1d1916; --card: #26211d; --ink: #efe6dc; --ink-soft: #d6c9bc; --muted: #a8968a;
    --line: #3a322c; --accent: #e08463;
    color-scheme: dark;
  }
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.75;
  padding: 40px max(16px, env(safe-area-inset-right, 0px)) 72px max(16px, env(safe-area-inset-left, 0px));
}
main { max-width: 720px; margin: 0 auto; display: grid; gap: 28px; }
header { display: grid; gap: 8px; }
.brand { font-size: 13px; letter-spacing: 0.08em; color: var(--muted); }
h1, h2 { font-family: var(--serif); font-weight: 700; line-height: 1.35; margin: 0; text-wrap: balance; }
h1 { font-size: clamp(28px, 5vw, 36px); }
h2 { font-size: 20px; }
p, ul, ol { margin: 0; }
ul, ol { padding-left: 1.4em; display: grid; gap: 6px; }
.meta { color: var(--muted); font-size: 14px; }
section { display: grid; gap: 10px; }
article { background: var(--card); border: 1px solid var(--line); border-radius: 24px; padding: 28px clamp(18px, 4vw, 36px); display: grid; gap: 26px; }
a { color: var(--accent); text-underline-offset: 3px; overflow-wrap: anywhere; }
a:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; border-radius: 4px; }
nav { display: flex; flex-wrap: wrap; gap: 8px 18px; font-size: 15px; }
.en { color: var(--ink-soft); font-size: 15px; }
.en h2 { font-family: var(--sans); font-size: 17px; }
.links { display: grid; gap: 12px; }
.links a { display: block; padding: 14px 18px; border: 1px solid var(--line); border-radius: 16px; background: var(--card); text-decoration: none; color: var(--ink); }
.links a span { display: block; color: var(--muted); font-size: 14px; }
.links a:hover { border-color: var(--accent); }
footer { color: var(--muted); font-size: 14px; display: grid; gap: 4px; }