/* Magazine Story: editorial cream, oversized serif, hairline rules, a red masthead tag. */
:root {
  --bg: #f2ede4;
  --surface: #f8f5ef;
  --ink: #121110;
  --muted: #6a645b;
  --line: #cfc6b8;
  --accent: #c1272d;
  --accent-ink: #ffffff;
  --accent-2: #121110;
  --ok: #2f6b45;
  --bad: #c1272d;
  --font-display: "Deck Serif", var(--cjk-serif), Georgia, serif;
  --font-body: "Deck Sans", var(--cjk), system-ui, sans-serif;
  --radius: 0px;
  --pad: 140px;
  --chart-colors: #c1272d, #121110, #9a8f80, #d9a441, #5b6b5a;
  --outer: #121110;
}
.deck-stage > section { border-top: 0; }
.deck-stage > section::before { content: ""; position: absolute; left: var(--pad); right: var(--pad); top: 80px; border-top: 1px solid var(--ink); }
section h1 { font-size: 196px; line-height: 0.92; letter-spacing: -0.03em; }
section h2 { font-size: 112px; line-height: 0.98; letter-spacing: -0.02em; }
:lang(zh) section h1 { font-size: 150px; line-height: 1.1; }
section em { font-style: italic; color: var(--accent); }
:lang(zh) section em { font-style: normal; }
section .kicker { display: inline-block; align-self: flex-start; background: var(--accent); color: #fff; padding: 10px 16px 8px; letter-spacing: 0.18em; }
section[data-layout="cover"] { justify-content: flex-end; }
section .sub { font-family: var(--font-display); font-style: italic; font-size: 56px; color: var(--muted); }
:lang(zh) section .sub { font-style: normal; }
.stat { border-top: 1px solid var(--ink); }
.stat b { color: var(--ink); font-size: 190px; font-style: italic; }
section[data-layout="bullets"] ol li::before { font-family: var(--font-display); font-size: 56px; top: -0.05em; color: var(--accent); }
section[data-layout="bullets"] ul li::before { background: var(--ink); height: 1px; }
section[data-layout="quote"] blockquote { font-size: 120px; font-style: italic; line-height: 1.02; }
section[data-layout="quote"] blockquote::before { font-style: normal; }
section[data-layout="compare"] .col { background: transparent; border: 0; border-top: 2px solid var(--ink); border-radius: 0; padding: 30px 0 0; }
section[data-layout="compare"] .col:last-child { border-top-color: var(--accent); }
.quiz li, ol.sort li, .match .target { background: var(--surface); }
.match .item { background: var(--ink); }
