/* Company Footprints tab (FootprintsPanel.js) and "Who runs this site?" card (SiteOwnerCard.js).
   Layout follows each block's own width (container queries), because Oasis sidebars change it. */

.fp { container: fp / inline-size; min-width: 0; display: grid; gap: 26px; font-variant-numeric: tabular-nums; }
.fp-block { min-width: 0; }
.fp-h { margin: 0 0 4px; font-size: 15px; font-weight: 700; color: var(--ctp-text); }
.fp-hint { margin: 0 0 10px; font-size: 12.5px; color: var(--ctp-subtext0); max-width: 80ch; }
.fp-state, .so-state { margin: 0; padding: 14px 16px; font-size: 12.5px; color: var(--ctp-subtext0); }
.fp-state--err, .so-state--err { color: #c2102f; }
.fp-retry { margin-left: 8px; border: 0; background: none; padding: 0; font: 600 12.5px Inter, sans-serif; color: #10696e; cursor: pointer; }
.fp-empty { margin: 0; padding: 14px 16px; border-radius: 12px; background: var(--ctp-surface0); font-size: 12.5px; color: var(--ctp-subtext0); }
/* Oasis base styles make every img a block; these panels lay icons inline. */
.fp img, .so img { display: inline-block; vertical-align: middle; max-width: none; }
.fp :focus-visible, .so :focus-visible { outline: 2px solid #10696e; outline-offset: 2px; }

.fp-lvl { display: inline-block; font-size: 11px; font-weight: 600; padding: 2px 8px; border-radius: 999px; white-space: nowrap; }
.fp-lvl--proves { background: rgb(64 160 43 / .12); color: #2f8a1f; }
.fp-lvl--strong { background: rgb(23 146 153 / .14); color: #10696e; }
.fp-lvl--backs { background: rgb(23 146 153 / .08); color: #137a80; }
.fp-lvl--hint { background: var(--ctp-mantle); color: var(--ctp-subtext0); }
.fp-flag { width: 16px; height: 11px; border-radius: 2px; object-fit: cover; flex: none; box-shadow: 0 0 0 1px rgba(0,0,0,.06); }
.fp-fav { width: 16px; height: 16px; border-radius: 4px; flex: none; background: var(--ctp-mantle); }
.fp-bico { width: 16px; height: 16px; border-radius: 4px; flex: none; background: var(--ctp-surface0); }
.fp-bletter { width: 16px; height: 16px; border-radius: 4px; flex: none; display: inline-grid; place-items: center; font-size: 9.5px; font-weight: 700;
  color: var(--ctp-subtext0); background: var(--ctp-mantle); }
.fp-on { color: var(--ctp-subtext0); font-size: 12px; }
.fp-chip { display: inline-flex; align-items: center; gap: 6px; max-width: 100%; padding: 3px 8px; border-radius: 7px; background: var(--ctp-base);
  font-size: 11.5px; color: var(--ctp-text); overflow-wrap: anywhere; }
.fp-chip img { width: 14px; height: 14px; flex: none; border-radius: 3px; }
.fp-chip em { font-style: normal; font-size: 10.5px; font-weight: 600; padding: 0 6px; border-radius: 999px; }
.fp-note { font-size: 12px; line-height: 1.4; color: var(--ctp-subtext0); }

/* market filter */
.fp-markets { display: flex; gap: 6px; flex-wrap: wrap; }
.fp-mkt { display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 11px; border: 0; border-radius: 8px; cursor: pointer;
  background: var(--ctp-surface0); box-shadow: inset 0 0 0 1.5px var(--ctp-crust); font: 600 12px Inter, sans-serif; color: var(--ctp-text); white-space: nowrap; }
.fp-mkt b { font-weight: 600; color: var(--ctp-overlay0); }
.fp-mkt.is-on { box-shadow: inset 0 0 0 2px #179299; color: #10696e; }
.fp-mkt.is-on b { color: #10696e; }

/* 1. what the company typically has: one compact row per footprint family, click to open it in place */
.fp-rows { display: grid; max-width: 1080px; background: var(--ctp-surface0); border-radius: 12px; overflow: hidden;
  box-shadow: 0 1px 2px rgba(45,63,78,.06), 0 6px 18px rgba(45,63,78,.04); }
.fp-row { border-top: 1px solid var(--ctp-crust); position: relative; }
.fp-row:first-child { border-top: 0; }
.fp-row::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: transparent; }
.fp-row--proves::before { background: #40a02b; }
.fp-row--strong::before { background: #179299; }
.fp-row.is-on > .fp-rowHead { background: rgb(23 146 153 / .06); }
.fp-row.is-on::before { width: 4px; }
.fp-rowHead { display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; align-items: start; gap: 12px; width: 100%; padding: 12px 14px 12px 16px;
  border: 0; background: none; font: inherit; color: inherit; text-align: left; cursor: pointer; }
.fp-rowHead:hover { background: color-mix(in srgb, var(--ctp-base) 60%, transparent); }
.fp-rowIco { width: 28px; height: 28px; }
.fp-rowMain { display: grid; gap: 7px; min-width: 0; padding-top: 4px; }
.fp-rowTitle { font-size: 13.5px; font-weight: 700; color: var(--ctp-text); }
.fp-row.is-on .fp-rowTitle { color: #10696e; }
.fp-rowVals { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; }
.fp-rowMeta { display: flex; align-items: center; gap: 10px; padding-top: 4px; white-space: nowrap; font-size: 12px; color: var(--ctp-subtext0); }
/* the open/close control reads as a button, not a stray arrow */
.fp-toggle { display: inline-flex; align-items: center; gap: 7px; height: 28px; padding: 0 11px 0 12px; border-radius: 8px; background: var(--ctp-surface0);
  box-shadow: inset 0 0 0 1.5px var(--ctp-crust), 0 1px 2px rgba(45,63,78,.06); font-size: 12px; font-weight: 600; color: var(--ctp-text); }
.fp-toggle .fp-chev { margin: 0 0 3px; }
.fp-rowHead:hover .fp-toggle { box-shadow: inset 0 0 0 1.5px #179299, 0 1px 2px rgba(45,63,78,.06); color: #10696e; }
.fp-weakToggle:hover .fp-toggle { box-shadow: inset 0 0 0 1.5px #179299, 0 1px 2px rgba(45,63,78,.06); color: #10696e; }
.fp-weakToggle[aria-expanded="true"] .fp-toggle .fp-chev { transform: rotate(225deg); margin-bottom: -3px; }
.fp-row.is-on .fp-toggle { background: #179299; box-shadow: none; color: #fff; }
.fp-row.is-on .fp-toggle .fp-chev { border-color: #fff; }
.fp-rowCount b { font-weight: 700; color: var(--ctp-text); }
.fp-chev { width: 7px; height: 7px; margin: 0 2px 3px 2px; border-right: 2px solid var(--ctp-overlay0); border-bottom: 2px solid var(--ctp-overlay0); transform: rotate(45deg); }
[aria-expanded="true"] > .fp-rowMeta .fp-chev, [aria-expanded="true"] .fp-toggle .fp-chev, .fp-weakToggle[aria-expanded="true"] > .fp-chev { transform: rotate(225deg); margin-bottom: -3px; }
.fp-val { display: inline-flex; align-items: center; gap: 5px; max-width: 100%; padding: 3px 8px; border-radius: 7px; background: var(--ctp-base);
  font-size: 11.5px; font-weight: 500; color: var(--ctp-text); overflow-wrap: anywhere; }
.fp-val--hint { color: var(--ctp-subtext0); background: transparent !important; box-shadow: inset 0 0 0 1px var(--ctp-crust); }
.fp-valMore { font-size: 11.5px; font-weight: 600; color: var(--ctp-overlay0); }
/* the go-link route: one numbered line per step, labels in one column so the values line up */
.fp-route { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.fp-routeStep { display: grid; grid-template-columns: 150px minmax(0, 1fr); align-items: center; gap: 10px; position: relative; }
.fp-routeStep:not(:last-child)::after { content: ""; position: absolute; left: 7.5px; top: 19px; height: calc(100% - 13px); width: 1px; background: var(--ctp-crust); }
.fp-routeLabel { display: inline-flex; align-items: center; gap: 8px; font-size: 11.5px; font-weight: 600; color: var(--ctp-subtext0); white-space: nowrap; }
.fp-routeVals { display: flex; flex-wrap: wrap; gap: 4px; min-width: 0; }
.fp-num { width: 16px; height: 16px; border-radius: 5px; display: inline-grid; place-items: center; font-size: 10px; font-weight: 700; color: #fff; background: var(--ctp-blue); }
/* an open row: one aligned table, columns line up so the eye reads down, not across the screen */
.fp-openBox { padding: 10px 16px 14px 56px; background: color-mix(in srgb, var(--ctp-base) 80%, var(--ctp-mantle)); border-top: 1px solid var(--ctp-crust); }
/* strength filter: All / Strong / Only a hint, as one centred button group */
.fp-seg { display: flex; justify-content: center; flex-wrap: wrap; gap: 4px; width: fit-content; max-width: 100%; margin: 0 auto 10px; padding: 3px; border-radius: 10px;
  background: var(--ctp-mantle); box-shadow: inset 0 0 0 1px var(--ctp-crust); }
.fp-segBtn { display: inline-flex; align-items: center; gap: 6px; height: 28px; padding: 0 12px; border: 0; border-radius: 7px; background: none; cursor: pointer;
  font: 600 12px Inter, sans-serif; color: var(--ctp-subtext0); white-space: nowrap; }
.fp-segBtn b { font-weight: 700; color: var(--ctp-overlay0); }
.fp-segBtn .fp-dot { width: 9px; height: 9px; }
.fp-segBtn:hover { color: var(--ctp-text); }
.fp-segBtn.is-on { background: var(--ctp-surface0); color: var(--ctp-text); box-shadow: 0 1px 2px rgba(45,63,78,.12); }
.fp-segBtn.is-on b { color: #10696e; }
.fp-openTable { border-radius: 10px; background: var(--ctp-surface0); box-shadow: 0 1px 2px rgba(45,63,78,.06), 0 4px 12px rgba(45,63,78,.05); overflow: hidden; }
.fp-openHead, .fp-openRow { display: grid; grid-template-columns: minmax(0, 1fr) 210px 100px; align-items: center; gap: 16px; padding: 0 16px; }
.fp-openHead { height: 32px; font-size: 10.5px; font-weight: 600; letter-spacing: .02em; color: var(--ctp-overlay0); background: color-mix(in srgb, var(--ctp-base) 60%, var(--ctp-surface0)); border-bottom: 1px solid var(--ctp-crust); }
.fp-openHead > :last-child, .fp-openLvl { text-align: right; }
.fp-openRow { padding-top: 11px; padding-bottom: 11px; }
.fp-openRow + .fp-openRow { border-top: 1px solid var(--ctp-crust); }
.fp-openRow:hover { background: color-mix(in srgb, var(--ctp-base) 50%, var(--ctp-surface0)); }
.fp-openName { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 10px; align-items: start; min-width: 0; }
.fp-openIco { width: 28px; height: 28px; border-radius: 8px; display: grid; place-items: center; background: var(--ctp-base); }
.fp-openIco img { width: 16px; height: 16px; border-radius: 3px; }
.fp-openText { display: grid; gap: 2px; min-width: 0; overflow-wrap: anywhere; padding-top: 5px; }
.fp-openText b { font-size: 12.5px; font-weight: 600; color: var(--ctp-text); }
.fp-openText .fp-note { font-size: 11.5px; }
.fp-openText .fp-members { margin-top: 4px; }
.fp-openSites { display: grid; gap: 5px; font-size: 12px; color: var(--ctp-subtext0); }
.fp-openCount { display: flex; align-items: center; flex-wrap: wrap; gap: 5px; }
.fp-openCount b { color: var(--ctp-text); margin-right: -2px; }
.fp-openCount .fp-flag:first-of-type { margin-left: 4px; }
.fp-bar { display: block; height: 4px; border-radius: 2px; background: var(--ctp-crust); overflow: hidden; }
.fp-bar i { display: block; height: 100%; background: #179299; border-radius: 2px; }
.fp-muted { font-size: 11.5px; color: var(--ctp-overlay0); }
/* supporting signs: one quiet line that opens the weaker rows */
.fp-weakToggle { display: flex; align-items: center; gap: 10px; width: 100%; padding: 10px 14px 10px 16px; border: 0; border-top: 1px solid var(--ctp-crust);
  background: color-mix(in srgb, var(--ctp-surface0) 60%, var(--ctp-base)); font: inherit; cursor: pointer; text-align: left; }
.fp-weakTitle { font-size: 12.5px; font-weight: 700; color: var(--ctp-subtext0); }
.fp-weakIcons { display: inline-flex; gap: 4px; }
.fp-weakIcons img { width: 20px; height: 20px; }
.fp-weakCount { margin-left: auto; font-size: 12px; color: var(--ctp-subtext0); }
.fp-row--weak { background: color-mix(in srgb, var(--ctp-surface0) 60%, var(--ctp-base)); }
.fp-row--weak .fp-rowIco { width: 24px; height: 24px; }
.fp-row--weak .fp-rowHead { grid-template-columns: 28px minmax(0, 1fr) auto; padding-top: 10px; padding-bottom: 10px; }
.fp-row--weak .fp-val { background: var(--ctp-surface0); }

.fp-close { margin-left: auto; width: 26px; height: 26px; border: 0; border-radius: 7px; background: none; font-size: 18px; line-height: 1; color: var(--ctp-overlay0); cursor: pointer; }
.fp-list { list-style: none; margin: 0; padding: 6px 10px 10px; display: grid; gap: 4px; }
.fp-list li { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 8px 10px; border-radius: 8px; background: var(--ctp-base); }
.fp-list-main { min-width: 0; overflow-wrap: anywhere; font-size: 12.5px; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; }
.fp-list-main b { color: var(--ctp-text); font-weight: 600; }
.fp-flags { display: inline-flex; align-items: center; gap: 4px; }
.fp-members { display: flex; flex-wrap: wrap; gap: 4px; flex-basis: 100%; }
.fp-list-main .fp-note { flex-basis: 100%; }

/* 2. toplists by market and topic */
.fp-tlMarkets { display: grid; gap: 12px; }
.fp-tlMarket { background: var(--ctp-surface0); border-radius: 12px; overflow: hidden; box-shadow: 0 1px 2px rgba(45,63,78,.06), 0 6px 18px rgba(45,63,78,.04); }
.fp-tlHead { display: flex; align-items: center; gap: 8px; padding: 10px 14px; background: var(--ctp-base); font-size: 13px; color: var(--ctp-text); }
.fp-tlTop { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 10px 14px; border-bottom: 1px solid var(--ctp-crust); }
.fp-tlLabel { font-size: 11.5px; font-weight: 600; color: var(--ctp-overlay0); margin-right: 2px; }
.fp-brand { display: inline-flex; align-items: center; gap: 6px; padding: 3px 4px 3px 7px; border-radius: 8px; background: var(--ctp-base); font-size: 12px; font-weight: 600; color: var(--ctp-text); }
.fp-brand i { font-style: normal; font-size: 10.5px; font-weight: 700; color: var(--ctp-subtext0); background: var(--ctp-surface0); border-radius: 5px; padding: 1px 6px; }
.fp-tlPage { padding: 11px 14px; border-top: 1px solid var(--ctp-crust); }
.fp-tlTop + .fp-tlPage { border-top: 0; }
.fp-tlPageHead { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 12px; margin-bottom: 8px; }
.fp-tlTopic { font-size: 13px; font-weight: 700; color: var(--ctp-text); text-decoration: none; }
.fp-tlTopic:hover { color: #10696e; text-decoration: underline; }
.fp-tlDomain { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; color: var(--ctp-subtext0); }
.fp-tlChange { margin-left: auto; font-size: 11.5px; font-weight: 600; color: var(--ctp-overlay0); }
.fp-tlChange.is-busy { color: #b45309; }
.fp-lineup { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.fp-lineup li { display: inline-flex; align-items: center; gap: 6px; padding: 4px 9px 4px 4px; border-radius: 8px; background: var(--ctp-base); font-size: 12px; font-weight: 600; color: var(--ctp-text); }
.fp-lineup li.is-new { box-shadow: inset 0 0 0 1.5px rgb(64 160 43 / .5); }
.fp-pos { width: 18px; height: 18px; border-radius: 5px; display: inline-grid; place-items: center; font-size: 10.5px; font-weight: 700; color: var(--ctp-subtext0); background: var(--ctp-surface0); }
.fp-diff { margin: 8px 0 0; display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 12px; color: var(--ctp-subtext0); }
.fp-in { color: #2f8a1f; } .fp-out { color: #c2102f; }

/* 3. evidence grid */
.fp-gridWrap { overflow-x: auto; background: var(--ctp-surface0); border-radius: 12px; box-shadow: 0 1px 2px rgba(45,63,78,.06), 0 6px 18px rgba(45,63,78,.04); }
.fp-grid { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 12.5px; }
.fp-grid thead th { position: sticky; top: 0; z-index: 1; height: 54px; padding: 0 8px; background: var(--ctp-base); color: var(--ctp-overlay0); font-size: 10.5px; font-weight: 600;
  border-bottom: 1px solid var(--ctp-crust); white-space: nowrap; }
.fp-grid th.fp-gSite { text-align: left; padding-left: 14px; }
.fp-gCol { width: 62px; text-align: center; }
.fp-gCol img { display: block !important; width: 22px; height: 22px; margin: 0 auto 3px; }
.fp-gCol.is-focus, .fp-gCell.is-focus { background: rgb(23 146 153 / .07); }
.fp-gWhy { text-align: left; }
.fp-grid td { height: 40px; padding: 0 8px; border-bottom: 1px solid var(--ctp-crust); }
.fp-grid tbody tr:last-child td { border-bottom: 0; }
.fp-gRow { cursor: pointer; }
.fp-gRow:hover td { background: color-mix(in srgb, var(--ctp-base) 70%, transparent); }
.fp-gRow.is-open td { background: rgb(23 146 153 / .05); }
td.fp-gSite { position: sticky; left: 0; z-index: 1; background: var(--ctp-surface0); padding-left: 14px; white-space: nowrap; }
td.fp-gSite > * { vertical-align: middle; }
.fp-gDomain { display: inline-block; margin: 0 7px 0 8px; font-weight: 600; color: var(--ctp-text); max-width: 220px; overflow: hidden; text-overflow: ellipsis; }
.fp-gCell { text-align: center; }
.fp-dot { display: inline-block; width: 12px; height: 12px; border-radius: 50%; vertical-align: middle; }
.fp-dot--proves { background: #40a02b; }
.fp-dot--strong { background: #179299; }
.fp-dot--backs { background: transparent; box-shadow: inset 0 0 0 2.5px #179299; }
.fp-dot--hint { background: transparent; box-shadow: inset 0 0 0 2px var(--ctp-overlay0); }
td.fp-gWhy { white-space: nowrap; }
.fp-gLead { margin-left: 8px; color: var(--ctp-subtext0); display: inline-block; max-width: 260px; overflow: hidden; text-overflow: ellipsis; vertical-align: middle; }
.fp-gDetail td { height: auto; padding: 0; background: rgb(23 146 153 / .04); }
.fp-gDetailBody { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 10px 14px 12px 38px; }
.fp-gDetailBody .fp-note { flex-basis: 100%; }
.fp-open { margin-left: auto; font-size: 12px; font-weight: 600; color: #10696e; text-decoration: none; }
.fp-open:hover { text-decoration: underline; }
.fp-legend { display: flex; flex-wrap: wrap; gap: 6px 16px; margin-top: 10px; font-size: 11.5px; color: var(--ctp-subtext0); }
.fp-legend span { display: inline-flex; align-items: center; gap: 6px; }
.fp-moreBtn { margin-top: 10px; height: 34px; padding: 0 14px; border: 0; border-radius: 9px; background: var(--ctp-surface0);
  box-shadow: inset 0 0 0 1.5px var(--ctp-crust); font: 600 12.5px Inter, sans-serif; color: var(--ctp-text); cursor: pointer; }

@container fp (max-width: 639px) {
  .fp-markets { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 2px; scrollbar-width: none; }
  .fp-markets::-webkit-scrollbar { display: none; }
  .fp-mkt { flex: none; }
  .fp-rowHead { grid-template-columns: 24px minmax(0, 1fr); gap: 10px; padding: 11px 12px 11px 14px; }
  .fp-rowIco { width: 24px; height: 24px; }
  .fp-rowMeta { grid-column: 1 / -1; justify-content: center; padding-top: 4px; }
  .fp-routeStep { grid-template-columns: minmax(0, 1fr); gap: 4px; padding-left: 0; }
  .fp-routeVals { padding-left: 24px; }
  .fp-openBox { padding: 10px; }
  .fp-openHead { display: none; }
  .fp-openRow { grid-template-columns: minmax(0, 1fr) auto; gap: 6px 10px; padding: 10px 12px; }
  .fp-openName { grid-column: 1 / -1; }
  .fp-openSites { padding-left: 38px; }
  .fp-openSites .fp-bar { width: 90px; }
  .fp-openLvl { align-self: end; }
  .fp-weakIcons { display: none; }
  .fp-tlChange { margin-left: 0; flex-basis: 100%; }
  .fp-grid th.fp-gWhy, .fp-grid td.fp-gWhy { display: none; }
  .fp-gDomain { max-width: 130px; }
  .fp-gCol { width: 48px; }
  .fp-gCol span { display: none; }
  .fp-gDetailBody { padding-left: 14px; }
  .fp-list li { flex-direction: column; gap: 4px; }
}

/* "Who runs this site?" */
.so { container: so / inline-size; margin: 12px 0; }
.so-head { padding: 12px 16px 0; display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.so-market { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 600; color: var(--ctp-subtext0); }
.so-count { margin: 12px 16px 0; font-size: 12px; font-weight: 600; color: var(--ctp-overlay0); }
.so-group { margin-top: 8px; }
.so-groupHead { display: flex; align-items: center; gap: 8px; padding: 6px 16px; font-size: 12px; font-weight: 700; color: var(--ctp-text); background: var(--ctp-base); }
.so-groupHead img { width: 20px; height: 20px; }
.so-head h3 { margin: 0; font-size: 14px; font-weight: 700; color: var(--ctp-text); }
.so-owner { display: flex; align-items: center; justify-content: space-between; gap: 8px 16px; flex-wrap: wrap; margin: 10px 16px 0;
  padding: 11px 14px; border-radius: 10px; background: color-mix(in srgb, #179299 7%, var(--ctp-surface0)); }
.so-ownerMain { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; min-width: 0; }
.so-by { font-size: 12.5px; color: var(--ctp-subtext0); }
.so-company { font-size: 16px; font-weight: 700; color: #10696e; text-decoration: none; }
.so-company:hover, .so-link:hover { text-decoration: underline; }
.so-link { font-size: 12.5px; font-weight: 600; color: #10696e; text-decoration: none; }
.so-why { display: grid; margin-top: 6px; }
.so-fpRow { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 12px; align-items: center; padding: 9px 16px 9px 44px; border-top: 1px solid var(--ctp-crust); }
.so-groupHead + .so-fpRow { border-top: 0; }
.so-fpText { min-width: 0; overflow-wrap: anywhere; font-size: 12.5px; }
.so-fam { display: block; font-size: 11px; font-weight: 600; color: var(--ctp-overlay0); }
.so-fpText b { color: var(--ctp-text); font-weight: 600; }
.so-shared { display: block; font-size: 12px; color: var(--ctp-subtext0); }
.so-note { margin: 0; padding: 10px 16px 13px; border-top: 1px solid var(--ctp-crust); font-size: 12px; color: var(--ctp-subtext0); }
.so-pool { display: grid; gap: 2px; margin: 10px 16px 14px; padding: 11px 14px; border-radius: 10px; background: var(--ctp-base); }
.so-pool b { font-size: 14px; color: var(--ctp-text); }
.so-pool span { font-size: 12.5px; color: var(--ctp-subtext0); }
.so > :last-child:not(.so-pool):not(.so-note) { padding-bottom: 6px; }
@container so (max-width: 460px) {
  .so-fpRow { grid-template-columns: minmax(0,1fr); gap: 4px; padding: 9px 14px 9px 42px; }
  .so-groupHead { padding: 6px 14px; }
  .so-count { margin-left: 14px; }
  .so-head { padding: 12px 14px 0; }
  .so-owner, .so-pool { margin-left: 14px; margin-right: 14px; }
}

/* Tech stack tab (TechStackPanel.js) */
.ts { container: ts / inline-size; display: grid; gap: 12px; font-variant-numeric: tabular-nums; }
.ts img { display: inline-block; vertical-align: middle; }
.ts-note { margin: 0; font-size: 12.5px; color: var(--ctp-subtext0); }
.ts-groups { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 12px; align-items: start; }
.ts-group { background: var(--ctp-surface0); border-radius: 12px; padding: 12px 14px; box-shadow: 0 1px 2px rgba(45,63,78,.06), 0 4px 14px rgba(45,63,78,.04); }
.ts-group h4 { display: flex; align-items: center; gap: 9px; margin: 0 0 8px; font-size: 13px; font-weight: 700; color: var(--ctp-text); }
.ts-group h4 img { width: 24px; height: 24px; }
.ts-entry { border-top: 1px solid var(--ctp-crust); }
.ts-item { width: 100%; display: grid; grid-template-columns: minmax(0,1fr) auto 70px auto; gap: 10px; align-items: center; padding: 7px 0; border: 0; background: none; font: inherit; font-size: 12.5px; text-align: left; cursor: pointer; }
.ts-item:hover .ts-name { color: #10696e; }
.ts-domains { display: flex; flex-wrap: wrap; gap: 5px; padding: 0 0 10px; }
.ts-domains .fp-chip { text-decoration: none; }
.ts-domains .fp-chip:hover { color: #10696e; }
.ts-name { color: var(--ctp-text); font-weight: 600; overflow-wrap: anywhere; }
.ts-flags { display: inline-flex; gap: 3px; }
.ts-bar { height: 6px; border-radius: 99px; background: var(--ctp-mantle); overflow: hidden; }
.ts-bar i { display: block; height: 100%; background: var(--ctp-blue); border-radius: 99px; }
.ts-n { text-align: right; color: var(--ctp-subtext0); font-size: 12px; }
@container ts (max-width: 420px) { .ts-item { grid-template-columns: minmax(0,1fr) 56px; } .ts-flags, .ts-bar { display: none; } }

/* Toplists tab: in-house brands */
.fp-house { display: flex; flex-wrap: wrap; gap: 6px; }
.fp-best { font-style: normal; font-size: 10.5px; font-weight: 700; color: #2f8a1f; }

/* Toplists views */
.tl-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; }
.tl-views { display: inline-flex; padding: 3px; border-radius: 10px; background: var(--ctp-mantle); }
.tl-view { height: 30px; padding: 0 14px; border: 0; border-radius: 8px; background: none; font: 600 12.5px Inter, sans-serif; color: var(--ctp-subtext0); cursor: pointer; }
.tl-view.is-on { background: var(--ctp-surface0); color: #10696e; box-shadow: 0 1px 2px rgba(45,63,78,.1); }
.tl-countries, .tl-grids { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 12px; align-items: start; }
.tl-grids { grid-template-columns: 1fr; }
.tl-country, .tl-gridBox { background: var(--ctp-surface0); border-radius: 12px; overflow: hidden; box-shadow: 0 1px 2px rgba(45,63,78,.06), 0 6px 18px rgba(45,63,78,.04); }
.tl-cHead { display: flex; align-items: center; gap: 8px; padding: 11px 14px; background: var(--ctp-base); font-size: 13px; color: var(--ctp-text); }
.tl-cHead span { margin-left: auto; font-size: 11.5px; color: var(--ctp-subtext0); }
.tl-rank { list-style: none; margin: 0; padding: 4px 0; }
.tl-rankRow { width: 100%; display: grid; grid-template-columns: 20px 24px minmax(110px, 180px) minmax(0,1fr) auto; gap: 10px; align-items: center; padding: 7px 14px; border: 0; background: none; font: inherit; color: inherit; text-align: left; cursor: pointer; }
.tl-rankRow:hover { background: color-mix(in srgb, var(--ctp-base) 70%, transparent); }
.tl-rankN { font-size: 11px; font-weight: 700; color: var(--ctp-overlay0); text-align: right; }
.tl-logo { width: 24px; height: 24px; border-radius: 6px; background: var(--ctp-mantle); }
.tl-rankName { font-size: 13px; font-weight: 600; color: var(--ctp-text); min-width: 0; overflow-wrap: anywhere; }
.tl-rankMeta { display: inline-flex; align-items: center; gap: 8px; }
.tl-on { font-size: 11.5px; color: var(--ctp-subtext0); white-space: nowrap; text-align: right; }
.tl-pos { display: inline-grid; place-items: center; min-width: 26px; height: 20px; padding: 0 5px; border-radius: 6px; font-size: 11px; font-weight: 700; background: var(--ctp-mantle); color: var(--ctp-subtext0); }
.tl-pos.is-top { background: rgb(64 160 43 / .14); color: #2f8a1f; }
.tl-pos.is-mid { background: rgb(23 146 153 / .12); color: #10696e; }
.tl-onList { list-style: none; margin: 0 14px 8px 64px; padding: 6px 8px; border-radius: 8px; background: var(--ctp-base); display: grid; gap: 4px; }
.tl-onList li { display: grid; grid-template-columns: auto 16px auto minmax(0,1fr); gap: 8px; align-items: center; font-size: 12px; }
.tl-onSite { font-weight: 600; color: var(--ctp-text); }
.tl-onTopic { color: var(--ctp-subtext0); text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tl-onTopic:hover { color: #10696e; text-decoration: underline; }
.tl-gridScroll { overflow-x: auto; }
.tl-grid { border-collapse: separate; border-spacing: 0; width: 100%; font-size: 12px; }
.tl-grid th, .tl-grid td { padding: 6px 10px; border-bottom: 1px solid var(--ctp-crust); }
.tl-grid tbody tr:last-child th, .tl-grid tbody tr:last-child td { border-bottom: 0; }
.tl-gBrand { position: sticky; left: 0; z-index: 1; background: var(--ctp-surface0); text-align: left; white-space: nowrap; font-weight: 600; color: var(--ctp-text); }
.tl-gBrand .fp-bico { margin-right: 8px; }
.tl-gPage { min-width: 120px; max-width: 160px; text-align: center; vertical-align: bottom; font-weight: 600; color: var(--ctp-text); background: var(--ctp-base); }
.tl-gPage .fp-fav { display: block; margin: 0 auto 3px; }
.tl-gPage span { display: block; font-size: 11.5px; }
.tl-gPage small { display: block; font-size: 10.5px; font-weight: 500; color: var(--ctp-subtext0); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tl-gCell { text-align: center; }
@container fp (max-width: 520px) { .tl-onList { margin-left: 14px; } .tl-onList li { grid-template-columns: auto 16px minmax(0,1fr); } .tl-onTopic { grid-column: 3; } }

/* Selection: the picked card, its detail panel and an opened tech tool share one purple highlight; the rest steps back. */
.fp-card { transition: opacity .15s, background-color .15s; }
.fp-cards:has(.fp-card.is-on) .fp-card:not(.is-on) { opacity: .5; }
.ts-entry:has(.ts-item[aria-expanded="true"]) { margin: 0 -8px; padding: 0 8px; border-radius: 8px; border-top-color: transparent;
  background: color-mix(in srgb, #179299 7%, var(--ctp-surface0)); box-shadow: inset 0 0 0 1.5px #179299; }
.ts-item[aria-expanded="true"] .ts-name { color: #10696e; }
.ts-group:has(.ts-item[aria-expanded="true"]) .ts-entry:not(:has(.ts-item[aria-expanded="true"])) { opacity: .55; }
.tl-rank li:has(.tl-rankRow[aria-expanded="true"]) { background: color-mix(in srgb, #179299 7%, var(--ctp-surface0)); box-shadow: inset 3px 0 0 #179299; }
.tl-rankRow[aria-expanded="true"] .tl-rankName { color: #10696e; }

/* By country: where each casino sits on every site of that market */
.tl-sites { display: flex; flex-wrap: wrap; gap: 5px; min-width: 0; }
.tl-site { display: inline-flex; align-items: center; gap: 6px; padding: 2px 3px 2px 7px; border-radius: 7px; background: var(--ctp-base); font-size: 11.5px; color: var(--ctp-text); }
.tl-site.is-off { opacity: .45; }
.tl-site .tl-pos { min-width: 24px; height: 18px; }
@container fp (max-width: 700px) {
  .tl-rankRow { grid-template-columns: 20px 24px minmax(0,1fr) auto; row-gap: 5px; }
  .tl-rankName { grid-column: 3; grid-row: 1; }
  .tl-rankMeta { grid-column: 4; grid-row: 1; }
  .tl-sites { grid-column: 3 / -1; grid-row: 2; }
  .tl-siteName { display: none; }
}

/* Topic match from Jev on each toplist page */
.tl-topic { display: inline-flex; align-items: center; gap: 6px; padding: 2px 4px 2px 8px; border-radius: 7px; font-size: 11.5px; font-weight: 600; text-decoration: none;
  color: var(--ctp-text); background: var(--ctp-mantle); }
.tl-topic b { font-size: 10.5px; padding: 1px 6px; border-radius: 5px; background: var(--ctp-surface0); }
.tl-topicLbl { font-size: 10.5px; font-weight: 600; color: var(--ctp-overlay0); }
.tl-topic.is-sure b { color: #2f8a1f; } .tl-topic.is-likely b { color: #b45309; } .tl-topic.is-unsure b { color: var(--ctp-overlay0); }
.tl-topic.is-sure { box-shadow: inset 0 0 0 1px rgb(64 160 43 / .35); }
.tl-topic.is-likely { box-shadow: inset 0 0 0 1px rgb(223 142 29 / .4); }
.tl-topic.is-none { color: var(--ctp-overlay0); font-weight: 500; }
a.tl-topic:hover { color: #10696e; }
.tl-topic--sm { margin-top: 4px; font-size: 10.5px; max-width: 100%; white-space: normal; text-align: left; }

/* Company detail tabs (Sites, Footprints, Toplists…): one line with icons; scrolls sideways on a phone instead of squashing. */
.co-ctabs { display: flex; flex-wrap: nowrap; align-items: center; gap: 2px; margin-top: 12px; overflow-x: auto; scrollbar-width: none;
  border-bottom: 1px solid var(--ctp-crust); -webkit-overflow-scrolling: touch; }
.co-ctabs::-webkit-scrollbar { display: none; }
.co-ctab { flex: none; display: inline-flex; align-items: center; gap: 7px; height: 38px; padding: 0 12px; border: 0; border-bottom: 2px solid transparent; margin-bottom: -1px;
  background: none; font: 600 12.5px Inter, sans-serif; color: var(--ctp-subtext0); white-space: nowrap; cursor: pointer; }
.co-ctab img { display: inline-block; width: 18px; height: 18px; object-fit: contain; flex: none; opacity: .85; }
.co-ctab small { font-size: 10.5px; font-weight: 600; color: var(--ctp-overlay0); }
.co-ctab:hover { color: var(--ctp-text); }
.co-ctab:hover img { opacity: 1; }
.co-ctab.is-on { color: #10696e; border-bottom-color: #179299; }
.co-ctab.is-on img { opacity: 1; }
.co-ctab:disabled { opacity: .4; cursor: not-allowed; }
.co-ctab:focus-visible { outline: 2px solid #179299; outline-offset: -2px; border-radius: 6px; }

/* Website Footprints tab (SiteFootprintsPanel.js): who runs the site, then the same rows as a company. */
.sf-verdict { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 18px; max-width: 1080px; padding: 14px 16px; border-radius: 12px;
  background: var(--ctp-surface0); box-shadow: 0 1px 2px rgba(45,63,78,.06), 0 6px 18px rgba(45,63,78,.04); border-left: 4px solid #179299; }
.sf-verdict.is-pool { border-left-color: var(--ctp-overlay0); }
.sf-fav { width: 28px; height: 28px; border-radius: 7px; background: var(--ctp-base); }
.sf-verdictMain { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 10px; min-width: 0; }
.sf-by { font-size: 12.5px; color: var(--ctp-subtext0); }
.sf-company { font-size: 16px; font-weight: 700; color: #10696e; text-decoration: none; }
.sf-company:hover { text-decoration: underline; }
.sf-pool { font-size: 14px; color: var(--ctp-text); }
.sf-market { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; color: var(--ctp-subtext0); }
.sf-leads { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin-left: auto; }
.sf-leadsLabel { font-size: 11.5px; font-weight: 600; color: var(--ctp-overlay0); }
.sf-lead { display: inline-flex; align-items: center; gap: 7px; height: 28px; padding: 0 10px; border-radius: 8px; text-decoration: none;
  background: var(--ctp-base); box-shadow: inset 0 0 0 1.5px var(--ctp-crust); font-size: 12px; color: var(--ctp-text); }
.sf-lead span { font-size: 11px; color: var(--ctp-subtext0); }
.sf-lead:hover { box-shadow: inset 0 0 0 1.5px #179299; }
.sf-table .fp-openHead, .sf-table .fp-openRow { grid-template-columns: minmax(0, 1fr) 260px 100px; }
.sf-also { display: grid; gap: 5px; font-size: 12px; color: var(--ctp-subtext0); }
.sf-alsoTop { display: flex; align-items: center; gap: 6px; }
.sf-alsoTop b { color: var(--ctp-text); }
.sf-favs { display: inline-flex; }
.sf-favs a { display: inline-grid; place-items: center; width: 20px; height: 20px; border-radius: 6px; background: var(--ctp-surface0); box-shadow: 0 0 0 2px var(--ctp-surface0), 0 0 0 3px var(--ctp-crust); }
.sf-favs a + a { margin-left: -4px; }
.sf-favs img { width: 14px; height: 14px; border-radius: 3px; }
.sf-cos { display: flex; flex-wrap: wrap; gap: 4px; }
.sf-co { display: inline-flex; align-items: center; gap: 5px; padding: 2px 7px; border-radius: 6px; background: rgb(23 146 153 / .08); color: #10696e; font-size: 11.5px; font-weight: 600; text-decoration: none; }
.sf-co i { font-style: normal; font-weight: 700; opacity: .7; }
.sf-co:hover { background: rgb(23 146 153 / .16); }
@container fp (max-width: 639px) {
  .sf-leads { margin-left: 0; }
  .sf-table .fp-openRow { grid-template-columns: minmax(0, 1fr) auto; }
  .sf-also { padding-left: 38px; }
}
.co-sitePanel { padding: 14px 0 4px; }

/* Sites sidebar, Niche view: each niche chip carries its Oasis tag icon. */
.co-nicheChips { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 8px; }
.co-nicheChip { display: inline-flex; align-items: center; gap: 6px; height: 28px; padding: 0 9px 0 6px; border: 0; border-radius: 8px; cursor: pointer;
  background: var(--ctp-surface0); box-shadow: inset 0 0 0 1px var(--ctp-crust); font: 500 11.5px Inter, sans-serif; color: var(--ctp-subtext0); white-space: nowrap; }
.co-nicheChip img { display: inline-block; width: 18px; height: 18px; object-fit: contain; flex: none; }
.co-nicheChip:hover { color: var(--ctp-text); box-shadow: inset 0 0 0 1px var(--ctp-overlay0); }
.co-nicheChip.is-on { background: rgb(23 146 153 / .1); box-shadow: inset 0 0 0 1.5px #179299; color: #10696e; font-weight: 600; }

/* Classification column in the company sites table: icon + type, who decided it, click to change. */
.fp-grid th.fp-gClass { text-align: left; min-width: 170px; }
td.fp-gClass { white-space: nowrap; }
.fp-class { display: inline-flex; align-items: center; gap: 8px; max-width: 230px; padding: 4px 8px 4px 5px; border: 0; border-radius: 8px; background: none; cursor: pointer; text-align: left; font: inherit; }
.fp-class:hover { background: var(--ctp-base); box-shadow: inset 0 0 0 1px var(--ctp-crust); }
.fp-classIco { width: 22px; height: 22px; flex: none; display: grid; place-items: center; }
.fp-classIco img, .fp-classIco svg { width: 20px !important; height: 20px !important; display: block !important; }
.fp-classText { display: grid; line-height: 1.2; min-width: 0; }
.fp-classText b { font-size: 12px; font-weight: 600; color: var(--ctp-text); overflow: hidden; text-overflow: ellipsis; }
.fp-classText i { font-style: normal; font-size: 10.5px; color: var(--ctp-overlay0); }
.fp-classText i.fp-src--human { color: #10696e; font-weight: 600; }
.fp-classNone { display: inline-flex; gap: 4px; }
.fp-jev, .fp-classSet { height: 26px; padding: 0 9px; border: 0; border-radius: 7px; cursor: pointer; font: 600 11.5px Inter, sans-serif; }
.fp-jev { background: rgb(23 146 153 / .1); color: #10696e; box-shadow: inset 0 0 0 1px rgb(23 146 153 / .35); }
.fp-jev:hover { background: rgb(23 146 153 / .18); }
.fp-jev:disabled { opacity: .6; cursor: wait; }
.fp-classSet { background: var(--ctp-surface0); color: var(--ctp-subtext0); box-shadow: inset 0 0 0 1px var(--ctp-crust); }

/* Evidence tiers above the proof columns, and the weighted score per site. */
.fp-grid thead tr.fp-tierRow th { height: 26px; position: static; border-bottom: 0; font-size: 10.5px; font-weight: 700; text-align: center; }
.fp-tierHead { color: var(--ctp-text); border-left: 2px solid var(--ctp-surface0); }
.fp-tierHead span { font-weight: 500; color: var(--ctp-overlay0); }
.fp-tierHead.fp-tier--1 { background: rgb(64 160 43 / .1); }
.fp-tierHead.fp-tier--2 { background: rgb(23 146 153 / .1); }
.fp-tierHead.fp-tier--3 { background: rgb(30 102 245 / .07); }
.fp-tierHead.fp-tier--4 { background: var(--ctp-mantle); }
.fp-gCol.is-empty img { opacity: .35; filter: grayscale(1); }
.fp-gCol.is-empty span { opacity: .6; }
.fp-gScore { width: 64px; text-align: center; }
.fp-score { display: inline-grid; place-items: center; min-width: 34px; height: 22px; padding: 0 6px; border-radius: 6px; font-size: 11.5px; font-weight: 700; }
.fp-score.is-high { background: rgb(64 160 43 / .14); color: #2f8a1f; }
.fp-score.is-mid { background: rgb(23 146 153 / .12); color: #10696e; }
.fp-score.is-low { background: var(--ctp-mantle); color: var(--ctp-subtext0); }
.fp-grid .fp-gCol { width: 50px; padding: 0 2px; }
.fp-grid .fp-gCol span { font-size: 9.5px; }
.fp-gLead { max-width: 200px; }
.fp-gDomain { max-width: 170px; }
.fp-class { box-shadow: inset 0 0 0 1px transparent; }
.fp-classEdit { width: 22px; height: 22px; margin-left: 2px; flex: none; display: grid; place-items: center; border-radius: 6px; color: var(--ctp-overlay0); background: var(--ctp-base); }
.fp-classEdit svg { width: 13px; height: 13px; }
.fp-class:hover .fp-classEdit { color: #fff; background: #179299; }

/* In-row classification dropdown + separate Jev column. */
.fp-grid th.fp-gClass, td.fp-gClass { min-width: 210px; }
.fp-classCell { display: flex; align-items: center; gap: 4px; }
.fp-classCell .classification-select { flex: 1; min-width: 0; }
.fp-classCell.is-saving { opacity: .55; }
button.fp-classEdit { border: 0; cursor: pointer; }
button.fp-classEdit:hover { color: #fff; background: #179299; }
.fp-classBy { display: block; margin: 1px 0 0 4px; font-style: normal; font-size: 10.5px; color: var(--ctp-overlay0); }
.fp-classBy.fp-src--human { color: #10696e; font-weight: 600; }
.fp-grid th.fp-gJev, td.fp-gJev { width: 96px; text-align: left; }
.fp-jevPct { display: grid; gap: 3px; width: 70px; font-size: 12px; }
.fp-jevPct b { color: var(--ctp-text); }
.fp-jevSaid { display: block; margin-top: 2px; font-size: 10.5px; color: #b45309; white-space: nowrap; }
.fp-miss { display: inline-block; font-style: normal; font-size: 13px; line-height: 1; font-weight: 600; color: var(--ctp-surface2, #c4c9d4); vertical-align: middle; }
.fp-miss--diff { color: #b45309; font-size: 14px; }
.fp-miss--unknown { color: var(--ctp-overlay0); font-size: 11px; }
.fp-missList { list-style: none; margin: 4px 0 0; padding: 0; flex-basis: 100%; display: grid; gap: 3px; }
.fp-missList li { display: grid; grid-template-columns: 16px 70px 14px minmax(0, 1fr); align-items: center; gap: 6px; font-size: 11.5px; color: var(--ctp-subtext0); }
.fp-missList img { width: 16px; height: 16px; }
.fp-missList b { font-weight: 600; color: var(--ctp-text); }
.fp-missList span { overflow-wrap: anywhere; }
.fp-missList li { grid-template-columns: 14px minmax(70px, max-content) minmax(0, 1fr); }
/* An open row's details stay in view when the table is scrolled sideways. */
.fp-gDetailBody { position: sticky; left: 0; box-sizing: border-box; max-width: calc(100cqw - 4px); }
td.fp-gSite { z-index: 2; }
.fp-gRow.is-open td.fp-gSite, .fp-gRow:hover td.fp-gSite { background: color-mix(in srgb, #179299 5%, var(--ctp-surface0)); }

/* Even rows: every cell centred, fixed row height, the "who decided" line always takes its space. */
.fp-grid tbody tr.fp-gRow > td { height: 58px; vertical-align: middle; }
td.fp-gClass { padding-top: 6px; padding-bottom: 6px; }
.fp-classCell .st-table-select-trigger { height: 30px; }
.fp-classBy { line-height: 14px; height: 14px; margin-top: 3px; white-space: nowrap; }
.fp-classBy.fp-src--none { color: var(--ctp-overlay0); opacity: .7; }
/* Countries: own column, every real market with its share. */
.fp-grid th.fp-gCountry { text-align: left; min-width: 150px; }
td.fp-gCountry { white-space: nowrap; }
.fp-countries { display: grid; gap: 3px; }
.fp-ctry { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--ctp-text); }
.fp-ctry i { font-style: normal; font-size: 11px; color: var(--ctp-overlay0); }
.fp-ctryMore { font-size: 11px; font-weight: 600; color: var(--ctp-overlay0); }

/* One line per row (Mark, 7 Oct): compact cells, flags only, source as a small chip, Jev % beside its bar. */
.fp-grid tbody tr.fp-gRow > td { height: 44px; padding-top: 0; padding-bottom: 0; }
td.fp-gClass { padding-top: 0; padding-bottom: 0; }
.fp-classCell .st-table-select-trigger { height: 28px; }
.fp-grid th.fp-gCountry { min-width: 0; width: 92px; }
.fp-flagsRow { display: inline-flex; align-items: center; gap: 4px; }
.fp-flagsRow .fp-flag { width: 18px; height: 13px; }
.fp-srcChip { flex: none; height: 18px; padding: 0 6px; border-radius: 5px; display: inline-grid; place-items: center; font-size: 10px; font-weight: 700; background: var(--ctp-mantle); color: var(--ctp-subtext0); }
.fp-srcChip.fp-src--human { background: rgb(23 146 153 / .12); color: #10696e; }
.fp-srcChip.fp-src--jev { background: rgb(30 102 245 / .1); color: #1e4fb8; }
.fp-jevPct { display: inline-flex; align-items: center; gap: 7px; width: auto; }
.fp-jevPct .fp-bar { width: 44px; }
.fp-jevPct b { font-size: 12px; }
.fp-jevSaid { display: inline; margin: 0; font-size: 14px; font-weight: 700; color: #b45309; cursor: help; }
.fp-grid th.fp-gJev, td.fp-gJev { width: 110px; }

/* No sideways scroll (Mark, 7 Oct): proof types sit as small slots inside one column per tier. */
.fp-gridWrap { overflow-x: visible; }
.fp-grid { table-layout: auto; font-size: 12px; }
.fp-grid thead th { height: 46px; font-size: 10.5px; }
.fp-gDomain { font-size: 12px; max-width: 150px; margin: 0 4px 0 7px; }
.fp-grid td { padding: 0 6px; }
td.fp-gSite, .fp-grid th.fp-gSite { padding-left: 10px; }
.fp-grid th.fp-gCountry { width: 70px; }
.fp-grid th.fp-gScore, td.fp-gScore { width: 44px; }
.fp-grid th.fp-gClass, td.fp-gClass { min-width: 0; width: 196px; }
.fp-classCell { display: grid; grid-template-columns: 136px 28px 22px; align-items: center; gap: 4px; }
.fp-classCell .st-table-select-trigger { height: 28px; font-size: 11.5px; padding-left: 6px; padding-right: 4px; }
.fp-srcChip { justify-self: start; }
.fp-grid th.fp-gJev, td.fp-gJev { width: 92px; }
.fp-jevPct .fp-bar { width: 34px; }
.fp-jev { height: 24px; padding: 0 8px; font-size: 11px; }
.fp-gTier { text-align: center; }
.fp-grid th.fp-gTier { vertical-align: middle; padding: 4px 6px; }
.fp-tierName { display: block; font-size: 10px; font-weight: 700; color: var(--ctp-subtext0); margin-bottom: 3px; white-space: nowrap; }
.fp-tierName i { font-style: normal; font-weight: 500; color: var(--ctp-overlay0); }
.fp-slots { display: inline-flex; gap: 2px; }
.fp-slots img { width: 16px; height: 16px; margin: 0 2px; display: inline-block !important; }
.fp-slots img.is-empty { opacity: .3; filter: grayscale(1); }
.fp-slot { width: 20px; height: 20px; display: inline-grid; place-items: center; border-radius: 5px; }
.fp-slot.is-focus, .fp-slots img.is-focus { background: rgb(23 146 153 / .1); }
.fp-slot .fp-dot { width: 10px; height: 10px; }
.fp-grid th.fp-gTier.fp-tier--1 { background: rgb(64 160 43 / .07); }
.fp-grid th.fp-gTier.fp-tier--2 { background: rgb(23 146 153 / .07); }
.fp-grid th.fp-gTier.fp-tier--3 { background: rgb(30 102 245 / .05); }
td.fp-gTier + td.fp-gTier, th.fp-gTier + th.fp-gTier { border-left: 1px solid var(--ctp-crust); }
.fp-flagsRow { display: flex; }
.fp-gCountry .fp-muted { font-size: 11px; }
.fp-slot { width: 16px; height: 18px; }
.fp-slots { gap: 1px; }
.fp-slots img { width: 14px; height: 14px; margin: 0 1px; }
.fp-grid td.fp-gTier, .fp-grid th.fp-gTier { padding: 0 3px; }
.fp-grid th.fp-gCountry { width: 62px; }
.fp-grid th.fp-gJev, td.fp-gJev { width: 84px; }
.fp-jevPct { gap: 5px; }
.fp-jevPct .fp-bar { width: 26px; }
.fp-gDomain { max-width: 140px; }
.fp-grid th.fp-gClass, td.fp-gClass { width: 214px; }
.fp-classCell { grid-template-columns: 156px 26px 22px; gap: 3px; }
.fp-srcChip { padding: 0 4px; }
.fp-classCell .st-table-select-trigger { font-size: 11px; gap: 5px; padding-left: 5px; padding-right: 3px; }
.fp-classCell .st-table-select-trigger img, .fp-classCell .st-table-select-trigger svg { width: 16px !important; height: 16px !important; }
.fp-gDomain { max-width: 132px; }
.fp-grid th.fp-gClass, td.fp-gClass { width: 226px; }
.fp-classCell { grid-template-columns: 168px 26px 22px; }
.fp-grid th.fp-gScore, td.fp-gScore { width: 40px; }
.fp-score { min-width: 30px; }
/* Fits on a normal screen; on a narrow one the table scrolls inside its own box, never the whole page. */
.fp-gridWrap { overflow-x: auto; }
@container fp (max-width: 820px) {
  .fp-grid th.fp-gCountry, td.fp-gCountry, .fp-grid th.fp-gScore, td.fp-gScore { display: none; }
}
@container fp (max-width: 700px) {
  .fp-srcChip { display: none; }
  .fp-classCell { grid-template-columns: 150px 22px; }
  .fp-grid th.fp-gClass, td.fp-gClass { width: 180px; }
  .fp-jevPct .fp-bar { display: none; }
  .fp-grid th.fp-gJev, td.fp-gJev { width: 64px; }
  .fp-gDomain { max-width: 110px; }
}
.fp-jev { white-space: nowrap; }
@container fp (max-width: 700px) { .fp-jev { padding: 0 6px; font-size: 10.5px; } }

/* Site column only as wide as a domain needs; spare width goes to the tier columns. */
.fp-grid th.fp-gSite, td.fp-gSite { width: 170px; max-width: 170px; }
.fp-gDomain { max-width: 132px; }
/* Countries: the main one, then "+N" opens the full list. */
.fp-grid th.fp-gCountry, td.fp-gCountry { width: 64px; position: relative; }
.fp-ctryMore { height: 18px; padding: 0 5px; border: 0; border-radius: 5px; cursor: pointer; background: var(--ctp-mantle); font: 700 10.5px Inter, sans-serif; color: var(--ctp-subtext0); }
.fp-ctryMore:hover, .fp-ctryMore[aria-expanded="true"] { background: rgb(23 146 153 / .14); color: #10696e; }
.fp-ctryPop { position: absolute; z-index: 5; top: calc(100% - 6px); left: 4px; min-width: 190px; display: grid; gap: 6px; padding: 10px 12px; border-radius: 10px;
  background: var(--ctp-surface0); box-shadow: 0 0 0 1px var(--ctp-crust), 0 10px 26px rgba(45,63,78,.16); text-align: left; white-space: nowrap; }
.fp-ctryPop b { font-size: 11.5px; color: var(--ctp-text); }
.fp-ctryLine { display: grid; grid-template-columns: 18px 1fr auto; align-items: center; gap: 7px; font-size: 12px; color: var(--ctp-text); }
.fp-ctryLine i { font-style: normal; font-size: 11px; color: var(--ctp-overlay0); }

/* Lighter classification cell (Mark, 7 Oct): no boxed dropdown, source in its own column, pencil on hover. */
.fp-grid th.fp-gClass, td.fp-gClass { width: 176px; }
.fp-classCell { grid-template-columns: minmax(0, 1fr) 22px; gap: 2px; }
.fp-classCell .st-table-select-trigger { height: 26px; border: 0 !important; box-shadow: none !important; background: transparent !important; padding: 0 4px; border-radius: 6px; }
.fp-classCell .st-table-select-trigger:hover, .fp-classCell .st-table-select-trigger[aria-expanded="true"] { background: var(--ctp-base) !important; box-shadow: inset 0 0 0 1px var(--ctp-crust) !important; }
.fp-classCell .st-table-select-trigger svg:last-child { opacity: .45; }
button.fp-classEdit { opacity: 0; background: none; }
.fp-gRow:hover button.fp-classEdit, button.fp-classEdit:focus-visible { opacity: 1; }
.fp-grid th.fp-gBy, td.fp-gBy { width: 46px; text-align: left; padding-left: 2px; }
@container fp (max-width: 700px) {
  .fp-grid th.fp-gBy, td.fp-gBy { display: none; }
  .fp-classCell { grid-template-columns: minmax(0, 1fr) 22px; }
  .fp-grid th.fp-gClass, td.fp-gClass { width: 168px; }
}

/* Who set it: the person's initial (as on the Training page), J for Jev, a spark for the AI, a clock for the old read. */
.fp-grid th.fp-gBy, td.fp-gBy { width: 34px; text-align: center; padding: 0 4px; }
.fp-who { width: 22px; height: 22px; border-radius: 50%; display: inline-grid; place-items: center; font-size: 11px; font-weight: 700; cursor: help; }
.fp-who svg { width: 13px; height: 13px; }
.fp-who--human { background: #179299; color: #fff; }
.fp-who--jev { background: rgb(30 102 245 / .12); color: #1e4fb8; }
.fp-who--ai { background: rgb(223 142 29 / .14); color: #b45309; }
.fp-who--saved { background: var(--ctp-mantle); color: var(--ctp-overlay0); }
/* Breathing space: roomier cells, and the classification name always shows in full. */
.fp-grid td { padding: 0 8px; }
.fp-grid tbody tr.fp-gRow > td { height: 46px; }
.fp-grid th.fp-gClass, td.fp-gClass { width: 196px; }
.fp-classCell .st-table-select-trigger { font-size: 11.5px; }
.fp-grid td.fp-gTier, .fp-grid th.fp-gTier { padding: 0 6px; }
.fp-grid th.fp-gClass, td.fp-gClass { width: 214px; }
.fp-classCell .st-table-select-trigger svg { flex: none; width: 12px; }

/* Sites table v3 (Mark, 7 Oct): one column per proof type under tier headings, sort by any heading, filter bar,
   drag headings to move, drag the right edge to resize. The table takes only the width its columns need. */
.fp-grid--cols { table-layout: fixed; width: max-content; max-width: none; }
.fp-gridWrap { overflow-x: auto; }
.fp-grid--cols thead tr.fp-tierRow th { height: 24px; }
.fp-grid--cols .fp-tierHead { font-size: 10.5px; border-left: 1px solid var(--ctp-crust); }
.fp-grid--cols thead tr:last-child th { height: 50px; position: relative; padding: 0 6px; }
.fp-th { user-select: none; }
.fp-th[draggable="true"] { cursor: grab; }
.fp-th.is-drop { box-shadow: inset 2px 0 0 #179299; background: rgb(23 146 153 / .06); }
.fp-sort { display: inline-flex; align-items: center; gap: 4px; max-width: 100%; border: 0; background: none; padding: 2px 0; cursor: pointer; font: inherit; font-weight: 600; color: inherit; }
.fp-sort:hover { color: var(--ctp-text); }
.fp-sort--col { flex-direction: column; gap: 3px; width: 100%; }
.fp-sort--col img { width: 20px; height: 20px; display: block !important; }
.fp-sort--col span { display: inline-flex; align-items: center; gap: 2px; font-size: 9.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.fp-gCol.is-empty .fp-sort--col img { opacity: .35; filter: grayscale(1); }
.fp-sortArrow { width: 0; height: 0; border-left: 3.5px solid transparent; border-right: 3.5px solid transparent; border-bottom: 4px solid currentColor; opacity: 0; flex: none; }
.fp-sort:hover .fp-sortArrow { opacity: .35; }
.fp-sortArrow.is-on { opacity: 1 !important; color: #10696e; }
.fp-sortArrow.is-desc { transform: rotate(180deg); }
.fp-resize { position: absolute; top: 0; right: -3px; width: 7px; height: 100%; cursor: col-resize; z-index: 2; }
.fp-resize:hover, body.fp-resizing .fp-resize:active { background: rgb(23 146 153 / .35); }
body.fp-resizing { cursor: col-resize; user-select: none; }
.fp-grid--cols td { overflow: hidden; text-overflow: ellipsis; }
.fp-grid--cols td.fp-gCountry { overflow: visible; }
.fp-grid--cols td.fp-gCell { text-align: center; }
.fp-grid--cols td.fp-gCell + td.fp-gCell { border-left: 0; }
.fp-grid--cols td.fp-gCell.fp-tier--1 { background: rgb(64 160 43 / .025); }
.fp-grid--cols td.fp-gCell.fp-tier--2 { background: rgb(23 146 153 / .025); }
.fp-grid--cols .fp-gDomain { max-width: calc(100% - 26px); }
.fp-grid--cols .fp-classCell { grid-template-columns: minmax(0, 1fr) 22px; }
/* filter bar */
.fp-filters { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 2px 0 10px; }
.fp-fSearch { height: 30px; width: 180px; padding: 0 10px; border: 0; border-radius: 8px; background: var(--ctp-surface0); box-shadow: inset 0 0 0 1.5px var(--ctp-crust); font: 500 12px Inter, sans-serif; color: var(--ctp-text); }
.fp-fSearch:focus { outline: none; box-shadow: inset 0 0 0 1.5px #179299; }
.fp-filters .st-table-select-trigger { height: 30px; font-size: 12px; min-width: 128px; }
.fp-fClear { height: 30px; padding: 0 10px; border: 0; border-radius: 8px; background: none; font: 600 12px Inter, sans-serif; color: #10696e; cursor: pointer; }
.fp-fClear:hover { background: rgb(23 146 153 / .08); }
.fp-fCount { margin-left: auto; font-size: 12px; color: var(--ctp-subtext0); }
@container fp (max-width: 639px) { .fp-fSearch { width: 100%; } .fp-fCount { margin-left: 0; } }

/* Company summary: description and saved research notes, kept from the old reference list. */
.fp-about { display: grid; gap: 10px; max-width: 1080px; }
.fp-aboutText { margin: 0; font-size: 13px; line-height: 1.5; color: var(--ctp-subtext0); }
.fp-notes { padding: 12px 14px; border-radius: 12px; background: var(--ctp-surface0); box-shadow: 0 1px 2px rgba(45,63,78,.06), 0 6px 18px rgba(45,63,78,.04); }
.fp-notesHead { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 700; color: var(--ctp-text); }
.fp-notesHead img { width: 22px; height: 22px; }
.fp-notesHead i { font-style: normal; font-weight: 500; font-size: 11.5px; color: var(--ctp-overlay0); }
.fp-notes ul { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 6px; }
.fp-notes li { display: grid; gap: 2px; padding: 8px 10px; border-radius: 8px; background: var(--ctp-base); }
.fp-notes li b { font-size: 12.5px; font-weight: 600; color: var(--ctp-text); overflow-wrap: anywhere; }
.fp-notes li span { font-size: 11.5px; line-height: 1.45; color: var(--ctp-subtext0); }
.fp-notesMore { margin-top: 8px; border: 0; cursor: pointer; }
.fp-keyTag { display: inline-block; margin-left: 8px; padding: 1px 6px; border-radius: 5px; font-size: 10px; font-weight: 700; vertical-align: 1px; background: rgb(23 146 153 / .12); color: #10696e; cursor: help; }
