:root {
  --bg: #fff8e7;
  --card: #ffffff;
  --ink: #2b211a;
  --muted: #6b5d52;
  --blue: #003893;
  --red: #b3141f;
  --yellow: #fcd116;
  --box: #fff3c4;
  --line: #eadfca;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #241c16;
    --card: #33291f;
    --ink: #f3ece4;
    --muted: #c9bcae;
    --blue: #8fb3ff;
    --red: #ff8f8f;
    --box: #43361f;
    --line: #4a3d31;
  }
}
* { box-sizing: border-box; }
body {
  margin: 0;
  padding: 0 16px 32px;
  background: var(--bg);
  color: var(--ink);
  font: 16px/1.6 system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
.flag { height: 8px; margin: 0 -16px; background: linear-gradient(to bottom, var(--yellow) 0 50%, #003893 50% 75%, #ce1126 75%); }
main {
  max-width: 820px;
  margin: 24px auto 0;
  background: var(--card);
  padding: 24px 28px;
  border-radius: 14px;
  border: 1px solid var(--line);
}
nav.lang { text-align: right; font-size: 0.95rem; }
h1 { color: var(--blue); margin: 0.2em 0 0.1em; line-height: 1.2; }
h2 { color: var(--blue); margin-top: 1.6em; font-size: 1.25rem; }
h3 { margin-top: 1.2em; font-size: 1.05rem; }
.meta { color: var(--muted); font-size: 0.95rem; margin-top: 0; }
a { color: var(--blue); }
ul { padding-left: 1.3em; }
li { margin: 0.3em 0; }
.summary, .later {
  border-radius: 10px;
  padding: 12px 16px;
  margin: 1.2em 0;
}
.summary { background: var(--box); }
.later { border: 2px dashed var(--red); }
.later .tag {
  display: inline-block;
  background: var(--red);
  color: #fff;
  border-radius: 6px;
  padding: 1px 8px;
  font-size: 0.85rem;
  font-weight: 700;
}
@media (prefers-color-scheme: dark) { .later .tag { color: #241c16; } }
table { border-collapse: collapse; width: 100%; font-size: 0.95rem; }
th, td { border: 1px solid var(--line); padding: 6px 8px; text-align: left; vertical-align: top; }
footer { max-width: 820px; margin: 16px auto 0; color: var(--muted); font-size: 0.9rem; text-align: center; }
@media (max-width: 520px) { main { padding: 18px 16px; } }