/* Public rules page only; all visual tokens come from Deep Field. */
#rulesPage { padding-block: 56px 80px; max-width: 820px; }
#rulesPage h1 { margin-top: 12px; font-family: var(--font-display); font-size: clamp(30px, 4vw, 44px); line-height: 1.15; letter-spacing: var(--tracking-display); text-wrap: balance; }
#rulesPage h2 { font-family: var(--font-display); font-size: 22px; line-height: 1.3; text-wrap: balance; }
#rulesPage p { color: var(--text-soft); line-height: 1.75; text-wrap: pretty; overflow-wrap: anywhere; }
#rulesPage .lede { margin-top: 20px; max-width: 70ch; }
#rulesPage .rules-list { display: grid; gap: 12px; margin-top: 32px; }
#rulesPage .rules-card { display: grid; gap: 10px; padding: 24px; border-radius: var(--radius-card); background: var(--surface); box-shadow: var(--shadow-card); }
#rulesPage .rules-sanction { color: var(--text); }
#rulesPage .rules-log { margin-top: 48px; }
#rulesPage .rules-log > p { margin-top: 14px; }
#rulesPage ul { list-style: none; padding: 0; margin: 20px 0 0; display: grid; gap: 8px; }
#rulesPage .rules-counts li, #rulesPage .rules-entries li { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 16px; padding: 12px 16px; border-radius: var(--radius-control); background: var(--surface); }
#rulesPage .rules-entries li time { color: var(--text-dim); font-variant-numeric: tabular-nums; }
#rulesPage .rules-note { margin-top: 20px; font-size: 14px; color: var(--text-dim); }
@media (max-width: 640px) {
    #rulesPage { padding-block: 32px 56px; }
    #rulesPage .rules-card { padding: 20px; }
}
