/* The hub's additions to the owner's site style (style.css is the owner's own, unchanged). */
.site-signin { padding: 8px 14px; font-size: 14px; }
@media (max-width: 760px) { .site-signin, .header-actions .mkt-btn-cta { display: none; } }
.spark { width: 100%; height: 56px; display: block; }
.risk-low { color: var(--profit); border-color: color-mix(in srgb, var(--profit) 45%, transparent); }
.risk-medium { color: var(--kadu); border-color: color-mix(in srgb, var(--kadu) 45%, transparent); }
.risk-high, .risk-very-high { color: var(--loss); border-color: color-mix(in srgb, var(--loss) 45%, transparent); }
/* the card's three figures (owner, 2026-11-07: option A's columns at option B's sizes) */
.card-figs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--border); }
.card-figs > div { display: flex; flex-direction: column; min-width: 0; }
.cf-l { font-size: 13px; color: var(--muted); white-space: nowrap; }
.cf-v { font-family: 'IBM Plex Mono', monospace; font-size: 17px; font-weight: 600; margin: 3px 0 2px; white-space: nowrap; }
.cf-v.up { color: var(--profit); } .cf-v.down { color: var(--loss); }
.cf-s { font-size: 11.5px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.site-count { margin: 4px 0 14px; font-size: 13px; }

.site-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; margin: 18px 0 26px; }
.site-kpis > div { background: var(--panel); border: 1px solid var(--border); border-radius: 12px; padding: 14px 16px; display: flex; flex-direction: column; gap: 2px; }
.site-kpis span { color: var(--muted); font-size: 12.5px; }
.site-kpis b { font-family: 'IBM Plex Mono', monospace; font-size: 22px; font-weight: 600; }
.site-kpis small { color: var(--muted); font-size: 12px; }
.site-kpis .up, .site-years .up { color: var(--profit); }
.site-kpis .down, .site-years .down { color: var(--loss); }

.chart-section .chart-box { position: relative; height: 320px; background: var(--panel); border: 1px solid var(--border); border-radius: 12px; padding: 12px; margin-bottom: 20px; }
.chart-section .dd-chart-box { height: 200px; }
.site-years td { white-space: nowrap; }
.site-actions { display: flex; flex-wrap: wrap; gap: 10px; margin: 18px 0 8px; }
.ledger.single { grid-template-columns: 1fr 1px 1fr; }
@media (max-width: 860px) { .ledger.single { grid-template-columns: 1fr; } .ledger.single .ledger-spine { display: none; } }
.small { font-size: 13px; }

.site-risk { padding: 26px 0 30px; }
.site-risk p { max-width: 900px; font-size: 13px; line-height: 1.6; margin: 0 0 8px; }
.site-search-l { flex: 1 1 260px; }
.site-search { width: 100%; min-width: 220px; padding: 9px 12px; border-radius: 8px; border: 1px solid var(--border); background: var(--panel); color: var(--bone); font: inherit; }
div.site-cell { display: contents; }
div.site-cell[hidden] { display: none; }

/* the strategies table (owner, 2026-11-07: the portal's style in the site's theme; phones get the cards) */
.st-wrap { overflow-x: auto; border: 1px solid var(--border); border-radius: 12px; background: var(--panel); }
.st-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.st-table th.n { text-align: right; }
.st-table th { font-size: 10.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); font-weight: 600; text-align: left; padding: 9px 8px; border-bottom: 1px solid var(--border); line-height: 1.25; vertical-align: bottom; background: var(--panel2); }
.st-table td { padding: 9px 8px; border-bottom: 1px solid var(--border); vertical-align: middle; }
.st-table tbody tr:last-child td { border-bottom: 0; }
.st-table tbody tr:hover td { background: var(--panel2); }
.st-table .n { text-align: right; font-family: 'IBM Plex Mono', monospace; white-space: nowrap; }
.st-table .up { color: var(--profit); } .st-table .down { color: var(--loss); }
.st-sep { border-left: 1px solid var(--border); }
.st-name { white-space: nowrap; }
.st-name a { font-family: 'Space Grotesk', sans-serif; font-weight: 600; font-size: 14px; color: var(--bone); text-decoration: none; }
.st-name a:hover { color: var(--kadu); }
.st-risk { display: inline-block; margin-left: 7px; font-size: 10.5px; padding: 1px 7px; border-radius: 5px; border: 1px solid currentColor; vertical-align: 1px; }
.st-coins { font-weight: 500; white-space: nowrap; }
.st-rules { font-size: 11.5px; color: var(--muted); margin-top: 2px; max-width: 360px; }
.st-tri { white-space: nowrap; letter-spacing: 2px; line-height: 1; }
.st-deploy { display: inline-block; background: var(--kadu); color: var(--ink); font-weight: 600; font-size: 12px; padding: 6px 11px; border-radius: 7px; white-space: nowrap; text-decoration: none; }
.st-deploy:hover { filter: brightness(1.08); }
.st-cards { display: none; }
@media (max-width: 900px) { .st-wrap { display: none; } .st-cards { display: grid; } }
tr.site-cell[hidden] { display: none; }

/* a strategy's page (owner, 2026-11-07): one figure each, as on the list and the card */
.site-chart-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.site-scale { display: inline-flex; border: 1px solid var(--border); border-radius: 8px; overflow: hidden; }
.site-scale button { background: transparent; color: var(--muted); border: 0; padding: 5px 12px; font: inherit; font-size: 12.5px; cursor: pointer; }
.site-scale button.on { background: var(--panel2); color: var(--bone); }
.site-note { margin: -8px 0 22px; }
.site-two { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 18px; margin-bottom: 18px; }
@media (max-width: 860px) { .site-two { grid-template-columns: 1fr; } }
.site-panel { background: var(--panel); border: 1px solid var(--border); border-radius: 12px; padding: 16px 18px; }
.site-panel .variant-title { margin: 0 0 10px; font-size: 18px; }
.site-panel .stat-table { width: 100%; }
.site-panel .stat-table td { padding: 7px 0; border-bottom: 1px solid var(--border); }
.site-panel .stat-table tr:last-child td { border-bottom: 0; }
.site-panel .stat-value { text-align: right; font-family: 'IBM Plex Mono', monospace; }
.site-panel .up { color: var(--profit); } .site-panel .down { color: var(--loss); }
.site-cta .site-actions { margin: 14px 0 10px; }

/* the Stage 5 popups on the list (owner, 2026-11-07: "the exact format except the colours"): the hub's own layout
   (lab/assets/app.css + pickgrid.css), its colour names pointed at the site's theme */
.st-row { cursor: pointer; }
.st-row:focus-visible td { outline: none; background: var(--panel2); }
.st-fig { background: none; border: 0; padding: 0; font: inherit; cursor: pointer; text-decoration: underline dotted; text-underline-offset: 3px; }
.st-fig.up { color: var(--profit); } .st-fig.down { color: var(--loss); }
#bp-dlg, #pk-info, #pk-pop { --card: var(--panel); --text: var(--bone); --accent: var(--kadu); --pos: var(--profit); --neg: var(--loss); --head-row: var(--panel2);
  font: 14px/1.45 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
#bp-dlg *, #pk-info * { box-sizing: border-box; }
#bp-dlg .pos, #pk-info .pos { color: var(--pos); }
#bp-dlg .neg, #pk-info .neg { color: var(--neg); }
#bp-dlg .muted, #pk-info .muted { color: var(--muted); }
#bp-dlg .small, #pk-info .small { font-size: 12px; }
#bp-dlg .nowrap { white-space: nowrap; }
#bp-dlg h4 { margin: 1.33em 0; }
#bp-dlg .table-wrap { overflow: auto; max-height: 640px; border: 1px solid var(--border); border-radius: 8px; }
#bp-dlg table, #pk-info table { border-collapse: collapse; width: 100%; font-size: 12.5px; font-variant-numeric: tabular-nums; }
#bp-dlg th, #bp-dlg td, #pk-info td { padding: 6px 9px; border-bottom: 1px solid var(--border); text-align: right; white-space: nowrap; }
#bp-dlg th { position: sticky; top: 0; background: var(--head-row); font-weight: 600; z-index: 1; }
#bp-dlg .btn { display: inline-block; padding: 8px 14px; border-radius: 7px; border: 1px solid var(--border); background: var(--card); color: var(--text); font: inherit; font-weight: 600; cursor: pointer; }
#bp-dlg .btn:hover { border-color: var(--accent); color: var(--accent); }
#bp-dlg .btn.small { padding: 5px 10px; font-size: 12px; }
.pk-pop { position: absolute; z-index: 50; min-width: 210px; max-width: 280px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 10px; background: var(--card); color: var(--text); box-shadow: 0 8px 24px rgba(0,0,0,.18); font-size: 13px; overflow-y: auto; }
.pk-pop[hidden] { display: none; }
.pk-pop h4 { margin: 0 0 8px; font-size: 13px; }
.pk-info { min-width: 240px; max-width: 340px; }
.pk-itable { width: 100%; margin: 8px 0; border-collapse: collapse; table-layout: auto; }
#pk-info .pk-itable td { padding: 3px 6px; border-top: 1px solid var(--border); border-bottom: 0; white-space: nowrap; }
.pk-info .pk-itable tr.small td { white-space: normal; vertical-align: bottom; line-height: 1.2; }
.pk-info:has(.s3-ddpop) { width: 560px !important; max-width: calc(100vw - 16px) !important; overflow-x: hidden; }
#pk-info .s3-ddpop .pk-itable td { white-space: normal; overflow-wrap: anywhere; }
#pk-info .s3-ddpop .pk-itable td.num { white-space: nowrap; width: 1%; padding-left: 12px; }
/* the header popups of the strategies table (assets/sitegrid.js: the hub's own, pickgrid.css) */
.st-table thead th[data-k] { cursor: pointer; user-select: none; }
.st-table thead th[data-k]:hover { color: var(--bone); }
.st-table thead th.pk-f { color: var(--kadu); }
.st-table .pk-ind { margin-left: 3px; color: var(--kadu); font-size: 9px; }
.st-hint { font-size: 12px; }
.st-clear { background: none; border: 0; padding: 0; margin-left: 8px; font: inherit; font-size: 12.5px; color: var(--kadu); cursor: pointer; text-decoration: underline dotted; text-underline-offset: 3px; }
.st-clear[hidden] { display: none; }
@media (min-width: 901px) { .filter-bar .st-mob { display: none; } }
@media (max-width: 900px) { .st-hint { display: none; } }
tr.st-row[hidden] { display: none; }
#pk-pop { font: 13px/1.45 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; max-width: 300px; }
#pk-pop .pk-list { padding-right: 6px; }
#pk-pop .muted { color: var(--muted); } #pk-pop .small { font-size: 12px; }
#pk-pop .btn { display: inline-block; padding: 5px 10px; border-radius: 7px; border: 1px solid var(--border); background: var(--card); color: var(--text); font: inherit; font-size: 12px; font-weight: 600; cursor: pointer; }
#pk-pop .btn:hover { border-color: var(--accent); color: var(--accent); }
#pk-pop .btn.primary { background: var(--accent); border-color: var(--accent); color: var(--ink); }
#pk-pop .pk-sorts { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
#pk-pop .pk-sorts .btn { flex: 1; }
#pk-pop .pk-sorts .btn.on { outline: 2px solid var(--accent); }
#pk-pop .pk-sorts .pk-nosort { flex-basis: 100%; }
#pk-pop .pk-sorts .pk-nosort:disabled { opacity: .55; cursor: default; }
#pk-pop .pk-list { max-height: 220px; overflow: auto; display: grid; gap: 3px; margin: 6px 0; }
#pk-pop .pk-list label { display: flex; gap: 6px; align-items: center; cursor: pointer; }
#pk-pop .pk-list label[hidden] { display: none; }
#pk-pop .pk-cnt { margin-left: auto; padding-left: 10px; color: var(--muted); font-size: 12px; font-variant-numeric: tabular-nums; }
#pk-pop .pk-range { display: flex; gap: 6px; align-items: center; margin: 6px 0; }
#pk-pop input[type=number], #pk-pop input[type=text], #pk-pop input[type=search] { width: 100%; padding: 4px 6px; border: 1px solid var(--border); border-radius: 6px; background: var(--panel2); color: var(--bone); font: inherit; }
#pk-pop .pk-setq { margin: 4px 0; }
#pk-pop .pk-links { display: flex; gap: 10px; font-size: 12px; }
#pk-pop .pk-links button { border: 0; background: none; padding: 0; color: var(--accent); cursor: pointer; font: inherit; }
#pk-pop .pk-foot { display: flex; justify-content: space-between; margin-top: 8px; }
#pk-pop .pk-seg { display: inline-flex; border: 1px solid var(--border); border-radius: 8px; overflow: hidden; margin-bottom: 6px; }
#pk-pop .pk-seg button { border: 0; background: none; padding: 3px 9px; font: inherit; font-size: 12px; cursor: pointer; color: var(--muted); }
#pk-pop .pk-seg button + button { border-left: 1px solid var(--border); }
#pk-pop .pk-seg button.on { background: var(--accent); color: var(--ink); }