/* GRETA post: page-specific blocks on top of the shared editorial layout in
   nicu-article.css. Prose stays verbatim; these add structure around it.
   Statins keep the orange they have in the figures. */
.greta-article { --statin:#e86838; }
.greta-article .nicu-section > ul { font-size:18px; line-height:1.7; margin:0 0 20px; }
.greta-ref { text-decoration:none; }
.nicu-deck u { text-decoration-color:var(--trace); text-decoration-thickness:2px; text-underline-offset:4px; }

/* Hero: the screen drawn as a night plate, one square per compound. */
.greta-screen { margin:0; }
.greta-plate { padding:28px 28px 22px; background:var(--plate); }
.greta-plate svg { display:block; width:100%; height:auto; }
.greta-well { fill:var(--lum-1); }
.greta-statin { fill:var(--statin); }
.greta-tested { fill:var(--n-trace); }
.greta-approved { fill:var(--lum-5); }
.greta-plate-key { display:flex; flex-wrap:wrap; gap:8px 20px; margin:20px 0 0; padding:0; list-style:none; font-family:var(--mono); font-size:11px; line-height:1.5; color:var(--n-ink-muted); }
.greta-plate-key li { display:flex; align-items:center; gap:8px; }
.greta-plate-key i { display:inline-block; width:8px; height:8px; }
.key-statin { background:var(--statin); }
.key-tested { background:var(--n-trace); }
.key-approved { background:var(--lum-5); }

/* The experiment's numbers, in the homepage's night metric panel. Labels sit
   above the numbers so "under $20,000" reads in order. */
.greta-metrics { grid-template-columns:repeat(4,minmax(0,1fr)); margin:36px -70px; padding:24px 6px; }
.greta-metrics .metric { flex-direction:column-reverse; justify-content:flex-start; padding:0 18px; }
.greta-metrics .metric + .metric { border-top:0; border-left:1px solid var(--n-line); }
.greta-metrics .metric strong { font-size:36px; line-height:40px; }
.greta-metrics .metric-under { flex-direction:column; justify-content:flex-end; }

/* Table 1: the cost comparison, with the totals shaded. */
.greta-cost-wrap { margin-top:20px; overflow-x:auto; }
.greta-cost-table { width:100%; border-collapse:collapse; font-size:15px; line-height:1.4; }
.greta-cost-table th, .greta-cost-table td { padding:12px; border-top:1px solid var(--line); text-align:left; vertical-align:middle; font-weight:400; }
.greta-cost-table thead th { border-top:2px solid var(--line-strong); font-weight:600; }
.greta-cost-table thead th:first-child { color:var(--ink-muted); font-weight:400; }
.greta-cost-table thead .greta-col-greta { color:var(--trace); }
.greta-cost-table small { display:block; margin-top:2px; font-size:13px; line-height:1.4; color:var(--ink-muted); font-weight:400; }
.greta-cost-table .greta-total > * { background:var(--ground-sunken); font-weight:600; }
.greta-cost-table .greta-total .greta-col-greta { color:var(--trace); }
.greta-cost-table .greta-total small { color:var(--ink-muted); }

/* Figures break out of the reading column so their labels stay legible. */
.nicu-body .greta-wide { margin:44px -140px; }
.post-figure figcaption.greta-fig-label { margin:0 0 9px; font-family:var(--mono); font-size:11px; line-height:1.5; letter-spacing:.09em; text-transform:uppercase; color:var(--trace); }

/* Clinical outcomes: the sentence's list as ruled rows, each marked lower. */
.nicu-body .greta-outcomes { margin:4px 0 26px; padding:0; list-style:none; border-bottom:1px solid var(--line); }
.greta-outcomes li { display:flex; align-items:baseline; gap:14px; margin:0; padding:12px 0; border-top:1px solid var(--line); font-size:20px; line-height:1.4; }
.greta-outcomes li::before { content:"↓" / ""; font-size:22px; line-height:1; font-weight:600; color:var(--trace); }

.nicu-body .greta-cta { margin:36px 0 0; }
.nicu-body .greta-cta p { margin:0; font-size:18px; line-height:1.7; }

.nicu-body .greta-refs h2 { margin-bottom:18px; font-size:22px; line-height:1.3; }
.nicu-body .greta-references { margin:0; padding-left:1.5em; font-size:15px; line-height:1.55; color:var(--ink-muted); }
.greta-references li { margin:0 0 10px; overflow-wrap:anywhere; scroll-margin-top:100px; }

@media(max-width:1040px) { .nicu-body .greta-wide { margin-inline:0; } }
@media(max-width:950px) {
 .greta-metrics { margin-inline:0; }
 .greta-metrics .metric { padding:0 14px; }
 .greta-metrics .metric strong { font-size:30px; line-height:34px; }
}
@media(max-width:760px) {
 .greta-metrics .metric strong { font-size:26px; line-height:30px; }
}
@media(max-width:640px) {
 .greta-metrics .metric strong { font-size:30px; line-height:34px; }
 .greta-plate { padding:20px 20px 16px; }
 .greta-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); row-gap:22px; margin-inline:-8px; padding:22px 6px; }
 .greta-metrics .metric:nth-child(3) { border-left:0; }
 .nicu-body .greta-wide { margin-inline:-20px; }
 .greta-wide img { border-inline:0; }
 .post-figure figcaption.greta-fig-label { padding-inline:20px; }
 .greta-cost-table { font-size:14px; }
 .greta-cost-table th, .greta-cost-table td { padding:10px 8px; }
 .greta-outcomes li { font-size:18px; }
}
