:root { --paper: #f6f0e4; --card: #fbf9f4; --ink: #3a322a; --ink-2: #51473e; --line: #e2d7c3; --terracotta: #a8543f; color-scheme: light; }
@media (prefers-color-scheme: dark) { :root:not([data-theme='light']) { --paper: #f6f0e4; } }
* { box-sizing: border-box; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: 'Zen Kaku Gothic New', 'Hiragino Sans', 'Yu Gothic', sans-serif; line-height: 1.9; letter-spacing: 0.03em; }
.legal { width: min(100% - 32px, 820px); margin: 0 auto; padding: 40px 0 80px; }
.legal header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 36px; }
.legal header img { width: 104px; height: auto; }
.legal header a { color: var(--ink-2); font-size: 0.9rem; }
.legal h1 { font-family: 'Zen Maru Gothic', sans-serif; font-weight: 900; font-size: clamp(1.5rem, 1.2rem + 1.2vw, 2rem); margin: 0 0 8px; }
.legal .updated { color: var(--ink-2); font-size: 0.85rem; margin: 0 0 28px; }
.legal h2 { font-family: 'Zen Maru Gothic', sans-serif; font-size: 1.1rem; margin: 32px 0 8px; }
.legal p, .legal li { font-size: 0.95rem; }
.legal ol, .legal ul { padding-left: 1.4em; }
.legal dl { margin: 0; background: var(--card); border-radius: 20px; overflow: hidden; }
.legal dl > div { display: grid; gap: 4px 24px; padding: 16px 22px; border-bottom: 1px solid var(--line); }
.legal dl > div:last-child { border-bottom: 0; }
@media (min-width: 680px) { .legal dl > div { grid-template-columns: 12em 1fr; } }
.legal dt { font-weight: 700; }
.legal dd { margin: 0; font-size: 0.95rem; }
.legal a { color: var(--terracotta); }
.legal footer { margin-top: 48px; display: flex; flex-wrap: wrap; gap: 8px 20px; font-size: 0.88rem; }