:root { --bg: #f2f7f4; --ink: #10201b; --ink-2: #425851; --line: #cfdfd7; --brand: #08795a; --surface: #fcfcfb; --pend-bg: #fff1d6; --pend-ink: #7a4b00; }
@media (prefers-color-scheme: dark) { :root { --bg: #0a1210; --ink: #eef3f0; --ink-2: #bccac3; --line: #2d3a35; --brand: #19c295; --surface: #151a18; --pend-bg: #3a2c0d; --pend-ink: #f3c56b; } }
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--ink); font: 16px/1.65 ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; }
main { max-width: 720px; margin: 0 auto; padding: 28px 18px 64px; }
.volver { display: inline-block; margin-bottom: 18px; color: var(--brand); font-weight: 600; text-decoration: none; }
h1 { font-size: 30px; line-height: 1.2; margin: 0 0 4px; }
.vigencia { color: var(--ink-2); margin: 0 0 26px; }
h2 { font-size: 19px; margin: 30px 0 6px; }
p, li { color: var(--ink); max-width: 68ch; }
ul { padding-left: 22px; }
li { margin: 4px 0; }
a { color: var(--brand); }
.caja { background: var(--surface); border: 1px solid var(--line); border-radius: 12px; padding: 14px 16px; }
.pendiente { background: var(--pend-bg); color: var(--pend-ink); padding: 0 6px; border-radius: 6px; font-weight: 600; }