(renderBlogFragment), so one file serves * both surfaces. * * The blog page's own palette does not define --primary-dark/--accent-dark/ * --border/--surface-2, so the scope block below declares the marketing-tokens * values as locals. On the standalone page marketing-tokens.css loads first and * these simply restate it. */ .publication-edition { --primary: #2d5016; --primary-dark: #1f3a0f; --accent: #82c341; --accent-dark: #6aa634; --text: #1d1d1f; --text-light: #5c6670; --bg: #fbfbfd; --surface: #ffffff; --surface-2: #f5f7f2; --border: #e6e6eb; color: var(--text); background: var(--bg); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-size: 16px; line-height: 1.55; } .publication-edition * { box-sizing: border-box; } .publication-edition a { color: var(--primary); text-underline-offset: 3px; } .publication-edition .site-header { min-height: 64px; padding: 0 5vw; border-bottom: 1px solid var(--border); background: var(--surface); display: flex; align-items: center; justify-content: space-between; } .publication-edition .site-header nav { display: flex; gap: 1rem; } .publication-edition .brand { color: var(--primary-dark); font-size: 1.35rem; font-weight: 800; text-decoration: none; } .publication-edition .brand span { color: var(--accent-dark); } .publication-edition main { width: min(1080px, 92vw); margin: 0 auto; } .publication-edition article > section, .publication-edition .method { margin: 3.5rem 0; } .publication-edition .hero { padding: 5rem 0 3.5rem; border-bottom: 4px solid var(--accent); } .publication-edition .eyebrow, .publication-edition .section-kicker { color: var(--primary); font-size: .78rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; } .publication-edition h1 { max-width: 900px; margin: .35rem 0 1rem; color: var(--primary-dark); font-size: clamp(2.4rem, 6vw, 4.8rem); line-height: 1.02; letter-spacing: -.045em; } .publication-edition h2 { margin: .25rem 0 1.25rem; color: var(--primary-dark); font-size: clamp(1.65rem, 3vw, 2.3rem); line-height: 1.15; border: 0; padding: 0; } .publication-edition h3 { margin: .4rem 0; color: var(--primary-dark); font-size: 1.18rem; line-height: 1.25; } .publication-edition p { margin: 0 0 1rem; } .publication-edition .dek { max-width: 760px; color: var(--text-light); font-size: 1.25rem; } .publication-edition .edition-meta, .publication-edition .org, .publication-edition .confidence { color: var(--text-light); } .publication-edition .summary { display: grid; grid-template-columns: 1fr 2fr; column-gap: 2rem; } .publication-edition .summary h2 { grid-column: 1; } .publication-edition .summary ul { grid-column: 2; grid-row: 1 / span 3; margin: 0; } .publication-edition .summary li { margin-bottom: .8rem; } .publication-edition .change-strip { grid-column: 1; display: flex; flex-wrap: wrap; gap: .4rem; align-content: start; } .publication-edition .change-strip span, .publication-edition .status { border-radius: 999px; padding: .3rem .6rem; background: var(--surface-2); color: var(--primary-dark); font-size: .75rem; font-weight: 750; text-transform: capitalize; } /* Status/label pills sit inside a card that sets `overflow-wrap: anywhere` for long * URLs. Without this reset the pill inherits it and breaks a word mid-character * ("Opportuni / ty"). Pills wrap between words only. */ .publication-edition .status, .publication-edition .change-strip span, .publication-edition .signal-status, .publication-edition .score-badge, .publication-edition .card-meta span { overflow-wrap: normal; word-break: normal; hyphens: none; } .publication-edition .card-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; } /* A live opportunity carries the full applicant brief, so it takes the full * width; the short cards (award signals, capital routes, watch items) stay two * to a row. */ .publication-edition .card-link:has([data-item-type="live-opportunity"]) { grid-column: 1 / -1; } .publication-edition .card-link { display: block; color: inherit; text-decoration: none; break-inside: avoid; page-break-inside: avoid; } .publication-edition .card-link:focus-visible { outline: 3px solid var(--accent-dark); outline-offset: 3px; } .publication-edition .card-link:hover .opportunity-card, .publication-edition .card-link:hover .signal-card { border-color: var(--accent-dark); } .publication-edition .opportunity-card, .publication-edition .signal-card { break-inside: avoid; page-break-inside: avoid; border: 1px solid var(--border); border-radius: 16px; background: var(--surface); padding: 1.2rem; box-shadow: 0 5px 18px rgba(31,58,15,.05); overflow-wrap: anywhere; } .publication-edition .card-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; } /* The score is SECONDARY to the opportunity (template: "The score must remain * visually secondary to the opportunity itself") and, since the 2026-09-15 * review, also EXPLAINABLE: it sits LAST on the card, in small type, carrying * what it measures and the capability areas that produced it — never a display * number above the program's name. */ .publication-edition .score-display { margin: 1rem 0 0; padding: .7rem .8rem; border-top: 1px solid var(--border); background: var(--surface-2); } .publication-edition .score-display > * { display: block; } .publication-edition .score-badge { color: var(--primary-dark); font-size: .84rem; font-weight: 750; } .publication-edition .score-meaning, .publication-edition .score-drivers { margin-top: .3rem; color: var(--text-light); font-size: .76rem; } .publication-edition .score-drivers { font-weight: 650; } .publication-edition .score-context { margin: 1.2rem 0 0; padding: .7rem .8rem; border-left: 3px solid var(--accent); background: var(--surface-2); color: var(--text-light); font-size: .82rem; } .publication-edition .score-context strong { color: var(--primary-dark); } /* The applicant brief (review §3): a label and its answer. The label is what a * reader scans, so it reads as a heading without becoming another . */ .publication-edition .brief-field { margin: 0 0 .7rem; } .publication-edition .brief-field strong, .publication-edition .brief-heading { display: block; color: var(--primary-dark); font-size: .8rem; font-weight: 800; letter-spacing: .02em; } .publication-edition .brief-field span { display: block; margin-top: .15rem; font-size: .92rem; } .publication-edition .funding-stack, .publication-edition .partners { margin: 0 0 .7rem; padding: .7rem .8rem; border-left: 3px solid var(--accent); background: var(--surface-2); } .publication-edition .funding-stack .brief-field:last-child, .publication-edition .partners ul { margin-bottom: 0; } .publication-edition .stack-status { display: inline-block; margin: .3rem 0 .5rem; border-radius: 999px; padding: .26rem .55rem; background: var(--surface); font-size: .72rem; font-weight: 800; line-height: 1.25; overflow-wrap: normal; word-break: normal; hyphens: none; } .publication-edition .stack-not-publicly-confirmed { color: var(--text-light); } .publication-edition .stack-unconfirmed { display: block; margin-bottom: .6rem; font-size: .88rem; } .publication-edition .partners ul { margin: .25rem 0 0; padding-left: 1.1rem; } .publication-edition .partners li { margin-bottom: .25rem; font-size: .92rem; } /* The standing context block (review §1) sits immediately under the title and * date, ahead of the first programme, and the standing close (§6) replaces the * long promotional spread on funding editions. */ .publication-edition .standing-context { max-width: 900px; margin: 0 0 2rem; border-left: 6px solid var(--accent); background: var(--surface-2); padding: 1.3rem 1.5rem; } .publication-edition .standing-context h2 { font-size: 1.25rem; margin-bottom: .6rem; } .publication-edition .standing-context p { font-size: .95rem; } .publication-edition .standing-context p:last-child { margin-bottom: 0; } .publication-edition .independent-analysis { color: var(--text-light); } .publication-edition .card-meta { display: flex; flex-wrap: wrap; gap: .5rem; margin: .8rem 0; } .publication-edition .card-meta span { border-radius: 6px; background: var(--surface-2); padding: .28rem .5rem; font-size: .78rem; } .publication-edition .source-line { margin-bottom: 0; font-size: .78rem; } .publication-edition .score-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; } .publication-edition .signal-card { display: grid; grid-template-columns: 84px 1fr; gap: 1rem; } .publication-edition .score-large { color: var(--primary); font-size: 3.4rem; font-weight: 850; line-height: 1; } .publication-edition .signal-value small { display: block; margin-top: .45rem; color: var(--text-light); font-size: .7rem; font-weight: 750; text-transform: uppercase; } .publication-edition .weekly-action { max-width: 900px; border-left: 6px solid var(--accent); background: var(--surface-2); padding: 1.5rem 1.7rem; } .publication-edition .weekly-action h2 { margin-bottom: .5rem; } .publication-edition .weekly-action p:last-child { max-width: 760px; margin-bottom: 0; font-size: 1.08rem; } .publication-edition .signal-status { display: inline-block; margin-top: .8rem; border-radius: 999px; padding: .28rem .5rem; font-size: .7rem; font-weight: 800; line-height: 1.2; } .publication-edition .signal-status-positive { background: #e7f3e3; color: var(--primary-dark); } .publication-edition .signal-status-mixed { background: #fff3d6; color: #684b00; } .publication-edition .signal-status-elevated, .publication-edition .signal-status-limited { background: #f7e5df; color: #7a2f1e; } .publication-edition .signal-action { margin: .35rem 0 .65rem; color: var(--primary-dark); font-size: 1rem; } .publication-edition .score-components { margin: .8rem 0; } .publication-edition .score-components summary { color: var(--primary); font-size: .8rem; font-weight: 800; cursor: pointer; } .publication-edition .score-components ul { margin: .65rem 0 0; padding: 0; list-style: none; } .publication-edition .score-components li { display: grid; grid-template-columns: minmax(130px, 1fr) 2fr 28px; align-items: center; gap: .55rem; margin: .35rem 0; font-size: .72rem; } .publication-edition .score-components li > i { height: 7px; border-radius: 999px; background: var(--surface-2); overflow: hidden; } .publication-edition .score-components li > i b { display: block; height: 100%; border-radius: inherit; background: var(--accent-dark); } .publication-edition .score-components li strong { text-align: right; } .publication-edition .score-key { max-width: 820px; margin: -.4rem 0 1.25rem; padding: .85rem 1rem; border-left: 4px solid var(--accent); background: var(--surface-2); color: var(--text-light); } .publication-edition .confidence { margin: .8rem 0; padding: .65rem .75rem; border-radius: 8px; background: var(--surface-2); } .publication-edition .confidence strong, .publication-edition .confidence span, .publication-edition .confidence small { display: block; } .publication-edition .confidence strong { color: var(--primary-dark); font-size: .82rem; } .publication-edition .confidence span { margin-top: .15rem; font-size: .78rem; } .publication-edition .confidence small { margin-top: .35rem; font-size: .7rem; font-weight: 750; } .publication-edition .evidence-chart-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; } .publication-edition .evidence-chart { border: 1px solid var(--border); border-radius: 16px; background: var(--surface); padding: 1.2rem; break-inside: avoid; } .publication-edition .chart-unit { margin-top: -.25rem; color: var(--text-light); font-size: .75rem; } .publication-edition .chart-bars { margin: 1rem 0; } .publication-edition .chart-row { display: grid; grid-template-columns: 105px 1fr 38px; align-items: center; gap: .6rem; margin: .65rem 0; font-size: .78rem; } .publication-edition .chart-row > div { height: 16px; border-radius: 4px; background: var(--surface-2); overflow: hidden; } .publication-edition .chart-row i { display: block; height: 100%; background: var(--primary); } .publication-edition .chart-row strong { text-align: right; } .publication-edition .audience-table-wrap { overflow-x: auto; } .publication-edition .audience-table { width: 100%; border-collapse: collapse; } .publication-edition .audience-table th, .publication-edition .audience-table td { border-bottom: 1px solid var(--border); padding: .8rem; text-align: left; vertical-align: top; background: none; color: inherit; } .publication-edition .audience-table thead th { background: var(--surface-2); color: var(--primary-dark); font-size: .8rem; } .publication-edition .audience-table tbody th { color: var(--primary-dark); } .publication-edition .checklist { columns: 2; gap: 2rem; } .publication-edition .checklist li { break-inside: avoid; margin: 0 0 .7rem; } .publication-edition .coverage, .publication-edition .method { border-left: 5px solid var(--accent); background: var(--surface-2); padding: 1.3rem 1.5rem; } .publication-edition .explore > div { display: grid; grid-template-columns: repeat(3, 1fr); gap: .7rem; } .publication-edition .explore a { display: flex; justify-content: space-between; border: 1px solid var(--border); border-radius: 10px; background: var(--surface); padding: .8rem 1rem; font-weight: 700; text-decoration: none; } .publication-edition .sources ol { padding-left: 1.4rem; } .publication-edition .sources li { margin-bottom: .55rem; } .publication-edition .sources span { display: block; color: var(--text-light); font-size: .8rem; } .publication-edition .action-panel, .publication-edition .infrastructure, .publication-edition .gwen-panel, .publication-edition .editorial-boundary { border-top: 1px solid var(--border); padding-top: 2rem; } .publication-edition .text-cta { display: inline-flex; gap: .75rem; align-items: center; border-radius: 999px; background: var(--primary); color: #fff; padding: .7rem 1rem; font-weight: 750; text-decoration: none; } .publication-edition .system-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .8rem; } .publication-edition .system-card { position: relative; min-height: 150px; display: flex; flex-direction: column; border: 1px solid var(--border); border-radius: 14px; background: var(--surface); color: inherit; padding: 1rem 2.3rem 1rem 1rem; text-decoration: none; break-inside: avoid; } .publication-edition .system-card strong { color: var(--primary-dark); font-size: 1rem; } .publication-edition .system-card span { margin-top: .5rem; color: var(--text-light); font-size: .88rem; } .publication-edition .system-card b { position: absolute; top: 1rem; right: 1rem; color: var(--primary); } .publication-edition .system-card:hover, .publication-edition .system-card:focus-visible { border-color: var(--accent-dark); outline: none; } .publication-edition .gwen-panel { border-left: 5px solid var(--accent); border-top: 0; background: var(--surface-2); padding: 1.5rem; } .publication-edition .workflow { display: flex; flex-wrap: wrap; align-items: center; gap: .55rem; margin: 1.2rem 0; } .publication-edition .workflow span, .publication-edition .workflow strong { border: 1px solid var(--border); border-radius: 8px; background: var(--surface); padding: .5rem .7rem; font-size: .82rem; } .publication-edition .workflow i { color: var(--primary); font-style: normal; } .publication-edition .boundary { padding-top: 1rem; border-top: 1px solid var(--border); } .publication-edition .editorial-boundary .sources { margin-top: 2rem; } .publication-edition footer { margin-top: 4rem; padding: 2rem 5vw; background: var(--primary-dark); color: #fff; text-align: center; } /* The blog template renders the fragment inside .article-content, which sets its * own max-width/padding. The fragment keeps its own rhythm without a second shell. */ .article-content .publication-edition > section:first-child { margin-top: 0; } @media (max-width: 700px) { .publication-edition main { width: min(94vw, 620px); } .publication-edition .hero { padding-top: 3rem; } .publication-edition .summary, .publication-edition .card-grid, .publication-edition .score-grid, .publication-edition .explore > div, .publication-edition .system-grid, .publication-edition .evidence-chart-grid { display: block; } .publication-edition .summary ul { padding-left: 1.3rem; } .publication-edition .opportunity-card, .publication-edition .signal-card, .publication-edition .explore a, .publication-edition .system-card, .publication-edition .evidence-chart { margin-bottom: .8rem; } .publication-edition .checklist { columns: 1; } } @media print { .publication-edition { background: #fff; font-size: 10.5pt; } .publication-edition .site-header nav, .publication-edition footer { display: none; } .publication-edition .site-header { min-height: 12mm; padding: 0; border: 0; } .publication-edition main { width: auto; } .publication-edition .hero { padding: 8mm 0 7mm; } .publication-edition h1 { font-size: 30pt; } .publication-edition h2 { font-size: 18pt; } .publication-edition h3 { font-size: 12pt; } .publication-edition .dek { font-size: 12pt; } .publication-edition article > section, .publication-edition .method { margin: 10mm 0; } .publication-edition section > h2, .publication-edition .section-kicker { break-after: avoid; page-break-after: avoid; } .publication-edition .card-grid, .publication-edition .score-grid { display: block; } .publication-edition .card-link, .publication-edition .opportunity-card, .publication-edition .signal-card, .publication-edition .system-card, .publication-edition .gwen-panel, .publication-edition .coverage, .publication-edition .method, .publication-edition .evidence-chart, .publication-edition .audience-table tr { break-inside: avoid-page !important; page-break-inside: avoid !important; } .publication-edition .opportunity-card, .publication-edition .signal-card { box-shadow: none; padding: 4mm; margin-bottom: 4mm; } .publication-edition .source-line, .publication-edition .sources span, .publication-edition .card-meta span, .publication-edition .change-strip span, .publication-edition .status, .publication-edition .score-badge, .publication-edition .score-context, .publication-edition .score-meaning, .publication-edition .score-drivers, .publication-edition .brief-field strong, .publication-edition .brief-heading, .publication-edition .brief-field span, .publication-edition .stack-status, .publication-edition .stack-unconfirmed, .publication-edition .partners li, .publication-edition .signal-value small, .publication-edition .signal-status, .publication-edition .score-components summary, .publication-edition .score-components li, .publication-edition .confidence strong, .publication-edition .confidence span, .publication-edition .confidence small, .publication-edition .chart-unit, .publication-edition .chart-row, .publication-edition .audience-table thead th, .publication-edition .system-card span, .publication-edition .workflow span, .publication-edition .workflow strong, .publication-edition .eyebrow, .publication-edition .section-kicker { font-size: 10pt; } .publication-edition .system-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4mm; } .publication-edition .system-card { min-height: 0; margin: 0; } .publication-edition a { color: var(--primary-dark); text-decoration: none; } .publication-edition .sources ol { padding-left: 0; list-style-position: inside; } .publication-edition .sources li { break-inside: avoid; page-break-inside: avoid; } .publication-edition .editorial-boundary .sources ol { columns: 2; column-gap: 8mm; } }