/* Shared layout contract. Loaded after page styles by the build shell.



   Padding applies to content surfaces and controls, not text or media pixels. */



:root { --content-padding-min: 12px; --control-gap: 12px; --hero-gap: 80px; --hero-bottom: 80px; --pagination-gap: 24px; }



.hero-in, .thero-in, .thero.thero-slim .thero-in { padding-top: calc(var(--livehead-h, 0px) + var(--hero-gap)); padding-bottom: var(--hero-bottom); }



main > .lede, main > * > .lede.person-lede { padding-top: var(--hero-gap); padding-bottom: var(--hero-bottom); }



/* This minimum is an invariant, including legacy component variants. */



html body :is(.btn,.vbtn,.fbtn,.chip,.facet-opt,.mon-search-opt,.srch-adv-link) { padding: var(--content-padding-min) !important; height: auto; min-height: 44px; box-sizing: border-box; }



:is(.row-main,.vid-body,.card:not(.row),.mkc,.th-stat,.thero-card) { padding: max(var(--content-padding-min), var(--space-2)); min-width: 0; }



.feed .row.card .row-main { padding: max(var(--content-padding-min), var(--space-2)); }



.feed .row.card { grid-template-columns: minmax(0, 32%) minmax(0, 1fr); column-gap: 0; min-height: 0; }



.feed.feed-grid .row.card { grid-template-columns: minmax(0, 32%) minmax(0, 1fr); }



.feed .row.card .row-media { min-height: 0; height: auto; align-self: stretch; }



.feed.feed-grid .row.card .row-main { gap: 12px; justify-content: flex-start; }



.feed.feed-grid .row.card .row-main > .row-meta { margin-top: 0; padding-right: 0; min-height: 0; gap: 12px; }



.feed.feed-grid .row.card .row-main > .row-acts { margin-top: auto; padding-top: 12px; gap: 12px; }



.feed .row.card .row-acts .rel-preview { display: contents; }



.feed .row.card .row-acts .rel-preview > .muted { flex-basis: 100%; }



.feed .row.card .row-src { padding-right: 0; }



.feed.feed-grid .row.card .row-main > .row-title { margin-top: 0; }



.feed .row.card :is(.row-mt-slot,.row-meta):empty { display: none; }



.feed .row.card .row-title { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; overflow: hidden; }



.srch-hero-form { position: relative; max-width: 860px; }



.thero-search { overflow: visible; z-index: 2; }



.srch-hero-form .mon-search-list { top: calc(100% + 12px); text-align: left; padding: 12px; }



:is(.tools,.acts,.row-acts,.chips-row,.facet-dates,.facet-check-list,.vb-group,.rel-preview,.feed-foot,.vid-foot) { gap: var(--control-gap); }



.facet-dates label { gap: var(--control-gap); }



.facet-dates input[type="date"] { padding: var(--content-padding-min); min-width: 0; max-width: 100%; }



.pg-host { margin-block: var(--pagination-gap); padding-block: var(--content-padding-min); min-width: 0; }



.pg-bar { margin: 0; gap: var(--control-gap); }



.pg-bar .vbtn { padding: var(--content-padding-min); min-height: 44px; }



.pg-bar .vb-group { flex-wrap: wrap; min-width: 0; }



.pg-bar .vb-set { max-width: 100%; flex-wrap: wrap; }



:is(.ex-head,.panel-head,.top-band-head,.srch-sec-head) { position: relative; padding-block: 12px 24px; margin-bottom: 24px; border-bottom: 1px solid var(--line); gap: 24px; }



:is(.ex-head,.panel-head,.top-band-head,.srch-sec-head)::before { content: ""; position: absolute; left: 0; bottom: -1px; width: 48px; height: 3px; background: var(--fg); }



:is(.ex-head,.panel-head,.top-band-head) .k { gap: 12px; color: var(--fg-2); }



:is(.ex-head,.panel-head,.top-band-head) .lead { max-width: 56ch; }



:is(.ex-head,.panel-head,.top-band-head) > .tools { gap: 12px; }



.srch-hero-box { height: auto; min-height: 64px; padding: 12px; border-radius: var(--r-ctl); gap: 12px; }



.srch-hero-box input { min-height: 44px; height: auto; }



.srch-hero-submit { width: auto; min-width: 44px; height: auto; min-height: 44px; padding: 12px; border-radius: var(--r-ctl); font: 600 14px/1.3 var(--body); }



.srch-adv-link { padding: 12px; }



#search-people .srch-sec-head { margin-bottom: 24px; }



.srch-sec + .srch-sec { margin-top: var(--section-gap); }



.ent-stats,.ent-seen,.ent-chart-wrap { margin-top: 12px; }



.ent-chart-wrap .k { margin-bottom: 12px; }



.ent-card { grid-template-columns: 112px minmax(0, 1fr); gap: 24px; align-items: start; }



.ent-media { width: 112px; height: 112px; }



.ent-media.logo { border: 0; border-radius: var(--r-card); background: transparent; }



.ent-media.logo .fav { width: 100%; height: 100%; margin: 0; padding: 12px; border: 0; border-radius: inherit; object-fit: contain; background: var(--surface); }



.srch-tile-media.sq { border: 0; border-radius: var(--r-ctl); background: transparent; }



.srch-tile-media.sq .fav { margin: 0; border: 0; border-radius: inherit; background: transparent; }



.who-head .portrait:has(img.fav) { border: 0; background: transparent; border-radius: var(--r-ctl); }



.who-head .portrait img.fav { margin: 0; border: 0; border-radius: inherit; }



@media (max-width: 560px) { .ent-card { grid-template-columns: 80px minmax(0, 1fr); gap: 16px; } .ent-media { width: 80px; height: 80px; } }



.hero-band .wire { width: calc(100vw - var(--sbw, 0px)); margin-left: calc((100% - 100vw + var(--sbw, 0px)) / 2); box-sizing: border-box; padding: 12px var(--page-gutter); }



@media (min-width: 1000px) { .brand .mon-search { margin-left: 10px; } }



.research-controls { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 20px; padding-block: 12px 24px; margin-bottom: 24px; border-bottom: 1px solid var(--line); }



.research-controls label { display: grid; gap: 12px; min-width: 0; font: 600 12px/1.4 var(--body); color: var(--fg-2); }



.research-controls :is(select,input) { min-width: 0; width: 100%; min-height: 44px; padding: 12px; border: 1px solid var(--line); border-radius: var(--r-ctl); background: var(--surface); color: var(--fg); font: 400 14px/1.4 var(--body); }



.research-controls button { align-self: end; }



.research-total { display: grid; gap: 12px; color: var(--fg-2); font-size: 12px; }



.research-total b { color: var(--fg); font: 800 36px/1 var(--head); }



.research-lane + .research-lane { margin-top: 40px; }



.research-lane > h3 { margin-bottom: 24px; }



.research[aria-busy="true"] .research-results { opacity: .55; }



.rel-entities { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; }



.rel-entity { display: flex; gap: 16px; align-items: center; color: var(--fg); text-decoration: none; min-width: 0; }



.rel-entity > span:last-child { min-width: 0; }



.rel-entity strong { display: block; margin-top: 16px; overflow-wrap: anywhere; }



.rel-entity .portrait, .rel-logo { flex: 0 0 64px; width: 64px; height: 64px; }



.rel-logo .fav { width: 100%; height: 100%; margin: 0; border: 0; border-radius: var(--r-ctl); object-fit: contain; }



.entity-hero-logo { display: inline-flex; flex: 0 0 96px; width: 96px; height: 96px; margin-right: 12px; border-radius: var(--r-card); overflow: hidden; }



.entity-hero-logo .fav { width: 100%; height: 100%; margin: 0; object-fit: contain; border: 0; }



.person-hero h1 { align-items: center; gap: 24px; }



.person-hero h1 > .portrait { flex: 0 0 112px; width: 112px; height: 112px; }



.person-hero h1 > span:last-child { min-width: 0; }



.rel-entities .image-credit { display: inline-block; margin-top: 12px; font-size: 12px; color: var(--fg-3); }



@media(max-width:560px) { .person-hero h1 { flex-wrap: wrap; } .person-hero h1 > .portrait { flex-basis:80px; width:80px; height:80px; } }



@media(max-width:760px) { .research-controls { grid-template-columns: repeat(2,minmax(0,1fr)); gap:16px; } .rel-entities { grid-template-columns:minmax(0,1fr); } }



@media(max-width:390px) { .research-controls { grid-template-columns:minmax(0,1fr); } }







/* Country belongs to source metadata, with no reserved footer space. */



.row-src .row-country { position:static; display:inline-flex; align-items:center; gap:12px; font-size:12px; color:var(--fg-3); }



.row-country img { border-radius:3px; flex:none; }







/* The minimum applies to every native control, including older page tools. */



html body button,



html body input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]),



html body select,



html body textarea { padding:12px !important; min-height:44px; min-width:44px; box-sizing:border-box; }



/* The pager strip spans the list it pages: inset above and below, never at
   the sides, so its edges line up with the cards' edges. */
.pg-host { padding:12px 0; }



.feed .row.card .row-meta { flex-wrap:nowrap; overflow-x:auto; max-width:100%; }



.feed .row.card .row-meta > * { flex-shrink:0; }







.pulse-day-link { cursor:pointer; }



.pulse a:focus-visible .pulse-day-link { stroke:var(--fg); stroke-width:2; }



.research[aria-busy="true"]::before { content:"Updating matching records..."; display:block; padding:12px; margin-bottom:12px; color:var(--fg-2); }







/* One outer content-card geometry across collections and routes. */



:root { --content-card-height: 420px; --content-card-width: calc((min(1302px, 100vw - 48px) - 24px) / 2); }



main section.ex, main section.panel { padding-inline: 0; }



.wrap, .wrap.wide { max-width:1350px; margin-inline:auto; padding-inline:24px; }



.hero-in,.thero-in,.hero-band-in,.top-band-in { max-width:1302px; }



:is(.feed,.feed.feed-grid,.mk-grid,[data-markets-home] .mk-grid) { display:grid; grid-template-columns:repeat(2,var(--content-card-width)); gap:24px; justify-content:start; }



:is(.row.card,.mkc) { box-sizing:border-box; width:var(--content-card-width) !important; height:var(--content-card-height) !important; min-height:var(--content-card-height) !important; max-height:var(--content-card-height) !important; overflow:hidden; margin:0; }



.feed .row.card { display:grid; grid-template-columns:28% minmax(0,1fr) !important; padding:0; }



.feed .row.card .row-main { min-height:0; padding:16px; gap:12px; overflow:hidden; }



.feed .row.card .row-src { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; flex-shrink:0; }



.feed .row.card .row-title { font-size:18px; line-height:1.35; -webkit-line-clamp:3; flex-shrink:0; }



.feed .row.card :is(.row-mt,.row-context,.row-relation) { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; margin:0; }



.feed .row.card .row-meta { flex-shrink:0; max-height:44px; }



.feed .row.card .row-acts { flex-shrink:0; padding-top:0; gap:12px; }



.feed .row.card .row-acts > .rel-preview { display:flex; flex-wrap:wrap; width:100%; gap:12px; }



.row.card .rel-preview .muted { display:flex; align-items:center; gap:12px; overflow:hidden; white-space:nowrap; width:100%; }



.row.card [data-notes-modal] { display:none; }



.row.card .row-mt-slot { min-height:0; }



.row.card .row-main > :is(.muted,.small) { flex-shrink:1; }



.row.card .art-ic { width:44px; height:44px; }



.row.card .art-lb { font-size:11px; overflow-wrap:anywhere; }



.mkc { display:flex; flex-direction:column; padding:16px; }



.mkc .mkc-foot { margin-top:auto; }



.category-filtered { display:none !important; }



.collection-toolbar,.research-toolbar { display:flex; flex-wrap:wrap; align-items:end; gap:12px; margin:0 0 24px; }



:is(.collection-toolbar,.research-toolbar) label { display:grid; gap:12px; color:var(--fg-2); font-size:12px; min-width:0; }



:is(.collection-toolbar,.research-toolbar) select { background:var(--surface); border:1px solid var(--line); border-radius:var(--r-ctl); color:var(--fg); max-width:100%; }



.research-advanced { flex-basis:100%; margin:0; }



[hidden],.research-advanced[hidden] { display:none !important; }



.research-total { display:block; }



.research-total b { font-size:20px; }



.research .ex-head { align-items:center; }



.category-dialog { color:var(--fg); background:var(--canvas); border:1px solid var(--line); border-radius:12px; width:min(800px,calc(100vw - 32px)); max-height:85vh; padding:24px; }
/* The legend scrolls inside its own frame: the dialog clips to its rounded
   corners and only the list moves, so the scrollbar never runs over the
   right hand corners (Jeremy, 28 September 2026). */
.category-dialog[open] { display:flex; flex-direction:column; overflow:hidden; }
.category-dialog .dialog-heading { flex:none; }
.category-dialog .category-list { flex:1 1 auto; min-height:0; overflow-y:auto; overscroll-behavior:contain; padding-right:8px; }



.category-dialog::backdrop { background:rgba(0,0,0,.55); }



.dialog-heading { display:flex; align-items:center; justify-content:space-between; gap:24px; margin-bottom:24px; }



.category-list { display:grid; grid-template-columns:1fr 1fr; gap:24px; }



.category-list a { display:flex; align-items:start; gap:12px; color:var(--fg); }



.category-list strong,.category-list span span { display:block; }



.category-list span span { margin-top:12px; font-size:13px; color:var(--fg-2); }



.category-mark { color:var(--topic-color); padding:12px; border-radius:8px; background:color-mix(in srgb,var(--topic-color) 12%,transparent); }



.mega-cards.is-focused { columns:auto; }



.mega-cards.is-focused .mega-list { grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }



.mega-cards.is-focused .mega-card { padding:12px; }



/* Text follows its container rather than an arbitrary character measure. */



main :is(.lead,.desc,.note-text,.section-note,.hero-disclose,.hero-depth,.hero-copy,.thero-latest),.feed-foot > .muted,.vid-foot > .muted { max-width:none; width:auto; }



:is(.ex-head,.panel-head,.top-band-head) > div:first-child { flex:1; min-width:0; }



.hero h1,.thero h1 { max-width:none; }



/* Original compact header shell, with the homepage stroke on every route. */



.livehead .in { padding:12px 24px; gap:16px; }



.livehead,.livehead.over-hero { border-bottom:1px solid var(--line); }



.livehead.over-hero:not(.solid) { border-bottom-color:rgba(255,255,255,.08); }



.livehead .nav .lang { padding:0 12px; }



html body .livehead .nav .lang select { padding:12px 0 !important; }



.person-inline { display:inline-flex; gap:8px; align-items:center; color:var(--fg); font-size:12px; min-width:0; }



.person-inline img,.person-inline .person-initial { width:28px; height:28px; border-radius:50%; object-fit:cover; flex:none; }



.person-inline .person-initial { display:grid; place-items:center; background:var(--sub); }



.podcast-topics { display:flex; gap:12px; align-items:center; overflow:hidden; min-height:28px; }



.podcast-topics a { display:inline-flex; gap:8px; align-items:center; font-size:12px; color:var(--fg-2); white-space:nowrap; }



@media(max-width:999px) {



 :root { --content-card-width:calc(100vw - 32px); }



 .wrap, .wrap.wide { padding-inline:16px; }



 :is(.feed,.feed.feed-grid,.mk-grid,[data-markets-home] .mk-grid) { grid-template-columns:var(--content-card-width); }



 .livehead .in { padding:12px 16px; }



 .mega-cards.is-focused .mega-list { grid-template-columns:repeat(2,minmax(0,1fr)); }



}



@media(max-width:560px) {



 :root { --content-card-height:460px; }



 .feed .row.card .row-main { padding:12px; }



 .feed .row.card .row-title { font-size:16px; -webkit-line-clamp:4; }



 .row.card .art-ic { width:32px; height:32px; }



 .row.card .art-lb { font-size:9px; }



 .category-list,.mega-cards.is-focused .mega-list { grid-template-columns:1fr; }



 .collection-toolbar label,.research-toolbar > label { flex:1 1 130px; }



}







.map-controls {display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin:16px 0;}



#wcmap {touch-action:none;cursor:grab;min-height:280px;}



#wcmap:active {cursor:grabbing;}



.wc-stage {overflow:hidden;}



.wc-heat {mix-blend-mode:multiply;}







/* Fixed card envelopes reserve space for actions before clipping prose. */



.feed .row.card .row-title { flex-shrink:1; min-height:24px; }



.feed .row.card .row-mt-slot { flex:0 1 48px; overflow:hidden; }



.feed .row.card .row-mt-slot:empty { display:none; }



.feed .row.card .row-acts { display:flex; flex-wrap:wrap; }



.feed .row.card .row-acts > .rel-preview { margin-top:0; }



.feed .row.card .row-acts .rel-preview > a { order:-1; }



.feed .row.card .row-acts .rel-preview > .muted { overflow-x:auto; }



.feed .row.card .row-src .row-country { margin-left:8px; }



.feed .row.card .row-title a { color:var(--fg); }



.mk-grid > .mkc { grid-column:auto; }



.mkc { gap:12px; }



.mkc .mkc-head h3 { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; margin-top:15px; }



.mkc .mkc-head .k { font-size:11px; }



.mkc .mkc-sub,.mkc .mkc-facts,.mkc .mkc-history,.mkc .mkc-key { display:none; }



.mkc .mkc-chart { flex:1 1 80px; min-height:0; max-height:100px; overflow:hidden; }



.mkc .mkc-lead { flex-shrink:0; padding-bottom:12px; }



.mkc .mkc-foot { flex-shrink:0; padding-top:12px; }



.mkc .mkc-what { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; font-size:11px; margin-top:12px; }



.mkc .rel-preview { display:none; }



.mkc .market-detail-button { float:right; }



.cp-grid { grid-template-columns:repeat(2,var(--content-card-width)); gap:24px; }



.cp { box-sizing:border-box; width:var(--content-card-width); height:var(--content-card-height); min-height:0; padding:16px; overflow:hidden; }



.cp-pair { min-height:0; }



.cp-side { min-height:0; overflow:hidden; display:flex; flex-direction:column; }



.cp-side .cp-q { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:4; overflow:hidden; }



.cp-side > .muted { margin-top:auto; }



.cp-side .cp-who { min-height:0; }



:is(.ex-head,.panel-head,.top-band-head) :is(.lead,.desc,p) { max-width:none; }



.market-detail-dialog { width:min(900px,calc(100vw - 32px)); max-height:85vh; background:var(--canvas); color:var(--fg); border:1px solid var(--line); border-radius:12px; padding:24px; }



.market-detail-dialog::backdrop { background:rgba(0,0,0,.55); }



.market-detail-dialog .mkc { width:100% !important; height:auto !important; max-height:none !important; min-height:0 !important; overflow:visible; }



.market-detail-dialog .mkc :is(.mkc-facts,.mkc-chart,.mkc-key,.mkc-sub,.mkc-history,.rel-preview) { display:revert; max-height:none; overflow:visible; }



.market-detail-dialog .mkc .mkc-facts { display:grid; }



.market-detail-dialog .mkc .market-detail-button { display:none; }



@media(max-width:999px){.cp-grid {grid-template-columns:var(--content-card-width);}}



@media(max-width:560px){



 .cp {padding:12px;}



 .cp-pair {grid-template-columns:1fr 1fr;gap:12px;}



 .cp-side {padding:12px;}



 .cp-side .cp-who {flex-direction:column;align-items:start;gap:12px;}



 .cp-side .cp-who h4 {font-size:12px;}



 .cp-side .cp-q,.cp-side > .muted {font-size:12px;}



 .cp-side .cp-q {-webkit-line-clamp:5;}



}



:is(.ex,.panel,.top-band-in) > p.muted.small,[data-podcasts] > p.muted.small,[data-podcasts] > .two > div > p.muted.small,.mini-count {max-width:none;}



.mkc .mk-hist {display:none;}



.market-detail-dialog .mkc .mk-hist {display:block;}



.who-grid {grid-template-columns:repeat(2,var(--content-card-width));gap:24px;}



.who-grid > .who-card {box-sizing:border-box;width:var(--content-card-width);height:var(--content-card-height);max-height:var(--content-card-height);display:flex;flex-direction:column;overflow:hidden;}



.who-card .who-body {min-height:0;overflow:auto;}



.who-card .who-foot {margin-top:auto;flex-shrink:0;}



.who-card .row.card {width:100% !important;height:auto !important;min-height:0 !important;max-height:none !important;}



.who-card .feed.feed-grid {grid-template-columns:minmax(0,1fr);}



.srch-grid,.mk-grid {list-style:none;padding-left:0;}



@media(max-width:999px){.who-grid {grid-template-columns:var(--content-card-width);}}



.feed .row.card .row-acts > .rel-preview {display:contents;}



.feed .row.card .row-acts .rel-preview > .muted {order:2;flex-basis:100%;min-height:28px;margin:0;line-height:1.3;}



.feed .row.card .row-acts .rel-preview > a {order:0;}



.feed .row.card .row-acts a {max-width:100%;}



.feed .row.card .row-relation {max-height:32px;flex-shrink:1;}







.feed .row.card .row-main > :is(p,ul,.note-list) {min-height:0;overflow:hidden;margin-block:0;flex:1 1 40px;}



.feed .row.card .row-acts {max-height:180px;overflow:auto;}







.feed .row.card .row-acts .rel-preview > .muted {min-height:56px;flex-shrink:0;overflow-y:hidden;}



.feed .row.card .row-acts {max-height:208px;}











.row.card .row-acts [data-card-note] {display:contents;}



.row.card [data-card-note] .notes-open-btn {display:inline-flex;width:auto;min-width:44px;min-height:44px;padding:12px;border:1px solid var(--line);border-radius:var(--r-ctl);background:var(--surface);color:var(--fg);}



.row.card [data-card-note] [data-role="count"] {display:inline;min-width:0;padding:0;border:0;background:transparent;color:inherit;font-size:12px;}







.podcast-people {display:flex;flex-wrap:wrap;gap:12px;max-height:76px;overflow:auto;flex-shrink:0;}







#sec-people-grid,.rel-entities {grid-template-columns:repeat(2,var(--content-card-width));gap:24px;}



#sec-people-grid > .srch-tile,.rel-entities > .card {box-sizing:border-box;width:var(--content-card-width);height:var(--content-card-height);min-height:0;max-height:var(--content-card-height);overflow:hidden;}



@media(max-width:999px){#sec-people-grid,.rel-entities {grid-template-columns:var(--content-card-width);}}







/* All menu item states share one borderless treatment. */



html body .livehead .nav .nav-mega-panel a.mega-card {border:0;padding:12px;background:transparent;}



html body .livehead .nav .nav-mega-panel a.mega-card:is(:hover,.on) {background:var(--sub);border:0;}



.nav-language > summary {display:flex;align-items:center;gap:8px;min-height:44px;box-sizing:border-box;}



.nav-language [data-current-language] {max-width:92px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}



.livehead .nav .language-panel {width:340px;max-width:calc(100vw - 32px);padding:12px;max-height:min(560px,calc(100dvh - 100px));overflow:auto;}



.language-search {display:grid;gap:12px;padding:12px;color:var(--fg-2);font:600 12px/1.4 var(--body);}



.language-search input {box-sizing:border-box;width:100%;min-width:0;padding:12px;border:1px solid var(--line);border-radius:var(--r-ctl);background:var(--canvas);color:var(--fg);font:400 14px/1.4 var(--body);}



.language-options {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;}



.language-options button {min-width:0;min-height:44px;padding:12px;border:0;border-radius:var(--r-ctl);background:transparent;color:var(--fg);font:600 13px/1.4 var(--body);text-align:start;cursor:pointer;overflow-wrap:anywhere;}



.language-options button:is(:hover,[aria-pressed="true"]) {background:var(--sub);}



.language-options button:focus-visible {outline:3px solid var(--fg);outline-offset:-3px;}



.language-empty {padding:12px;margin:0;}



@media(max-width:760px){.livehead .nav .language-panel {position:static;width:100%;max-width:none;max-height:420px;}}







.livehead .nav .nav-language .language-panel {left:auto;right:0;}











html[data-theme="light"] .language-panel {color-scheme:light;}



html[data-theme="dark"] .language-panel {color-scheme:dark;}



.language-search input::placeholder {color:var(--fg-3);opacity:1;}



.language-search input:focus-visible {outline:3px solid var(--fg);outline-offset:2px;}





/* Calendar collections use the shared grid width without an inset panel. */

html body .cal-day-inline { padding-left:0; padding-right:0; border-left:0; border-right:0; background:transparent; }





.language-options button { display:flex; align-items:center; gap:8px; padding:10px 8px; }

.language-flag { width:24px; height:18px; object-fit:contain; flex:none; }

.language-options button span { min-width:0; }


.row.card [data-card-note] .notes-open-btn {align-items:center;gap:8px;}

/* Keep video media 16:9 with a flush join to its content. */
.vid { gap:0; }
.vid .vid-thumb { position:relative; aspect-ratio:16/9; overflow:hidden; }
.vid .vid-thumb img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.vid .vid-body { padding-top:16px; }



/* Approved article and podcast layouts; other media retain their own rules. */
html body .row.card[data-content-kind] {height:300px!important;min-height:300px!important;max-height:300px!important;}
html body .row.card[data-content-kind] .row-main {display:flex;flex-direction:column;height:100%;padding:18px;gap:10px;}
html body .row.card[data-content-kind] .row-title {font-size:18px;line-height:1.35;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;max-height:73px;overflow:hidden;margin:0;flex-shrink:0;}
html body .row.card[data-content-kind="article"] .row-meta a[href*="topic-"] {display:none;}
html body .row.card[data-content-kind="article"] .row-meta:not(:has(a:not([href*="topic-"]))) {display:none;}
html body .row.card[data-content-kind] .row-acts {margin-top:auto;flex-wrap:wrap;gap:8px;max-height:100px;padding-top:8px;border-top:1px solid var(--line);}
html body .row.card[data-content-kind] .card-relationships {display:flex;flex-wrap:wrap;gap:6px;margin-top:auto;max-height:68px;overflow:auto;flex-shrink:0;}
html body .row.card[data-content-kind] .card-relationships :is(.muted,.podcast-people) {display:flex;flex-wrap:wrap;gap:6px;margin:0;min-height:0;}
html body .row.card[data-content-kind] .card-relationships a:not(.person-credit) {display:inline-flex;align-items:center;gap:6px;font-size:12px;min-height:28px;}
html body .row.card[data-content-kind="podcast"] {display:block!important;}
html body .row.card[data-content-kind="podcast"] .podcast-identity {display:flex;gap:12px;align-items:center;flex-shrink:0;}
html body .row.card[data-content-kind="podcast"] .row-media {width:48px;height:48px;min-height:48px;flex:none;border-radius:8px;overflow:hidden;}
html body .row.card[data-content-kind="podcast"] .art-lb {display:none;}
html body .row.card[data-content-kind="podcast"] .art-ic {width:26px;height:26px;}
html body .row.card[data-content-kind="podcast"] .art-in {padding:0;}
html body .row.card[data-content-kind="podcast"] .podcast-topics {font-size:11px;}
@media(max-width:560px){
 html body .row.card[data-content-kind="article"] {height:320px!important;min-height:320px!important;max-height:320px!important;}
 html body .row.card[data-content-kind="podcast"] {height:330px!important;min-height:330px!important;max-height:330px!important;}
 html body .row.card[data-content-kind] .row-main {padding:12px;gap:8px;}
 html body .row.card[data-content-kind] .row-title {font-size:16px;max-height:65px;}
 html body .row.card[data-content-kind] .row-acts {gap:6px;max-height:110px;}
}

/* Approved compact action row stays fully visible at the narrowest width. */
html body .row.card[data-content-kind] .row-acts {flex-wrap:nowrap;align-items:center;flex-shrink:0;min-height:44px;max-height:44px;overflow:visible;margin-top:8px;gap:8px;}
html body .row.card[data-content-kind] .row-acts :is(a.btn,button.notes-open-btn) {width:auto!important;min-width:0!important;min-height:36px!important;padding:0!important;border:0;background:transparent;font-size:11.5px;white-space:nowrap;flex:0 0 auto;}
html body .row.card[data-content-kind] .row-acts > a:not([data-share-url]) svg {display:none;}
html body .row.card[data-content-kind] .row-acts [data-share-url] {order:3;margin-left:auto;}
html body .row.card[data-content-kind] .row-acts .rel-preview {display:contents;}
html body .row.card[data-content-kind] .row-acts [data-role="count"] {font-size:11.5px;}
html body .row.card[data-content-kind] .card-relationships {margin-top:auto;}


.vid .vid-body {display:flex;flex-direction:column;}
.vid .video-actions {display:flex;align-items:center;gap:12px;margin-top:auto;padding-top:10px;border-top:1px solid var(--line);}
.vid .video-actions [data-card-note] {display:contents;}
html body .vid .video-actions :is(.btn,.notes-open-btn) {display:inline-flex;align-items:center;gap:8px;min-height:36px;min-width:0;width:auto;padding:0!important;border:0;background:transparent;color:var(--fg);font-size:12px;}
.vid .video-actions [data-role="count"] {display:inline;padding:0;border:0;background:transparent;color:inherit;}
.vid .video-actions .notes-open-btn {margin-left:auto;}
.vid .video-actions .cnt {display:inline-flex;}


.vid .vid-body {flex:1;min-height:210px;}
.vid .vid-title {display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;line-height:1.35;min-height:42px;}
.vid .vid-body > .rel-preview {order:1;}
.vid .vid-body > .rel-preview .muted {display:flex;flex-wrap:wrap;gap:8px;}
.vid .vid-body > .video-actions {order:2;margin-top:auto;}


/* Approved media-specific envelopes replace the universal height. */
html body .row.card[data-content-kind="drift"],html body .cp,html body .mk-grid .mkc {height:360px!important;min-height:360px!important;max-height:360px!important;}
html body .row.card[data-content-kind="quote"] {display:block!important;}
html body .row.card[data-content-kind="quote"] .row-media {width:44px;height:44px;min-height:0;float:left;margin:16px 12px 0 16px;}
html body .row.card[data-content-kind="quote"] .row-title {-webkit-line-clamp:4;font-size:19px;max-height:103px;}
html body .mk-grid .mkc .mkc-chart {display:block;height:64px;min-height:64px;overflow:hidden;}
html body .mk-grid .mkc .mkc-chart svg {height:64px;width:100%;}
html body .mk-grid .mkc .mkc-key {display:block;font-size:11px;max-height:30px;overflow:hidden;}
html body .mk-grid .mkc .mkc-head h3 {-webkit-line-clamp:2;font-size:17px;margin-top:8px;}
html body .mk-grid .mkc .mkc-lead {min-height:48px;}
html body .mk-grid .mkc .mkc-foot {margin-top:auto;flex-shrink:0;}
html body .cp .cp-pair {flex:1;min-height:0;overflow:auto;}
html body .cp .cp-side {min-height:0;overflow:auto;}
@media(max-width:560px){
 html body .row.card[data-content-kind="story"],html body .row.card[data-content-kind="record"],html body .row.card[data-content-kind="quote"] {height:320px!important;min-height:320px!important;max-height:320px!important;}
 html body .row.card[data-content-kind="drift"],html body .cp,html body .mk-grid .mkc {height:380px!important;min-height:380px!important;max-height:380px!important;}
}

/* Compact video footer: no padded discussion panel. */
html body .vid .vid-body {padding-bottom:0;}
html body .vid .video-actions {height:44px;min-height:44px;max-height:44px;padding:0;align-items:center;flex-shrink:0;}
html body .vid .video-actions .notes-open-btn {height:36px!important;min-height:36px!important;padding:0!important;margin-block:0;}
html body .vid .video-actions [data-role="count"] {min-height:0!important;min-width:0!important;padding:0!important;line-height:1;}


/* Approved directory cards: fixed footer, primary left and supporting actions right. */
html body .who-grid > .who-card[data-profile-layout] {height:200px;min-height:200px;max-height:200px;}
html body .who-card[data-profile-layout] > .who-band {border:0;flex:1;min-height:0;padding:16px 18px;overflow:hidden;}
html body .who-card[data-profile-layout] > .who-body {display:none;}
html body .who-card[data-profile-layout] .who-kind {font-size:11px;margin-bottom:8px;}
html body .who-card[data-profile-layout] .who-role {display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
html body .profile-actions {display:flex;align-items:center;gap:20px;flex:none;height:60px;min-height:60px;margin:0 18px;padding:0;border-top:1px solid var(--line,#e3dfd8);}
html body .profile-actions > .profile-open {margin-right:auto;font-weight:600;}
html body .profile-actions a,html body .profile-actions button {display:inline-flex;align-items:center;justify-content:center;gap:6px;align-self:center;height:36px;min-height:36px;min-width:0;margin-top:0;margin-bottom:0;padding:0;border:0;background:transparent;font:inherit;font-size:12px;color:inherit;cursor:pointer;}
html body .profile-actions [data-card-note] {display:contents;}
html body .profile-actions .notes-open-btn {width:auto;flex:none;}
html body .profile-actions [data-role="count"] {min-height:0;min-width:0;padding:0;border:0;background:none;}
html body .profile-actions .cnt {display:inline-flex;align-items:center;}
.profile-detail-dialog {width:min(760px,calc(100vw - 32px));max-height:85vh;overflow:auto;padding:24px;border:1px solid var(--line);border-radius:12px;background:var(--bg,#faf9f6);color:var(--ink,#101624);}
@media(max-width:560px){html body .who-grid > .who-card[data-profile-layout]{height:210px;min-height:210px;max-height:210px;}}

/* Equal upper-section spacing around directory avatars. */
html body .who-card[data-profile-layout] > .who-band {display:flex;align-items:center;padding:18px;}
html body .who-card[data-profile-layout] .who-head {display:flex;align-items:center;width:100%;margin:0;gap:14px;}
html body .who-card[data-profile-layout] .who-head .portrait {flex:none;width:64px;height:64px;min-height:64px;margin:0;}
html body .who-card[data-profile-layout] .who-kind {margin:6px 0 0;font-size:10px;}
html body .who-card[data-profile-layout] .who-kind .chip {padding:2px 5px;min-height:0;font-size:9px;}

/* Reserve the approved footer area even when metadata is long. */
html body .row.card[data-content-kind] .row-acts {flex-wrap:nowrap!important;position:static!important;min-height:44px;flex-shrink:0;gap:6px;}
html body .row.card[data-content-kind] .row-main > .row-src {max-height:40px;overflow:hidden;flex-shrink:0;}
html body .row.card[data-content-kind] .row-main > :is(p,.row-ctx,.row-mt-slot,.note-list) {min-height:0;overflow:hidden;flex-shrink:1;}
html body .row.card[data-content-kind="story"] .row-main > p {flex:1;margin:0;}
html body .row.card[data-content-kind] .row-main > .row-meta {max-height:28px;overflow:hidden;flex-shrink:1;}
html body .vid .vid-body {height:210px;min-height:210px;max-height:210px;flex:none;overflow:hidden;}
html body .vid .vid-body > .rel-preview {min-height:0;overflow:auto;}
html body .vid-grid {width:100%;max-width:1302px;margin-inline:auto;grid-template-columns:repeat(4,minmax(0,1fr));}
@media(max-width:1199px){html body .vid-grid {grid-template-columns:repeat(3,minmax(0,1fr));}}
@media(max-width:900px){html body .vid-grid {grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:600px){html body .vid-grid {grid-template-columns:minmax(0,1fr);}}

html body .row.card[data-content-kind] .row-main > .muted {min-height:0;overflow:hidden;flex-shrink:1;}

/* The same profile component is used in search and relationship collections. */
html body .who-card[data-profile-layout] {box-sizing:border-box;width:var(--content-card-width);height:200px;min-height:200px;max-height:200px;padding:0;display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--line);border-radius:var(--r-card,12px);}
html body .srch-tile-grid:has(.who-card),html body .rel-grid:has(> .who-card) {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;}
@media(max-width:999px){html body .srch-tile-grid:has(.who-card),html body .rel-grid:has(> .who-card){grid-template-columns:minmax(0,1fr);}}
@media(max-width:560px){html body .who-card[data-profile-layout]{height:210px;min-height:210px;max-height:210px;}}

html body .who-card[data-profile-layout].hide,html body .who-card[data-profile-layout][hidden] {display:none!important;}
/* Long relationship lists stay within the shared card, above its footer. */
html body .row.card[data-content-kind] .card-relationships {min-height:28px;max-height:56px;flex-shrink:1;}
html body .row.card[data-content-kind] .row-acts [data-role="count"] {min-height:0!important;height:auto!important;min-width:0!important;padding:0!important;line-height:1;}
html body .row.card[data-content-kind="podcast"] .podcast-topics {min-height:0;max-height:32px;overflow:hidden;flex-shrink:1;}
html body .row.card[data-content-kind="podcast"] .row-main {gap:6px;}
html body .who-card[data-profile-layout] {height:200px!important;min-height:200px!important;max-height:200px!important;}
@media(max-width:560px){html body .who-card[data-profile-layout]{height:210px!important;min-height:210px!important;max-height:210px!important;}}

/* Let financial table columns shrink inside the page before scrolling. */
.three > * { min-width:0; }

/* ---- Approved card layouts ------------------------------------------------
   The one stylesheet for the card structure site/assets/content-ui.js builds
   (canonical(), BUILD per type). Anatomy: meta, title, context, chips, then a
   footer with the primary action left and the secondary action and comment
   count right. Dimensions stay where they were set above, per type. */
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-body { display:flex; flex-direction:column; gap:10px; min-width:0; min-height:0; }
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-meta { display:flex; align-items:flex-start; gap:12px; flex-shrink:0; min-height:0; font-size:12px; line-height:1.45; color:var(--fg-2); }
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-meta-t { flex:1 1 auto; min-width:0; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; }
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-meta .card-follow { flex:none; position:static; float:none; margin:0; padding:0; }
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-title { margin:0; flex-shrink:0; }
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-title a { color:var(--fg); }
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-context { margin:0; flex:0 0 auto; min-height:0; font-size:14px; line-height:1.45; color:var(--fg-2); display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; }
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-context:empty { display:none; }
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-context .row-mt-slot { display:contents; }
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-context .row-mt { display:inline !important; -webkit-line-clamp:unset; max-height:none; overflow:visible; margin:0; padding:0; font-size:inherit; color:inherit; }
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-links { display:flex; flex-wrap:wrap; gap:6px; margin-top:auto; max-height:66px; overflow:hidden; flex-shrink:0; }
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-links:empty { display:none; }
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-links:empty + .mc-actions { margin-top:auto; }
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-chip { display:inline-flex; align-items:center; gap:6px; min-height:28px; padding:4px 8px; border-radius:6px; background:var(--line-2); color:var(--fg); font-size:12px; line-height:1.2; text-decoration:none; max-width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-chip:hover { background:var(--line); text-decoration:none; }
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-chip :is(img,.person-initial) { width:22px; height:22px; border-radius:50%; flex:none; object-fit:cover; display:grid; place-items:center; font-size:9px; background:var(--surface); }
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-chip > span:not(.person-initial) { overflow:hidden; text-overflow:ellipsis; }
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-chip small { display:none; }
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-actions { display:flex; align-items:center; gap:8px; flex-shrink:0; min-height:44px; padding-top:8px; border-top:1px solid var(--line); }
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-main { margin-right:auto; font-size:12px; font-weight:700; color:var(--fg); display:inline-flex; align-items:center; gap:4px; min-height:34px; }
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-end { display:inline-flex; align-items:center; gap:10px; min-width:0; }
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-sec { font-size:12px; color:var(--fg); display:inline-flex; align-items:center; min-height:34px; background:none; border:0; padding:0; cursor:pointer; font-family:inherit; white-space:nowrap; }
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] :is(.mc-main,.mc-sec):hover { color:var(--orange); text-decoration:none; }
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-end [data-notes] { display:inline-flex; align-items:center; }
/* The comment control is the existing icon and its count, nothing around
   it. The global control rule above pads every button 12px !important and
   app.css draws .notes-open-btn as a bordered block, so both are undone
   here for the card footer only. */
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-end .notes-open-btn { display:inline-flex; align-items:center; gap:4px; width:auto; min-height:34px; min-width:0; padding:0 !important; border:0 !important; border-radius:0; background:transparent !important; box-shadow:none; color:var(--fg); font:inherit; font-size:12px; line-height:1; cursor:pointer; }
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-end .notes-open-btn:hover { color:var(--orange); background:transparent !important; }
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-sec.mc-rules { padding:0 !important; min-height:34px; min-width:0; }
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-end .notes-open-btn .cnt { display:inline-flex; }
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-end .notes-open-btn .cnt svg { width:15px; height:15px; }
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-end [data-role="count"] { display:inline; min-width:0; padding:0; border:0; background:transparent; color:inherit; font-size:12px; }
/* Cards without a side panel use the full width. */
html body .row.card[data-mc="quote"][data-mc] { display:flex !important; flex-direction:column; }
html body .row.card[data-mc="quote"][data-mc] > .mc-body { flex:1 1 auto; height:100%; }
/* Podcasts use the same split as articles and stories: the podcast panel
   left, the episode right. The older compact tile rules are undone here. */
html body .row.card[data-mc="podcast"][data-mc] { display:grid !important; grid-template-columns:28% minmax(0,1fr) !important; padding:0; }
html body .row.card[data-mc="podcast"][data-mc] > .row-media { width:auto; height:auto; min-height:0; border-radius:0; flex:initial; align-self:stretch; }
html body .row.card[data-mc="podcast"][data-mc] > .row-media .art-in { padding:0 12px; }
html body .row.card[data-mc="podcast"][data-mc] > .row-media .art-ic { width:44px; height:44px; }
html body .row.card[data-mc="podcast"][data-mc] > .row-media .art-lb { display:block; }
html body .row.card[data-mc="podcast"][data-mc] .mc-meta-stack { display:flex; flex-direction:column; gap:2px; min-width:0; flex:1 1 auto; }
html body .row.card[data-mc="podcast"][data-mc] .mc-tag a { font-size:11px; color:var(--fg-2); }
/* Quotation: the words first, attributed. */
html body .row[data-mc="quote"][data-mc] .mc-quote { margin:0; font-size:18px; line-height:1.4; color:var(--fg); display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:4; overflow:hidden; flex-shrink:0; }
html body .row[data-mc="quote"][data-mc] .mc-note { font-size:12px; color:var(--fg-2); }
/* Source record: the document panel. */
html body .row[data-mc="record"][data-mc] .mc-doc { --art:#687183; }
/* Video: the approved four across card, footer pinned. */
html body .vid[data-mc] { display:flex; flex-direction:column; }
html body .vid[data-mc] > .vid-body { flex:1 1 auto; padding:16px; gap:10px; }
html body .vid[data-mc] .mc-title { font-size:15.5px; line-height:1.35; font-weight:700; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; }
/* Prediction market: provider and time, question, price, chart. */
html body .mkc[data-mc] > .mc-body { flex:1 1 auto; }
html body .mkc[data-mc] .mc-title { font-size:17px; line-height:1.35; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; }
html body .mkc[data-mc] .mkc-lead { padding-bottom:0; flex-shrink:0; }
html body .mkc[data-mc] .mkc-chart { flex:0 1 auto; min-height:0; max-height:84px; overflow:hidden; }
.mc-rules-dialog .mc-rules-list { display:grid; gap:8px; margin:16px 0; }
.mc-rules-dialog .mc-rules-list > div { display:flex; gap:12px; }
.mc-rules-dialog dt { min-width:80px; color:var(--fg-2); }
.mc-rules-dialog dd { margin:0; }
/* A translation slot that holds only the "unavailable" notice is not context. */
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-context:has(.row-mt):not(:has(q)) { display:none; }
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-end [data-role="count"] { padding:0 !important; min-height:0 !important; height:auto; line-height:1; display:inline-flex; align-items:center; }
html body .mkc[data-mc] .mc-title q { quotes:none; }
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] :is(.mc-main,.mc-sec) { white-space:nowrap; }
@media (max-width:560px) {
  html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-actions { gap:6px; }
  html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-end { gap:6px; }
  html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] :is(.mc-main,.mc-sec,.mc-end .notes-open-btn) { font-size:11.5px; }
}
/* Paired perspectives: two equal panes, each person and source linked. */
html body article.cp[data-mc][data-mc] { display:flex; flex-direction:column; padding:0; height:360px; min-height:360px; max-height:360px; border-radius:10px; overflow:hidden; }
html body article.cp[data-mc][data-mc] > .mc-body { flex:1 1 auto; padding:18px; }
html body article.cp[data-mc][data-mc] .mc-title { font-size:18px; line-height:1.35; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; }
html body article.cp[data-mc][data-mc] .mc-pair { display:grid; grid-template-columns:1fr 1fr; gap:12px; flex:1 1 auto; min-height:0; }
html body article.cp[data-mc][data-mc] .mc-pane { display:flex; flex-direction:column; gap:8px; min-width:0; min-height:0; overflow:hidden; padding:12px; border-radius:8px; background:var(--sub); }
html body article.cp[data-mc][data-mc] .mc-pane .mc-chip { align-self:flex-start; background:var(--surface); }
html body article.cp[data-mc][data-mc] .mc-pos { margin:0; font-size:14px; line-height:1.4; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; overflow:hidden; }
html body article.cp[data-mc][data-mc] .mc-pos a { color:var(--fg); }
html body article.cp[data-mc][data-mc] :is(.mc-pane-meta,.mc-pane-tag,.img-credit) { font-size:11px; color:var(--fg-2); }
html body article.cp[data-mc][data-mc] .mc-pane-tag { margin-top:auto; }
html body article.cp[data-mc][data-mc] .mc-actions { margin-top:0; }
html body article.cp[data-mc][data-mc] :is(.mc-main,.mc-sec) { white-space:nowrap; }
@media (max-width:560px) { html body article.cp[data-mc][data-mc] { height:380px; min-height:380px; max-height:380px; } html body article.cp[data-mc][data-mc] .mc-pair { gap:8px; } html body article.cp[data-mc][data-mc] .mc-pane { padding:10px; } }
/* Headline comparison and quotation cards carry no side panel. */
html body .row.card[data-mc="drift"][data-mc] { display:flex !important; flex-direction:column; }
html body .row.card[data-mc="drift"][data-mc] > .mc-body { flex:1 1 auto; height:100%; }
/* Country of origin and translation, locked for every article card. */
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-flag { flex:none; display:inline-flex; align-items:center; height:18px; }
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-flag img { width:20px; height:15px; border-radius:2px; object-fit:cover; box-shadow:0 0 0 1px var(--line); }
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-disclaimer { flex-shrink:0; margin-top:-4px; font-size:11px; line-height:1.3; color:var(--fg-3); }
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc]:not(:has(.mc-context q)) .mc-disclaimer { display:none; }
/* Venue and organization marks: the shared logo, small and round. */
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-venue { flex:none; display:inline-flex; }
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-venue :is(img,.fav) { width:18px; height:18px; border-radius:50%; margin:0; object-fit:cover; }
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-chip .fav { width:18px; height:18px; margin:0; border-radius:4px; object-fit:contain; background:var(--surface); display:inline-grid; place-items:center; font-size:10px; }
/* Directory cards look the same in Search as on People and organizations. */
html body .who-card.srch-tile { align-items:stretch; text-align:left; }
html body .who-card.srch-tile > :is(.who-band,.profile-actions) { width:auto; align-self:stretch; }
html body .vid[data-mc][data-mc] .mc-meta-t { -webkit-line-clamp:1; }
/* Footer rhythm: the actions sit centred between the 1px stroke and the
   card's bottom edge, the same space above and below, on every type. */
html body .row.card[data-mc][data-mc] > .mc-body, html body article.cp[data-mc][data-mc] > .mc-body, html body .vid[data-mc][data-mc] > .vid-body { padding-bottom:0 !important; }
html body .mkc[data-mc][data-mc] { padding-bottom:0 !important; }
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-actions { padding:0 !important; min-height:52px; height:52px; align-items:center; margin-bottom:0; }
/* One row of relationship chips: a chip that does not fit wraps out of view
   whole, never cut; Related coverage lists every connection. */
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-links { max-height:28px; }
/* People and company marks are rounded squares, the same shape everywhere:
   chips, the market venue, paired perspectives. */
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-chip :is(img,.person-initial,.fav) { border-radius:5px; }
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-venue :is(img,.fav) { border-radius:5px; }
html body .feed .row.card[data-mc][data-mc] > .mc-body, html body .row.card[data-mc][data-mc] > .mc-body { gap:10px; }
/* Headline comparison panes: the same pane as paired perspectives. */
html body .row.card[data-mc="drift"][data-mc] .mc-pair { display:grid; grid-template-columns:1fr 1fr; gap:12px; flex:0 1 auto; min-height:0; }
html body .row.card[data-mc="drift"][data-mc] .mc-pane { display:flex; flex-direction:column; gap:6px; min-width:0; min-height:0; overflow:hidden; padding:12px; border-radius:8px; background:var(--sub); }
html body .row.card[data-mc="drift"][data-mc] .mc-pane-tag { font-size:11px; letter-spacing:.04em; text-transform:uppercase; color:var(--fg-2); }
html body .row.card[data-mc="drift"][data-mc] .mc-pos { margin:0; font-size:14px; line-height:1.4; color:var(--fg); display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; overflow:hidden; }
html body .row.card[data-mc="drift"][data-mc] .mc-pos mark { background:var(--hl); color:inherit; padding:0 1px; border-radius:2px; }

/* ---- Home page corrections ----------------------------------------------- */
/* The additional hero statistics are one compact, always visible row. */
html body .hero-more { margin:14px 0 0; }
html body .hero-stats.hero-stats-more { display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px 24px; margin:0; padding:0; border:0; }
html body .hero-stats-more .hs { display:flex; align-items:baseline; gap:8px; }
html body .hero-stats-more .hv { font-size:20px; line-height:1.2; }
html body .hero-stats-more .hk { font-size:12px; margin:0; }
/* "On this page", locked 28 September 2026 (Jeremy: one row only, nothing
   cut off, full span like the wire marquee, keep it sticky, keep the icons
   and use the whole width). The strip bleeds to the viewport edges like
   .hero-band .wire and its chips use that whole width, page gutter to page
   gutter, growing to fill it up to 260px each (a page with three chips
   keeps them at 260px, left aligned). Chips keep their icons whenever the row fits;
   when it would not, app.js adds .rail-compact, which drops the icons, and
   only if it still does not fit does the row scroll sideways, never wrap,
   with a fade at an edge that has more and the active chip scrolled into
   view. No "On this page" label and no counts: each chip is its icon and its
   section name (Jeremy: "counts aren't needed, just the icon and the
   section"). */
html body .rail { flex-wrap:nowrap; overflow-x:auto; overflow-y:hidden; max-width:none; width:calc(100vw - var(--sbw, 0px)); margin-left:calc((100% - 100vw + var(--sbw, 0px)) / 2); margin-right:0; box-sizing:border-box; gap:4px; padding-block:12px; padding-inline:var(--page-gutter, 24px); scroll-padding-inline:var(--page-gutter, 24px); }
html body .rail .rail-k, html body .rail .rail-n { display:none; }
/* app.css .thero + .rail zeroes the top padding, which put topic-page chips
   against the header stroke once the strip stuck. */
html body .thero + .rail { padding-top:12px; }
html body .rail a { flex:1 0 auto; max-width:260px; justify-content:center; padding:0 12px; gap:5px; }
html body .rail.rail-compact a > svg { display:none; }
html body .rail.rail-compact a { padding:0 11px; gap:0; }
html body .rail.rail-more-r { -webkit-mask-image:linear-gradient(to right, #000 calc(100% - 48px), transparent); mask-image:linear-gradient(to right, #000 calc(100% - 48px), transparent); }
html body .rail.rail-more-l { -webkit-mask-image:linear-gradient(to left, #000 calc(100% - 48px), transparent); mask-image:linear-gradient(to left, #000 calc(100% - 48px), transparent); }
html body .rail.rail-more-l.rail-more-r { -webkit-mask-image:linear-gradient(to right, transparent, #000 48px, #000 calc(100% - 48px), transparent); mask-image:linear-gradient(to right, transparent, #000 48px, #000 calc(100% - 48px), transparent); }
@media (max-width:760px) { html body .rail { position:relative; top:auto; } }
/* Tan strips read against the tan page at rest. Every view bar (the pager,
   the home View control, the topic view tools) is one strip: 12px inside on
   all four sides so its controls sit centred in it, rounded, no underline.
   Fixed 28 September 2026: the pager's tan fill had app.css's underline
   padding only, so its controls sat on the strip's top and side edges. */
html body :is(.visit-delta,.view-bar) { background:var(--tan-100); }
html[data-theme="dark"] body :is(.visit-delta,.view-bar) { background:var(--sub); }
html body .view-bar { padding:12px; border-bottom:0; border-radius:var(--r-ctl); }
/* The home View control: sizes, View all, and the count shown. */
html body .home-view-bar { display:flex; flex-wrap:wrap; gap:12px; align-items:center; margin-block:16px; }
html body .home-view-bar .vb-count { margin-left:auto; }
html body .hero-more { margin-top:22px; }
/* Section anchors clear the header and the sticky "On this page" rail. */
html body main section[id] { scroll-margin-top:calc(var(--livehead-h, 71px) + 120px); }
/* On phones a section's title takes the full width; its tools wrap below. */
@media (max-width:760px) { html body .ex-head { flex-wrap:wrap; } html body .ex-head > :first-child { flex:1 1 100%; min-width:0; } }
/* The meta line is one line (the story card keeps two beside Follow), so a
   long outlet name can never push the footer out of the card. */
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc]:not([data-mc="story"]) .mc-meta-t { -webkit-line-clamp:1; }
/* A directory card without a cleared portrait shows the person's initials in
   the same rounded square, never an empty shape. */
html body .who-card .portrait[data-initials]:not(.has) { display:grid; place-items:center; }
html body .who-card .portrait[data-initials]:not(.has)::after { content:attr(data-initials); font:700 18px/1 var(--head); color:var(--fg-2); }
/* People and companies share one mark shape on every surface: the rounded
   square (owner decision, 27 September 2026). Directory portraits, person
   heroes, paired perspectives and inline person links alike. */
html body .portrait { border-radius:var(--r-box); }
html body .portrait img { border-radius:inherit; }
html body :is(.person-inline img, .person-inline .person-initial, .srch-avatar, .srch-avatar img) { border-radius:5px; }
/* Company logos are the same size as people's avatars: the same tile, border
   and background in the directory, the same square in chips. */
html body .who-head .portrait:has(img.fav), html body .who-head .portrait:has(.fav-mark) { border:1px solid var(--line); background:var(--surface); border-radius:var(--r-box); }
html body .who-head .portrait img.fav { width:100%; height:100%; padding:6px; box-sizing:border-box; object-fit:contain; border-radius:inherit; }
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-chip .fav { width:22px; height:22px; }
html body .who-head .portrait img.fav { background:transparent; border:0; }
/* A portrait fills its stroked tile completely at every size: the photo is
   the tile, never a smaller picture parked in its corner. */
html body .portrait.has > img:not(.fav), html body .portrait.lg > img:not(.fav) { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; border-radius:inherit; }
/* Directory cards with their featured strips (content-ui.js featuredCards):
   one height for people, organizations and outlets, on every route. The
   header strip is one fixed height so the strips of cards side by side
   line up; Follow sits at its right. */
html body .who-card[data-profile-layout][data-featured] { height:444px !important; min-height:444px !important; max-height:444px !important; }
@media (max-width:560px) { html body .who-card[data-profile-layout][data-featured] { height:460px !important; min-height:460px !important; max-height:460px !important; } }
html body .who-card[data-profile-layout][data-featured] > .who-band { flex:none; box-sizing:border-box; height:132px; min-height:132px; max-height:132px; }
html body .who-card[data-profile-layout] .who-head > div:not(.portrait):not(.who-follow) { flex:1 1 auto; min-width:0; }
html body .who-card[data-profile-layout] .who-head h3 { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
html body .who-card[data-profile-layout] .who-kind .chip { padding:2px 6px !important; min-height:0 !important; line-height:1.4; }
html body .who-card[data-profile-layout] .who-head > .who-follow { flex:none; align-self:center; margin:0 0 0 auto; padding:0; float:none; position:static; }
@media (max-width:560px) {
  html body .who-card[data-profile-layout] .who-follow .my-btn { width:36px; min-width:36px; padding:0 !important; justify-content:center; }
  html body .who-card[data-profile-layout] .who-follow [data-label] { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
}
html body .who-card[data-featured] > .who-feature { flex:1 1 auto; min-height:0; overflow:hidden; display:flex; flex-direction:column; gap:0; padding:14px 18px 0; }
html body .who-card[data-featured] > .who-feature[hidden] { display:none; }
/* The count line sits in the middle of the space between the last strip
   and the footer stroke. */
html body .who-card[data-featured] .who-featured { margin:0; font-size:12px; line-height:1.4; color:var(--fg-2); flex:1 1 auto; min-height:17px; display:flex; align-items:center; }
html body :is(.who-card[data-featured] .who-feature, .lead-latest) .mini-list { display:flex; flex-direction:column; gap:6px; min-height:0; margin:0; }
html body :is(.who-card[data-featured] .who-feature, .lead-latest) .mini-row { flex:none; box-sizing:border-box; height:56px; align-items:center; background:var(--sub); border-color:var(--line-2); padding:0 12px; overflow:hidden; }
html body :is(.who-card[data-featured] .who-feature, .lead-latest) .mini-body { min-width:0; flex:1 1 auto; display:flex; flex-direction:column; gap:2px; }
html body :is(.who-card[data-featured] .who-feature, .lead-latest) .mini-title { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:1; overflow:hidden; }
html body :is(.who-card[data-featured] .who-feature, .lead-latest) .mini-meta { display:flex; align-items:center; gap:6px; min-width:0; overflow:hidden; }
html body :is(.who-card[data-featured] .who-feature, .lead-latest) .mini-date { flex:0 1 auto; font-size:11px; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
html body :is(.who-card[data-featured] .who-feature, .lead-latest) .mini-flag { flex:none; display:inline-flex; }
html body :is(.who-card[data-featured] .who-feature, .lead-latest) .mini-flag img { display:block; width:16px; height:12px; border-radius:2px; }
html body :is(.who-card[data-featured] .who-feature, .lead-latest) .mini-note { color:var(--fg-3); }
/* The lead call-out, locked 28 September 2026: the approved story card in
   the left column of the band's two column grid, and beside it the story's
   three newest reports from different outlets as the directory cards' micro
   strips, one height, the count line centred in the space left over. One
   column on narrow screens. No filter or sort over a single card. */
html body .lead-pair { display:grid; grid-template-columns:minmax(0,1fr); gap:var(--card-gap); align-items:stretch; }
@media (min-width:1000px) { html body .lead-pair:not(.solo) { grid-template-columns:repeat(2, minmax(0,1fr)); } }
html body .lead-pair > .feed { margin:0; min-width:0; }
html body .lead-latest { box-sizing:border-box; display:flex; flex-direction:column; min-width:0; min-height:0; overflow:hidden; padding:16px 18px 0; background:var(--surface); border:1px solid var(--line); border-radius:var(--r-box); }
html body .lead-latest > h3 { margin:0 0 12px; font-size:13px; line-height:1.3; font-weight:600; letter-spacing:.02em; color:var(--fg-2); }
/* The count line takes all the space from the last strip down to the
   panel's bottom border and centres its text in it (the panel has no bottom
   padding for exactly this). 44px at least, so it breathes on phones. */
html body .lead-latest > .mini-count { margin:0; flex:1 0 auto; min-height:44px; display:flex; align-items:center; font-size:12px; line-height:1.4; color:var(--fg-2); }
/* The footer's actions carry no box of their own, button or link alike,
   and one count size. */
html body .profile-actions > :is(a, button), html body .profile-actions .notes-open-btn { padding:0 !important; }
/* The comment count matches the media cards' footer: 12px, weight 600,
   4px after the icon, whichever control draws it. */
html body .profile-actions :is(.wc-discuss, .notes-open-btn) { gap:4px; }
html body .profile-actions :is(.wc-discuss .num, [data-role="count"]) { font-size:12px; font-weight:600; padding:0 !important; min-width:0 !important; min-height:0 !important; border:0; background:none; color:inherit; line-height:1; }
/* Phone gutters, set by the owner on 28 September 2026: 10px left and right
   on every page at phone widths, the header included. Full bleed bands keep
   their bleed; only the space before their content changes. */
@media (max-width:760px) {
  :root { --page-gutter:10px; --content-card-width:calc(100vw - 20px); }
  html body .wrap, html body .wrap.wide { padding-inline:10px; }
  html body .livehead .in { padding-left:10px; padding-right:10px; }
  html body :is(.hero, .hero-band, .thero, .top-band) { padding-left:10px; padding-right:10px; }
}
/* Paciva research cards (topics page, topic pages): hover never switches to
   a fixed palette colour. The old hover painted the light tan behind light
   text in the dark theme. Theme tokens only: the border takes the link
   colour and the title follows it. */
html body .report-card:hover { background:var(--sub); border-color:color-mix(in srgb, var(--link) 40%, var(--line)); color:var(--fg); text-decoration:none; }
html body .report-card:hover h3 { color:var(--link); }
/* The discussion bar sits one to two shades darker than whatever it sits on,
   in both themes (owner, 28 September 2026), so it reads as a bar and not as
   a gap. A translucent dark layer does that on any background. */
html body details.notes > summary { background:rgba(13,19,33,.045); border-color:var(--line); }
html[data-theme="dark"] body details.notes > summary { background:rgba(0,0,0,.5); }
html body details.notes > summary:hover, html body details.notes[open] > summary { background:var(--sub); }
html body .vid details.notes > summary { background:transparent; border-color:transparent; }
/* Videos page: a day in the strip and a channel in the bars filter the
   archive, and the chosen one is marked. */
html body [data-video-channels] .hb { cursor:pointer; }
html body [data-video-channels] .hb.on { outline:2px solid var(--link); outline-offset:1px; border-radius:6px; }
/* Per day counts as a compact bar chart (owner, 28 September 2026), on the
   podcasts page, the home podcasts section and the videos page. One column
   per day with no gap, so any number of days fits any width; the fill is
   inset inside its column, grows in with the section and turns the link
   colour on hover, focus or selection. An empty day shows a 2px base. */
html body .daybars { display:grid; grid-auto-flow:column; grid-auto-columns:minmax(0,1fr); align-items:stretch; height:80px; margin:0; border-bottom:1px solid var(--line); }
html body .daybars .daybar { position:relative; display:block; min-width:0; }
html body .daybars .daybar::before { content:""; position:absolute; left:12%; right:12%; bottom:0; height:max(var(--h, 0%), 2px); background:var(--s-voice); border-radius:2px 2px 0 0; transform:scaleY(0); transform-origin:bottom; transition:transform 500ms var(--ease) var(--d, 0ms); }
html body .daybars .daybar.zero::before { background:var(--line); }
html body :is([data-ex].on, .panel) .daybars .daybar::before { transform:scaleY(1); }
html body .daybars .daybar[role="button"] { cursor:pointer; }
html body .daybars .daybar:is(:hover, :focus-visible, .on)::before { background:var(--link); }
html body .daybars .daybar:focus-visible { outline:none; }
@media (prefers-reduced-motion: reduce) { html body .daybars .daybar::before { transform:none; transition:none; } }

/* Hover inside the dark hero band. The band keeps a dark ground in the light
   theme, where --sub is a light tan, so a hovered row there turned light with
   light text on it. A translucent light layer reads on the band in both
   themes (Jeremy, 28 September 2026). */
html body .hero-band :is(.ch-hb-row.drillable, .tl):is(:hover, :focus-visible) { background:rgba(255,255,255,.08); color:inherit; }

/* What's new: the newest headline strips sit one to two shades darker than
   their card, drawn the way the discussion bar is (a translucent dark layer),
   because the card itself is already var(--sub) and a --sub strip vanished
   into it (Jeremy, 28 September 2026). Hover returns to the card's own tone. */
html body .whats-new .mini-row { background:rgba(13,19,33,.045); border-color:var(--line-2); }
html[data-theme="dark"] body .whats-new .mini-row { background:rgba(0,0,0,.35); }
html body .whats-new .mini-row:is(:hover, :focus-visible) { background:var(--surface); }

/* Hero sub text wraps at two thirds of the hero's width on every hero banner,
   the lede and the disclosure lines alike; titles and statistics keep the
   full width. Phones use the full width. Jeremy, 28 September 2026: "wrap
   all hero banners sub text at 2/3 width". */
html body main :is(.hero, .thero) :is(.desc, .hero-disclose, .hero-depth, .thero-latest) { max-width:calc(100% * 2 / 3); }
@media (max-width:760px) { html body main :is(.hero, .thero) :is(.desc, .hero-disclose, .hero-depth, .thero-latest) { max-width:none; } }

/* "On this page" on phones bleeds to the 10px gutter, not the old 16px one
   (app.css), which put its stroke 6px off screen on the left. */
/* Phones: the full-bleed strip above already reaches both edges; the chips
   keep the 10px gutter (--page-gutter). */

/* J, 28 September 2026. A pager belongs to the list it follows: when that  */
/* list is a hidden tab panel (who.html's organizations and outlets), its   */
/* strip is hidden with it, so the page shows one pager, not three.         */
[hidden] + .pg-host { display:none; }

/* Prediction market cards: the outcome bars fill on every surface, not     */
/* only inside a home section that has scrolled into view.                  */
html body .mkc .mk-bars .hb-t i { width: var(--w); }
html body [data-ex]:not(.on) .mkc .mk-bars .hb-t i { width: 0; }

/* Relationship chips: company logos 55 per cent larger (22px to 34px),     */
/* drawn from the 256px logo source (rights.js logoFor) so they stay sharp  */
/* on high density screens. Only company logos change; portraits keep     */
/* their size.                                                              */
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-chip .fav { width:34px; height:34px; font-size:12px; }
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-chip .fav { padding:2px; box-sizing:border-box; }
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-chip:has(> .fav) { min-height:40px; padding:3px 10px 3px 3px; gap:8px; }
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-links { max-height:40px; }
/* Every chip is one height (40px) whatever mark it carries, so the row's
   40px clip shows one whole row and never the top of a second one. Person
   marks match the company logo at 34px. */
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-chip { min-height:40px; padding:3px 10px 3px 3px; gap:8px; box-sizing:border-box; }
html body :is(.row,.vid,.mkc,.cp)[data-mc][data-mc] .mc-chip :is(img,.person-initial) { width:34px; height:34px; font-size:12px; }

/* People tab spacing: one 24px rhythm from the tabs to the first card. The */
/* note under the sort row no longer touches it, and the gap above "Add a   */
/* person" matches the rest.                                               */
html body .who-tools { margin-top:24px; row-gap:16px; }
html body .who-tools > .collection-toolbar { margin-bottom:0; }
html body #people-rule { margin:24px 0 16px; }
html body .who-grid > .suggest-cta { margin-top:0; }

/* Market outcome chart: rows start at the top and the box is exactly three */
/* rows tall (20px rows, 7px gaps), so a row is either shown whole or not   */
/* at all. It was centred in a shorter box, which cut the third row in half.*/
html body .mk-grid .mkc[data-mc] .mkc-chart:has(> .mk-bars), html body .mkc[data-mc] .mkc-chart:has(> .mk-bars) { flex:none; display:block; height:auto; min-height:0; max-height:74px; }

/* AI company pages: the hero copy takes the row beside its actions, like  */
/* every other hero, and each group of people or companies sits under its  */
/* own small label with one gap between groups.                            */
html body [data-company-hero] { flex:1 1 auto; min-width:0; }
html body .company-group + .company-group { margin-top:16px; }
html body .company-group > .k { margin-bottom:8px; }

/* Announcement bar, the first line of the header on every page. A dark    */
/* band with the brand orange, one strong line and a call to action, tall  */
/* enough to read as a launch. Dismissing it removes it for good in this   */
/* browser.                                                                */
html body .announce { background:linear-gradient(90deg,#0d1321 0%,#1a2540 55%,#2b1a12 100%); color:#fff; border-bottom:1px solid rgba(255,255,255,.1); }
html body .announce-in { position:relative; display:flex; align-items:center; justify-content:center; gap:12px; min-height:40px; padding:4px 56px; box-sizing:border-box; font-size:14px; line-height:1.3; text-align:center; flex-wrap:nowrap; white-space:nowrap; overflow:hidden; }
html body .announce-tag { flex:none; padding:3px 8px; border-radius:var(--r-ctl, 6px); background:#f15a29; color:#fff; font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
html body .announce-link { color:#fff; text-decoration:none; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
html body .announce-link strong { font-weight:800; margin-right:6px; }
html body .announce-cta { display:inline-block; margin-left:12px; padding:4px 12px; border-radius:var(--r-ctl, 6px); background:#fff; color:#0d1321; font-weight:700; font-size:13.5px; white-space:nowrap; }
html body .announce-link:hover .announce-cta { background:#f15a29; color:#fff; }
html body .announce-x { position:absolute; right:12px; top:50%; transform:translateY(-50%); width:32px; height:32px; border:0; border-radius:8px; background:rgba(255,255,255,.1); color:#fff; font-size:20px; line-height:1; cursor:pointer; }
html body .announce-x:hover { background:rgba(255,255,255,.2); }
@media (max-width:760px) { html body .announce-in { justify-content:flex-start; text-align:left; padding:4px 48px 4px 10px; font-size:13px; } html body .announce-cta { margin-left:10px; } }

/* Chips never touch: every chip row carries one 8px gap.                 */
html body .chips { display:flex; flex-wrap:wrap; gap:8px; }
/* Funding, revenue and investors span the full content width.             */
html body #funding .company-bars, html body .company-summary { max-width:none; }
/* Social chips carry the network's mark and open in a new window.         */
html body .social-chip svg { width:14px; height:14px; margin-right:6px; }

/* AI company page, L. The category is a row in the facts list, never a    */
/* chip under the name in the hero; the summary leads the facts; key people */
/* are portrait cards (a silhouette when no cleared portrait exists); social */
/* channels are chips; the Commons logo fills its tile without distortion.  */
html body .entity-hero-logo .company-logo { width:100%; height:100%; object-fit:contain; padding:10px; box-sizing:border-box; background:#fff; border-radius:inherit; margin:0; }
html body .company-summary { max-width:880px; margin:0 0 20px; }
html body .company-summary p:first-child { font-size:17px; line-height:1.6; margin:0 0 6px; }
html body .company-facts .chips { display:flex; flex-wrap:wrap; gap:8px; }
html body .social-chip { text-transform:none; letter-spacing:0; font-weight:600; }
html body .person-tiles { display:grid; grid-template-columns:repeat(auto-fill, minmax(280px, 1fr)); gap:12px; }
html body .person-tile { display:flex; align-items:center; gap:14px; min-height:84px; padding:12px 14px; box-sizing:border-box; border:1px solid var(--line); border-radius:10px; background:var(--surface); color:var(--fg); text-decoration:none; }
html body .person-tile:hover { background:var(--sub); text-decoration:none; }
html body .pt-photo { position:relative; flex:none; width:56px; height:56px; border-radius:5px; overflow:hidden; background:var(--sub); color:var(--fg-3); display:grid; place-items:center; }
html body .pt-photo img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
html body .pt-photo.has .pt-sil { visibility:hidden; }
html body .pt-body { min-width:0; display:flex; flex-direction:column; gap:2px; }
html body .pt-name { font-weight:700; font-size:15px; line-height:1.3; }
html body .pt-role { font-size:11px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--link, #36539f); }
html body .pt-desc { font-size:12.5px; line-height:1.35; color:var(--fg-2); display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; }
html body .img-credits { margin-top:14px; }
html body .img-credits summary { cursor:pointer; font-size:12px; color:var(--fg-2); }
html body #funding h3 { margin:18px 0 10px; }
html body #funding h3:first-child { margin-top:0; }
html body .company-bars { max-width:880px; }
html body .company-bars .hb-t i { background:var(--mk-lead, #36539f); }

/* Hero titles balance their lines on every hero, the person page header   */
/* included (.person-lede never matched the old selector), and titles are  */
/* 30px on phones (Slack Rec0C4KRPKY06).                                   */
html body :is(.hero, .thero, .lede, .person-lede) h1 { text-wrap: balance; }
@media (max-width:760px) { html body :is(.hero, .thero, .lede, .person-lede) h1 { font-size:30px; line-height:1.15; } }

/* The Contribute launcher and its menu sit on the left (Jeremy, 29        */
/* September 2026), leaving the right for the search assistant.            */
html body #contrib-btn { right:auto; left:20px; }
html body .contrib-menu { right:auto; left:20px; }
html body:has(#contrib-btn) .i18n-pill { bottom: calc(18px + env(safe-area-inset-bottom)); }
html body:has(.cookie:not([hidden])):has(#contrib-btn) .i18n-pill { bottom: calc(var(--cookie-h, 150px) + 16px + env(safe-area-inset-bottom)); }

/* AI company directory (Jeremy, 30 September 2026: "a tight 3 or 4 across  */
/* grid with the logo, the number of people, the number of articles, the     */
/* category"). One row of controls, then 4 tiles across at 1280 and above,   */
/* 3 from 1000, 2 from 600, 1 below. Tiles are equal height and pin their   */
/* facts row to the bottom at the container. Drawn by companies-view.js.     */
html body .co-controls { display:flex; flex-wrap:wrap; align-items:center; gap:var(--control-gap); margin:0 0 16px; }
html body .co-controls .co-search { display:flex; align-items:center; gap:8px; flex:1 1 340px; min-width:0; height:44px; padding:0 12px; box-sizing:border-box; border:1px solid var(--line); border-radius:var(--r-ctl); background:var(--surface); cursor:text; transition:border-color 120ms var(--ease, ease); }
html body .co-controls .co-search svg { flex:none; color:var(--fg-3); }
html body .co-controls .co-search input { flex:1; min-width:0; height:100%; padding:0; border:0; background:transparent; color:var(--fg); font:600 15px/1.3 var(--body); }
html body .co-controls .co-search input::placeholder { color:var(--fg-3); font-weight:500; }
html body .co-controls .co-search input:focus { outline:0; }
html body .co-controls .co-sel { flex:0 1 140px; min-width:0; display:block; }
html body .co-controls select { width:100%; min-width:0; height:44px; min-height:44px; padding:0 12px; box-sizing:border-box; border:1px solid var(--line); border-radius:var(--r-ctl); background:var(--surface); color:var(--fg); font:500 14px/1.3 var(--body); text-overflow:ellipsis; }
html body .co-controls select:focus-visible, html body .co-controls .co-search:focus-within { border-color:var(--info, var(--fg)); outline:0; }
html body .co-controls .co-clear { flex:none; }
html body .co-count { margin:0 0 16px; }
html body .co-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; align-items:stretch; margin:0; }
html body .co-tile { display:flex; flex-direction:column; gap:12px; min-width:0; padding:16px; box-sizing:border-box; border:1px solid var(--line); border-radius:var(--r-box); background:var(--surface); }
html body .co-top { display:flex; align-items:center; gap:12px; min-width:0; }
html body .co-logo { flex:none; display:flex; align-items:center; justify-content:center; width:44px; height:44px; overflow:hidden; border:1px solid var(--line); border-radius:5px; background:var(--surface); }
html body .co-logo img.fav { display:block; width:100%; height:100%; margin:0; padding:6px; box-sizing:border-box; object-fit:contain; border:0; border-radius:inherit; background:transparent; }
html body .co-logo .fav-mark { width:100%; height:100%; margin:0; border-radius:inherit; font:700 20px/1 var(--head); }
html body .co-id { min-width:0; flex:1 1 auto; }
html body .co-name { margin:0; font:700 16px/1.25 var(--head); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
html body .co-name a { color:var(--fg); text-decoration:none; }
html body .co-name a:hover, html body .co-name a:focus-visible { color:var(--link); text-decoration:underline; }
html body .co-place { margin:2px 0 0; min-height:18px; font:400 13px/18px var(--body); color:var(--fg-2); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
html body .co-cats { display:flex; flex-wrap:wrap; gap:6px; height:24px; overflow:hidden; }
html body .co-chip { display:inline-flex; align-items:center; min-height:24px; padding:0 8px; border:1px solid transparent; border-radius:5px; background:var(--tan-50, var(--sub)); color:var(--fg-2); font:600 11.5px/1 var(--body); white-space:nowrap; }
html[data-theme="dark"] body .co-chip { background:var(--sub); }
html body .co-facts { display:flex; gap:8px; margin:auto 0 0; padding:12px 0 0; border-top:1px solid var(--line); }
html body .co-fact { display:flex; flex-direction:column-reverse; justify-content:flex-end; gap:2px; min-width:min-content; flex:1 1 0; }
html body .co-fact dt { margin:0; min-height:27px; font:600 11px/13.5px var(--body); color:var(--fg-3); }
html body .co-fact dd { margin:0; font:700 15px/1.2 var(--head); color:var(--fg); white-space:nowrap; }
@media (max-width:1279px) { html body .co-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:999px) { html body .co-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:1279px) { html body .co-controls .co-search { flex:1 1 100%; } html body .co-controls .co-sel { flex-grow:1; } }
@media (max-width:599px) {
  html body .co-grid { grid-template-columns:minmax(0,1fr); }
  html body .co-controls .co-sel { flex:1 1 calc(50% - 6px); }
  html body .co-controls .co-clear { flex:1 1 100%; }
}
html body .company-bars .hb { display:grid; grid-template-columns:130px minmax(0,1fr) 128px; gap:14px; align-items:center; min-height:26px; }
html body .company-bars .hb b { text-align:right; white-space:nowrap; }
@media (max-width:760px) { html body .company-bars .hb { grid-template-columns:92px minmax(0,1fr) 104px; gap:8px; font-size:12.5px; } }

/* Home hero, Monitor 2026-09-29 R (Jeremy, 29 September 2026: mocks approved).
   Title, live claim, search, a data driven Try line, a "Right now" strip of
   four equal height tiles, then the stats row. The mosaic fades to the page
   background by 60 percent of the hero's height. No pill or chip shape here:
   the Try examples are plain underlined links and every mark is a 5px
   rounded square. Tiles carry the same padding on all four sides and the
   eyebrow sits flush left with its icon. */
html body .hero-veil { background: linear-gradient(180deg, rgba(13,19,33,.04) 0%, rgba(13,19,33,.55) 35%, #0d1321 60%, #0d1321 100%); }
html body .hero-copy { max-width: none; }
html body .hero .hn-claim { font-size: 20px; line-height: 1.35; margin: 18px 0 0; color: var(--hero-fg); max-width: 66%; }
html body .hero .hn-claim2 { font-size: 15px; line-height: 1.4; margin: 6px 0 0; color: var(--hero-fg2); max-width: 66%; }
html body .hero .hn-search { display: flex; align-items: center; gap: 12px; max-width: 760px; height: 54px; margin: 26px 0 10px; padding: 0 16px; box-sizing: border-box; border: 1px solid rgba(255,255,255,.22); border-radius: var(--r-ctl, 8px); background: rgba(255,255,255,.07); color: var(--hero-fg); }
html body .hero .hn-search:focus-within { border-color: rgba(255,255,255,.5); }
html body .hero .hn-search svg { flex: none; opacity: .8; }
html body .hero .hn-search input { flex: 1; min-width: 0; background: none; border: 0; outline: 0; color: inherit; font: inherit; font-size: 17px; }
html body .hero .hn-search input::placeholder { color: var(--hero-fg2); }
html body .hero .hn-try { font-size: 14px; margin: 0; color: var(--hero-fg2); }
html body .hero .hn-try a { color: var(--hero-fg); text-decoration: underline; text-underline-offset: 3px; margin-right: 16px; }
html body .hero .hn-nowh { margin: 30px 0 12px; }
html body .hero .hn-nowh { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px 16px; }
html body .hero .hn-nowh .hn-pulse { color: var(--hero-fg); font: 600 13px/1.2 var(--body); letter-spacing: 0; text-transform: none; text-decoration: underline; text-underline-offset: 3px; }
html body .hero .hn-now { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; align-items: stretch; }
html body .hero .hn-tile { display: flex; flex-direction: column; min-width: 0; min-height: 168px; padding: 18px; box-sizing: border-box; border: 1px solid rgba(255,255,255,.16); border-radius: var(--r-box, 10px); background: rgba(255,255,255,.07); color: var(--hero-fg); text-decoration: none; }
html body .hero .hn-tile:hover { background: rgba(255,255,255,.11); }
html body .hero .hn-k { display: flex; align-items: center; gap: 8px; margin: 0 0 14px; padding: 0; min-height: 0; border: 0; font: 600 11px/1.2 var(--body); letter-spacing: .12em; text-transform: uppercase; color: var(--hero-fg2); white-space: normal; }
html body .hero .hn-k svg { flex: none; }
html body .hero .hn-t { font-size: 16px; line-height: 1.3; font-weight: 600; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
html body .hero .hn-m { margin-top: auto; padding-top: 12px; font-size: 13px; color: var(--hero-fg2); }
html body .hero .hn-s { font-size: 13px; font-weight: 500; color: var(--hero-fg2); }
html body .hero .hn-who { display: flex; align-items: center; gap: 12px; margin: 0 0 10px; }
html body .hero .hn-initial { font: 700 22px/1 var(--head); color: #0d1321; }
html body .hero .hn-big { font-family: var(--head); font-weight: 700; font-size: 30px; line-height: 1; margin: 0 0 4px; font-variant-numeric: tabular-nums; }
html body .hero .hn-bar { height: 6px; margin-top: 10px; background: rgba(255,255,255,.18); overflow: hidden; }
html body .hero .hn-bar i { display: block; height: 100%; background: var(--orange); }
html body .hero .hero-copy-stats .hero-stats { max-width: none; }
@media (max-width: 999px) { html body .hero .hn-now { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) { html body .hero .hn-claim, html body .hero .hn-claim2 { max-width: 100%; } html body .hero .hn-search { height: 48px; } html body .hero .hn-try a { margin-right: 12px; } }
@media (max-width: 480px) { html body .hero .hn-now { grid-template-columns: minmax(0, 1fr); } }

/* Hero alignment, Jeremy, 29 September 2026: hero elements are top aligned,
   never bottom aligned, on every hero; the description sits 25px under the
   title, on every page. The topic and section heroes (.thero-top) and the
   home hero grid both aligned their columns to the bottom edge before. */
html body .hero { justify-content: flex-start; }
html body .hero-in { align-items: start; }
html body .thero-top { align-items: flex-start; }
html body .hero .desc, html body .thero .desc, html body .hero .hn-claim { margin-top: 25px; }

/* Person record pages (/person-<slug> from the company records), Monitor
   2026-09-29 U. The hero mark is the same 96px rounded square the company
   hero uses; a portrait fills it edge to edge. A company drawn as a person
   tile carries its publisher mark in the photo slot. */
html body .entity-hero-logo.pr-portrait { overflow: hidden; }

/* Section hero featured cards, Monitor 2026-09-29 U. Every section hero
   carries one data chosen card in the right column beside its copy
   (scripts/section-hero-view.js draws it for the build and the repaint). The
   card is 10px, its mark 5px; nothing here is a pill. */
html body .thero-top { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 28px; align-items: start; }
html body .thero-top > .thero-acts { grid-column: 1 / -1; }
html body .thero-copy .thero-acts { margin-top: 18px; }
html body .sf-card { display: flex; flex-direction: column; min-width: 0; min-height: 200px; padding: 18px; box-sizing: border-box; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.16); border-radius: 10px; color: inherit; text-decoration: none; }
html body .sf-card:hover { background: rgba(255,255,255,.11); text-decoration: none; color: inherit; }
html body .sf-k { display: flex; align-items: center; gap: 8px; margin: 0 0 15px; font: 600 11px/1.2 var(--body); letter-spacing: .12em; text-transform: uppercase; opacity: .75; }
html body .sf-h { display: flex; align-items: center; gap: 12px; margin: 0 0 10px; }
html body .sf-name { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; min-width: 0; flex: 1; }
html body .sf-name b { font-size: 22px; font-weight: 700; line-height: 1.1; }
html body .sf-name span { font-size: 12.5px; opacity: .7; text-align: right; }
html body .sf-nums { display: flex; flex-wrap: wrap; gap: 8px 24px; margin: 2px 0 12px; }
html body .sf-nums b { display: block; font-family: var(--head); font-size: 26px; font-weight: 700; line-height: 1; font-variant-numeric: tabular-nums; }
html body .sf-nums span { font-size: 12.5px; opacity: .7; }
html body .sf-hl { margin: 0 0 12px; font-size: 14.5px; line-height: 1.35; font-weight: 600; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
html body .sf-bar { height: 6px; margin: 0 0 4px; background: rgba(255,255,255,.18); overflow: hidden; }
html body .sf-bar i { display: block; height: 100%; background: var(--orange); }
html body .sf-m { margin-top: auto; padding-top: 12px; display: flex; justify-content: space-between; gap: 12px; font-size: 13px; opacity: .85; }
html body .sf-m span { min-width: 0; opacity: .85; }
html body .sf-m u { flex: 0 0 auto; text-decoration: none; color: #fff; font-weight: 600; }
html body .sf-panel .k { display: flex; align-items: center; gap: 8px; }
html body .sf-mv, html body .sf-catlist { list-style: none; margin: 0; padding: 0; font-size: 14px; }
html body .sf-mv li { display: grid; grid-template-columns: 20px minmax(0, 1fr) auto auto; gap: 10px; align-items: center; padding: 7px 0; border-top: 1px solid rgba(255,255,255,.1); }
html body .sf-mv li:first-child { border-top: 0; padding-top: 0; }
html body .sf-mv a { color: inherit; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html body .sf-ar { font-weight: 700; color: var(--orange); text-align: center; }
html body .sf-ar.dn { color: #8fa3d9; }
html body .sf-n { font-variant-numeric: tabular-nums; opacity: .85; }
html body .sf-x { font-variant-numeric: tabular-nums; font-weight: 600; }
html body .sf-catlist { columns: 2; column-gap: 20px; line-height: 1.9; }
html body .sf-catlist li { display: flex; justify-content: space-between; gap: 8px; break-inside: avoid; white-space: nowrap; }
html body .sf-catlist li > :first-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
html body .sf-map { display: block; width: 100%; height: auto; }
html body .sf-land { fill: rgba(255,255,255,.12); stroke: rgba(255,255,255,.18); stroke-width: .6; }
html body .sf-dot { fill: var(--orange); fill-opacity: .55; stroke: var(--orange); stroke-width: 1; }
html body .sf-weeks { display: block; width: 100%; height: auto; }
html body .sf-wk { fill: var(--orange); }
html body .sf-wk.arch { fill: rgba(255,255,255,.28); }
@media (max-width: 999px) { html body .thero-top { grid-template-columns: minmax(0, 1fr); } }

/* Mark boxes, one rule for every square mark on the site (Jeremy, 29
   September 2026: logos uniform with avatars, centred and middled, always on
   white, 6px inner padding). 56px box, 5px corners, white in both themes,
   6px padding, content centred. A logo is drawn by fav() with the transform
   Rights.logoFit() measured for it, so its ink fills the padded area; a
   portrait covers the padded area. Home hero tiles, section featured cards,
   person tiles and the person page hero share this; nothing redeclares it. */
html body .hn-mark, html body .sf-mark, html body .cf-mark, html body .pt-photo, html body .pt-photo.pt-org { position: relative; flex: 0 0 56px; width: 56px; height: 56px; box-sizing: border-box; padding: 6px; margin: 0; border-radius: 5px; overflow: hidden; background: #fff; color: #0d1321; display: flex; align-items: center; justify-content: center; }
html body .hn-mark img, html body .sf-mark img, html body .cf-mark img, html body .pt-photo img, html body .hn-mark .fav, html body .sf-mark .fav, html body .pt-photo .fav, html body .entity-hero-logo .fav { position: static; inset: auto; width: 100%; height: 100%; margin: 0; flex: none; background: transparent; object-fit: contain; display: block; border-radius: 0; }
/* A person's avatar fills its box entirely (Jeremy, 29 September 2026:
   "People AVATARS should totally fill"): no inner padding, cover. */
html body .hn-face, html body .sf-face, html body .pt-photo.has:not(.pt-org), html body .entity-hero-logo.pr-portrait.has { padding: 0; }
html body .hn-face img, html body .sf-face img, html body .pt-photo:not(.pt-org) img, html body .entity-hero-logo.pr-portrait img { object-fit: cover; border-radius: 0; }
html body .hn-mark .fav-mark, html body .sf-mark .fav-mark, html body .hn-initial, html body .sf-initial, html body .pt-photo .pt-sil { display: flex; align-items: center; justify-content: center; font: 700 22px/1 var(--head); color: #0d1321; }
html body .pt-photo.has .pt-sil { display: none; }
html body .entity-hero-logo { box-sizing: border-box; padding: 8px; background: #fff; display: inline-flex; align-items: center; justify-content: center; }
html body .entity-hero-logo img, html body .entity-hero-logo .fav { width: 100%; height: 100%; object-fit: contain; display: block; }

/* Person pages, Monitor 2026-09-29 V. One hierarchy for the record page and
   the roster page (approved by the owner, who called the earlier layout thin,
   poorly laid out and boring): hero with a featured card, Why now, What they
   said, Where they are named, Connections, then the rest. No pill or chip
   shape: a statement's topics and the topic filter are plain words joined by
   " · ", a company or person is a tile with the 5px mark from "Mark boxes". */
html body .pn-feature { min-width: 0; }
html body .pn-feature:empty { display: none; }
html body .sf-role { -webkit-line-clamp: 3; font-size: 20px; line-height: 1.25; }
html body .pn-counts { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 14px 28px; margin: 4px 0 18px; }
html body .pn-counts b { display: block; font-family: var(--head); font-size: 30px; font-weight: 700; line-height: 1.1; font-variant-numeric: tabular-nums; }
html body .pn-counts span { display: block; margin-top: 4px; font-size: 13px; line-height: 1.35; color: var(--fg-2); }
html body .pn-outlets { margin: 0 0 22px; font-size: 13.5px; line-height: 1.7; color: var(--fg-2); }
html body .pn-outlets a { color: var(--fg); font-weight: 600; }
html body .pn-newest { margin-top: 4px; }
html body .pn-conn { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; align-items: stretch; }
html body .pn-group { display: flex; flex-direction: column; min-width: 0; }
html body .pn-group h3 { margin: 0 0 14px; }
html body .pn-sub { margin: 22px 0 8px; font-size: 13px; font-weight: 700; color: var(--fg-2); }
html body .pn-conn .person-tiles { grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); grid-auto-rows: 96px; }
html body .pn-conn .person-tile { height: 96px; min-height: 0; overflow: hidden; }
html body .pn-conn .pt-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html body .pn-conn .pt-role { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
@media (max-width: 999px) { html body .pn-conn { grid-template-columns: minmax(0, 1fr); } }
html body .tl-tags { color: var(--fg-2); font-size: 12.5px; }
html body .tl-tag { color: inherit; text-decoration: none; }
html body .tl-tag:hover { color: var(--fg); text-decoration: underline; }
html body .tl-sep { color: var(--fg-3); }
html body .tl-side { font-weight: 600; font-size: 12px; color: var(--fg-2); }
html body .tl-side.side-warning { color: #ac0000; }
html body .tl-side.side-pushback { color: #36539f; }
html body .tl-side.side-regulation { color: #8a6100; }
html body .tl-warn { display: inline-flex; align-items: center; gap: 4px; color: #8a6100; font-size: 11px; }
html body .tl-filters { margin: 16px 0 6px; display: flex; flex-wrap: wrap; align-items: center; gap: 0 2px; line-height: 2.2; }
html body .tl-filter { display: inline; padding: 0 2px; border: 0; background: none; color: var(--fg-2); font: 600 13px/1.6 var(--body); cursor: pointer; }
html body .tl-filter .num { color: var(--fg-3); font-weight: 600; }
html body .tl-filter:hover { color: var(--fg); }
html body .tl-filter.on { color: var(--fg); text-decoration: underline; text-underline-offset: 5px; text-decoration-thickness: 2px; }
html body .tls-key i { border-radius: 2px; }
html body .sf-card .sf-mt { margin: -6px 0 12px; font-size: 11px; line-height: 1.3; opacity: .7; }
html body .pn-count { margin: 10px 0 0; }
/* The portrait's image credit sits directly under the portrait, inside the
   hero title's box, in the 25px between title and description. */
html body .person-hero h1 { position: relative; }
html body .person-hero h1 .pr-credit { position: absolute; left: 0; top: 100%; margin-top: 5px; font: 400 11px/1 var(--body); letter-spacing: 0; word-spacing: 0; text-transform: none; white-space: nowrap; }

/* Hover on the dark topic heroes. The rule above for .hero-band left the
   .thero cards (topics, every topic page, companies, podcasts, markets) on
   the old --sub hover, which in the light theme is a tan layer under white
   text (Jeremy, 29 September 2026: "regressed"). One translucent light layer
   on every dark ground, both themes. */
html body :is(.hero-band, .thero) :is(.ch-hb-row.drillable, .tl, .mini-row):is(:hover, :focus-visible) { background:rgba(255,255,255,.08); color:inherit; }
html body :is(.hero-band, .thero) :is(.ch-hb-row.drillable, .tl, .mini-row):is(:hover, :focus-visible) :is(.ch-hb-name, .ch-hb-n, .tl-t, .mini-title) { color:inherit; }

/* Other categories on a card: mini chips in the body, each in its own
   category colour and glyph from Rights.topicChips, linking to the topic. */
html body .mc-topics { display:flex; flex-wrap:wrap; gap:6px; margin:6px 0 0; }
html body .tchip { display:inline-flex; align-items:center; gap:6px; min-height:24px; padding:0 8px 0 3px; border:1px solid var(--line); border-radius:5px; background:var(--surface); color:var(--fg-2); font:600 11.5px/1 var(--body); text-decoration:none; white-space:nowrap; }
html body .tchip:hover, html body .tchip:focus-visible { color:var(--fg); border-color:var(--art); }
html body .tchip-ic { display:inline-flex; align-items:center; justify-content:center; width:18px; height:18px; border-radius:4px; background:var(--art); color:#fff; }
html body .tchip-ic svg { width:12px; height:12px; }
html body .art-field .art-also { display:none; }

/* Found in coverage: a plain kind line, never a pill (locked 29 September 2026). */
html body .who-card .who-kind .new-chip, html body .who-kind .new-chip { display:inline; margin:0; padding:0; border:0; border-radius:0; background:none; color:inherit; font:inherit; min-height:0; }
html body .who-card .who-kind .new-chip::before { content:"\00b7 "; }

/* People list view, rebuilt for the current card (band, feature strips,
   actions). The old list rules in app.css assumed the card before the
   profile layout and the 444px card rules overrode them, which left the
   list unreadable (Jeremy, 29 September 2026). One row per person: portrait
   and name, the newest strip, the actions. */
html body .who-grid.who-list { display:flex; flex-direction:column; gap:0; border:1px solid var(--line); border-radius:var(--r-box, 8px); overflow:hidden; background:var(--surface); }
html body .who-grid.who-list > .who-card[data-profile-layout] { display:grid !important; grid-template-columns:minmax(240px, 1fr) minmax(0, 1.6fr) auto; gap:0 24px; align-items:center; width:auto; height:auto !important; min-height:0 !important; max-height:none !important; padding:10px 20px; border:0; border-top:1px solid var(--line); border-radius:0; background:transparent; overflow:visible; }
html body .who-grid.who-list > .who-card[data-profile-layout]:first-child { border-top:0; }
html body .who-grid.who-list > .who-card[data-profile-layout] > .who-band { display:flex; align-items:center; height:auto; min-height:0; max-height:none; padding:0; background:transparent; }
html body .who-grid.who-list > .who-card[data-profile-layout] .who-head { gap:12px; }
html body .who-grid.who-list > .who-card[data-profile-layout] .who-head .portrait { width:44px; height:44px; min-height:44px; }
html body .who-grid.who-list > .who-card[data-profile-layout] .who-head h3 { font-size:15px; margin:0; }
html body .who-grid.who-list > .who-card[data-profile-layout] .who-role { font-size:12px; -webkit-line-clamp:1; }
html body .who-grid.who-list > .who-card[data-profile-layout] .who-kind, html body .who-grid.who-list > .who-card[data-profile-layout] .who-head > .who-follow, html body .who-grid.who-list > .who-card[data-profile-layout] .photo-credit { display:none; }
html body .who-grid.who-list > .who-card[data-profile-layout] > .who-body { display:none; }
html body .who-grid.who-list > .who-card[data-profile-layout] > .who-feature { display:block; flex:none; min-width:0; padding:0; overflow:hidden; }
html body .who-grid.who-list > .who-card[data-profile-layout] > .who-feature .mini-list { display:block; }
html body .who-grid.who-list > .who-card[data-profile-layout] > .who-feature .mini-row { height:44px; padding:0 10px; }
html body .who-grid.who-list > .who-card[data-profile-layout] > .who-feature .mini-row + .mini-row { display:none; }
html body .who-grid.who-list > .who-card[data-profile-layout] > .who-feature .who-featured { min-height:0; }
html body .who-grid.who-list > .who-card[data-profile-layout] > .who-feature .mini-list + .who-featured { display:none; }
html body .who-grid.who-list > .who-card[data-profile-layout] > .profile-actions { height:auto; min-height:0; margin:0; border:0; gap:16px; }
html body .who-grid.who-list > .who-load-more, html body .who-grid.who-list > .suggest-cta { margin:12px 20px; }
@media (max-width:760px) {
  html body .who-grid.who-list > .who-card[data-profile-layout] { grid-template-columns:minmax(0,1fr); gap:8px; padding:12px 10px; }
  html body .who-grid.who-list > .who-card[data-profile-layout] > .profile-actions { justify-content:flex-start; }
}

/* Graph views: the story map, the flow figures, the actor graph, their table
   and the statement of fact under each. Drawn by scripts/graph-view.js and
   site/assets/graph-page.js. Tokens only, so both themes hold. Family colours
   are the data encoding for equity, debt and contracts (blue, orange, green
   in the light theme, lighter in the dark theme). Square corners on every
   control and chip; no edge strips. */
:root { --gv-equity: #2f6fd6; --gv-debt: #f15a29; --gv-contracts: #77a817; --gv-other: var(--fg-2); }
html[data-theme="dark"] { --gv-equity: #6d9cf0; --gv-debt: #ff7a4d; --gv-contracts: #8fc02a; }
[data-graph-view] { margin-top: 0; }
[data-graph-view][hidden], .gv-chips[hidden], .gv-table[hidden] { display: none; }
.gv-title { margin: 0 0 12px; font: 600 18px/1.3 var(--head); color: var(--fg); }
[data-graph-view] + [data-graph-view] { margin-top: 48px; }
.gv-bar { margin: 0 0 16px; }
.gv-bar .gv-when { min-width: 0; min-height: 36px; padding: 0 10px; border: 1px solid var(--line); border-radius: var(--r-ctl); background: var(--surface); color: var(--fg); font: 600 13px/1.4 var(--body); }
.gv-chip button:focus-visible, .gv-when:focus-visible, .gv-scroll:focus-visible, .gv-lab a:focus-visible, .gv-note a:focus-visible, .gv-chk input:focus-visible { outline: 3px solid var(--fg); outline-offset: 2px; }
.gv-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 12px; }
.gv-chip { display: inline-flex; align-items: center; gap: 6px; min-height: 32px; padding: 0 0 0 10px; border: 1px solid var(--line); border-radius: 5px; background: var(--surface); color: var(--fg); font: 600 13px/1.3 var(--body); }
.gv-chip button { min-width: 36px; min-height: 34px; padding: 0; border: 0; border-radius: 0; background: color-mix(in srgb, var(--fg) 6%, transparent); color: var(--fg); font: 400 18px/1 var(--body); cursor: pointer; }
.gv-chip button:hover { background: color-mix(in srgb, var(--fg) 14%, transparent); }
.gv-legend { display: flex; flex-wrap: wrap; gap: 8px 24px; margin: 0 0 12px; font: 400 12px/1.4 var(--body); color: var(--fg-2); }
.gv-lg { display: inline-flex; align-items: center; gap: 8px; }
.gv-lg i { display: inline-block; width: 22px; height: 0; border-top: 3px solid var(--fg-2); }
.gv-lg-equity i { border-top-color: var(--gv-equity); }
.gv-lg-debt i { border-top-color: var(--gv-debt); }
.gv-lg-contracts i { border-top-color: var(--gv-contracts); }
.gv-lg-dashed i { border-top-style: dashed; }
.gv-lg-dotted i { border-top-style: dotted; }
.gv-lg-arc i { height: 8px; border: 0; border-top: 1.5px solid var(--fg-3); border-radius: 50% 50% 0 0; }
.gv-lg-event i { border-top: 2px dashed var(--link); }
.gv-lg-dot i { width: 10px; height: 10px; border: 0; background: var(--fg); border-radius: 50%; }
.gv-scroll { overflow-x: auto; }
.gv-svg { display: block; width: 100%; height: auto; }
.gv-svg text { font-family: var(--body); fill: var(--fg); }
.gv-svg [role="button"] { cursor: pointer; }
.gv-svg [role="button"]:focus-visible { outline: 3px solid var(--fg); outline-offset: 2px; }
.gv-dim { opacity: .3; }
.gv-hit { fill: transparent; }
.gv-mark { display: flex; align-items: center; justify-content: center; overflow: hidden; box-sizing: border-box; border-radius: 5px; color: var(--fg-2); background: #fff; }
.gv-mark-face { background: var(--line); }
.gv-mark .fav { width: 100%; height: 100%; margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; object-fit: contain; }
.gv-mark .fav-mark { width: 100%; height: 100%; border-radius: 3px; display: flex; align-items: center; justify-content: center; background: var(--line); color: var(--fg); font-weight: 700; }
.gv-mark .gv-face { object-fit: cover; }
/* story map */
.gv-grid { stroke: var(--line); stroke-width: 1; }
.gv-rowline { stroke: var(--line); stroke-width: 1; stroke-dasharray: 1 4; }
.gv-rowlabel { font-size: 12px; font-weight: 700; }
.gv-axis { font-size: 11px; fill: var(--fg-3); }
.gv-svg .gv-axis { fill: var(--fg-3); }
.gv-arc path { fill: none; stroke: var(--fg-3); stroke-width: 1.3; opacity: .6; }
.gv-svg .gv-arclabel { font-size: 10px; fill: var(--fg-3); }
.gv-bracket { fill: none; stroke: var(--link); stroke-width: 1.5; stroke-dasharray: 3 3; }
.gv-dotc { fill: var(--fg); stroke: var(--surface); stroke-width: 1.5; }
.gv-dot.gv-sel .gv-dotc, .gv-dot.gv-hl .gv-dotc { stroke: var(--link); stroke-width: 3; }
.gv-dot:hover .gv-dotc { stroke: var(--link); stroke-width: 2; }
/* flow figures and edges */
.gv-fig { margin: 0; }
.gv-fig + .gv-fig { margin-top: 32px; }
.gv-fig figcaption { margin: 0 0 8px; font: 600 16px/1.3 var(--head); color: var(--fg); }
.gv-e path { fill: none; stroke-width: 2.4; }
.gv-f-equity path { stroke: var(--gv-equity); }
.gv-f-debt path { stroke: var(--gv-debt); }
.gv-f-contracts path { stroke: var(--gv-contracts); }
.gv-f-other path { stroke: var(--gv-other); }
.gv-s-dashed path { stroke-dasharray: 8 5; }
.gv-s-dotted path { stroke-dasharray: 1.5 5; stroke-linecap: round; }
.gv-ah { }
.gv-ah-equity path { fill: var(--gv-equity); }
.gv-ah-debt path { fill: var(--gv-debt); }
.gv-ah-contracts path { fill: var(--gv-contracts); }
.gv-ah-other path { fill: var(--gv-other); }
.gv-lbox { fill: var(--surface); stroke-width: 1.5; }
.gv-lbox.gv-f-equity { stroke: var(--gv-equity); }
.gv-lbox.gv-f-debt { stroke: var(--gv-debt); }
.gv-lbox.gv-f-contracts { stroke: var(--gv-contracts); }
.gv-lbox.gv-f-other { stroke: var(--gv-other); }
.gv-svg .gv-l1 { font-size: 11px; font-weight: 700; }
.gv-svg .gv-l2 { font-size: 9.5px; fill: var(--fg-2); }
.gv-lab a { cursor: pointer; }
.gv-lab a:hover .gv-l1 { fill: var(--link); }
.gv-box { fill: var(--surface); stroke: var(--fg); stroke-width: 2; }
.gv-k-pool .gv-box { stroke-dasharray: 5 4; stroke-width: 1.6; }
.gv-svg .gv-nn { font-size: 12px; font-weight: 700; letter-spacing: .04em; }
.gv-svg .gv-nk { font-size: 10px; fill: var(--fg-2); }
.gv-k-pool .gv-nk { font-style: italic; }
.gv-ring { fill: none; stroke: var(--link); stroke-width: 3; }
.gv-node:hover .gv-box, .gv-node:hover .gv-tile { stroke: var(--link); }
.gv-note line { stroke: var(--fg-3); stroke-width: 1.2; stroke-dasharray: 1.5 4; }
.gv-note rect { fill: var(--surface); stroke: var(--fg-3); stroke-width: 1.2; stroke-dasharray: 2 4; }
.gv-svg .gv-nt { font-size: 10.5px; }
.gv-svg .gv-nm { font-size: 9px; fill: var(--fg-2); }
/* actor graph */
.gv-tile { fill: var(--surface); stroke: var(--fg-3); stroke-width: 1.6; }
.gv-k-pool .gv-tile { stroke-dasharray: 4 3; }
.gv-svg .gv-nl { font-size: 11px; font-weight: 600; }
.gv-co path { fill: none; stroke: var(--fg-3); stroke-width: 1.1; opacity: .55; }
.gv-svg .gv-lab-s .gv-l1 { font-size: 9.5px; paint-order: stroke; stroke: var(--surface); stroke-width: 3px; stroke-linejoin: round; }
.gv-svg .gv-lab-s .gv-l2 { font-size: 8.5px; paint-order: stroke; stroke: var(--surface); stroke-width: 3px; stroke-linejoin: round; }
/* table */
.gv-table { margin-top: 16px; overflow-x: auto; }
.gv-table table { width: 100%; border-collapse: collapse; font: 400 13px/1.4 var(--body); }
.gv-table + .gv-table { margin-top: 12px; }
.gv-table table + table { margin-top: 24px; }
.gv-table caption { padding: 0 0 8px; text-align: left; font: 600 14px/1.3 var(--head); color: var(--fg); }
.gv-table th { padding: 8px 16px 8px 0; text-align: left; font-weight: 600; font-size: 12px; color: var(--fg-2); border-bottom: 1px solid var(--line); }
.gv-table td { padding: 8px 16px 8px 0; border-bottom: 1px solid var(--line); vertical-align: top; color: var(--fg); }
.gv-chk { display: inline-flex; align-items: center; gap: 8px; min-height: 32px; cursor: pointer; }
.gv-chk input { width: 18px; height: 18px; accent-color: var(--link); }
/* thread and statement of fact */
.gv-thread { margin-top: 16px; }
.gv-thread h4, .gv-fact-s { margin: 24px 0 8px; font: 600 14px/1.3 var(--head); color: var(--fg); }
.gv-thread h4 { margin-top: 0; }
.gv-thread ol, .gv-heads, .gv-ledger { list-style: none; margin: 0; padding: 0; }
.gv-thread li, .gv-heads li, .gv-ledger li { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 12px; padding: 6px 0; font: 400 14px/1.45 var(--body); }
.gv-thread time, .gv-heads time, .gv-ledger time { color: var(--fg-2); font-variant-numeric: tabular-nums; font-size: 13px; }
.gv-hb { display: block; min-width: 0; }
.gv-out { margin-left: 8px; color: var(--fg-3); font-size: 13px; }
.gv-mt { display: block; margin-top: 2px; color: var(--fg-3); font-size: 12px; }
.gv-fact { margin-top: 24px; padding-top: 24px; border-top: 1px solid var(--line); }
.gv-fact-h { margin: 0; font: 600 17px/1.35 var(--head); color: var(--fg); }
.gv-sum { margin: 16px 0 0; font: 400 14px/1.5 var(--body); color: var(--fg-2); }
.ent-graph { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 12px; }
.ent-graph[hidden], .ent-graph [hidden] { display: none; }
.ent-gl { font: 600 12px/1.4 var(--body); color: var(--fg-2); }
@media (max-width: 760px) {
  .gv-map { min-width: 760px; }
  .gv-flow, .gv-actors { width: var(--gvw); max-width: none; }
  .gv-thread li, .gv-heads li, .gv-ledger li { grid-template-columns: 52px minmax(0, 1fr); }
}
@media (prefers-reduced-motion: no-preference) { .gv-dotc { transition: stroke-width .12s; } }

/* Ask Pax                                                                  */
/* Paciva's chat surface: three regions that are never fused (a             */
/* conversation card, a composer card 16px below it, a privacy line under   */
/* both). Fixed size; only the conversation body scrolls, anchored to the   */
/* bottom, so the composer never moves. The launcher is the Pax mark on the */
/* Paciva gradient circle at right 32, bottom 32 (16 on phones). The panel  */
/* is 400px wide, its right edge on the launcher's and 16px above it.       */
/* Expand moves the same three regions into a scrim at the sign in card's   */
/* size. --shadow-chat is defined here and used by nothing else.            */
:root { --shadow-chat:0 12px 40px rgba(13,19,33,.14); }
html[data-theme="dark"] { --shadow-chat:0 12px 40px rgba(0,0,0,.5); }
html body #pax-btn { position:fixed; right:32px; left:auto; bottom:calc(32px + env(safe-area-inset-bottom)); z-index:55; width:56px; height:56px; padding:0 !important; box-sizing:border-box; line-height:0; border:0; border-radius:50%; background:transparent; cursor:pointer; box-shadow:0 10px 28px rgba(13,19,33,.28); transition:bottom 200ms var(--ease); }
html body #pax-btn:empty { display:none; }
html body:has(.cookie:not([hidden])) #pax-btn { bottom:calc(var(--cookie-h, 150px) + 16px + env(safe-area-inset-bottom)); }
html body.ex-open #pax-btn, html body.drift-open #pax-btn, html body.notes-open #pax-btn, html.pm-open body #pax-btn,
html body.ex-open .pax-panel:not(.pax-wide), html body.drift-open .pax-panel:not(.pax-wide), html body.notes-open .pax-panel:not(.pax-wide), html.pm-open body .pax-panel:not(.pax-wide) { display:none !important; }
html body:has(#pax-btn) .i18n-pill { bottom:calc(100px + env(safe-area-inset-bottom)); }
html body:has(.cookie:not([hidden])):has(#pax-btn) .i18n-pill { bottom:calc(var(--cookie-h, 150px) + 84px + env(safe-area-inset-bottom)); }
html.pax-open body .i18n-pill { display:none; }
.pax-circ { display:inline-flex; align-items:center; justify-content:center; flex:none; box-sizing:border-box; border-radius:50%; background:linear-gradient(135deg, #fef0ea, #e9f2ff); border:1px solid var(--tan-200, #e6e3d9); }
.pax-circ svg { display:block; }
#pax-btn:focus-visible { outline:3px solid var(--info); outline-offset:3px; }
.pax-tip { position:absolute; right:calc(100% + 10px); top:50%; transform:translateY(-50%); padding:7px 10px; border-radius:5px; background:var(--inverse); color:var(--inverse-fg); font:500 12px/1.2 var(--body); white-space:nowrap; opacity:0; pointer-events:none; transition:opacity 140ms var(--ease); }
html[data-theme="dark"] .pax-tip { background:#ffffff; color:#0d1321; }
#pax-btn:hover .pax-tip, #pax-btn:focus-visible .pax-tip { opacity:1; }
html.pax-open .pax-tip { display:none; }
@media (prefers-reduced-motion: no-preference) {
  .pax-dots i { animation:pax-dot 1.2s ease-in-out infinite; }
  .pax-dots i:nth-child(2) { animation-delay:.15s; } .pax-dots i:nth-child(3) { animation-delay:.3s; }
  @keyframes pax-dot { 0%, 60%, 100% { opacity:.3; transform:translateY(0); } 30% { opacity:1; transform:translateY(-3px); } }
  .pax-send.sending::after { animation:pax-spin .8s linear infinite; }
  @keyframes pax-spin { to { transform:rotate(360deg); } }
}

html body .pax-panel { --pax-hover:var(--tan-50); --pax-chip:var(--tan-25); --pax-chip-hover:var(--tan-100); --pax-bot:var(--tan-50); --pax-me:#0d1321; --pax-me-fg:#ffffff; position:fixed; right:32px; bottom:calc(104px + env(safe-area-inset-bottom)); z-index:57; display:flex; flex-direction:column; gap:16px; box-sizing:border-box; width:400px; max-width:calc(100vw - 20px); height:min(620px, calc(100dvh - 120px)); color:var(--fg); font:400 14px/1.5 var(--body); transition:bottom 200ms var(--ease); }
html[data-theme="dark"] body .pax-panel { --pax-hover:var(--sub); --pax-chip:var(--sub); --pax-chip-hover:rgba(255,255,255,.08); --pax-bot:var(--sub); --pax-me:#2b3556; }
html body .pax-panel[hidden] { display:none; }
html body:has(.cookie:not([hidden])) .pax-panel:not(.pax-wide) { bottom:calc(var(--cookie-h, 150px) + 88px + env(safe-area-inset-bottom)); height:min(620px, calc(100dvh - var(--cookie-h, 150px) - 104px)); }
html body .pax-panel.pax-wide { position:relative; right:auto; bottom:auto; z-index:auto; width:min(860px, 100%); max-width:none; max-height:calc(100dvh - 32px); height:min(720px, calc(100dvh - 32px)); }
#pax-scrim { z-index:260; }
.pax-card { background:var(--surface); border:1px solid var(--line); border-radius:10px; box-shadow:var(--shadow-chat); }
.pax-conv { flex:1 1 auto; min-height:0; display:flex; flex-direction:column; overflow:hidden; }
.pax-head { display:flex; align-items:center; gap:12px; padding:16px 20px; border-bottom:1px solid var(--line); flex:none; }
.pax-mark { display:inline-flex; flex:none; }
.pax-who { min-width:0; }
.pax-who h2 { margin:0; font:600 14px/1.2 var(--head); color:var(--fg); }
.pax-status { margin:2px 0 0; display:flex; align-items:center; gap:6px; font:400 12px/1.2 var(--body); color:var(--fg-2); }
.pax-dot { width:8px; height:8px; border-radius:50%; background:#77a817; flex:none; }
.pax-status.typing .pax-dot { background:#9a9a9a; }
.pax-acts { margin-left:auto; display:flex; gap:8px; }
.pax-ib { display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; border:1px solid var(--line); border-radius:50%; background:var(--surface); color:var(--fg); cursor:pointer; padding:0; }
.pax-ib:hover { background:var(--pax-hover); }
.pax-ib:focus-visible, .pax-chip:focus-visible, .pax-send:focus-visible, .pax-cite a:focus-visible { outline:3px solid var(--info); outline-offset:2px; }
.pax-body { flex:1 1 auto; min-height:0; overflow-y:auto; overscroll-behavior:contain; padding:20px; display:flex; flex-direction:column; gap:16px; }
.pax-body > :first-child { margin-top:auto; }
.pax-body.pax-fresh > :first-child { margin-top:0; }
.pax-chip-quiet { background:transparent; color:var(--fg-2); }
.pax-row { display:flex; align-items:flex-start; gap:12px; flex:none; }
.pax-r-me { flex-direction:row-reverse; }
.pax-av { flex:none; display:inline-flex; }
.pax-me-av { width:32px; height:32px; align-items:center; justify-content:center; border-radius:50%; background:var(--pax-me); color:#ffffff; }
.pax-col { flex:1 1 auto; min-width:0; }
.pax-r-me .pax-col { flex:0 1 auto; max-width:80%; }
.pax-typing-row .pax-col { flex:0 0 auto; }
.pax-bub { padding:14px 18px; border-radius:8px; background:var(--pax-bot); color:var(--fg); font:400 14px/1.5 var(--body); }
.pax-r-me .pax-bub { background:var(--pax-me); color:var(--pax-me-fg); }
.pax-t { margin:0; overflow-wrap:anywhere; }
.pax-t + .pax-t { margin-top:8px; }
.pax-time { display:block; margin-top:6px; font:400 12px/1 var(--body); font-variant-numeric:tabular-nums; color:var(--fg-3); }
.pax-r-me .pax-time { color:rgba(255,255,255,.65); }
.pax-dots { display:inline-flex; gap:5px; align-items:center; height:21px; }
.pax-dots i { width:6px; height:6px; border-radius:50%; background:var(--fg-3); display:block; }
.pax-cite { font-size:11px; line-height:0; margin-left:1px; }
.pax-cite a { color:var(--link); font-weight:700; text-decoration:none; padding:0 1px; }
.pax-cite a:hover { text-decoration:underline; }
.pax-chips { display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }
.pax-chip { display:inline-flex; align-items:center; min-height:40px; padding:8px 14px; border:1px solid var(--line); border-radius:8px; background:var(--pax-chip); color:var(--fg); font:500 14px/1.3 var(--body); text-align:left; text-decoration:none; cursor:pointer; transition:background 120ms var(--ease); }
.pax-chip:hover { background:var(--pax-chip-hover); color:var(--fg); text-decoration:none; }
/* A control the reader presses reads as one: chips that send or choose are
   blue, the send control is orange (Jeremy, 30 September 2026). Links to
   pages keep the quiet chip. */
button.pax-chip { background:var(--info-bg); color:var(--info); border-color:transparent; }
button.pax-chip:hover { background:var(--info); color:#ffffff; }
html[data-theme="dark"] button.pax-chip { background:rgba(54,83,159,.28); color:#b9c8ee; }
html[data-theme="dark"] button.pax-chip:hover { background:var(--info); color:#ffffff; }
button.pax-chip.pax-chip-quiet { background:transparent; color:var(--fg-2); border-color:var(--line); }
/* No ring around the composer: focus shows as the card border only. */
.pax-comp:focus-within, .pax-comp textarea:focus, .pax-comp textarea:focus-visible { outline:0 !important; }
.pax-comp textarea, .pax-comp textarea:focus { box-shadow:none; background:transparent; }
.pax-comp:focus-within { border-color:var(--tan-200, var(--line)); }
.pax-strips { margin:10px 0 0; gap:6px; }
.pax-n { display:block; }
.pax-strips .mini-row { padding:8px 10px; border-radius:8px; background:var(--pax-chip); }
.pax-strips .mini-meta, .pax-strips .mini-date { font-size:12px; }
.pax-plain { display:flex; flex-direction:column; gap:2px; padding:8px 10px; border:1px solid var(--line); border-radius:8px; background:var(--pax-chip); color:var(--fg); text-decoration:none; }
.pax-sum { margin:10px 0 0; display:grid; grid-template-columns:auto minmax(0,1fr); gap:6px 12px; font-size:13px; }
.pax-sum dt { color:var(--fg-2); }
.pax-sum dd { margin:0; overflow-wrap:anywhere; }
.pax-comp { flex:none; padding:20px; display:flex; flex-direction:column; gap:12px; }
.pax-comp textarea { display:block; width:100%; box-sizing:border-box; min-height:24px; max-height:200px; padding:0; border:0; outline:0; background:transparent; color:var(--fg); font:400 14px/24px var(--body); resize:none; overflow-y:hidden; }
.pax-comp textarea::placeholder { color:var(--fg-3); }
.pax-act { display:flex; align-items:center; justify-content:space-between; }
.pax-send { position:relative; display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; padding:0; border:0; border-radius:8px; background:var(--tan-100); color:var(--fg-3); cursor:default; }
html[data-theme="dark"] .pax-send { background:rgba(255,255,255,.08); }
.pax-send.ready { background:var(--orange); color:#ffffff; cursor:pointer; }
.pax-send.ready:hover { background:var(--orange-hover); }
html[data-theme="dark"] .pax-send.ready { background:var(--orange); color:#ffffff; }
.pax-send.sending { background:#0d1321; color:#ffffff; }
html[data-theme="dark"] .pax-send.sending { background:#ffffff; color:#0d1321; }
.pax-send.sending svg { display:none; }
.pax-send.sending::after { content:""; width:14px; height:14px; box-sizing:border-box; border:2px solid currentColor; border-right-color:transparent; border-radius:50%; }
@media (max-width:759px) { html body .pax-panel.pax-wide { width:min(520px, 100%); } }
@media (max-width:640px) {
  html body #pax-btn { right:16px; bottom:calc(16px + env(safe-area-inset-bottom)); }
  html body:has(.cookie:not([hidden])) #pax-btn { bottom:calc(var(--cookie-h, 150px) + 16px + env(safe-area-inset-bottom)); }
  html body:has(#pax-btn) .i18n-pill { bottom:calc(84px + env(safe-area-inset-bottom)); }
  html body .pax-panel:not(.pax-wide) { left:10px; right:10px; width:auto; max-width:none; bottom:calc(88px + env(safe-area-inset-bottom)); height:min(620px, calc(100dvh - 88px - var(--livehead-h, 64px) - 16px)); }
  html body:has(.cookie:not([hidden])) .pax-panel:not(.pax-wide) { bottom:calc(var(--cookie-h, 150px) + 88px + env(safe-area-inset-bottom)); height:max(240px, min(620px, calc(100dvh - var(--cookie-h, 150px) - 88px - var(--livehead-h, 64px) - 16px))); }
  .pax-comp textarea { font-size:16px; }
  .pax-head { padding:14px 16px; } .pax-body { padding:16px; } .pax-comp { padding:16px; }
}

/* Market page hero and chart (Jeremy, 30 September 2026: the question is a
   long title, so it takes the hero's capped size; the chart reads the site's
   line colour, never the page's text colour). */
html body .thero h1.mk-hero-title { font-size:clamp(30px, 3.1vw, 46px); line-height:1.08; letter-spacing:-.01em; }
html body .thero h1.mk-hero-title .entity-hero-logo { flex:0 0 64px; width:64px; height:64px; }
html body .mp-chart { --mk-lead: var(--link); }
html body .mp-chart .mp-line { stroke:var(--link); stroke-width:2; }
html body .mp-chart .mp-area { fill:var(--link); opacity:.10; }
html body .mp-chart .mp-grid { stroke:var(--line); }
html body .mp-chart .mp-ax { fill:var(--fg-3); font:500 12px var(--body); }

/* While the cookie notice is open the two launchers stay out of the way:
   lifted above it they landed on the hero's own controls (the Share button
   on Money & Influence, Jeremy, 30 September 2026). They return the moment
   the notice is answered. */
html body:has(.cookie:not([hidden])) #contrib-btn, html body:has(.cookie:not([hidden])) #pax-btn, html body:has(.cookie:not([hidden])) .contrib-menu { display:none !important; }