/* ========================================================================== Energy AI Observatory — design system layer. Loaded LAST. 1. Semantic tokens (light, dark via OS preference, dark/light via [data-theme]) 2. Legacy token remap so older stylesheets pick the tokens up 3. Base, focus, logos, evidence badges, stage chips, companies grid 4. Generated colour remap (tools: scratch gen-tokens.cjs) — every legacy hard-coded colour replayed in cascade order as a token All text tokens are >= 4.5:1 on --bg, --surface, --surface-2 and the soft tints. ========================================================================== */ :root { color-scheme: light; --bg: #f8f7f2; --surface: #ffffff; --surface-2: #efefe8; --surface-3: #ecf1ea; --surface-warm: #faf6ec; --text: #23271f; --text-muted: #575c52; --rule: #303a32; --border: #d8dad0; --border-strong: #858b80; --accent: #a13d2a; --accent-ink: #9a3a27; --accent-soft: #f5e6df; --positive: #2f5f49; --positive-ink: #2f5f49; --positive-soft: #e3ece4; --positive-line: #9db8a6; --caution: #7a5210; --caution-ink: #7a5210; --caution-soft: #f6ecd6; --info-ink: #2f5878; --fill-positive: #3f6152; --fill-accent: #a13d2a; --fill-caution: #85591a; --fill-info: #3b6286; --fill-positive-soft: #b9d0c3; --fill-accent-soft: #e3b7a7; --fill-caution-soft: #e6d2a6; --fill-neutral: #c9ccc2; --inverse-bg: #20261e; --on-inverse: #eef1ea; --on-inverse-muted: #b9c0b3; --on-fill: #ffffff; --focus: #1d5c96; --logo-tile: transparent; --shadow: 0 1px 2px rgba(20, 24, 21, .06), 0 8px 24px rgba(20, 24, 21, .06); /* evidence grades: one hue, strength shown by fill → outline → dashed → dotted */ --grade-a: #2f5f49; --grade-b: #2f5f49; --grade-c: #7a5210; --grade-d: #575c52; --grade-a-ink: #ffffff; /* charts: one hue for magnitude, rust reserved for "evidence gap" annotation */ --chart-strong: #3f6152; --chart-soft: #b9d0c3; --chart-flag: #a13d2a; --chart-grid: #d8dad0; --chart-axis: #858b80; /* oilfield illustration */ --scene-sky: transparent; --scene-ground-1: #eae4d4; --scene-ground-2: #dad6bd; --scene-ground-3: #c7cbb3; --scene-texture: #d4c8ae; --scene-line: #4b6250; --scene-line-soft: #b4b29a; --scene-structure: #354f42; --scene-panel: #dce4d8; --scene-panel-2: #e7ebdf; --scene-flame: #af7549; --scene-label: #5d604f; } @media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { color-scheme: dark; --bg: #141815; --surface: #1b201c; --surface-2: #242a25; --surface-3: #1f2a23; --surface-warm: #211f1a; --text: #ebeae3; --text-muted: #adb3a7; --rule: #c9cdc2; --border: #343c36; --border-strong: #6b756d; --accent: #e48a70; --accent-ink: #ec9a82; --accent-soft: #3b2520; --positive: #8fcaa9; --positive-ink: #8fcaa9; --positive-soft: #1e3328; --positive-line: #4c7a62; --caution: #e3bd6f; --caution-ink: #e3bd6f; --caution-soft: #362c19; --info-ink: #9cc3e6; --fill-positive: #3f7a5f; --fill-accent: #b4513a; --fill-caution: #8e621c; --fill-info: #3d6a91; --fill-positive-soft: #35574a; --fill-accent-soft: #6a3b2e; --fill-caution-soft: #5d4a24; --fill-neutral: #4a514b; --inverse-bg: #2a312b; --on-inverse: #eef1ea; --on-inverse-muted: #b9c0b3; --on-fill: #ffffff; --focus: #8cc4ff; --logo-tile: #f4f3ee; --shadow: 0 1px 2px rgba(0, 0, 0, .4), 0 8px 24px rgba(0, 0, 0, .35); --grade-a: #8fcaa9; --grade-b: #8fcaa9; --grade-c: #e3bd6f; --grade-d: #adb3a7; --grade-a-ink: #10140f; --chart-strong: #6fae8d; --chart-soft: #35574a; --chart-flag: #e48a70; --chart-grid: #343c36; --chart-axis: #6b756d; --scene-ground-1: #2a2a22; --scene-ground-2: #25291f; --scene-ground-3: #20261d; --scene-texture: #3c3a2e; --scene-line: #8fb39b; --scene-line-soft: #4f5446; --scene-structure: #b7cdbd; --scene-panel: #2d382f; --scene-panel-2: #333d34; --scene-flame: #e0a070; --scene-label: #b5b8a8; } } :root[data-theme="dark"] { color-scheme: dark; --bg: #141815; --surface: #1b201c; --surface-2: #242a25; --surface-3: #1f2a23; --surface-warm: #211f1a; --text: #ebeae3; --text-muted: #adb3a7; --rule: #c9cdc2; --border: #343c36; --border-strong: #6b756d; --accent: #e48a70; --accent-ink: #ec9a82; --accent-soft: #3b2520; --positive: #8fcaa9; --positive-ink: #8fcaa9; --positive-soft: #1e3328; --positive-line: #4c7a62; --caution: #e3bd6f; --caution-ink: #e3bd6f; --caution-soft: #362c19; --info-ink: #9cc3e6; --fill-positive: #3f7a5f; --fill-accent: #b4513a; --fill-caution: #8e621c; --fill-info: #3d6a91; --fill-positive-soft: #35574a; --fill-accent-soft: #6a3b2e; --fill-caution-soft: #5d4a24; --fill-neutral: #4a514b; --inverse-bg: #2a312b; --on-inverse: #eef1ea; --on-inverse-muted: #b9c0b3; --on-fill: #ffffff; --focus: #8cc4ff; --logo-tile: #f4f3ee; --shadow: 0 1px 2px rgba(0, 0, 0, .4), 0 8px 24px rgba(0, 0, 0, .35); --grade-a: #8fcaa9; --grade-b: #8fcaa9; --grade-c: #e3bd6f; --grade-d: #adb3a7; --grade-a-ink: #10140f; --chart-strong: #6fae8d; --chart-soft: #35574a; --chart-flag: #e48a70; --chart-grid: #343c36; --chart-axis: #6b756d; --scene-ground-1: #2a2a22; --scene-ground-2: #25291f; --scene-ground-3: #20261d; --scene-texture: #3c3a2e; --scene-line: #8fb39b; --scene-line-soft: #4f5446; --scene-structure: #b7cdbd; --scene-panel: #2d382f; --scene-panel-2: #333d34; --scene-flame: #e0a070; --scene-label: #b5b8a8; } /* 2. Legacy tokens → semantic tokens. (--blue was rust in publication.css; it is the accent.) */ :root { --paper: var(--bg); --ink: var(--text); --muted: var(--text-muted); --line: var(--border); --light: var(--surface-2); --blue: var(--accent); --atlas-green: var(--positive-ink); --atlas-soft: var(--positive-soft); --atlas-ink: var(--text); --atlas-copper: var(--accent); } /* 2b. Generated colour remap (legacy hard-coded colours replayed as tokens, cascade order preserved). Regenerate, do not hand-edit. */ body{background:var(--paper);color:var(--ink)} button:focus-visible{outline:2px solid var(--blue)} a:focus-visible{outline:2px solid var(--blue)} button:focus-visible{outline-offset:3px} a:focus-visible{outline-offset:3px} button:hover{color:var(--blue)} a:hover{color:var(--blue)} .kicker{color:var(--muted)} .label{color:var(--muted)} .outline{border:1px solid var(--border-strong)} .function-group>button:hover{background:var(--bg)} .adjacent{background:var(--bg)} .rail-group>button[aria-current]{background:var(--surface-2)} .toolbar input{border:1px solid var(--border-strong)} .toolbar select{border:1px solid var(--border-strong)} .toolbar input{background:var(--surface)} .toolbar select{background:var(--surface)} .toolbar input{border-radius:0} .toolbar select{border-radius:0} .mode-switch button[aria-pressed=true]{color:var(--on-fill)} .result-group{background:var(--surface)} .result-group-head{background:var(--bg)} .logo.dark{background:var(--fill-info)} .monogram{background:var(--positive-soft);color:var(--text)} .research-card{background:var(--surface)} .review-label{color:var(--positive-ink)!important;background:var(--positive-soft)} .review-label.pending{background:var(--caution-soft);color:var(--caution-ink)!important} .finding{color:var(--text)} .cite a{text-decoration:none} .company-row:hover{background:var(--bg)} .company-label small{color:var(--muted)} .company-preview{color:var(--muted)} .program-heading{background:var(--bg)} .ambition-item .evidence-note{background:var(--bg)} .ambition-item .evidence-note p{color:var(--text-muted)} .h1{background:var(--positive-soft)} .h2{background:var(--fill-positive-soft)} .h3{background:var(--fill-positive);color:var(--on-fill)} .zero{color:var(--text-muted)} .compare-tray{color:var(--on-fill)} .compare-tray button{color:var(--on-fill)} .compare-tray #compare{background:var(--positive-soft)} .skip:focus{background:var(--surface)} footer{color:var(--muted)} dialog{border:0;background:var(--paper)} .detail-head{background:var(--bg)} .fact{background:var(--bg)} .caution{border-left:3px solid var(--border-strong);background:var(--caution-soft)} .timeline article{border-left:2px solid var(--border)} .scope-banner{background:var(--bg)} @media(max-width:700px){.dossier-nav{background:var(--bg)}} @media(min-width:701px) and (max-width:850px){.dossier-nav{background:var(--bg)}} .text-link{text-decoration:underline} .dept-link{text-decoration:underline} .record-link{text-decoration:underline} .cite a{text-decoration:underline} .text-link{text-decoration-thickness:1px} .dept-link{text-decoration-thickness:1px} .record-link{text-decoration-thickness:1px} .cite a{text-decoration-thickness:1px} .text-link{text-decoration-color:var(--text-muted)} .dept-link{text-decoration-color:var(--text-muted)} .record-link{text-decoration-color:var(--text-muted)} .cite a{text-decoration-color:var(--text-muted)} .report-strip{background:var(--bg)} .depth-label{color:var(--info-ink)!important} .audit-note{background:var(--caution-soft);color:var(--caution-ink)} .reported-result{background:var(--bg)} .coverage-summary>div{background:var(--bg)} .audit-record{border-left:3px solid var(--teal,var(--positive-ink));background:var(--bg)} .opp-tools input{border:1px solid var(--line)} .opp-tools select{border:1px solid var(--line)} .opp-tools input{background:var(--surface)} .opp-tools select{background:var(--surface)} .opp-tools input{border-radius:3px} .opp-tools select{border-radius:3px} .opp-swatch.dark{background:var(--fill-positive)} .opp-swatch.pale{background:var(--fill-positive-soft)} .opp-swatch.reserve{border:1px dashed var(--border-strong)} .opp-row.balance{background:var(--bg)} .opp-near{background:var(--fill-positive);color:var(--on-fill)} .opp-upside{background:var(--fill-positive-soft);color:var(--text)} .opp-reserve{border:1px dashed var(--border-strong)} .opp-fit.direct{color:var(--positive-ink)} .opp-fit.related{color:var(--caution-ink)} .opp-question{border-left:2px solid var(--border)} .opp-gap{background:var(--bg)} .opp-matrix th:first-child{background:var(--paper,var(--bg))} .opp-matrix td button{background:var(--positive-soft)} .opp-matrix td button.related{background:var(--surface-warm)} .reading-method{border-left:2px solid var(--line)} .source-check{background:var(--surface-2)} .opp-audit-mark{color:var(--caution-ink)} body{background:var(--paper)} p{color:var(--text-muted)} .kicker{color:var(--text-muted)} .label{color:var(--text-muted)} .site-rail{background:var(--surface)} .rail-edition{color:var(--text-muted)} .site-rail .nav-group{color:var(--text-muted)} .site-rail nav button{color:var(--text-muted)} .site-rail nav button span{color:var(--text-muted)} .site-rail nav button:hover{background:var(--bg)} .site-rail nav button.active{background:var(--bg);color:var(--positive-ink)} .site-rail nav button.active span{color:var(--positive-ink)} .rail-bottom p{color:var(--text-muted)} .workspace-bar{background:rgba(255,255,255,.9)} .workspace-label{color:var(--text-muted)} .workspace-label span{color:var(--text-muted)} .edition-date{color:var(--text-muted)} .global-find{color:var(--text-muted);background:var(--surface)} .download-action{background:var(--surface)} .download-action small{color:var(--text-muted)} .report-hero h1{color:var(--text)} .report-hero h1 em{color:var(--text-muted)} .primary-action{background:var(--fill-positive);color:var(--on-fill);border:1px solid var(--positive-ink);border-radius:4px} .primary-action:hover{background:var(--fill-positive);color:var(--on-fill)} .secondary-action{border:1px solid var(--border);border-radius:4px;color:var(--text-muted)} .hero-index strong{color:var(--text)} .hero-index>div span{color:var(--text-muted)} .proof-card{background:var(--surface)} .proof-company{color:var(--text)} .proof-company small{color:var(--text-muted)} .logo{background:var(--surface)} .proof-number{color:var(--text)} .proof-unit{color:var(--text-muted)} .status-dot{color:var(--text-muted)} .status-dot:before{background:var(--fill-positive-soft)} .chart-footnote{color:var(--text-muted)} .thesis-feature{background:var(--bg)} .thesis-feature p{color:var(--text-muted)} .inline-actions button{border-bottom:1px solid var(--positive-line)} .finding-number{color:var(--text-muted)} .expand-label{color:var(--text-muted)} .finding-body .implication{border-left:2px solid var(--positive-line)} .implication b{color:var(--positive-ink)} .evidence-pill{border:1px solid var(--line);border-radius:4px;background:var(--surface)} .next-proof{color:var(--text-muted)!important} .next-proof b{color:var(--text-muted)} .reading-path{background:var(--surface)} .reading-path button span{color:var(--text-muted)} .view-tabs button.selected{border-color:var(--positive-ink);color:var(--positive-ink)} .compact-tools input{background:var(--surface)!important} .compact-tools select{background:var(--surface)!important} .opportunity-workbench{background:var(--surface)} .chart-heading>span{color:var(--text-muted)} .value-legend>span{color:var(--text-muted)} .near-bar{background:var(--fill-positive)} .potential-bar{background:var(--positive-soft)} .balance-bar{background:repeating-linear-gradient(135deg,var(--caution-soft) 0,var(--caution-soft) 2px,var(--surface-warm) 2px,var(--surface-warm) 5px)} .chart-instruction{color:var(--text-muted)} .value-row{border:1px solid transparent;border-top-color:var(--border);border-radius:3px} .value-row:hover{background:var(--bg)} .value-row.is-selected{background:var(--bg);border:1px solid var(--positive-line)} .value-label small{color:var(--text-muted)} .value-track{background:var(--bg)} .value-total{color:var(--text-muted)} .value-total small{color:var(--text-muted)} .chart-source{color:var(--text-muted)} .chart-source p{color:var(--text-muted)} .company-evidence-panel{background:var(--bg)} .map-panel-stats span{color:var(--text-muted)} .map-panel-stats b{color:var(--positive-ink)} .panel-list-heading>span{color:var(--text-muted)} .panel-case{background:var(--surface)} .fit-chip{background:var(--bg);color:var(--text-muted)} .fit-chip.direct{background:var(--surface-3);color:var(--positive-ink)} .panel-case-meta{color:var(--text-muted)} .panel-case details{color:var(--text-muted)} .panel-case summary{border-bottom:1px dotted var(--positive-line)} .panel-open{border-bottom:1px solid var(--positive-line);color:var(--positive-ink)} .map-method summary{color:var(--text-muted)} .opp-matrix-wrap{background:var(--surface)} .compact-card{background:var(--surface)} .record-category{color:var(--text-muted)} .record-category>span{color:var(--text-muted)} .compact-meta{color:var(--text-muted)} .review-label{background:var(--bg);color:var(--text-muted)} .toolbar input{border-radius:4px} .toolbar select{border-radius:4px} .toolbar input{background:var(--surface)} .toolbar select{background:var(--surface)} .company-row{background:var(--surface)} .function-group{background:var(--surface)} .reading-method{border-left:2px solid var(--border)} .ambition-item{background:var(--surface)} .download-list>a{background:var(--surface)} .sources-table{background:var(--surface)} footer{color:var(--on-inverse-muted)} dialog#detail{background:var(--surface);border:1px solid var(--border);border-radius:9px} #detail .close{background:var(--bg);border:1px solid var(--border);border-radius:50%} .dossier-company span{color:var(--text-muted)} .dossier-status{color:var(--text-muted)} .dossier-tabs{background:var(--surface)} .dossier-tabs [aria-selected=true]{border-color:var(--positive-ink);color:var(--positive-ink)} .dossier-stat-grid{background:var(--bg)} .evidence-boundary{border-left:3px solid var(--border-strong)} .evidence-boundary .label{color:var(--caution-ink)} .dossier-tab-body .source-link{background:var(--bg)} .map-method[open]{background:var(--bg)} .opp-disposition details{background:var(--surface)} .panel-case .panel-stage{color:var(--text-muted);border-left:2px solid var(--border)} .value-row:focus-visible{outline:2px solid var(--positive-ink);outline-offset:1px} @media(max-width:800px){.mobile-close{color:var(--text-muted)}} .reports-tabs button{color:var(--text-muted)} .reports-tabs button.selected{color:var(--positive-ink);border-color:var(--positive-ink)} .reports-tabs small{color:var(--text-muted)} .literature-lead strong{color:var(--positive-ink)} .report-start{background:var(--surface)} .report-start:hover{border-color:var(--positive-line);background:var(--bg)} .report-start>span:last-child{color:var(--positive-ink)} .literature-title>.small{color:var(--text-muted)} .report-cite{border:1px solid var(--border);border-radius:3px;background:var(--bg);color:var(--text-muted)} .report-cite span{color:var(--text-muted)} .report-cite:hover{background:var(--positive-soft)} .insight-action{border-left:2px solid var(--positive-line)} .insight-action p{color:var(--text-muted)} .literature-insight summary{color:var(--text-muted)} .literature-coverage summary{color:var(--text-muted)} .comparison-lessons{background:var(--surface-3)} .literature-coverage .inline-actions a{color:var(--positive-ink)} .report-filters{background:var(--bg)} .report-filters input{background:var(--surface)} .report-filters select{background:var(--surface)} .report-filters input{border:1px solid var(--border)} .report-filters select{border:1px solid var(--border)} .report-filters input{border-radius:3px} .report-filters select{border-radius:3px} .report-filters input{color:var(--text)} .report-filters select{color:var(--text)} .report-filters button{border:1px solid var(--border);border-radius:3px} .report-result-count{color:var(--text)} .report-result-count span{color:var(--text-muted)} .report-publisher{color:var(--text)} .report-date{color:var(--text-muted)} .method-chip{background:var(--surface-3);color:var(--text-muted)} .report-summary h3 button{color:var(--text)} .report-tags{color:var(--text-muted)} .report-tags span{border-left:1px solid var(--border)} .report-actions a{color:var(--text-muted)} .report-actions label{color:var(--text-muted)} .report-actions input{accent-color:var(--positive-ink)} .report-compare-tray:not(:empty){background:var(--fill-positive);color:var(--on-fill)} .report-compare-tray>button{color:var(--on-fill)} .report-compare-tray .primary-action{background:var(--positive-soft);color:var(--positive-ink)} .report-comparison-scroll table{background:var(--surface)} .report-comparison-scroll th:first-child{color:var(--text-muted);background:var(--bg)} .report-comparison-scroll thead th{background:var(--surface-3);color:var(--positive-ink)} .report-comparison-scroll thead button{color:var(--text)} .report-comparison-scroll small{color:var(--text-muted)} .report-detail-body li{color:var(--text-muted)} .report-question{background:var(--surface-3)} .report-metric>strong{color:var(--positive-ink)} .report-metric>strong small{color:var(--text-muted)} .report-detail-body .evidence-boundary{background:var(--surface-warm)} .literature-callout{border:1px solid var(--border);background:var(--surface-3);border-radius:5px} @media print{.report-cite{border:0}} .report-company-evidence small{color:var(--text-muted)} .gap-baseline strong{color:var(--text)} .gap-baseline span{color:var(--text-muted)} .gap-reading h3 button{color:var(--positive-ink)} .gap-reading a{color:var(--positive-ink)} .gap-reading .text-link{color:var(--positive-ink)} .gap-reading .gap-limit{color:var(--text-muted)} .gap-status{color:var(--caution-ink);background:var(--surface-warm)} .gap-departments button:hover{background:var(--surface-3)} .gap-departments i{background:linear-gradient(to right,var(--fill-positive-soft) var(--coverage),var(--bg) var(--coverage))} .gap-departments b{color:var(--text-muted)} .gap-table-scroll table{background:var(--surface)} .gap-table-scroll th{background:var(--surface-3);color:var(--text-muted)} .gap-table-scroll button{color:var(--positive-ink)} .gap-table-scroll small{color:var(--text-muted)} .gap-jump{border-left:3px solid var(--positive-line);background:var(--surface-3)} body{background:var(--surface);color:var(--ink)} p{color:var(--text-muted)} .site-rail{background:var(--bg)} .site-rail nav button.active{background:var(--surface-2);color:var(--text);box-shadow:inset 2px 0 var(--positive-ink)} .site-rail .nav-group{color:var(--text-muted)} .workspace-bar{background:var(--surface)} .global-find{background:var(--surface);color:var(--text-muted)} .edition-date{color:var(--text-muted)} .workspace-label{color:var(--text-muted)} .kicker{color:var(--text-muted)} .label{color:var(--text-muted)} .primary-action{border-radius:2px} .secondary-action{border-radius:2px} .report-opening{border-bottom:1px solid var(--rule)} .report-dateline{color:var(--text-muted)} .report-deck{color:var(--text-muted)} .report-inventory button{color:var(--text-muted)} .report-inventory b{color:var(--text)} .report-lead{border-bottom:1px solid var(--rule)} .section-label{color:var(--accent-ink)} .report-read{border-bottom:1px solid var(--positive-ink)} .report-section-heading>span{color:var(--text-muted)} .report-section-heading>button{color:var(--text-muted)} .report-table{background:var(--surface)} .report-table thead th{color:var(--text-muted)} .report-table td{color:var(--text-muted)} .report-table td>strong{color:var(--text)} .report-table small{color:var(--text-muted)} .table-workflow{color:var(--text-muted)} .table-source{color:var(--text-muted)} .section-note{color:var(--text-muted)} .report-finding>summary>span:first-child{color:var(--text-muted)} .workflow-disclosure{color:var(--text-muted)} .report-scope{border-top:1px solid var(--rule)} .report-breadcrumb{color:var(--text-muted)} .company-report-head{border-bottom:1px solid var(--rule)} .company-report-identity{color:var(--text-muted)} .report-byline{color:var(--text-muted)} .company-contents>span{color:var(--text-muted)} .company-contents a{color:var(--text-muted)} .company-contents p{color:var(--text-muted)} .inline-sources a{color:var(--positive-ink)} .eqt-at-a-glance>div>span{color:var(--text-muted)} .eqt-at-a-glance strong{color:var(--text)} .workflow-index{color:var(--text-muted)} .eqt-workflow small{color:var(--text-muted)} .workflow-body dl>div{border-top:1px solid var(--border)} .workflow-body dt{color:var(--text-muted)} .workflow-body dd{color:var(--text-muted)} .analyst-note{border-left:2px solid var(--positive-line)} .report-chronology time{color:var(--text-muted)} .research-questions li{color:var(--text-muted)} .research-questions h3{color:var(--text)} .source-number{color:var(--text-muted)} .report-source-list p{color:var(--text-muted)} .report-related p{color:var(--text-muted)} .review-label{background:var(--bg)} .fit-chip{background:var(--bg)} .gap-status{background:var(--bg)} .review-label{color:var(--text-muted)} .fit-chip{color:var(--text-muted)} .gap-status{color:var(--text-muted)} .gap-jump{background:var(--bg);border-left-color:var(--positive-line)} .gap-reading .gap-limit{color:var(--text-muted)} .gap-table-scroll small{color:var(--text-muted)} .literature-callout{background:var(--bg)} .thesis-feature{background:var(--bg)} .literature-callout{border-radius:0} footer{color:var(--on-inverse-muted)} button:focus-visible{outline:2px solid var(--positive-ink)} a:focus-visible{outline:2px solid var(--positive-ink)} summary:focus-visible{outline:2px solid var(--positive-ink)} button:focus-visible{outline-offset:4px} a:focus-visible{outline-offset:4px} summary:focus-visible{outline-offset:4px} .report-table th small{color:var(--text-muted)} @media(max-width:800px){.table-scroll-note{color:var(--text-muted)}} .company-research-update a{color:var(--green,var(--positive-ink))} .report-search-log{border-top:1px solid var(--border)} .report-search-log article{border-bottom:1px solid var(--border)} .gap-intro .report-inventory>span{color:var(--text-muted)} .atlas-tabs button[aria-selected=true]{border-bottom-color:var(--atlas-green);color:var(--atlas-green)} .atlas-tabs small{color:var(--text-muted)} .atlas-filter select{border:1px solid var(--border-strong);background:var(--surface)} .atlas-controls{color:var(--text-muted)} .atlas-value-labels{color:var(--text-muted)} .atlas-value-row:hover{background:var(--bg)} .atlas-department-bars button:hover{background:var(--bg)} .atlas-note{color:var(--text-muted)!important} .atlas-matrix{background:var(--surface)} .atlas-matrix th{border-bottom:1px solid var(--line)} .atlas-matrix td{border-bottom:1px solid var(--line)} .atlas-matrix thead th{color:var(--text-muted)} .atlas-matrix th:first-child{background:var(--surface)} .atlas-matrix small{color:var(--text-muted)} .level-1{background:var(--surface-3)} .level-2{background:var(--positive-soft)} .level-3{background:var(--fill-positive-soft)} .level-4{background:var(--fill-positive);color:var(--on-fill)} .atlas-empty{color:var(--text-muted)} .atlas-tag{color:var(--text-muted);border:1px solid var(--border)} .atlas-audit-list small{color:var(--text-muted)} .atlas-outcome-track i{background:var(--atlas-green)} .atlas-outcome-track em{background:var(--fill-positive-soft);border-left:2px solid var(--atlas-green);border-right:2px solid var(--atlas-green)} .atlas-lanes section{border-left:2px solid var(--border)} .atlas-brief-aside>button span{color:var(--text-muted)} .atlas-register-stat>span{color:var(--text-muted)} .atlas-composition{background:var(--surface-2)} .atlas-more summary{color:var(--text-muted)} .atlas-result-index small{color:var(--text-muted)} .atlas-result-index button:hover{background:var(--bg)} .atlas-unit{color:var(--text-muted)} .atlas-outcome-track{border-left:1px solid var(--positive-line)} body{background:var(--paper);color:var(--ink)} p{color:var(--text-muted)} ::selection{background:var(--surface-2)} button:focus-visible{outline:2px solid var(--accent)} a:focus-visible{outline:2px solid var(--accent)} summary:focus-visible{outline:2px solid var(--accent)} button:focus-visible{outline-offset:5px} a:focus-visible{outline-offset:5px} summary:focus-visible{outline-offset:5px} button:hover{color:var(--accent-ink)} a:hover{color:var(--accent-ink)} footer{color:var(--muted)} .workspace-bar{background:var(--paper)} .publication-brand span{color:var(--accent-ink)} .publication-masthead>p{color:var(--text-muted)} .global-find{background:transparent;color:var(--text-muted)} .publication-nav button.active{color:var(--accent-ink);border-bottom-color:var(--accent)} .site-rail{background:var(--bg)!important} .site-rail nav button.active{box-shadow:inset 2px 0 var(--accent);color:var(--accent-ink);background:var(--surface-warm)} .publication-dateline{color:var(--text-muted)} .publication-dateline>span:first-child{color:var(--accent-ink)} .publication-cover h1{color:var(--text)} .publication-cover h1 em{color:var(--text-muted)} .publication-cover-links button:last-child{color:var(--text-muted)} .publication-section-no{color:var(--accent-ink)} .publication-small-track i{background:var(--fill-positive)} .publication-small-track i.accent{background:var(--fill-accent)} .publication-chart-note{color:var(--text-muted)} .publication-caption-link{color:var(--text-muted)} .publication-inventory{color:var(--text-muted)} .publication-inventory b{color:var(--text)} .publication-eyebrow{color:var(--text-muted)} .publication-proof-value small{color:var(--text-muted)} .publication-source{text-decoration:underline;text-decoration-color:var(--on-inverse-muted)} .publication-source span{color:var(--text-muted)} .publication-strip-note{color:var(--text-muted)} .publication-ordinal{color:var(--accent-ink)} .publication-reading-list>button>span{color:var(--accent-ink)} .publication-reading-list small{color:var(--text-muted)} .publication-reading-list em{color:var(--text-muted)} .publication-edition summary{color:var(--text-muted)} .atlas-head .kicker{color:var(--accent-ink)} .page-head .kicker{color:var(--accent-ink)} .atlas-tabs small{color:var(--text-muted)} .atlas-tabs button[aria-selected=true]{color:var(--accent-ink);border-color:var(--accent)} .atlas-filter{color:var(--text-muted)} .atlas-filter select{border:1px solid var(--border);background:transparent;border-radius:0} .atlas-controls{color:var(--text-muted)} .atlas-value-labels{color:var(--text-muted)} .atlas-value-row:hover{background:var(--surface-warm)} .atlas-department-bars button:hover{background:var(--surface-warm)} .atlas-value-row>strong{color:var(--accent-ink)} .atlas-note{color:var(--text-muted)!important} .atlas-matrix{background:transparent} .atlas-matrix th:first-child{background:var(--paper)} .atlas-matrix th{border-color:var(--border)} .atlas-matrix td{border-color:var(--border)} .atlas-matrix thead th{color:var(--text-muted)} .level-1{background:var(--positive-soft)} .level-2{background:var(--positive-soft)} .level-3{background:var(--fill-positive-soft)} .level-4{background:var(--fill-positive);color:var(--on-fill)} .atlas-tag{border:0;background:var(--positive-soft);color:var(--text-muted)} .atlas-outcome-track i{background:var(--fill-positive)} .atlas-outcome-track em{background:var(--fill-positive-soft);border-color:var(--positive-ink)} .atlas-lanes section{border:0} .atlas-lanes .label{color:var(--accent-ink)} .atlas-platform-company .atlas-tag{color:var(--text-muted)} .kicker{color:var(--text-muted)} .label{color:var(--text-muted)} .toolbar input{background:var(--surface)} .toolbar select{background:var(--surface)} .opp-tools input{background:var(--surface)} .opp-tools select{background:var(--surface)} .report-filters input{background:var(--surface)} .report-filters select{background:var(--surface)} .toolbar input{border:1px solid var(--border)} .toolbar select{border:1px solid var(--border)} .opp-tools input{border:1px solid var(--border)} .opp-tools select{border:1px solid var(--border)} .report-filters input{border:1px solid var(--border)} .report-filters select{border:1px solid var(--border)} .toolbar input{border-radius:0} .toolbar select{border-radius:0} .opp-tools input{border-radius:0} .opp-tools select{border-radius:0} .report-filters input{border-radius:0} .report-filters select{border-radius:0} .company-row{background:transparent} .company-row:hover{background:var(--bg)} .company-label small{color:var(--text-muted)} .company-preview{color:var(--text-muted)} .logo{background:transparent} .company-research-update{color:var(--text-muted)} .research-card{background:transparent} .compact-card{background:transparent} .proof-card{background:transparent} .ambition-item{background:transparent} .function-group{background:transparent} .review-label{background:var(--surface-3)} .fit-chip{background:var(--surface-3)} .gap-status{background:var(--surface-3)} .review-label{color:var(--text-muted)} .fit-chip{color:var(--text-muted)} .gap-status{color:var(--text-muted)} .primary-action{background:var(--fill-positive);border-color:var(--positive-ink);color:var(--on-fill);border-radius:0} .secondary-action{border-radius:0} .outline{border-radius:0} .download-action{background:transparent} .view-tabs .selected{color:var(--accent-ink)} .view-tabs button.active{color:var(--accent-ink)} .view-tabs .selected{border-color:var(--accent)} .view-tabs button.active{border-color:var(--accent)} .literature-lead{background:var(--surface-warm)} .literature-callout{background:var(--surface-warm)} .thesis-feature{background:var(--surface-warm)} .gap-jump{background:var(--surface-warm)} .literature-callout{border:0} .gap-jump{border:0} .literature-callout{border-radius:0} .gap-jump{border-radius:0} .inline-sources a{color:var(--accent-ink)} .evidence-pill{border-radius:0!important;background:transparent;border-color:var(--border)} dialog{border:1px solid var(--border);border-radius:0!important;background:var(--surface)} .dossier-company span{color:var(--text-muted)} .dossier-tabs{background:transparent} .dossier-tabs button[aria-selected=true]{color:var(--accent-ink);border-color:var(--accent)} .dossier-overview .lead-workflow{color:var(--text)} .evidence-boundary{border-left:2px solid var(--border-strong);background:var(--surface-warm)} @media(max-width:560px){.publication-nav button.active{border-bottom-width:1px}} .publication-source{text-decoration:underline;text-decoration-color:var(--on-inverse-muted)} .publication-small-track i{background:var(--fill-positive)} .publication-chart-note{color:var(--muted)} .brief-links button{text-decoration:underline;text-decoration-color:var(--on-inverse-muted)} .brief-examples td:last-child{color:var(--text-muted)} .atlas-tag{background:transparent} .evidence-pill{background:transparent} .review-label{background:transparent} .fit-chip{background:transparent} .gap-status{background:transparent} .publication-section-no{color:var(--muted)} .publication-eyebrow{color:var(--muted)} .atlas-scroll:focus-visible{outline:2px solid var(--positive-ink);outline-offset:4px} .exhibit-caption{color:var(--text-muted)} .exhibit-caption a{color:var(--text-muted)} .exhibit-legend{color:var(--text-muted)} .operating{background:var(--fill-positive)} .pilot{background:var(--fill-caution-soft)} .unknown{background:var(--fill-neutral)} .visual-matrix-cell:hover{background:var(--positive-soft)} .atlas-empty{color:var(--text-muted)} .opportunity-columns{color:var(--text-muted)} .opportunity-track .full{background:var(--positive-soft)} .opportunity-track .near{background:var(--fill-positive)} .match-count{color:var(--text-muted)} .more-matches{color:var(--text-muted)} .no-match{color:var(--text-muted)} .result-category-tabs button[aria-pressed=true]{background:var(--positive-soft);border-color:var(--border);color:var(--text)} .result-group-note{color:var(--text-muted)} .result-measure>strong{color:var(--text-muted)} .result-measure small{color:var(--text-muted)} .result-context b{color:var(--text)} .result-context details{color:var(--text-muted)} .result-context summary{color:var(--text-muted)} .timeline-company-tabs>button[aria-pressed=true]{border-color:var(--positive-ink)} .company-timeline time{color:var(--text-muted)} .company-timeline li>div{border-left:1px solid var(--border)} .company-timeline li>div:before{background:var(--fill-positive)} .timeline-status{color:var(--on-fill)} .timeline-status.unknown{color:var(--text-muted);background:var(--positive-soft)} .timeline-status.pilot{background:var(--fill-caution-soft)} .oilfield-scene{border:1px solid var(--border);background:var(--bg)} .oilfield-hotspot{border:1px solid var(--border)} .oilfield-hotspot.selected{background:var(--fill-positive);color:var(--on-fill);border-color:var(--positive-ink)} .oilfield-records small{color:var(--text-muted)} .failure-case-heading>span{color:var(--accent-ink)} .failure-limit{color:var(--text-muted)!important;border-left:2px solid var(--border)} .failure-metric-track{background:var(--positive-soft)} .failure-metric-track i{background:var(--fill-caution-soft)} .failure-metrics small{color:var(--text-muted)} .brief-exhibit-field>span{background:var(--surface-3)} .brief-exhibit-field small{color:var(--text-muted)} .brief-exhibit-links span{color:var(--text-muted)} @media print{body{background:var(--surface);color:var(--text)}} @media(max-width:560px){.oilfield-hotspot.selected{background:var(--fill-positive);color:var(--on-fill)}} .oilfield-scene{background:var(--surface-warm)} .opportunity-track .full{background:var(--chart-soft)} .opportunity-track .near{background:var(--chart-strong)} .failure-case-heading>span{color:var(--accent-ink)} .failure-metrics small{color:var(--text-muted)} .failure-limit{color:var(--text-muted)} .failure-metric-track{background:var(--surface-2)} .failure-metric-track i{background:var(--chart-strong)} /* 3a. Base */ html, body { background: var(--bg); color: var(--text); } body { -webkit-font-smoothing: antialiased; } a { color: inherit; text-decoration-color: color-mix(in srgb, currentColor 45%, transparent); text-underline-offset: 3px; } a:hover { text-decoration-color: currentColor; } input, select, textarea { background: var(--surface); color: var(--text); border-color: var(--border-strong); } ::placeholder { color: var(--text-muted); opacity: 1; } hr { border-color: var(--border); } table { color: var(--text); } th { color: var(--text); } td, th { border-color: var(--border); } /* Small labels: never below 10.5px, always muted-ink (>= 4.5:1) */ .site-rail .nav-group { font-size: 10.5px; letter-spacing: 1px; color: var(--text-muted); } .site-rail nav button { color: var(--text); } .site-rail nav button span, .rail-edition, .rail-bottom p { color: var(--text-muted); } .site-rail nav button.active { color: var(--accent-ink); background: var(--surface-2); } /* 3b. Focus — one visible ring everywhere */ :focus-visible, button:focus-visible, a:focus-visible, summary:focus-visible, input:focus-visible, select:focus-visible, [tabindex]:focus-visible, .atlas-scroll:focus-visible, .value-row:focus-visible, .atlas-tabs button:focus-visible { outline: 2px solid var(--focus) !important; outline-offset: 2px !important; border-radius: 2px; } /* 3c. Dialog, tables, footer */ dialog, dialog#detail { background: var(--surface); color: var(--text); border-color: var(--border); } dialog::backdrop, dialog#detail::backdrop { background: rgba(16, 20, 17, .55); } dialog .close, #detail .close { background: var(--surface); color: var(--text); border-color: var(--border); } footer { color: var(--text-muted); border-color: var(--border); } .skip:focus { background: var(--surface); color: var(--text); } /* 3d. Logos — one box, fixed height, contained; light tile in dark mode so dark wordmarks stay visible */ .logo { display: inline-flex; align-items: center; justify-content: center; height: 32px; width: 56px; min-width: 56px; padding: 4px; background: var(--logo-tile); border-radius: 4px; box-sizing: border-box; overflow: hidden; } .logo img { display: block; max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; } .logo.dark { background: #17323c; } .monogram { display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; height: 32px; width: 56px; min-width: 56px; border-radius: 4px; background: var(--surface-2); color: var(--text-muted); border: 1px solid var(--border); font: 600 11px/1 var(--mono, ui-monospace, monospace); letter-spacing: .5px; } .dossier-header .logo, .company-report-identity .logo { height: 48px; width: 96px; min-width: 96px; justify-content: flex-start; } .evidence-pill .logo, .opportunity-companies .company-identity > .logo, .company-identity > .logo { height: 24px; width: 36px; min-width: 36px; padding: 2px; } .atlas-matrix .logo, .table-company .logo { height: 26px; width: 40px; min-width: 40px; padding: 2px; } /* 3e. Evidence badges — A solid, B outline, C dashed + hatched, D dotted & muted. Letter always shown. */ .ev-badge { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; vertical-align: middle; font: 600 11px/1 var(--publication-sans, 'Helvetica Neue', Arial, sans-serif); letter-spacing: .2px; padding: 4px 7px 4px 6px; border-radius: 3px; border: 1.5px solid transparent; color: var(--text); } .ev-badge::before { font-weight: 700; font-size: 11px; } .ev-badge.ev-A { background: var(--grade-a); border-color: var(--grade-a); color: var(--grade-a-ink); } .ev-badge.ev-B { background: transparent; border-color: var(--grade-b); color: var(--positive-ink); } .ev-badge.ev-C { border-style: dashed; border-color: var(--grade-c); color: var(--caution-ink); background: repeating-linear-gradient(135deg, var(--caution-soft) 0 4px, transparent 4px 8px); } .ev-badge.ev-D { border-style: dotted; border-color: var(--grade-d); color: var(--text-muted); background: transparent; font-weight: 500; } .ev-badge.ev-compact { padding: 2px 5px; font-size: 10.5px; min-width: 1.6em; justify-content: center; } .ev-chip { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; vertical-align: middle; font: 500 11px/1 var(--publication-sans, 'Helvetica Neue', Arial, sans-serif); padding: 4px 7px; border-radius: 3px; border: 1px dashed var(--caution-ink); color: var(--caution-ink); background: var(--caution-soft); } .ev-chip.ev-vendor::before { content: "!"; display: inline-grid; place-items: center; width: 12px; height: 12px; border-radius: 50%; border: 1px solid currentColor; font-size: 9px; font-weight: 700; } .ev-legend { display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: center; margin: 10px 0; font-size: 12px; color: var(--text-muted); } /* 3f. Stage chips — position on the path shown by a filled pip count, not colour alone */ .stage-chip { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; vertical-align: middle; font: 500 11px/1 var(--publication-sans, 'Helvetica Neue', Arial, sans-serif); padding: 4px 7px; border-radius: 999px; border: 1px solid var(--border-strong); color: var(--text); background: var(--surface); text-transform: capitalize; } .stage-chip::before { content: ""; width: 22px; height: 6px; border-radius: 3px; flex: none; background: linear-gradient(90deg, var(--pip) 0 var(--pip-w, 0%), var(--fill-neutral) var(--pip-w, 0%) 100%); } .stage-chip.stage-announced { --pip: var(--text-muted); --pip-w: 25%; } .stage-chip.stage-pilot { --pip: var(--caution-ink); --pip-w: 50%; } .stage-chip.stage-operating { --pip: var(--positive-ink); --pip-w: 75%; } .stage-chip.stage-scaled { --pip: var(--positive-ink); --pip-w: 100%; border-color: var(--positive-ink); } .stage-chip.stage-unclear { --pip: var(--fill-neutral); --pip-w: 0%; color: var(--text-muted); border-style: dotted; } /* 3g. Companies — compact multi-column directory instead of 115 tall rows */ #company-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 0 24px; border-top: 1px solid var(--rule); } #company-list .company-row { display: grid; grid-template-columns: 56px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 10px 4px; margin: 0; border: 0; border-bottom: 1px solid var(--border); border-radius: 0; background: transparent; text-align: left; min-height: 56px; } #company-list a.company-row { color: var(--text); text-decoration: none; } #company-list .company-row:hover { background: var(--surface-2); } #company-list .company-row .logo, #company-list .company-row .monogram { width: 56px; min-width: 56px; height: 32px; } #company-list .company-label { font: 600 15px/1.25 var(--publication-serif, Georgia, serif); letter-spacing: 0; color: var(--text); min-width: 0; overflow-wrap: anywhere; } #company-list .company-label small { display: block; font: 400 11.5px/1.3 var(--publication-sans, 'Helvetica Neue', Arial, sans-serif); color: var(--text-muted); margin-top: 3px; } #company-list .company-preview { display: none; } #company-list .company-row .ev-badge { justify-self: end; } @media (max-width: 640px) { #company-list { grid-template-columns: 1fr; } } /* 3h. Theme toggle (injected by visuals.js) */ .theme-toggle { display: inline-flex; align-items: center; gap: 6px; font: 500 12px/1 var(--publication-sans, 'Helvetica Neue', Arial, sans-serif); padding: 6px 9px; border: 1px solid var(--border-strong); border-radius: 3px; background: transparent; color: var(--text); cursor: pointer; } .theme-toggle svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.6; } /* 3i. Dark-mode specifics the remap can't infer */ @media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) img:not(.logo img):not([src$=".svg"]) { filter: brightness(.92); } } :root[data-theme="dark"] img:not(.logo img):not([src$=".svg"]) { filter: brightness(.92); } /* 3j. Company links (moved from an inline