/* ═══════════════════════════════════════════════════════
   21VOX BITCOIN WEEKLY ISSUE PAGES: "The Briefing"
   Loaded after styles.css by every bitcoin-weekly-NNN.html.
   Markup: scripts/issues/build.mjs (template) and docs/issue-redesign/ISSUE-MARKUP.md (body).
   ═══════════════════════════════════════════════════════ */

:root {
    --is-text: var(--white-warm);
    --is-body: var(--text-warm);
    --is-soft: #e6e0d6;
    --is-muted: var(--text-muted-warm);
    --is-dim: #8a8378;
    --is-card: var(--panel-bg);
    --is-line: #262420;
    --is-outline: #3a3732;
    --is-field: #34312c;
    --is-input: #0b0a09;
    --is-toc: #0f0e0d;
    --is-tint: #120d07;
    --is-tint-line: #3a2a14;
}

/* Georgia sized to DM Serif Display's width, so the title does not reflow when the web font arrives */
@font-face { font-family: 'DM Serif Fallback'; src: local('Georgia'); size-adjust: 97%; }
.issue { --serif: 'DM Serif Display', 'DM Serif Fallback', Georgia, serif; }

/* The rail is sticky, which needs a body that clips instead of scrolling.
   The site header scrolls away with the page, as it does on the other redesigned pages. */
body { overflow-x: clip; }
site-header > header { position: relative; }
@media (prefers-reduced-motion: no-preference) {
    html { scroll-behavior: smooth; }
}

.issue { color: var(--is-text); font-family: var(--sans); font-size: 18px; line-height: 1.6; }
.issue-article { max-width: 1280px; margin: 0 auto; padding: 36px 32px 64px; }
.issue-narrow, .issue-toc-more, .issue-toc-mark { display: none; }
.issue-vh { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.issue-sep { margin: 0 0.55em; }
.issue a:focus-visible, .issue button:focus-visible, .issue input:focus-visible, .issue summary:focus-visible { outline: 2px solid var(--orange); outline-offset: 3px; border-radius: 4px; }
.issue-n, .issue-anchor, .issue h2[id] { scroll-margin-top: 24px; }
/* styles.css makes every nav link a small uppercase header link; these navs are not the header */
.issue nav a { font-family: inherit; font-size: inherit; font-weight: inherit; letter-spacing: normal; text-transform: none; white-space: normal; }

/* ── Masthead ── */
/* styles.css styles every <header> as the sticky site bar; this one is the issue's own */
.issue-head { position: static; z-index: auto; background: none; backdrop-filter: none; -webkit-backdrop-filter: none; border-bottom: 0; transform: none; transition: none; }
.issue-crumb { display: flex; flex-wrap: wrap; align-items: center; gap: 0 9px; margin-bottom: 28px; font-size: 13px; color: var(--is-dim); }
.issue-crumb a { display: inline-flex; align-items: center; min-height: 32px; color: var(--is-muted); text-decoration: none; }
.issue-crumb a:hover { color: var(--orange); }
.issue-mast { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; padding-bottom: 18px; border-bottom: 1px solid var(--is-line); }
.issue-brand { font-family: var(--serif); font-size: 26px; line-height: 1.2; color: var(--is-text); }
.issue-brand em { color: var(--orange); }
.issue-no { padding: 4px 9px; border: 1px solid var(--orange); border-radius: 6px; font-family: var(--mono); font-size: 12px; letter-spacing: 0.08em; color: var(--orange); }
.issue-dateline { font-family: var(--mono); font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--is-muted); }
.issue-head h1 { max-width: 24ch; margin-top: 30px; font-family: var(--serif); font-weight: 400; font-size: 58px; line-height: 1.04; color: var(--is-text); }

/* ── Two columns: the body's children and the rail share one grid ──
   The body is display: contents, so the sentence can run under both columns
   and the Pulse and tool cards can sit side by side. */
.issue-grid {
    display: grid;
    grid-template-columns:
        [main-start pulse-start] minmax(0, 353px) [pulse-end] 14px
        [tool-start] minmax(0, 353px) [tool-end main-end] 64px
        [rail-start] minmax(0, 300px) [rail-end];
}
.issue-body { display: contents; }
.issue-grid > *, .issue-body > * { grid-column: main; min-width: 0; }

/* ── The week in one sentence ── */
.issue-sentence {
    grid-column: main-start / rail-end; grid-row: 1; max-width: 900px;
    position: relative; margin-top: 30px; padding: 24px 0 24px 170px;
    border-top: 1px solid var(--is-line); border-bottom: 1px solid var(--is-line);
    font-family: var(--serif); font-size: 27px; line-height: 1.3; color: var(--is-text);
}
.issue-sentence::before {
    content: "The week in\A one sentence";
    position: absolute; left: 0; top: 30px; width: 150px; white-space: pre;
    font-family: var(--mono); font-size: 11px; line-height: 1.6; letter-spacing: 0.14em; text-transform: uppercase; color: var(--orange);
}

/* ── Stories ── */
.issue-story { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 16px; padding-top: 44px; }
.issue-story > * { grid-column: 1 / -1; }
.issue-story > .issue-n { grid-column: 1; grid-row: 1; align-self: baseline; font-family: var(--serif); font-size: 54px; line-height: 0.8; color: var(--orange); }
.issue-story > h2 { grid-column: 2; grid-row: 1; align-self: baseline; }
.issue-story > h2, .issue-section > h2 { margin-bottom: 18px; font-family: var(--serif); font-weight: 400; font-size: 34px; line-height: 1.12; color: var(--is-text); }
.issue-section { padding-top: 44px; }
.issue-anchor { display: block; height: 0; }
.issue-story h3, .issue-section h3 { margin: 30px 0 12px; font-family: var(--serif); font-weight: 400; font-size: 24px; line-height: 1.2; color: var(--is-text); }

.issue-story p, .issue-section p, .issue-body > p:not([class]) { margin: 0 0 22px; font-size: 18px; line-height: 1.72; color: var(--is-body); }
.issue-body > p:not([class]):first-of-type { margin-top: 30px; }
.issue-story ul, .issue-story ol, .issue-section ul, .issue-section ol { margin: 0 0 22px; padding-left: 1.4em; font-size: 18px; line-height: 1.72; color: var(--is-body); }
.issue-story li, .issue-section li { margin-bottom: 8px; }
.issue-body strong { font-weight: 600; color: var(--is-text); }
.issue-body img { max-width: 100%; height: auto; }

.issue-body a { color: var(--orange); text-decoration: underline; text-decoration-color: rgba(247, 147, 26, 0.45); text-underline-offset: 3px; }
.issue-body a:hover { color: #ffb257; text-decoration-color: currentColor; }
/* Glossary words: light text with a dotted orange underline */
.issue-body a[href^="/glossary/"]:not([class]) { color: var(--is-text); text-decoration-style: dotted; text-decoration-color: var(--orange); text-decoration-thickness: 1px; text-underline-offset: 4px; }
.issue-body a[href^="/glossary/"]:not([class]):hover { color: var(--orange); }

/* In-story tool card (contract: a.issue-try) */
.issue-try {
    display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 2px 16px;
    margin: 28px 0 4px; padding: 16px 18px; background: var(--is-card); border: 1px solid var(--is-line); border-radius: 12px;
}
.issue-body a.issue-try { color: var(--is-text); text-decoration: none; }
.issue-try::before { content: "Try it \B7  Free tool"; grid-column: 1; font-family: var(--mono); font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--is-muted); }
.issue-try::after { content: "\2192"; content: "\2192" / ""; grid-column: 2; grid-row: 1 / span 3; font-size: 20px; color: var(--orange); }
.issue-try-name { grid-column: 1; font-size: 16px; font-weight: 700; }
.issue-try-line { grid-column: 1; font-size: 14px; line-height: 1.5; color: var(--is-muted); }
.issue-body a.issue-try:hover { border-color: var(--orange); }

/* Older issues: tool callouts, fact boxes and a pull quote, kept with their words */
.issue-body .tool-callout { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 20px; margin: 28px 0; padding: 16px 18px; background: var(--is-card); border: 1px solid var(--is-line); border-radius: 12px; }
.tool-callout-text { flex: 1 1 280px; font-size: 15px; line-height: 1.55; color: var(--is-muted); }
.tool-callout-text strong { display: block; margin-bottom: 4px; font-family: var(--mono); font-size: 10px; font-weight: 400; letter-spacing: 0.14em; text-transform: uppercase; color: var(--is-muted); }
.issue-body a.tool-callout-btn { display: inline-flex; align-items: center; min-height: 44px; padding: 0 16px; border: 1px solid var(--is-outline); border-radius: 999px; color: var(--is-text); font-size: 15px; font-weight: 600; text-decoration: none; }
.issue-body a.tool-callout-btn:hover { border-color: var(--orange); color: var(--is-text); }
.issue-body .data-box { margin: 6px 0 28px; padding: 18px 20px; background: var(--is-card); border: 1px solid var(--is-line); border-radius: 12px; font-family: var(--mono); font-size: 14px; line-height: 1.7; color: var(--is-body); }
.issue-body .data-box strong { display: block; margin-bottom: 8px; font-size: 11px; font-weight: 400; letter-spacing: 0.14em; text-transform: uppercase; color: var(--orange); }
/* #002's figure captions carry an inline gray that fails contrast on this background */
.issue-body figcaption { color: var(--is-muted) !important; }
.issue-body .pull-quote { margin: 8px 0 30px; padding: 4px 0 4px 22px; border-left: 3px solid var(--orange); }
.issue-body .pull-quote p { margin: 0; font-family: var(--serif); font-size: 24px; line-height: 1.35; color: var(--is-text); }

/* ── The Numbers ── */
/* The section is the sideways scroller; the table wraps first, so it rarely needs to. */
.issue-numbers { margin: 0 -4px; padding: 48px 4px 0; overflow-x: auto; }
.issue-numbers h2, .issue-watch h2, .issue-from-h { font-family: var(--serif); font-weight: 400; font-size: 30px; line-height: 1.2; color: var(--is-text); }
.issue-numbers h2 { margin-bottom: 6px; }
.issue-live { margin: 0 0 14px; font-size: 15px; }
.issue-body .issue-live a { text-decoration: none; }
/* A caption taken out of flow breaks the fixed table layout, so this one stays a caption, clipped to nothing */
.numbers-table caption.issue-vh { position: static !important; display: table-caption; width: auto; height: 1px; margin-bottom: -1px; }
.issue-body .numbers-table { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 16px; line-height: 1.45; }
.numbers-table td { padding: 11px 0; border-top: 1px solid var(--is-line); vertical-align: top; font-variant-numeric: tabular-nums; color: var(--is-text); overflow-wrap: anywhere; }
.numbers-table td:first-child { width: 42%; padding-right: 16px; font-weight: 500; color: var(--is-body); }
.issue-body .numbers-table td:first-child a { color: inherit; text-decoration-style: dotted; text-decoration-color: var(--orange); }

/* ── What to watch next week ── */
.issue-watch { padding-top: 48px; }
.issue-watch h2 { margin-bottom: 14px; }
.issue-watch ul { list-style: none; margin: 0; padding: 0; }
.issue-watch li { position: relative; padding: 16px 0; border-top: 1px solid var(--is-line); font-size: 17px; line-height: 1.6; color: var(--is-body); }
.issue-watch li[data-when] { padding-left: 126px; }
.issue-watch li[data-when]::before { content: attr(data-when); position: absolute; left: 0; top: 20px; width: 108px; font-family: var(--mono); font-size: 11px; line-height: 1.5; letter-spacing: 0.1em; color: var(--orange); }
.issue-watch li[data-when="ONGOING"]::before { color: var(--is-dim); }

/* ── From 21VOX ── */
.issue-from-h { padding-top: 52px; margin-bottom: 16px; }
.issue-card, .issue-tool { display: flex; flex-direction: column; gap: 6px; margin-bottom: 14px; padding: 20px; background: var(--is-card); border: 1px solid var(--is-line); border-radius: 14px; }
.issue-body a.issue-card { color: var(--is-text); text-decoration: none; }
.issue-body a.issue-card:hover, .issue-tool:hover { border-color: var(--is-outline); }
.issue-body .issue-pulse { grid-column: pulse; }
.issue-body .issue-pulse--solo { grid-column: main; }
.issue-body .issue-tool { grid-column: tool; position: relative; }
.issue-card-k { display: inline-flex; align-items: center; gap: 7px; font-family: var(--mono); font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--is-muted); }
.issue-card-k--tool { color: var(--orange); }
.issue-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--green); }
.issue-card-t { font-size: 18px; font-weight: 700; line-height: 1.3; color: var(--is-text); }
.issue-card-d, .issue-tool p:not([class]) { margin: 0; font-size: 15px; line-height: 1.5; color: var(--is-muted); }
/* The tool's name stretches over the whole card; links in its paragraph stay clickable */
.issue-body a.issue-tool-link { color: var(--is-text); text-decoration: none; }
.issue-tool-link::after { content: ""; position: absolute; inset: 0; border-radius: 14px; }
.issue-tool p a { position: relative; z-index: 1; }
@supports selector(:has(a)) {
    .issue-tool:has(.issue-tool-link:focus-visible) { outline: 2px solid var(--orange); outline-offset: 3px; }
    .issue .issue-tool-link:focus-visible { outline: none; }
}
.issue-body > .issue-more { margin: 4px 0 18px; font-size: 16px; line-height: 1.65; color: var(--is-muted); }

.issue-legacy { display: flex; flex-direction: column; overflow: hidden; margin-top: 0; padding-bottom: 26px; background: var(--is-tint); border: 1px solid var(--is-tint-line); border-radius: 16px; }
.issue-legacy > :not(.issue-legacy-img) { margin-left: 28px; margin-right: 28px; }
.issue-legacy-img { display: block; width: 100%; height: 280px; object-fit: cover; }
.issue-legacy-k { display: flex; align-items: center; margin-top: 26px; margin-bottom: 8px; font-family: var(--mono); font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--orange); }
.issue-shield { width: 11px; height: 11px; margin-right: 8px; fill: var(--orange); flex: none; }
.issue-legacy h3 { margin-bottom: 14px; font-family: var(--serif); font-weight: 400; font-size: 28px; line-height: 1.2; color: var(--is-text); }
.issue-legacy p:not([class]) { margin-bottom: 14px; font-size: 16px; line-height: 1.65; color: var(--is-body); }
.issue-body a.issue-legacy-btn { align-self: flex-start; display: inline-flex; align-items: center; min-height: 46px; margin-top: 4px; padding: 0 20px; background: var(--orange); color: #140c02; border-radius: 10px; font-weight: 700; text-decoration: none; }
.issue-body a.issue-legacy-btn:hover { background: #ffa53d; color: #140c02; }

.issue-signoff, .issue-body > .editorial-note { margin-top: 28px; font-size: 15px; line-height: 1.6; font-style: italic; color: var(--is-dim); }
.issue-signoff em { font-style: italic; }
.issue-body .issue-signoff a { color: var(--is-muted); }

/* ── Share ── */
.issue-share.share-bar {
    max-width: none; margin: 36px 0 0; padding: 18px 0; border: 0; border-radius: 0;
    border-top: 1px solid var(--is-line); border-bottom: 1px solid var(--is-line);
    display: flex; flex-flow: row wrap; align-items: center; gap: 10px;
}
.issue-share-k { margin-right: 6px; font-family: var(--mono); font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--is-muted); }
.issue-pill { display: inline-flex; align-items: center; min-height: 44px; padding: 0 16px; background: transparent; border: 1px solid var(--is-outline); border-radius: 999px; color: var(--is-soft); font-family: var(--sans); font-size: 14px; text-decoration: none; cursor: pointer; }
.issue-pill:hover { border-color: var(--orange); color: var(--is-text); }

/* ── Previous and next ── */
.issue-pn { margin-top: 28px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); align-items: stretch; gap: 14px; }
.issue-pn-card { display: flex; flex-direction: column; gap: 6px; padding: 20px; border: 1px solid var(--is-line); border-radius: 14px; color: var(--is-text); text-decoration: none; }
a.issue-pn-card:hover { border-color: var(--is-outline); }
a.issue-pn-card:hover .issue-pn-t { color: var(--orange); }
.issue-pn-card--next { text-align: right; }
.issue-pn-card--soon { border: 1px dashed var(--is-outline); }
.issue-pn-k { font-family: var(--mono); font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--is-muted); }
.issue-pn-t { font-family: var(--serif); font-size: 21px; line-height: 1.25; color: var(--is-text); }
.issue-pn-card--soon .issue-pn-t { color: var(--is-soft); }
.issue-pn-go { align-self: flex-start; display: inline-flex; align-items: center; gap: 0.3em; min-height: 44px; color: var(--orange); font-size: 15px; font-weight: 600; text-decoration: none; }
.issue-pn-go:hover { color: #ffb257; }

/* ── Rail: In this issue, the numbers, signup ── */
.issue-rail {
    grid-column: rail; grid-row: 2 / span 100; align-self: start;
    position: sticky; top: 24px; max-height: calc(100vh - 24px); overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin;
    display: flex; flex-direction: column; gap: 28px; margin: 0 -4px; padding: 44px 4px 8px;
}
.issue-rail--top { grid-row: 1 / span 100; }
.issue-rail-k { font-family: var(--mono); font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--is-muted); }
.issue-toc summary { display: block; margin-bottom: 8px; list-style: none; cursor: default; }
.issue-toc summary::-webkit-details-marker { display: none; }
.issue-toc ol { list-style: none; margin: 0; padding: 0; }
.issue-toc a { display: grid; grid-template-columns: 26px minmax(0, 1fr); gap: 8px; padding: 9px 0; border-top: 1px solid var(--is-line); color: var(--is-muted); font-size: 14px; line-height: 1.4; text-decoration: none; }
.issue-toc a:hover, .issue-toc a[aria-current="true"] { color: var(--is-text); }
.issue-toc-n { padding-top: 2px; font-family: var(--mono); font-size: 11px; color: var(--is-dim); }
.issue-toc a[aria-current="true"] .issue-toc-n { color: var(--orange); }
.issue-keys-head { display: flex; justify-content: space-between; align-items: center; }
.issue-keys-head a { display: inline-flex; align-items: center; gap: 0.3em; min-height: 32px; font-size: 13px; color: var(--orange); text-decoration: none; }
.issue-keys-list { margin: 0; }
.issue-key { display: flex; flex-direction: column; gap: 2px; padding: 12px 0; border-top: 1px solid var(--is-line); }
.issue-key dt { font-family: var(--mono); font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--is-muted); }
.issue-key dd { margin: 0; }
.issue-key-v { font-size: 22px; font-weight: 600; line-height: 1.25; font-variant-numeric: tabular-nums; color: var(--is-text); }
.issue-key-v--long { font-size: 16px; line-height: 1.35; }
.issue-key-n { font-size: 12px; line-height: 1.45; color: var(--is-dim); }
.issue-rail-sub { display: flex; flex-direction: column; gap: 10px; padding: 18px; background: var(--is-tint); border: 1px solid var(--is-tint-line); border-radius: 14px; }
.issue-rail-sub > p { font-size: 16px; line-height: 1.4; color: var(--is-text); }
.issue-rail-sub em { font-family: var(--serif); font-size: 18px; color: var(--orange); }

/* Touch screens get 44px rows; with a mouse the rail keeps the reference's tighter list */
@media (pointer: coarse) {
    .issue-toc a { min-height: 44px; padding: 12px 0; }
    .issue-keys-head a, .issue-crumb a { min-height: 44px; }
    .issue-crumb { margin-bottom: 8px; }
    .issue-body .issue-live a { display: inline-flex; align-items: center; min-height: 44px; }
    .issue-live { margin-bottom: 4px; }
}

/* ── Signup forms (Substack; subscribe-bar.js handles the submit) ── */
.issue-form.bw-subscribe-form { display: flex; gap: 10px; width: auto; }
.issue-input { flex: 1 1 auto; min-width: 0; height: 52px; padding: 0 16px; background: var(--is-input); color: var(--is-text); border: 1px solid var(--is-field); border-radius: 10px; font-family: var(--sans); font-size: 16px; }
.issue-input::placeholder { color: #8f897f; opacity: 1; }
.issue-input:focus { border-color: var(--orange); }
.issue-btn.bw-subscribe-btn { height: 52px; padding: 0 22px; background: var(--orange); color: #140c02; border: 0; border-radius: 10px; box-shadow: none; font-family: var(--sans); font-size: 16px; font-weight: 700; }
.issue-btn.bw-subscribe-btn:hover { background: #ffa53d; transform: none; box-shadow: none; }
.issue-rail .issue-form.bw-subscribe-form { flex-direction: column; gap: 8px; }
.issue-rail .issue-input, .issue-rail .issue-btn.bw-subscribe-btn { height: 44px; font-size: 15px; }
.issue-rail .issue-btn.bw-subscribe-btn { width: 100%; }

.issue-band { background: var(--is-tint); border-top: 1px solid var(--is-tint-line); border-bottom: 1px solid var(--is-tint-line); }
.issue-band-in { max-width: 1280px; margin: 0 auto; padding: 48px 32px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px 48px; }
.issue-band-copy { flex: 1 1 420px; }
.issue-band h2 { font-family: var(--serif); font-weight: 400; font-size: 34px; line-height: 1.15; color: var(--is-text); }
.issue-band p { margin-top: 6px; font-size: 16px; color: var(--is-muted); }
.issue-band .issue-form.bw-subscribe-form { flex: 1 1 420px; }

/* ── One column below 1100px: the rail becomes a collapsed list and a 2 by 2 grid ── */
@media (max-width: 1099px) {
    .issue-grid {
        max-width: 720px;
        grid-template-columns: [main-start pulse-start] minmax(0, 1fr) [pulse-end] 14px [tool-start] minmax(0, 1fr) [tool-end main-end];
    }
    .issue-sentence { grid-column: main; }
    .issue-rail, .issue-rail--top {
        grid-column: main; grid-row: auto; position: static; max-height: none; overflow: visible;
        gap: 12px; margin: 16px 0 0; padding: 0;
    }
    .issue-toc { background: var(--is-toc); border: 1px solid var(--is-line); border-radius: 12px; }
    .issue-toc summary { display: flex; align-items: center; justify-content: space-between; min-height: 48px; margin: 0; padding: 0 16px; cursor: pointer; }
    .issue-toc-more { display: inline; }
    .issue-toc-mark { display: block; color: var(--orange); font-size: 18px; line-height: 1; }
    .issue-toc-mark::before { content: "+"; }
    .issue-toc[open] .issue-toc-mark::before { content: "\2212"; }
    .issue-toc ol { padding: 0 16px 6px; }
    .issue-keys-head, .issue-key-n, .issue-rail-sub { display: none; }
    .issue-keys-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
    .issue-key { padding: 12px; border: 1px solid var(--is-line); border-radius: 10px; }
    .issue-key dt { font-size: 9px; }
    .issue-key-v { font-size: 19px; }
    .issue-key-v--long { font-size: 15px; }
}

/* ── Phones ── */
@media (max-width: 640px) {
    .issue { font-size: 17px; }
    .issue-article { padding: 22px 16px 40px; }
    .issue-narrow { display: inline; }
    .issue-wide { display: none; }
    .issue-crumb { margin-bottom: 14px; }
    .issue-mast { gap: 8px 12px; padding-bottom: 14px; }
    .issue-brand { font-size: 22px; }
    .issue-no { padding: 3px 8px; font-size: 11px; }
    .issue-dateline { flex-basis: 100%; font-size: 11px; letter-spacing: 0.06em; }
    .issue-head h1 { max-width: none; margin-top: 22px; font-size: 34px; line-height: 1.08; }
    .issue-sentence { margin-top: 20px; padding: 18px 0; font-size: 22px; }
    .issue-sentence::before { content: "The week in one sentence"; position: static; display: block; width: auto; margin-bottom: 8px; white-space: normal; font-size: 10px; }
    .issue-story { column-gap: 12px; padding-top: 32px; }
    .issue-section { padding-top: 32px; }
    .issue-story > .issue-n { font-size: 40px; }
    .issue-story > h2, .issue-section > h2 { margin-bottom: 14px; font-size: 26px; line-height: 1.15; }
    .issue-story p, .issue-section p, .issue-body > p:not([class]), .issue-story ul, .issue-story ol, .issue-section ul, .issue-section ol { font-size: 17px; }
    .issue-numbers { padding-top: 36px; }
    .issue-watch { padding-top: 36px; }
    .issue-from-h { padding-top: 40px; margin-bottom: 12px; }
    .issue-numbers h2, .issue-watch h2, .issue-from-h { font-size: 26px; }
    .issue-numbers h2 { margin-bottom: 4px; }
    .issue-body .numbers-table { font-size: 15px; }
    .issue-watch li { padding: 14px 0; font-size: 16px; line-height: 1.55; }
    .issue-watch li[data-when] { padding-left: 0; }
    .issue-watch li[data-when]::before { position: static; display: block; width: auto; margin-bottom: 4px; font-size: 10px; }
    .issue-body .issue-pulse, .issue-body .issue-tool { grid-column: main; }
    .issue-card, .issue-tool { margin-bottom: 10px; padding: 16px; border-radius: 12px; }
    .issue-legacy { border-radius: 14px; padding-bottom: 18px; }
    .issue-legacy > :not(.issue-legacy-img) { margin-left: 16px; margin-right: 16px; }
    .issue-legacy-img { height: 150px; }
    .issue-legacy-k { margin-top: 18px; font-size: 10px; }
    .issue-legacy h3 { margin-bottom: 12px; font-size: 24px; line-height: 1.15; }
    .issue-legacy p:not([class]) { font-size: 15px; }
    .issue-body a.issue-legacy-btn { align-self: stretch; justify-content: center; min-height: 48px; }
    .issue-share-k { flex-basis: 100%; }
    .issue-pn-card--next { text-align: left; }
    .issue-band-in { padding: 28px 16px; gap: 14px; }
    .issue-band-copy, .issue-band .issue-form.bw-subscribe-form { flex-basis: 100%; }
    .issue-band h2 { font-size: 24px; line-height: 1.2; }
    .issue-band p { font-size: 14px; }
    .issue-band .issue-input, .issue-band .issue-btn.bw-subscribe-btn { height: 50px; }
}