:root {
  --paper: #f4f1ea;
  --ink: #1a1916;
  --muted: #5c584f;
  --line: #d9d3c6;
  --card: #fffdf8;
  --lime: #d6f25c;
  --lime-ink: #1a2408;
  --serif: Georgia, "Iowan Old Style", "Palatino Linotype", serif;
  --sans: system-ui, -apple-system, "Segoe UI", sans-serif;
}
* { box-sizing: border-box; }
html { background: var(--paper); }
body { margin: 0; color: var(--ink); font: 18px/1.5 var(--sans); }
a { color: inherit; }
.sheet, .colophon, .mast-in { width: min(980px, calc(100% - 32px)); margin: 0 auto; }
.mast { background: #14170f; color: #f4f1ea; }
.mast-in { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 0; }
.mark { font: 700 28px/1 var(--serif); letter-spacing: -0.04em; text-decoration: none; color: #f4f1ea; }
.mark em { font-style: normal; background: var(--lime); color: var(--lime-ink); padding: 0 5px; }
.mast nav, .colophon nav { display: flex; flex-wrap: wrap; gap: 14px; }
.mast nav a, .colophon nav a { font-size: 14px; font-weight: 650; text-decoration: none; }
.mast nav a:hover { color: var(--lime); }
.sheet { padding: 8px 0 36px; }
.hero { padding: 28px 0 8px; }
.hero-grid { display: grid; grid-template-columns: minmax(0, 1.5fr) 240px; gap: 28px; align-items: end; padding-bottom: 8px; }
.edition { background: #14170f; color: #f4f1ea; padding: 16px 16px 14px; display: grid; gap: 8px; }
.edition span { font-size: 12px; font-weight: 750; letter-spacing: 0.08em; text-transform: uppercase; color: #b7b3a6; }
.edition b { font: 700 42px/0.9 var(--serif); letter-spacing: -0.04em; }
.edition p { margin: 0 0 4px; color: #d5d0c4; font-size: 15px; }
.edition a { display: block; text-decoration: none; border: 1px solid #3a3d34; padding: 8px 10px; font-size: 14px; font-weight: 700; }
.edition a.is-on { background: var(--lime); color: var(--lime-ink); border-color: var(--lime); }
.kicker { margin: 0 0 8px; font-size: 13px; font-weight: 750; letter-spacing: 0.08em; text-transform: uppercase; }
h1 { margin: 0 0 12px; font: 700 48px/1.05 var(--serif); letter-spacing: -0.03em; }
.dek { margin: 0 0 8px; font-size: 20px; max-width: 38em; }
.en { margin: 0 0 28px; color: var(--muted); font-size: 15px; max-width: 40em; }
.specimen { background: var(--card); border: 1px solid var(--ink); border-left: 10px solid var(--lime); padding: 18px 20px 8px; margin: 18px 0 22px; }
.specimen header { display: flex; justify-content: space-between; gap: 12px; font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: var(--muted); }
.specimen h2 { margin: 10px 0 8px; font: 700 32px/1.12 var(--serif); }
.stamps { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 12px; padding: 0; list-style: none; }
.stamps li { background: #14170f; color: var(--lime); font: 700 12px/1 var(--sans); letter-spacing: 0.04em; text-transform: uppercase; padding: 7px 8px; }
.specimen p { margin: 0 0 12px; }
.blocks { display: grid; grid-template-columns: 1.3fr 0.7fr; gap: 10px; margin: 0 0 8px; }
.blocks article, .legal article { background: var(--card); border: 1px solid var(--line); padding: 14px 16px; }
.blocks article:first-child { border-top: 4px solid #14170f; }
.blocks article:last-child { background: #14170f; color: #f4f1ea; border-color: #14170f; }
.blocks article:last-child p { color: #d5d0c4; }
.blocks h2, .price h2, .legal h2 { margin: 0 0 6px; font: 700 18px/1.25 var(--serif); }
.blocks p, .price li, .legal p { margin: 0; color: var(--muted); font-size: 15px; }
.inkband { background: #14170f; color: #f4f1ea; padding: 28px 0 32px; margin-top: 18px; }
.inkband h3 { color: #f4f1ea; }
.price { display: grid; grid-template-columns: 1fr 1.15fr; gap: 12px; margin: 8px 0 12px; }
.price article { background: #23281c; border: 1px solid #3a3d34; padding: 16px 18px; }
.price .is-month { background: var(--lime); color: var(--lime-ink); border-color: var(--lime); }
.price .sum { margin: 8px 0; font: 700 52px/1 var(--serif); letter-spacing: -0.04em; }
.price .sum small { font: 700 16px/1.2 var(--sans); letter-spacing: 0; }
.price ul { margin: 0; padding-left: 18px; display: grid; gap: 6px; }
.price li { color: #d5d0c4; }
.price .is-month li, .price .is-month h2 { color: var(--lime-ink); }
.note { color: #b7b3a6; font-size: 14px; }
h3 { margin: 28px 0 8px; font: 700 26px/1.2 var(--serif); }
.faq { display: grid; gap: 8px; }
.faq details { border-top: 1px solid var(--line); padding: 10px 0; }
.faq summary { cursor: pointer; font-weight: 700; }
.faq p { margin: 8px 0 0; color: var(--muted); }
.colophon { border-top: 1px solid var(--ink); padding: 18px 0 32px; color: var(--muted); font-size: 14px; }
.colophon .fine { margin-bottom: 0; }
.legal h1 { font-size: 36px; }
.legal article { margin-bottom: 10px; }
.legal article p { color: var(--ink); }
@media (max-width: 720px) {
  h1 { font-size: 34px; }
  .hero-grid, .blocks, .price { grid-template-columns: 1fr; }
  .mast-in { align-items: flex-start; flex-direction: column; }
  .price .sum { font-size: 42px; }
}