/* Tokwatch app styles. Load order: Basecoat CDN (shadcn tokens, @layer) → theme.css (design template) → this file.
   Everything here is unlayered so it wins over Basecoat, and every size, weight, spacing and colour comes from theme.css.
   Basecoat components used by class: btn, badge, table/table-container, select, input, textarea, label. Icons are Lucide.
   The selectors mirror dist/styles.css (the Bialetti demo) so both surfaces stay in step. */

/* ---------- Base ---------- */
html{font-family:var(--font-sans);color:var(--foreground);background:var(--background);font-size:var(--text-base);line-height:var(--leading-normal);font-synthesis:none;-webkit-font-smoothing:antialiased}
body{margin:0}
h1,h2,h3{font-weight:var(--w-semibold);line-height:var(--leading-tight)}
h1{font-size:var(--text-h1);font-weight:var(--w-display);letter-spacing:var(--tracking-h1);margin:0 0 var(--sp-2)}
h2{font-size:var(--text-xl);letter-spacing:var(--tracking-h2);margin:0 0 var(--sp-1)}
h3{font-size:var(--text-md);letter-spacing:-.2px;margin:0 0 var(--sp-1)}
p{margin:0 0 var(--sp-2)}
a{color:inherit;text-decoration:none}a:hover{text-decoration:underline}
a.btn:not([data-variant]){color:var(--primary-foreground)}a.btn:hover{text-decoration:none}  /* the unlayered a{} rule above would otherwise beat Basecoat's layered .btn colour */
button,select,input,textarea{font:inherit}button{cursor:pointer}
a:focus-visible,.metric input:focus-visible{outline:2px solid var(--ring);outline-offset:3px;border-radius:4px}
svg.lucide{width:var(--icon);height:var(--icon);flex-shrink:0}
.muted{color:var(--muted-foreground)}
.subtext{font-size:var(--text-sm);color:var(--muted-foreground);margin:0;line-height:var(--leading-relaxed)}
.numeric{font-variant-numeric:tabular-nums;white-space:nowrap}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
[hidden]{display:none!important}
.error{color:var(--negative-fg);font-size:var(--text-sm);margin:0}.error:empty{display:none}

/* ---------- Shell: side navigation, main ---------- */
.layout{display:grid;grid-template-columns:var(--sidebar-w) minmax(0,1fr);min-height:100vh}
.side-nav{background:var(--sidebar);border-right:1px solid var(--sidebar-border);padding:0 var(--sp-3) var(--sp-4);position:sticky;top:0;align-self:start;height:100vh;display:flex;flex-direction:column}
.wordmark{display:flex;align-items:center;gap:var(--sp-2);height:var(--topbar-h);padding:0 var(--sp-5);margin:0 calc(-1 * var(--sp-3)) var(--sp-3);border-bottom:1px solid var(--sidebar-border);font-size:var(--text-xl);font-weight:var(--w-display);letter-spacing:-.5px}.wordmark:hover{text-decoration:none}
.mark{width:var(--mark);height:var(--mark);flex:none;display:block}
.nav-list{display:flex;flex-direction:column;gap:2px;margin:0}
.nav-list a,.nav-list .soon{display:flex;align-items:center;gap:var(--sp-2);width:100%;height:var(--control-h);padding:0 var(--sp-2);box-sizing:border-box;border-radius:var(--radius-md);color:var(--sidebar-foreground);font-size:var(--text-base);font-weight:var(--w-medium);white-space:nowrap}
.nav-list a svg{color:var(--muted-foreground)}
.nav-list .soon{color:var(--muted-foreground);opacity:.6;cursor:default;user-select:none}
.nav-list .soon small{margin-left:auto;padding:1px 6px;border:1px solid currentColor;border-radius:999px;font-size:10px;line-height:14px;letter-spacing:.02em;text-transform:uppercase}
.nav-list a:hover{background:var(--sidebar-accent);text-decoration:none}
.nav-list a[aria-current=page]{background:var(--card);box-shadow:var(--surface-ring)}
.nav-list a[aria-current=page] svg{color:var(--foreground)}
.nav-list a.bottom{margin-top:auto}
.nav-list{flex:1}
main{padding:var(--content-pt) var(--content-px) var(--content-pb);margin:0;min-width:0}
#view{max-width:var(--content-max)}
.loading{padding:var(--sp-10) 0;color:var(--muted-foreground)}
.empty-state{padding:var(--sp-8);color:var(--muted-foreground)}.empty-state h2{color:var(--foreground)}.empty-state p{margin-bottom:var(--sp-4)}

/* ---------- Page headings and section headers ---------- */
.section-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--sp-5);margin:0 0 var(--section-gap)}
.section-heading .subtext{font-size:var(--text-base);max-width:64ch}
.results-header{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--sp-4);margin:var(--sp-8) 0 var(--sp-4)}
.results-header h2{margin:0}
.results-header .subtext{margin-top:var(--sp-1)}
.btn,.select,.input{height:var(--control-h);font-size:var(--control-text);font-weight:var(--w-medium)}
.input,.select,.textarea{font-weight:var(--w-normal)}
.btn[data-size=sm]{height:var(--control-h-sm)}.btn[data-size=xs]{height:var(--control-h-xs)}
.row{display:flex;gap:var(--sp-2);align-items:center;flex-wrap:wrap}
.toolbar{display:flex;gap:var(--sp-2);align-items:center;flex-shrink:0}
.tb{position:relative;display:block}
.tb .cal{position:absolute;left:11px;top:50%;translate:0 -50%;width:var(--icon-sm);height:var(--icon-sm);color:var(--muted-foreground);pointer-events:none;z-index:1}
.tb .select,.tb .input{padding-left:34px}
.subtabs{display:flex;gap:var(--sp-6);border-bottom:1px solid var(--border);margin:0 0 var(--section-gap)}
.subtabs button{border:0;background:none;padding:0 2px var(--sp-3);margin-bottom:-1px;font-size:var(--text-md);font-weight:var(--w-medium);color:var(--muted-foreground);border-bottom:2px solid transparent;border-radius:0}
.subtabs button:hover{color:var(--foreground)}.subtabs button[aria-current=true]{color:var(--foreground);border-color:var(--foreground)}
.list-controls{display:flex;align-items:center;gap:var(--sp-3);margin:0 0 var(--sp-4);flex-wrap:wrap}
.tb.filter{flex:1;max-width:360px}
.list-controls>.btn{margin-left:auto}
.info{display:inline-flex;align-items:center;vertical-align:middle;color:var(--muted-foreground);cursor:help;margin-left:4px}.th-btn .info svg{opacity:1}.info svg{width:14px;height:14px}
.row .muted{font-size:var(--text-sm)}

/* ---------- Surfaces (same tokens as Basecoat .card) ---------- */
.chart-card,.brand-card,.seg-card,.kpis,.table-wrap:not(.flat){background:var(--card);border-radius:var(--radius-xl);box-shadow:var(--surface-ring)}
.chart-card{padding:var(--card-py) var(--card-px);min-width:0;margin-bottom:var(--block-gap)}
.chart-head{display:flex;flex-direction:column;gap:var(--sp-1);margin-bottom:var(--sp-3)}.chart-head h3{font-size:var(--text-base);margin:0}.chart-head .subtext{font-size:var(--text-xs)}
.chart-grid{display:grid;grid-template-columns:1fr;gap:var(--block-gap);margin-bottom:var(--section-gap)}
.chart-grid.three{grid-template-columns:repeat(3,1fr)}
.chart-grid .chart-card{margin-bottom:0;padding-bottom:var(--sp-4)}
.chart-tools{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--sp-2) var(--sp-4);margin-bottom:var(--sp-3)}
/* Series pills: the chart's legend, each one a switch. The swatch empties and the pill fades when its series is hidden. */
.series-pills{display:flex;flex-wrap:wrap;gap:var(--sp-2)}
.series-pill{display:inline-flex;align-items:center;gap:var(--sp-2);height:var(--lp-btn-h-sm);padding:0 var(--sp-3);border:0;border-radius:var(--radius-full);background:var(--lp-surface-2);color:var(--lp-ink);font:inherit;font-size:var(--lp-micro);line-height:var(--lp-micro-lh);cursor:pointer;transition:background-color .15s,color .15s}
.series-pill:hover{background:var(--lp-bar)}.series-pill:focus-visible{outline:2px solid var(--lp-accent);outline-offset:2px}
.series-pill i{flex:none;width:8px;height:8px;border-radius:2px;box-shadow:inset 0 0 0 8px transparent}
.series-pill b{font-weight:inherit;color:var(--lp-body);font-variant-numeric:tabular-nums}
.series-pill[aria-pressed=false]{background:transparent;box-shadow:inset 0 0 0 1px var(--lp-rule);color:var(--lp-muted)}
.series-pill[aria-pressed=false] i{background:transparent!important;box-shadow:inset 0 0 0 1.5px var(--lp-faint)}.series-pill[aria-pressed=false] b{color:var(--lp-faint)}
/* areaChart (chart.js): y labels | stretched plot, x labels under it. Hover a period for its guide, points and tooltip. */
.area-chart{display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--sp-2) var(--sp-3);font-size:var(--lp-tiny);line-height:1;color:var(--lp-muted);font-variant-numeric:tabular-nums}
.ac-y{display:flex;flex-direction:column;justify-content:space-between;text-align:right;margin:-5px 0}
.ac-plot{position:relative;height:var(--ns-chart-h)}
.ac-plot svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.ac-grid{stroke:var(--lp-surface-2);stroke-width:1;vector-effect:non-scaling-stroke}
.ac-line{fill:none;stroke-width:2;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke}
.ac-x{grid-column:2;position:relative;height:var(--lp-tiny)}
.ac-x span{position:absolute;top:0;translate:-50% 0;white-space:nowrap}.ac-x .first{translate:0 0}.ac-x .last{translate:-100% 0}
.ac-empty{grid-column:1/-1;display:flex;align-items:center;justify-content:center;height:var(--ns-chart-h);margin:0;font-size:var(--lp-small)}
.ac-col{position:absolute;top:0;bottom:0}
.ac-col>*{visibility:hidden}.ac-col:hover{z-index:2}.ac-col:hover>*{visibility:visible}
.ac-guide{position:absolute;top:0;bottom:0;left:var(--at);width:1px;margin-left:-.5px;background:var(--lp-rule)}
.ac-col>b{position:absolute;width:10px;height:10px;margin:-5px 0 0 -5px;border-radius:50%;box-shadow:0 0 0 2px var(--lp-page)}
.ac-tip{position:absolute;top:var(--sp-2);left:calc(var(--at) + var(--sp-3));min-width:150px;padding:var(--sp-3);border-radius:var(--lp-radius-panel);background:var(--lp-nav);color:var(--lp-nav-fg);font-size:var(--lp-micro);line-height:var(--lp-micro-lh);pointer-events:none}
.ac-col.flip .ac-tip{left:auto;right:calc(100% - var(--at) + var(--sp-3))}
.ac-tip strong{display:block;margin-bottom:var(--sp-1);font-weight:inherit;color:#fff}
.ac-tip div{display:flex;justify-content:space-between;gap:var(--sp-5);white-space:nowrap}.ac-tip span{display:flex;align-items:center;gap:var(--sp-2)}
.ac-tip i{width:8px;height:8px;border-radius:2px}.ac-tip b{font-weight:inherit;color:#fff}
.plot{width:100%;height:auto;display:block;color:var(--brand)}.plot .grid{stroke:var(--border);stroke-width:1}.plot .tick{font-size:10px;fill:var(--muted-foreground)}.plot .placeholder{font-size:12px;fill:var(--muted-foreground)}

/* ---------- Summary cards with segmented bars ---------- */
.seg-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--block-gap);margin-bottom:var(--block-gap)}
.seg-card{padding:var(--sp-4) var(--card-px) var(--card-py);display:flex;flex-direction:column;gap:var(--sp-3);min-width:0}
.seg-card header{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-2) var(--sp-4)}.seg-card h3{margin:0;font-size:var(--text-base);display:flex;align-items:center;gap:5px}.seg-card h3 svg{width:var(--icon-sm);height:var(--icon-sm);color:var(--muted-foreground)}
.seg-legend{display:flex;flex-wrap:wrap;gap:6px var(--sp-3);font-size:var(--text-sm);color:var(--muted-foreground)}.seg-legend i{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px}.seg-legend b{color:var(--foreground);font-weight:var(--w-semibold);margin-right:4px}
.seg-bar{display:flex;gap:var(--sp-1);height:6px;margin-top:auto}.seg-bar i{display:block;border-radius:3px;min-width:6px}

/* ---------- KPI tiles ---------- */
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-bottom:var(--block-gap)}
.kpis:has(> :nth-child(5)){grid-template-columns:repeat(5,1fr)}
.kpi{padding:var(--card-py) var(--card-px);border-left:1px solid var(--border);display:flex;flex-direction:column;gap:6px;min-width:0}.kpi:first-child{border-left:0}
.kpi-label{font-size:var(--text-sm);color:var(--muted-foreground);display:inline-flex;align-items:center;gap:4px}
.kpi strong{font-size:var(--text-kpi);font-weight:var(--w-semibold);letter-spacing:var(--tracking-num);line-height:1.1}
.kpi strong .delta{font-size:inherit;font-weight:inherit;margin:0}
.kpi strong.kpi-inline{display:flex;align-items:center;gap:var(--sp-3)}.kpi strong .badge{font-size:var(--text-sm);letter-spacing:0}
.kpi strong.nowrap{white-space:nowrap}.kpi-flag{font-size:var(--text-lg);margin-left:var(--sp-2);vertical-align:2px;letter-spacing:0}
.kpi-unit{font-size:var(--text-base);font-weight:var(--w-medium);letter-spacing:0;color:var(--muted-foreground);margin-left:2px}
.kpi-sub{font-size:var(--text-xs);color:var(--muted-foreground);line-height:var(--leading-normal)}
.kpis.compact .kpi{padding:var(--sp-4) var(--sp-5)}.kpis.compact .kpi strong{font-size:var(--text-kpi-sm)}

/* ---------- Keyword research lookup ---------- */
.lookup{max-width:920px}
.lookup-head{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);margin-bottom:var(--sp-2)}
.lookup-label{display:inline-flex;align-items:center;gap:var(--sp-2);font-size:var(--text-sm);font-weight:var(--w-medium);color:var(--muted-foreground)}
.kw-editor{display:grid;grid-template-columns:auto minmax(0,1fr);border:1px solid var(--input);border-radius:var(--radius-md);background:var(--card);margin-bottom:var(--sp-3);overflow:hidden;transition:border-color .15s,box-shadow .15s}
.kw-editor:focus-within{border-color:var(--ring);box-shadow:0 0 0 3px color-mix(in oklab,var(--ring) 30%,transparent)}
.kw-lines,.kw-editor .textarea{margin:0;padding:var(--sp-3) var(--sp-3);font:inherit;font-size:var(--text-base);line-height:var(--leading-relaxed)}
.kw-lines{overflow:hidden;color:var(--muted-foreground);text-align:right;min-width:2.4em;padding-right:0;font-variant-numeric:tabular-nums;user-select:none}
.kw-editor .textarea{border:0;border-radius:0;box-shadow:none;outline:none;resize:none;min-height:0;background:transparent}
.kw-editor .textarea:focus-visible{outline:none;box-shadow:none}
.kw-result{margin-bottom:var(--section-gap)}.kw-result .results-header{margin-top:0}
.kw-body{position:relative}.kw-body.nodata .kw-dim{opacity:var(--dim-opacity);pointer-events:none;user-select:none;filter:grayscale(1)}
.fetch-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--sp-3);text-align:center;padding:var(--sp-5)}
.fetch-overlay .muted{font-size:var(--text-sm);margin:0}.fetch-overlay .btn[disabled]{opacity:1}.fetch-overlay .spinner{border-color:var(--primary-foreground);border-top-color:transparent;opacity:.7}
.chart-grid.two{grid-template-columns:1fr 1fr}
.geo-total{display:block;font-size:var(--text-kpi);font-weight:var(--w-semibold);letter-spacing:var(--tracking-num);line-height:1.1;margin:0 0 var(--sp-4)}
.geo-rows{display:flex;flex-direction:column;gap:var(--sp-3)}
.geo-row{display:grid;grid-template-columns:64px 1fr 84px;align-items:center;gap:var(--sp-3);font-size:var(--text-base)}
.geo-country{color:var(--brand);font-weight:var(--w-medium);white-space:nowrap}.geo-row.current .geo-country{color:var(--foreground)}.geo-row.none .geo-country{color:var(--muted-foreground)}
.geo-bar{display:block;height:10px;border-radius:3px;background:var(--muted);overflow:hidden}.geo-bar i{display:block;height:100%;min-width:2px;border-radius:3px;background:color-mix(in oklab,var(--brand) 45%,white)}.geo-row.current .geo-bar i{background:var(--brand)}.geo-row.none .geo-bar i{display:none}
.geo-value{text-align:right;font-size:var(--text-sm)}.geo-row.current .geo-value{font-weight:var(--w-semibold)}.geo-row.none .geo-value{color:var(--muted-foreground)}

/* ---------- Brand cards ---------- */
.brand-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(var(--brand-card-min),1fr));gap:var(--block-gap);margin-bottom:var(--section-gap)}
.brand-card{display:flex;flex-direction:column;gap:var(--sp-3);padding:var(--card-py) var(--card-px);transition:box-shadow .15s;cursor:pointer}.brand-card:hover{box-shadow:var(--surface-ring),var(--surface-hover)}
.brand-head{display:flex;gap:var(--sp-3);align-items:flex-start;min-width:0}.brand-head>div{display:flex;flex-direction:column;gap:var(--sp-1);min-width:0}
.brand-card strong{font-size:var(--text-md);font-weight:var(--w-semibold);letter-spacing:var(--tracking-h2);color:var(--foreground)}
.brand-card strong a{color:inherit}.brand-card strong a:hover{text-decoration:underline}
.brand-card .brand-meta{display:inline-flex;align-items:center;gap:var(--sp-2);font-size:var(--text-sm);color:var(--muted-foreground);line-height:var(--leading-normal)}
.brand-card .brand-meta svg{width:var(--icon-sm);height:var(--icon-sm);flex-shrink:0}
.brand-card:focus-visible{outline:2px solid var(--ring);outline-offset:3px}
.brand-card{position:relative}.brand-actions{position:absolute;top:var(--sp-3);right:var(--sp-3)}.brand-actions>.btn{color:var(--muted-foreground)}.brand-card:hover .brand-actions>.btn,.brand-actions>.btn[aria-expanded=true]{color:var(--foreground)}
.brand-card .brand-head{padding-right:var(--sp-8)}
.avatar-wrap{position:relative;width:var(--avatar);height:var(--avatar);flex-shrink:0}
.initials{position:absolute;inset:0;background:var(--muted);border:1px solid var(--border);display:grid;place-items:center;border-radius:50%;font-size:var(--text-xs);color:var(--muted-foreground);font-weight:var(--w-semibold)}
.avatar-img{position:absolute;inset:0;width:100%;height:100%;border-radius:50%;object-fit:cover;border:1px solid var(--border)}
.external{display:inline-block;width:var(--icon-xs);height:var(--icon-xs);margin-left:2px;vertical-align:-1px;color:var(--muted-foreground)}

/* ---------- Dialog (Basecoat .dialog: article > header, section, footer, close button) ---------- */
.dialog>article{box-shadow:var(--popover-shadow),var(--surface-ring)}
.dialog>article>header>h2{font-size:var(--text-xl);font-weight:var(--w-semibold);letter-spacing:var(--tracking-h2);margin:0}
.dialog>article>header>p{font-size:var(--text-sm);margin:0;max-width:52ch}
.dialog>article>section .form{max-width:none}
.dialog>article>footer .btn{flex-shrink:0}
.dialog>article>.dialog-close{top:var(--sp-4);right:var(--sp-4);color:var(--muted-foreground)}
.dialog .form>p:empty,.dialog .form>div:empty{display:none}

/* ---------- Brand keywords row (Search tracker, under the toolbar) ---------- */
.terms{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-2);margin:calc(-1 * var(--sp-2)) 0 var(--block-gap)}
.terms-label{display:inline-flex;align-items:center;gap:var(--sp-1);margin-right:var(--sp-1);font-size:var(--text-sm);font-weight:var(--w-medium);color:var(--muted-foreground)}.terms-label svg{width:var(--icon-sm);height:var(--icon-sm)}.terms-label .muted{font-weight:var(--w-normal)}
.term{display:inline-flex;align-items:center;gap:var(--sp-1);height:var(--control-h-sm);padding:0 var(--sp-1) 0 var(--sp-3);border-radius:999px;background:var(--muted);color:var(--foreground);font-size:var(--text-sm);font-weight:var(--w-medium)}
.term button{display:grid;place-items:center;width:20px;height:20px;border:0;border-radius:50%;background:none;color:var(--muted-foreground);cursor:pointer}.term button:hover,.term button:focus-visible{background:var(--border);color:var(--foreground)}.term button svg{width:var(--icon-xs);height:var(--icon-xs)}
.term-add{display:inline-flex;align-items:center;gap:var(--sp-2)}.term-add .input{height:var(--control-h-sm);width:200px}
.terms>.error{flex-basis:100%;margin:0}.terms>.error:empty{display:none}

/* ---------- Tables (Basecoat .table inside .table-container) ---------- */
.table-wrap{margin-bottom:var(--section-gap)}
.table{font-size:var(--text-base)}
.table th{height:auto;padding:var(--sp-3) var(--table-px);font-size:var(--text-xs);font-weight:var(--w-medium);color:var(--muted-foreground);background:color-mix(in oklab,var(--muted) 60%,transparent);white-space:nowrap}
.table td{padding:var(--table-py) var(--table-px);white-space:normal;vertical-align:middle}
.table td.numeric,.table td.date-cell{white-space:nowrap}
.table tbody tr:last-child{border-bottom:0}
.table td .muted{font-size:var(--text-sm)}
.table-wrap.flat{margin-bottom:var(--sp-1)}.table-wrap.flat th{background:none;padding:6px var(--sp-2)}.table-wrap.flat td{padding:var(--sp-2)}
.kw-table td{padding:11px var(--sp-3)}.kw-table th{padding:10px var(--sp-3)}
.row-actions{text-align:right;width:1%}.row-actions>.dropdown-menu{display:inline-flex;align-items:center;vertical-align:middle}.row-actions .btn[data-size=icon-sm]{width:28px;height:28px}
.kw-table td:first-child{min-width:220px}
.dropdown-menu>[data-popover]{background:var(--popover);border-radius:var(--radius-md);box-shadow:var(--popover-shadow),var(--surface-ring);padding:var(--sp-1);min-width:var(--menu-min)}
.row-actions>.dropdown-menu>[data-popover],.brand-actions>[data-popover]{position:fixed;inset:auto;margin:0;translate:none}
.dropdown-menu [role=menuitem]{border:0;background:none;cursor:pointer;color:var(--foreground);font-size:var(--text-base);font-weight:var(--w-medium);height:var(--control-h-sm)}
.dropdown-menu [role=menuitem]:hover,.dropdown-menu [role=menuitem]:focus-visible{background:var(--muted)}
.dropdown-menu [role=menuitem] svg{width:var(--icon);height:var(--icon);color:var(--muted-foreground)}
.kw-link{font-weight:var(--w-medium);white-space:nowrap}button.kw-link{border:0;background:none;padding:0;font:inherit;font-weight:var(--w-medium);color:inherit;cursor:pointer;text-align:left}button.kw-link:hover{text-decoration:underline}
.table th.sortable{padding:0}.th-btn{display:inline-flex;align-items:center;gap:var(--sp-1);height:100%;min-height:36px;padding:0 var(--sp-3);border:0;background:none;font:inherit;color:inherit;white-space:nowrap;cursor:pointer}.th-btn svg{width:var(--icon-xs);height:var(--icon-xs);opacity:.5}.th-btn:hover{color:var(--foreground)}th[aria-sort=ascending] .th-btn,th[aria-sort=descending] .th-btn{color:var(--foreground)}th[aria-sort=ascending] .th-btn svg,th[aria-sort=descending] .th-btn svg{opacity:1}
.count-cell{display:inline-flex;align-items:baseline;gap:var(--sp-1);font-variant-numeric:tabular-nums;white-space:nowrap}.count-cell b{font-weight:var(--w-semibold);font-size:var(--text-sm)}.count-cell .muted{font-size:var(--text-xs)}
.cov-cell{display:inline-flex;align-items:center;gap:var(--sp-2);font-variant-numeric:tabular-nums;white-space:nowrap}.cov-cell b{font-weight:var(--w-semibold);font-size:var(--text-sm)}.ring{width:22px;height:22px;flex-shrink:0}
.ring-empty{color:var(--muted-foreground);padding-left:7px}
.bars{display:inline-flex;gap:2px;align-items:flex-end;height:14px}.bars i{display:block;width:5px;height:100%;border-radius:1px;background:var(--bar-off)}.bars i.on{background:var(--bar-on)}.bars.diff i.on{background:var(--bar-diff)}
.vol{display:inline-flex;align-items:center;gap:var(--sp-2);white-space:nowrap}.vol small{font-size:var(--text-xs);color:var(--muted-foreground)}
.tag{display:inline-flex;align-items:center;height:22px;padding:0 var(--sp-2);border-radius:5px;font-size:var(--text-xs);font-weight:var(--w-medium);white-space:nowrap}
.date-cell{color:var(--muted-foreground);font-size:var(--text-sm)}
.position{color:var(--muted-foreground);font-size:var(--text-sm);min-width:50px}
.delta{font-variant-numeric:tabular-nums;font-weight:var(--w-medium);font-size:var(--text-sm);margin-left:var(--sp-1)}.delta.up{color:var(--positive-fg)}.delta.down{color:var(--negative-fg)}
.fetching{color:var(--muted-foreground);font-size:var(--text-sm);display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.spinner{width:var(--spinner-size);height:var(--spinner-size);border:1px solid var(--border);border-top-color:var(--muted-foreground);border-radius:50%;animation:spin .9s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.caption{max-width:410px;line-height:var(--leading-normal);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.video-title{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-width:220px;max-width:410px;line-height:var(--leading-normal)}

/* ---------- Badges and chips (Basecoat .badge) ---------- */
.badge{font-size:var(--text-xs);font-weight:var(--w-medium)}
.badge.positive{background:var(--positive-bg);color:var(--positive-fg)}
.badge.negative{background:var(--negative-bg);color:var(--negative-fg)}
.badge.mixed{background:var(--mixed-bg);color:var(--mixed-fg)}
.badge.neutral{background:var(--muted);color:var(--muted-foreground)}
.badge.own{background:var(--own-bg);color:var(--own-fg)}

/* ---------- Forms ---------- */
.form{display:grid;gap:var(--sp-4);max-width:var(--form-max)}
.form .fld{display:grid;gap:var(--sp-2)}
.form .label{font-size:var(--text-sm);font-weight:var(--w-medium)}
.form .textarea{min-height:96px;resize:vertical}
.form .row .btn{flex-shrink:0}
.metric{display:flex;align-items:center;gap:var(--sp-2);font-size:var(--text-base);color:var(--foreground);cursor:pointer;user-select:none}
.metric input{width:15px;height:15px;margin:0;cursor:pointer;accent-color:var(--brand)}
.metric .muted{font-size:var(--text-sm)}
.pick-list{display:flex;flex-direction:column;gap:var(--sp-2);margin:0 0 var(--sp-2)}
.kv{display:grid;grid-template-columns:auto 1fr;gap:var(--sp-2) var(--sp-6);margin:0 0 var(--sp-4);font-size:var(--text-base);line-height:var(--leading-normal)}
.kv dt{color:var(--muted-foreground);font-weight:var(--w-medium);white-space:nowrap}.kv dd{margin:0}

/* ---------- Landing page (views/home.js), in the visual style of design/northstar-landing ---------- */
@font-face{font-family:"Open Runde";src:url("fonts/open-runde-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Open Runde";src:url("fonts/open-runde-500.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Open Runde";src:url("fonts/open-runde-600.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}
/* the landing page brings its own chrome, so the app shell steps aside (app.js sets body.landing on the home route) */
body.landing .side-nav{display:none}
body.landing .layout{display:block}
body.landing .layout>main{padding:0}
body.landing #view{max-width:none}
body.landing{background:var(--lp-page)}
.lp{font-family:var(--lp-font);letter-spacing:var(--lp-tracking);color:var(--lp-ink);font-weight:var(--lp-w-regular);min-height:100vh}
.lp h1,.lp h2,.lp h3,.lp p{margin:0;letter-spacing:inherit}
.lp a:hover{text-decoration:none}
.lp-h1{font-size:var(--lp-h1);line-height:var(--lp-h1-lh);font-weight:var(--lp-w-display);letter-spacing:var(--lp-h1-track)!important;color:var(--lp-ink);text-wrap:balance}
.lp-h2{font-size:var(--lp-h2);line-height:var(--lp-h2-lh);font-weight:var(--lp-w-regular);letter-spacing:var(--lp-h2-track)!important;color:var(--lp-ink);text-wrap:balance}
.lp-h3{font-size:var(--lp-lead);line-height:var(--lp-lead-lh);font-weight:var(--lp-w-regular);color:var(--lp-ink);text-wrap:balance}
.lp-lead{font-size:var(--lp-lead);line-height:var(--lp-lead-lh);color:var(--lp-body);text-wrap:balance}
.lp-body{font-size:var(--lp-text);line-height:var(--lp-text-lh);color:var(--lp-body)}
.lp-small{font-size:var(--lp-small);line-height:var(--lp-small-lh);color:var(--lp-body)}
.lp-micro{font-size:var(--lp-micro);line-height:var(--lp-micro-lh);color:var(--lp-muted)}
.lp-caps{text-transform:uppercase;letter-spacing:.12em}
.lp-center{text-align:center}
/* buttons: full pills, 44px on the page and 32px in the nav */
.lp-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:var(--lp-btn-h);padding:0 var(--sp-5);border-radius:var(--radius-full);background:var(--lp-accent-btn);color:#fff;font-size:var(--lp-text);font-weight:var(--lp-w-regular);user-select:none;transition:opacity .15s}
.lp-btn:hover{opacity:.9}.lp-btn:focus-visible{outline:2px solid var(--lp-accent);outline-offset:2px}
.lp-btn.sm{height:var(--lp-btn-h-sm);padding:0 var(--sp-3);font-size:var(--lp-small);line-height:var(--lp-small-lh)}
/* floating dark pill nav */
.lp-nav{position:fixed;inset:var(--lp-nav-inset) var(--lp-nav-inset) auto;z-index:50;display:flex;justify-content:center}
.lp-nav-pill{display:flex;align-items:center;gap:var(--sp-2);width:100%;max-width:var(--lp-nav-max);height:var(--lp-nav-h);padding:0 10px 0 var(--sp-3);border-radius:var(--lp-radius-block);background:var(--lp-nav)}
.lp-wordmark{display:flex;align-items:center;gap:var(--sp-2);flex:none;font-size:var(--lp-wordmark);line-height:var(--lp-wordmark-lh);font-weight:var(--lp-w-wordmark);color:var(--lp-ink)}
.lp-wordmark .mark{width:var(--mark-lp);height:var(--mark-lp)}
.lp-nav .lp-wordmark{color:#fff}
.lp-nav nav{display:flex;align-items:center;gap:var(--sp-4);margin-left:var(--sp-3)}
.lp-nav nav a,.lp-nav nav button{border:0;background:none;padding:0;font:inherit;letter-spacing:inherit;font-size:var(--lp-small);line-height:var(--lp-small-lh);color:var(--lp-nav-fg);transition:color .15s}
.lp-nav nav a:hover,.lp-nav nav button:hover{color:#fff}
.lp-nav .lp-btn{margin-left:auto}
.lp-nav-actions{display:flex;align-items:center;gap:var(--sp-4);margin-left:auto}.lp-nav-actions .lp-btn{margin-left:0}
.lp-nav-actions a:not(.lp-btn){font-size:var(--lp-small);line-height:var(--lp-small-lh);color:var(--lp-nav-fg);transition:color .15s}.lp-nav-actions a:not(.lp-btn):hover{color:#fff}
/* page column */
.lp-main{width:100%;max-width:var(--lp-page-max);margin:0 auto;padding:var(--lp-main-top) var(--sp-6) 0;box-sizing:border-box}
.lp-hero{display:flex;flex-direction:column;align-items:center;text-align:center;padding:var(--lp-block-py) 0 var(--sp-10)}
.lp-hero .lp-pill{margin-bottom:var(--sp-6)}
.lp-hero .lp-h1{max-width:19ch}
.lp-hero .lp-lead{max-width:var(--lp-prose-max);margin-top:var(--sp-5)}
.lp-actions{display:flex;flex-direction:column;align-items:center;gap:var(--sp-3);margin-top:var(--sp-7)}
.lp-pill{display:inline-flex;align-items:center;border-radius:var(--radius-full);padding:var(--sp-1) var(--sp-3);font-size:var(--lp-micro);line-height:var(--lp-micro-lh)}
.lp-pill.sky{background:var(--lp-sky-soft);color:var(--lp-sky)}
.lp-pill.soon{background:var(--lp-surface-2);color:var(--lp-body)}.lp-h3 .lp-pill{margin-left:var(--sp-2);vertical-align:middle;padding-top:2px;padding-bottom:2px}
.lp-section{padding-top:var(--lp-section-gap)}
.lp-hero+.lp-section{padding-top:var(--lp-section-gap-sm)}
.lp-head{display:flex;flex-direction:column;align-items:center;text-align:center;margin-bottom:var(--lp-head-gap)}
.lp-head .lp-h2{max-width:var(--lp-head-max)}
.lp-grid{display:grid;gap:var(--sp-4);align-items:stretch}
.lp-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}
/* flat surface card: no border, no shadow */
.lp-card{display:flex;flex-direction:column;align-items:center;text-align:center;border-radius:var(--lp-radius-card);background:var(--lp-surface);padding:var(--sp-6)}
.lp-card .lp-small{margin-top:var(--sp-2);max-width:34ch}
.lp-card.left{align-items:flex-start;text-align:left}.lp-card.left .lp-small{max-width:none}
.lp-icon{display:flex;align-items:center;justify-content:center;width:var(--lp-icon-tile);height:var(--lp-icon-tile);border-radius:var(--lp-radius-panel);background:var(--lp-page);color:var(--lp-accent);margin-bottom:var(--sp-5)}
/* the product picture under the hero (DASHBOARD in views/home-shots.js): a white app frame on a soft shadow */
.lp-dash{display:grid;grid-template-columns:var(--lp-dash-side) minmax(0,1fr);border-radius:var(--lp-radius-block);background:var(--lp-page);box-shadow:var(--lp-dash-shadow);overflow:hidden;text-align:left;font-size:var(--lp-micro);line-height:var(--lp-micro-lh);color:var(--lp-body);font-variant-numeric:tabular-nums}
.lp-dash+.lp-section{padding-top:var(--lp-section-gap-sm)}
.lp-dash strong,.lp-dash em,.lp-dash b{font-weight:inherit;font-style:normal}.lp-dash .up{color:var(--positive-fg)}.lp-dash .down{color:var(--negative-fg)}
.lp-dash aside{display:flex;flex-direction:column;gap:var(--sp-6);padding:var(--sp-5) var(--sp-3);background:var(--lp-block);border-right:1px solid var(--lp-surface-2)}
.lp-dash aside .lp-wordmark{padding:0 var(--sp-2);font-size:var(--lp-text)}.lp-dash aside .lp-wordmark .mark{width:22px;height:22px}
.lp-dash nav{display:grid;gap:2px}
.lp-dash nav span,.lp-dash .foot{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-2);border-radius:var(--lp-radius-panel);color:var(--lp-ink);font-size:var(--lp-small);line-height:var(--lp-small-lh)}
.lp-dash nav span.on{background:var(--lp-page);box-shadow:0 0 0 1px var(--lp-surface-2)}
.lp-dash aside svg{width:16px;height:16px;color:var(--lp-muted)}.lp-dash .foot{margin-top:auto}
.lp-dash-main{display:flex;flex-direction:column;gap:var(--sp-5);min-width:0;padding:var(--sp-7) var(--sp-7) var(--sp-5)}
.lp-dash-head{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3)}.lp-dash-head strong{font-size:var(--lp-dash-title);line-height:var(--lp-h2-sm-lh);letter-spacing:var(--lp-h2-sm-track);color:var(--lp-ink)}.lp-dash-head>span{display:flex;gap:var(--sp-2)}
.lp-dash-segs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-3)}
.lp-dash-seg{display:flex;flex-direction:column;gap:var(--sp-4);min-width:0;border-radius:var(--lp-radius-card);background:var(--lp-surface);padding:var(--sp-4)}
.lp-dash-seg header{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-1) var(--sp-3)}.lp-dash-seg strong{color:var(--lp-ink);font-size:var(--lp-small)}
.lp-dash-seg header span{display:flex;flex-wrap:wrap;gap:var(--sp-1) var(--sp-3)}.lp-dash-seg em{white-space:nowrap}.lp-dash-seg em i{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px}.lp-dash-seg em b{color:var(--lp-ink);margin-right:4px}
.lp-dash-seg .bar{display:flex;gap:3px;height:8px;margin-top:auto}.lp-dash-seg .bar i{border-radius:var(--radius-full)}
.lp-dash-table{width:100%;border-collapse:collapse}
.lp-dash-table th{font-weight:inherit;color:var(--lp-muted);text-align:left;white-space:nowrap;padding:0 var(--sp-3) var(--sp-3) 0}
.lp-dash-table td{padding:var(--sp-3) var(--sp-3) var(--sp-3) 0;border-top:1px solid var(--lp-surface-2);white-space:nowrap}
.lp-dash-table td:first-child{color:var(--lp-ink);font-size:var(--lp-small)}
.lp-dash-table .cell{display:inline-flex;align-items:center;gap:var(--sp-2)}.lp-dash-table .cell b{color:var(--lp-ink)}.lp-dash-table .cell em{color:var(--lp-muted)}
.lp-dash-table .lp-shot-ring{width:20px;height:20px}.lp-dash-table .lp-shot-ring circle{stroke-width:6}
.lp-shot-level.ink i.on{background:var(--lp-ink)}
/* feature cards that lead with a product-like picture (views/home-shots.js): a white panel set into the grey card */
.lp-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.lp-card.shot{padding:var(--sp-4) var(--sp-4) var(--sp-7)}
.lp-card.shot .lp-h3{margin-top:var(--sp-6)}
.lp-shot{align-self:stretch;display:flex;flex-direction:column;gap:var(--sp-4);box-sizing:border-box;min-height:var(--lp-shot-h);border-radius:var(--lp-radius-panel);background:var(--lp-page);padding:var(--sp-5);text-align:left;font-size:var(--lp-micro);line-height:var(--lp-micro-lh);color:var(--lp-body);font-variant-numeric:tabular-nums}
.lp-shot strong,.lp-shot em{font-weight:inherit;font-style:normal}.lp-shot .up{color:var(--positive-fg)}.lp-shot .down{color:var(--negative-fg)}
.lp-shot-bar{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-2)}
.lp-shot-input,.lp-shot-chip{display:inline-flex;align-items:center;gap:6px;height:var(--lp-btn-h-sm);padding:0 var(--sp-3);border-radius:var(--radius-full);background:var(--lp-surface);color:var(--lp-ink)}
.lp-shot-input{flex:1;max-width:60%}.lp-shot-input svg{width:14px;height:14px;color:var(--lp-muted)}
.lp-shot-key{font-size:var(--lp-text);line-height:var(--lp-text-lh);color:var(--lp-ink)}
.lp-shot-kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-2)}
.lp-shot-kpis>div{display:flex;flex-direction:column;gap:2px;min-width:0;border-radius:var(--lp-radius-panel);background:var(--lp-surface);padding:var(--sp-3)}
.lp-shot-kpis strong{display:flex;align-items:center;gap:6px;font-size:var(--lp-text);line-height:var(--lp-text-lh);color:var(--lp-ink);white-space:nowrap}
.lp-shot-kpis em{color:var(--lp-muted);white-space:nowrap}
.lp-shot-level{display:inline-flex;gap:2px}.lp-shot-level i{width:4px;height:12px;border-radius:1px;background:var(--lp-bar)}.lp-shot-level i.on{background:var(--lp-accent)}
.lp-shot-table{width:100%;border-collapse:collapse;margin-top:auto}
.lp-shot-table th{font-weight:inherit;color:var(--lp-muted);text-align:left;padding:0 0 var(--sp-2);white-space:nowrap}
.lp-shot-table td{padding:var(--sp-2) 0;border-top:1px solid var(--lp-surface-2);color:var(--lp-ink);white-space:nowrap}
.lp-shot-table th:nth-child(n+2),.lp-shot-table td:nth-child(n+2){text-align:right;padding-left:var(--sp-3)}
.lp-shot-table td:first-child{overflow:hidden;text-overflow:ellipsis;max-width:0;width:100%}
.lp-shot-rank{display:flex;align-items:center;gap:var(--sp-4)}
.lp-shot-rank strong{font-size:var(--lp-stat);line-height:var(--lp-stat-lh);letter-spacing:var(--lp-h1-sm-track);font-weight:var(--lp-w-display);color:var(--lp-ink)}
.lp-shot-rank div{display:flex;flex-direction:column}.lp-shot-rank span{color:var(--lp-ink);font-size:var(--lp-small);line-height:var(--lp-small-lh)}.lp-shot-rank em .up{margin-right:2px}
.lp-shot-plot{display:flex;gap:var(--sp-2);flex:1;min-height:var(--lp-shot-plot-h)}
.lp-shot-plot .axis{display:flex;flex-direction:column;justify-content:space-between;color:var(--lp-muted);font-size:var(--lp-tiny);line-height:1}
.lp-shot-plot .plot{position:relative;flex:1;min-width:0}
.lp-shot-chart{position:absolute;inset:0;width:100%;height:100%}
.lp-shot-chart .grid{stroke:var(--lp-surface-2);stroke-width:1;vector-effect:non-scaling-stroke}
.lp-shot-chart .line{fill:none;stroke:var(--lp-accent);stroke-width:2;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke}
.lp-shot-chart .area{fill:var(--lp-accent);opacity:.08}
.lp-shot-plot b{position:absolute;width:10px;height:10px;margin:-5px 0 0 -5px;border-radius:50%;background:var(--lp-accent);box-shadow:0 0 0 2px var(--lp-page)}
.lp-shot-legend{display:flex;justify-content:space-between;color:var(--lp-muted)}.lp-shot-legend i{display:inline-block;width:8px;height:8px;margin-right:6px;border-radius:2px;background:var(--lp-accent)}
.lp-shot-strip{display:grid;grid-template-columns:repeat(20,minmax(0,1fr));gap:2px;margin-top:calc(-1 * var(--sp-2))}
.lp-shot-strip i{height:var(--lp-bar-h);border-radius:2px;background:var(--lp-bar)}.lp-shot-strip i.you{background:var(--lp-accent)}
.lp-shot.mini{flex:1;min-height:var(--lp-shot-mini-h);padding:var(--sp-4);gap:var(--sp-3);margin-top:var(--sp-3)}
.lp-stage>.lp-small{margin-top:var(--sp-4)}
.lp-shot-field{display:flex;flex-direction:column;gap:var(--sp-1)}.lp-shot-field span{color:var(--lp-muted)}
.lp-shot-field p{display:flex;align-items:center;gap:var(--sp-1);min-height:var(--lp-btn-h-sm);box-sizing:border-box;margin:0;padding:0 var(--sp-3);border:1px solid var(--lp-rule);border-radius:var(--lp-radius-panel);color:var(--lp-ink)}
.lp-shot-field p.terms{padding:0 var(--sp-1)}.lp-shot-field .lp-shot-pill{font-size:var(--lp-micro)}
.lp-shot-btn{display:flex;align-items:center;justify-content:center;height:var(--lp-btn-h-sm);margin-top:auto;border-radius:var(--radius-full);background:var(--lp-accent-btn);color:#fff}
.lp-shot-input.wide{max-width:none}
.lp-shot-rows{display:flex;flex-direction:column;flex:1;justify-content:space-between}
.lp-shot-rows div{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-2) 0;border-top:1px solid var(--lp-surface-2)}.lp-shot-rows div:first-child{border-top:0}
.lp-shot-rows span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--lp-ink)}.lp-shot-rows em{color:var(--lp-muted);white-space:nowrap}
.lp-shot-rows i{flex:none;display:flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;background:var(--lp-surface-2);color:var(--lp-body)}.lp-shot-rows i.on{background:var(--lp-accent);color:#fff}.lp-shot-rows i svg{width:10px;height:10px}
.lp-shot-table.watch{margin-top:0}.lp-shot-table.watch td{padding-top:var(--sp-3);padding-bottom:var(--sp-3)}
.lp-shot-table.watch b{font-weight:inherit;margin-right:6px}.lp-shot-table.watch td:nth-child(2) span{display:inline-block;min-width:2em;text-align:left}.lp-shot-table.watch .cell{display:inline-flex;align-items:center;gap:6px}
.lp-shot-table.watch .lp-shot-ring{width:16px;height:16px}.lp-shot-table.watch .lp-shot-ring circle{stroke-width:6}
.lp-shot-ring{flex:none;width:var(--lp-stat-lh);height:var(--lp-stat-lh)}.lp-shot-ring circle{fill:none;stroke-width:5}.lp-shot-ring .track{stroke:var(--lp-bar)}.lp-shot-ring .value{stroke:var(--lp-accent);stroke-linecap:round}
.lp-shot-weeks{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--sp-2);flex:1;min-height:var(--lp-shot-plot-h)}
.lp-shot-weeks div{display:flex;flex-direction:column;justify-content:flex-end;gap:var(--sp-1);text-align:center;color:var(--lp-muted);font-size:var(--lp-tiny);line-height:1.4}
.lp-shot-weeks i{display:block;width:var(--lp-shot-col-w);margin:0 auto;border-radius:var(--lp-bar-radius) var(--lp-bar-radius) 0 0;background:var(--lp-bar)}.lp-shot-weeks i.you{background:var(--lp-accent)}
.lp-shot-pill{display:inline-flex;align-items:center;padding:1px var(--sp-2);border-radius:var(--radius-full);background:var(--lp-surface-2);color:var(--lp-body);font-size:var(--lp-tiny);line-height:var(--lp-micro-lh);white-space:nowrap}
.lp-shot-pill.on{background:var(--lp-sky-soft);color:var(--lp-sky)}.lp-shot-pill.you{margin-left:6px;background:var(--lp-accent);color:#fff}
.lp-shot-table.results{margin-top:0}.lp-shot-table.results td{padding-top:var(--sp-3);padding-bottom:var(--sp-3)}
.lp-shot-table.results th:nth-child(-n+3),.lp-shot-table.results td:nth-child(-n+3){text-align:left}
.lp-shot-table.results td:first-child{width:auto;max-width:none;color:var(--lp-muted);padding-right:var(--sp-3)}
.lp-shot-table.results td:nth-child(2){width:100%;max-width:0;overflow:hidden;text-overflow:ellipsis;padding-left:0}.lp-shot-table.results th:nth-child(2){padding-left:0}
.lp-shot-table.results td:last-child{color:var(--lp-body)}
.lp-shot-video{display:flex;gap:var(--sp-4);flex:1;min-height:0}
.lp-shot-thumb{position:relative;flex:none;align-self:flex-start;display:flex;align-items:center;justify-content:center;width:var(--lp-shot-thumb-w);aspect-ratio:788/1264;overflow:hidden;border-radius:var(--lp-radius-panel);background:linear-gradient(160deg,var(--lp-shot-thumb-a),var(--lp-shot-thumb-b));color:var(--lp-page)}
.lp-shot-thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.lp-shot-thumb>svg{position:relative;width:28px;height:28px;opacity:.9;filter:drop-shadow(0 1px 4px rgba(0,0,0,.5))}
/* the box sits on the logo in img/ai-detection.jpg: 35–51% across, 81.5–91% down */
.lp-shot-thumb .box{position:absolute;left:35%;width:16%;top:81.5%;height:9.5%;border:2px solid var(--lp-accent);border-radius:4px}
.lp-shot-thumb .box b{position:absolute;left:-2px;bottom:100%;padding:0 var(--sp-1);border-radius:4px 4px 4px 0;background:var(--lp-accent);color:#fff;font-weight:inherit;font-size:var(--lp-tiny);line-height:var(--lp-micro-lh);white-space:nowrap}
.lp-shot-found{display:flex;flex-direction:column;gap:var(--sp-2);min-width:0;flex:1}.lp-shot-found p{margin:0}
.lp-shot-found .pills{display:flex;flex-wrap:wrap;gap:var(--sp-1)}
.lp-shot-quote{border-radius:var(--lp-radius-panel);background:var(--lp-surface);padding:var(--sp-2) var(--sp-3)}
.lp-shot-quote span{color:var(--lp-muted);font-size:var(--lp-tiny)}.lp-shot-quote p{color:var(--lp-ink)}
.lp-shot-quote mark{background:color-mix(in srgb,var(--lp-accent) 22%,transparent);color:inherit;border-radius:3px;padding:0 2px}
.lp-shot-alerts{display:flex;flex-direction:column;gap:var(--sp-2);flex:1;justify-content:center}
.lp-shot-alerts>div{display:flex;align-items:flex-start;gap:var(--sp-3);border-radius:var(--lp-radius-panel);background:var(--lp-surface);padding:var(--sp-3)}
.lp-shot-alerts>div>div{flex:1;min-width:0}.lp-shot-alerts strong{display:block;color:var(--lp-ink)}.lp-shot-alerts p{margin:0}
.lp-shot-alerts>div>span{flex:none;color:var(--lp-muted);font-size:var(--lp-tiny);line-height:var(--lp-micro-lh)}
.lp-shot-alert-icon{flex:none;display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background:var(--lp-page);color:var(--lp-accent)}.lp-shot-alert-icon svg{width:14px;height:14px}
.lp-shot.soon{filter:grayscale(1)}.lp-shot.soon .lp-shot-alerts{opacity:.6}.lp-shot.soon .lp-shot-alert-icon{color:var(--lp-muted)}
.lp-shot-connectors{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-2)}
.lp-shot-connectors span{display:flex;flex-direction:column;align-items:center;gap:var(--sp-2);border-radius:var(--lp-radius-panel);background:var(--lp-surface);padding:var(--sp-4) var(--sp-2);color:var(--lp-ink)}
.lp-shot-connectors svg{width:22px;height:22px;color:var(--lp-body)}
.lp-shot-alerts .rise .lp-shot-alert-icon{color:var(--positive-fg)}.lp-shot-alerts .fall .lp-shot-alert-icon{color:var(--negative-fg)}
/* the wide #fafafa block and the numbered stages inside it */
.lp-block{border-radius:var(--lp-radius-block);background:var(--lp-block);padding:var(--lp-block-py) var(--sp-8)}
.lp-stage{display:flex;flex-direction:column;min-width:0}
.lp-stage-title{display:flex;align-items:center;gap:var(--sp-2);font-size:var(--lp-small);line-height:var(--lp-small-lh);color:var(--lp-ink)}
.lp-num{display:flex;align-items:center;justify-content:center;flex:none;width:20px;height:20px;border-radius:50%;background:var(--lp-accent);color:#fff;font-size:var(--lp-tiny)}
.lp-panel{flex:1;margin-top:var(--sp-3);border-radius:var(--lp-radius-panel);background:var(--lp-page);padding:var(--sp-4)}
/* proof: heading and a stat callout beside a bar list, inside the #fafafa block */
.lp-split{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--lp-split-gap);align-items:center}
.lp-split .lp-micro{margin-top:var(--sp-5)}
.lp-micro a{color:inherit;text-decoration:underline;text-decoration-color:var(--lp-rule);text-underline-offset:3px}.lp-micro a:hover{color:var(--lp-ink)}
.lp-split .lp-panel{margin:0;padding:var(--sp-7)}
.lp-bars{list-style:none;margin:var(--sp-6) 0 0;padding:0;display:grid;gap:var(--sp-5)}
.lp-bars li{display:grid;grid-template-columns:1fr auto;row-gap:var(--sp-2);font-size:var(--lp-small);line-height:var(--lp-small-lh);color:var(--lp-body)}
.lp-bars strong{color:var(--lp-ink);font-weight:inherit;font-variant-numeric:tabular-nums}
.lp-bars i{grid-column:1/-1;height:var(--lp-bar-h);border-radius:0 var(--lp-bar-radius) var(--lp-bar-radius) 0;background:var(--lp-bar)}
.lp-bars .lead span{color:var(--lp-ink)}.lp-bars .lead i{background:var(--lp-accent)}
.lp-callout{display:flex;align-items:center;gap:var(--sp-6);margin-top:var(--sp-7)}
.lp-callout strong{flex:none;font-size:var(--lp-stat);line-height:var(--lp-stat-lh);letter-spacing:var(--lp-h1-sm-track);font-weight:var(--lp-w-display);color:var(--lp-ink)}
.lp-callout .lp-small{color:var(--lp-ink)}.lp-callout .lp-micro{margin-top:var(--sp-1)}
/* pricing */
.lp-plan{display:flex;flex-direction:column;align-items:flex-start;border-radius:var(--lp-radius-block);background:var(--lp-block);padding:var(--sp-7)}
.lp-plan.popular{box-shadow:0 0 0 2px var(--lp-accent)}
.lp-plan-name{display:flex;align-items:center;gap:var(--sp-2);width:100%;min-height:22px}.lp-plan-name .lp-pill{margin-left:auto;padding-top:2px;padding-bottom:2px}
.lp-dot{width:8px;height:8px;border-radius:50%;background:var(--lp-accent)}
.lp-price{display:flex;align-items:baseline;gap:var(--sp-2);margin-top:var(--sp-5)!important}
.lp-plan .lp-body{margin-top:var(--sp-3);min-height:calc(2 * var(--lp-text-lh))}
.lp-plan .lp-btn{margin-top:var(--sp-6)}
.lp-checks{list-style:none;width:100%;margin:var(--sp-7) 0 0;padding:var(--sp-6) 0 0;border-top:1px solid var(--lp-rule);display:grid;gap:var(--sp-3)}
.lp-checks li{display:flex;align-items:flex-start;gap:10px;font-size:var(--lp-small);line-height:var(--lp-small-lh);color:var(--lp-ink)}
.lp-tick{display:flex;align-items:center;justify-content:center;flex:none;width:var(--lp-tick);height:var(--lp-tick);margin-top:2px;border-radius:50%;background:var(--lp-green);color:#fff}.lp-tick svg{width:10px;height:10px}
.lp-section>.lp-micro{margin-top:var(--sp-6)}
/* footer */
.lp-footer{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);margin-top:var(--lp-footer-gap);padding:var(--sp-10) 0;border-top:1px solid var(--lp-rule)}
/* sign in and sign up: one centred card under the same nav pill */
.lp-auth-main{display:flex;flex-direction:column;align-items:center;justify-content:center;box-sizing:border-box;min-height:100vh;padding:var(--lp-main-top) var(--sp-4) var(--sp-10)}
.lp-auth-card{width:100%;max-width:var(--lp-auth-max);box-sizing:border-box;border-radius:var(--lp-radius-block);background:var(--lp-block);padding:var(--sp-9)}
.lp-auth-card .lp-h2{font-size:var(--lp-h2-sm);line-height:var(--lp-h2-sm-lh);letter-spacing:var(--lp-h2-sm-track)!important}
.lp-auth-card>.lp-small{margin-top:var(--sp-2)}
.lp-auth-card strong{color:var(--lp-ink);font-weight:var(--lp-w-regular);overflow-wrap:anywhere}
.lp-form{display:grid;gap:var(--sp-4);margin-top:var(--sp-6)}
.lp-field{display:grid;gap:6px}.lp-field>span:first-child{font-size:var(--lp-small);line-height:var(--lp-small-lh);color:var(--lp-ink)}
.lp-field input{width:100%;box-sizing:border-box;height:var(--lp-input-h);padding:0 var(--sp-4);border:1px solid var(--lp-rule);border-radius:var(--lp-radius-panel);background:var(--lp-page);color:var(--lp-ink);font:inherit;letter-spacing:inherit;font-size:var(--lp-text);outline:none;transition:border-color .15s,box-shadow .15s}
.lp-field input::placeholder{color:var(--lp-faint)}
.lp-field input:focus-visible{border-color:var(--lp-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--lp-accent) 25%,transparent)}
.lp-input-wrap{position:relative;display:block}.lp-input-wrap input{padding-right:64px}
.lp-reveal{position:absolute;right:6px;top:50%;translate:0 -50%;height:var(--lp-btn-h-sm);padding:0 var(--sp-3);border:0;border-radius:var(--radius-full);background:none;font:inherit;letter-spacing:inherit;font-size:var(--lp-micro);color:var(--lp-body)}
.lp-reveal:hover{background:var(--lp-surface)}
.lp-btn.wide{width:100%}
.lp-btn{border:0;font-family:inherit;letter-spacing:inherit;cursor:pointer}
.lp-btn[disabled]{opacity:.6;cursor:default}
.lp-btn.subtle{background:var(--lp-surface-2);color:var(--lp-body)}
.lp-error{min-height:var(--lp-small-lh);font-size:var(--lp-small);line-height:var(--lp-small-lh);color:var(--lp-error)}.lp-error:empty{display:none}
.lp-link{display:block;margin:var(--sp-5) auto 0;border:0;background:none;padding:0;font:inherit;letter-spacing:inherit;font-size:var(--lp-small);line-height:var(--lp-small-lh);color:var(--lp-body);text-decoration:underline;text-decoration-color:var(--lp-rule);text-underline-offset:4px}
.lp-link:hover{color:var(--lp-ink)}
.lp-auth-swap{margin-top:var(--sp-6)!important}.lp-auth-swap a{color:var(--lp-ink);text-decoration:underline;text-decoration-color:var(--lp-accent);text-decoration-thickness:2px;text-underline-offset:4px}
.lp-auth .lp-nav nav:empty{display:none}
@media(max-width:900px){.lp-dash{grid-template-columns:minmax(0,1fr)}.lp-dash aside{display:none}.lp-dash-table th:nth-child(6),.lp-dash-table td:nth-child(6){display:none}.lp-grid.two{grid-template-columns:1fr}.lp-split{grid-template-columns:1fr;gap:var(--sp-8)}.lp-grid.three{grid-template-columns:repeat(2,minmax(0,1fr))}#plans.lp-grid.three{grid-template-columns:1fr;max-width:var(--lp-column);margin-left:auto;margin-right:auto}}
@media(max-width:640px){
.lp-h1{font-size:var(--lp-h1-sm);line-height:var(--lp-h1-sm-lh);letter-spacing:var(--lp-h1-sm-track)!important}
.lp-h2{font-size:var(--lp-h2-sm);line-height:var(--lp-h2-sm-lh);letter-spacing:var(--lp-h2-sm-track)!important}
.lp-main{padding-left:var(--sp-4);padding-right:var(--sp-4)}
.lp-hero{padding-top:var(--sp-10)}
.lp-section{padding-top:var(--lp-section-gap-sm)}
.lp-grid.three{grid-template-columns:1fr}
.lp-shot{padding:var(--sp-4)}.lp-shot-kpis{grid-template-columns:minmax(0,1.3fr) minmax(0,.9fr) minmax(0,1.1fr)}.lp-shot-kpis>div{padding:var(--sp-2)}.lp-shot-kpis strong{font-size:var(--lp-small);line-height:var(--lp-small-lh)}.lp-shot-kpis em,.lp-shot-kpis .lp-shot-level{display:none}.lp-dash-main{padding:var(--sp-5) var(--sp-4) var(--sp-3);gap:var(--sp-4)}.lp-dash-segs{grid-template-columns:1fr}.lp-dash-seg:first-child{display:none}.lp-dash-table th:nth-child(n+3),.lp-dash-table td:nth-child(n+3){display:none}.lp-dash-table th:nth-child(5),.lp-dash-table td:nth-child(5){display:table-cell;text-align:right;padding-right:0}.lp-shot-table.results th:nth-child(n+4),.lp-shot-table.results td:nth-child(n+4){display:none}.lp-shot-video{gap:var(--sp-3)}.lp-shot-thumb{width:var(--lp-shot-thumb-w-sm)}
.lp-block{padding:var(--sp-10) var(--sp-5)}
.lp-nav nav{display:none}
.lp-footer{flex-direction:column}
.lp-auth-card{padding:var(--sp-6)}
}

/* ---------- Responsive ---------- */
@media(max-width:1000px){.chart-grid.three,.seg-grid{grid-template-columns:1fr}.kpis,.kpis:has(> :nth-child(5)){grid-template-columns:1fr 1fr}.kpi:nth-child(3),.kpi:nth-child(5){border-left:0}.kpi:nth-child(n+3){border-top:1px solid var(--border)}}
@media(max-width:800px){
.chart-grid.two{grid-template-columns:1fr}
.ac-x span:nth-child(even):not(.last){display:none}
.layout{display:block;min-height:0}
.side-nav{position:static;height:auto;border-right:0;border-bottom:1px solid var(--border);padding:0 var(--sp-4) var(--sp-3)}.wordmark{height:56px;margin:0 calc(-1 * var(--sp-4)) var(--sp-2);padding:0 var(--sp-4)}
.nav-list{flex-direction:row;gap:var(--sp-1);overflow-x:auto}.nav-list a,.nav-list .soon{width:auto;font-size:var(--text-sm);padding:0 var(--sp-2)}
main{padding:var(--sp-6) var(--sp-5)}
.section-heading{flex-direction:column;gap:var(--sp-3)}.toolbar{width:100%;flex-wrap:wrap}.tb{flex:1}.tb .select{width:100%}
.list-controls>.btn{margin-left:0}.tb.filter{max-width:none;flex-basis:100%}.subtabs{gap:var(--sp-4);overflow-x:auto}.subtabs button{font-size:var(--text-base);white-space:nowrap}
.nav-list a.bottom{margin-top:0}
.table td,.table th{padding:var(--sp-3)}.caption{min-width:220px}
.results-header{flex-wrap:wrap}
}
@media(max-width:480px){
.wordmark{font-size:var(--text-lg)}h1{font-size:var(--text-2xl)}
.kpis,.kpis:has(> :nth-child(5)){grid-template-columns:1fr}.kpi{border-left:0;border-top:1px solid var(--border)}.kpi:first-child{border-top:0}.kpi strong{font-size:var(--text-kpi-sm)}
}

/* ---------- Research: browse by category, related searches ---------- */
.browse{margin-top:var(--section-gap)}
.chips{display:flex;flex-wrap:wrap;gap:var(--sp-2);margin-bottom:var(--sp-4)}
.chip{font-size:var(--text-sm);padding:var(--sp-1) var(--sp-3);border:1px solid var(--border);border-radius:var(--radius-full);background:var(--card);color:var(--foreground);cursor:pointer}
.chip.active{background:var(--brand);border-color:var(--brand);color:var(--primary-foreground)}
.link{background:none;border:0;padding:0;font:inherit;color:var(--foreground);cursor:pointer;text-align:left}.link:hover{color:var(--brand);text-decoration:underline}
.related-groups{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-6)}
.related-groups h4{margin:0 0 var(--sp-2);font-size:var(--text-sm);color:var(--muted-foreground);font-weight:var(--w-medium)}
.related-groups>div{min-width:0}
.related-sum{display:flex;align-items:baseline;gap:var(--sp-2);margin:0 0 var(--sp-4);font-size:var(--text-base);color:var(--muted-foreground)}
.related-sum strong{font-size:var(--text-kpi);font-weight:var(--w-semibold);letter-spacing:var(--tracking-num);line-height:1.1;color:var(--foreground)}.related-sum b{font-weight:var(--w-semibold);color:var(--foreground)}
.related-table{width:100%;border-collapse:collapse;font-size:var(--text-base)}
.related-table th{padding:var(--sp-2) 0;text-align:left;font-size:var(--text-xs);font-weight:var(--w-medium);color:var(--muted-foreground);border-bottom:1px solid var(--border)}
.related-table td{padding:var(--sp-3) 0;border-bottom:1px solid var(--border)}
.related-table th.numeric,.related-table td.numeric{text-align:right;padding-left:var(--sp-4);width:1%;white-space:nowrap}
.related-table .delta{margin-left:0}
.related-table+.btn{margin-top:var(--sp-4)}
@media(max-width:700px){.related-groups{grid-template-columns:1fr}}
.pager-row{justify-content:space-between}
.pager{display:flex;align-items:center;flex-wrap:wrap;gap:var(--sp-1)}
.page{display:inline-flex;align-items:center;justify-content:center;min-width:var(--control-h-sm);height:var(--control-h-sm);padding:0 var(--sp-2);border:0;border-radius:var(--radius-md);background:none;color:var(--muted-foreground);font-size:var(--text-sm);font-variant-numeric:tabular-nums}
.page:hover{background:var(--muted);color:var(--foreground)}.page[aria-current=page]{background:var(--foreground);color:var(--background)}
.page[disabled]{opacity:.35;cursor:default;background:none}.page svg{width:var(--icon-sm);height:var(--icon-sm)}
.page-gap{min-width:var(--sp-5);text-align:center;color:var(--muted-foreground)}

/* ---------- North Star skin (.ns): a signed-in view in the landing page's style (views/research.js) ----------
   theme.css remaps the colour, weight and font tokens under .ns, so most components follow on their own.
   What is left here is shape: pill controls, flat grey cards, #fafafa blocks with a dotted title and white panels. */
.ns{font-family:var(--font-sans);letter-spacing:var(--lp-tracking);color:var(--foreground);font-weight:var(--w-normal)}
.ns h1{font-size:var(--lp-h2);line-height:var(--lp-h2-lh);letter-spacing:var(--lp-h2-track);font-weight:var(--lp-w-regular);margin:0 0 var(--sp-2);text-wrap:balance}
.ns h2{font-size:var(--lp-h2-sm);line-height:var(--lp-h2-sm-lh);letter-spacing:var(--lp-h2-sm-track);font-weight:var(--lp-w-regular)}
.ns .section-heading{margin-bottom:var(--sp-8)}
.ns .section-heading .subtext,.ns .results-header .subtext{font-size:var(--lp-text);line-height:var(--lp-text-lh)}
.ns .results-header .subtext{margin-top:var(--sp-2)}
.ns .error{font-size:var(--lp-small);color:var(--lp-error)}
.ns .row .muted,.ns .fetch-overlay .muted{font-size:var(--lp-small);line-height:var(--lp-small-lh)}
/* controls: full pills, the primary one in the accent */
.ns .btn{height:var(--ns-control-h);padding:0 var(--sp-5);border-radius:var(--radius-full);font-size:var(--lp-small);letter-spacing:inherit;box-shadow:none;transition:opacity .15s,background-color .15s,color .15s}
.ns .btn:not([data-variant]){background:var(--lp-accent-btn);color:#fff}.ns .btn:not([data-variant]):hover{opacity:.9}  /* Basecoat resolves its own primary at :root, so the remap in theme.css does not reach it */
.ns .btn[data-size=sm]{height:var(--lp-btn-h-sm);padding:0 var(--sp-3)}
.ns .btn[data-variant=outline]{border:0;background:var(--lp-surface-2);color:var(--lp-body)}.ns .btn[data-variant=outline]:hover{background:var(--lp-rule);color:var(--lp-ink)}
.ns .btn[data-variant=ghost]{color:var(--lp-body)}.ns .btn[data-variant=ghost]:hover{background:var(--lp-surface-2);color:var(--lp-ink)}
.ns .btn:focus-visible,.ns .chip:focus-visible,.ns .link:focus-visible{outline:2px solid var(--lp-accent);outline-offset:2px}
.ns .select{height:var(--ns-control-h);border-radius:var(--radius-full);border-color:var(--lp-rule);background-color:var(--lp-page);box-shadow:none;letter-spacing:inherit;font-size:var(--lp-small)}
.ns .tb .select{padding-left:36px}.ns .tb .cal{left:14px}
.ns .badge{border-radius:var(--radius-full);font-size:var(--lp-micro);line-height:var(--lp-micro-lh);letter-spacing:inherit;border:0}
/* blocks: #fafafa, radius 24, a dot before the title, the figure on a white panel */
.ns .chart-card{background:var(--lp-block);border-radius:var(--lp-radius-block);padding:var(--sp-6)}
.ns .chart-card>p:only-child{margin:0;font-size:var(--lp-small)}
.ns .chart-grid .chart-card{display:flex;flex-direction:column;padding-bottom:var(--sp-6)}
.ns .chart-head{flex-direction:row;flex-wrap:wrap;align-items:baseline;gap:var(--sp-1) var(--sp-3);margin-bottom:var(--sp-3)}
.ns .chart-head h3{display:flex;align-items:center;gap:var(--sp-2);font-size:var(--lp-small);line-height:var(--lp-small-lh);font-weight:var(--lp-w-regular);letter-spacing:inherit}
.ns .chart-head h3::before{content:"";flex:none;width:8px;height:8px;border-radius:50%;background:var(--lp-accent)}
.ns .chart-head .subtext{font-size:var(--lp-micro);line-height:var(--lp-micro-lh);color:var(--lp-muted)}
.ns-panel{flex:1;min-width:0;border-radius:var(--lp-radius-panel);background:var(--lp-page);padding:var(--sp-6)}
.ns .plot .tick,.ns .plot .placeholder{fill:var(--lp-muted)}
/* lookup: the editor is the white panel */
.ns .lookup{margin-bottom:var(--sp-10)}
.ns .lookup-label{font-size:var(--lp-small);color:var(--lp-ink)}
.ns .kw-editor{border-radius:var(--lp-radius-panel);margin-bottom:var(--sp-4)}
.ns .kw-editor:focus-within{border-color:var(--lp-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--lp-accent) 25%,transparent)}
.ns .kw-lines,.ns .kw-editor .textarea{padding:var(--sp-4);font-size:var(--lp-text);line-height:var(--lp-text-lh);letter-spacing:inherit}
.ns .kw-lines{padding-right:0;color:var(--lp-faint)}
.ns .kw-editor .textarea::placeholder{color:var(--lp-faint)}
.ns .kw-result{margin-bottom:var(--sp-10)}
.ns .kw-dim>.chart-card:only-child{display:flex;align-items:flex-end;box-sizing:border-box;min-height:var(--ns-nodata-min);margin-bottom:0}  /* room for the Fetch overlay over a one-line card */
/* KPI tiles: one flat grey card each, no dividers */
.ns .kpis{background:none;gap:var(--block-gap)}
.ns .kpis .kpi{border:0;border-radius:var(--lp-radius-card);background:var(--lp-surface);padding:var(--sp-5)}
.ns .kpi-label{font-size:var(--lp-small);line-height:var(--lp-small-lh)}
.ns .kpi strong{font-size:var(--ns-kpi);letter-spacing:var(--ns-kpi-track)}
.ns .kpi strong .badge{font-size:var(--lp-micro)}
.ns .kpi-sub{font-size:var(--lp-micro);line-height:var(--lp-micro-lh);color:var(--lp-muted)}
/* global volume: the landing page's bar list, accent on the searched country only */
.ns .geo-total{font-size:var(--lp-h2);line-height:var(--lp-h2-lh);letter-spacing:var(--lp-h2-track);font-weight:var(--lp-w-display);margin-bottom:var(--sp-5)}
.ns .geo-rows{gap:var(--sp-4)}
.ns .geo-country{color:var(--lp-body)}.ns .geo-row.current .geo-country{color:var(--lp-ink)}.ns .geo-row.none .geo-country,.ns .geo-row.none .geo-value{color:var(--lp-faint)}
.ns .geo-bar{height:var(--lp-bar-h);border-radius:0;background:none}
.ns .geo-bar i{border-radius:0 var(--lp-bar-radius) var(--lp-bar-radius) 0;background:var(--lp-bar)}.ns .geo-row.current .geo-bar i{background:var(--lp-accent)}
.ns .geo-row.current .geo-value{font-weight:inherit;color:var(--lp-ink)}.ns .geo-value{color:var(--lp-body)}
/* related searches: one white panel per group */
.ns .related-groups{gap:var(--sp-4)}
.ns .related-groups>div{border-radius:var(--lp-radius-panel);background:var(--lp-page);padding:var(--sp-5) var(--sp-6)}
.ns .related-groups h4{margin-bottom:var(--sp-1);font-size:var(--lp-small);line-height:var(--lp-small-lh);font-weight:var(--lp-w-regular);color:var(--lp-ink)}
.ns .related-sum{font-size:var(--lp-small);line-height:var(--lp-small-lh);color:var(--lp-body)}
.ns .related-sum strong{font-size:var(--lp-h2-sm);line-height:var(--lp-h2-sm-lh);letter-spacing:var(--lp-h2-sm-track);font-weight:var(--lp-w-display);color:var(--lp-accent)}.ns .related-sum b{font-weight:var(--lp-w-regular);color:var(--lp-ink)}
.ns .related-table{font-size:var(--lp-small);line-height:var(--lp-small-lh)}
.ns .related-table th{font-size:var(--lp-micro);font-weight:var(--lp-w-regular);color:var(--lp-muted);border-color:var(--lp-rule)}
.ns .related-table td{border-color:var(--ns-row-rule)}.ns .related-table tbody tr:last-child td{border-bottom:0}
.ns .related-table td.numeric{color:var(--lp-body)}
.ns .link:hover{color:var(--lp-ink);text-decoration:underline;text-decoration-color:var(--lp-accent);text-decoration-thickness:2px;text-underline-offset:4px}
/* browse: pill filters, the table on a #fafafa block */
.ns .browse{margin-top:var(--ns-section-gap)}
.ns .browse .results-header{margin:0 0 var(--sp-6)}
.ns .chips{margin-bottom:var(--sp-5)}
.ns .chip{display:inline-flex;align-items:center;height:var(--lp-btn-h-sm);padding:0 var(--sp-4);border:0;background:var(--lp-surface);color:var(--lp-body);font-size:var(--lp-small);letter-spacing:inherit;transition:background-color .15s,color .15s}
.ns .chip:hover{background:var(--lp-surface-2);color:var(--lp-ink)}
.ns .chip.active{background:var(--lp-nav);color:#fff}
.ns .page{min-width:var(--lp-btn-h-sm);height:var(--lp-btn-h-sm);padding:0 var(--sp-3);border-radius:var(--radius-full);color:var(--lp-body);font-size:var(--lp-small);letter-spacing:inherit;transition:background-color .15s,color .15s}
.ns .page:hover{background:var(--lp-surface-2);color:var(--lp-ink)}.ns .page[aria-current=page]{background:var(--lp-nav);color:#fff}
.ns .page.step{padding:0;background:var(--lp-surface)}.ns .page.step:hover{background:var(--lp-surface-2)}.ns .page[disabled],.ns .page[disabled]:hover{background:var(--lp-surface);color:var(--lp-faint);opacity:1}
.ns .page:focus-visible{outline:2px solid var(--lp-accent);outline-offset:2px}
.ns .page-gap{color:var(--lp-faint)}
.ns .table-wrap{background:var(--lp-block);border:0;border-radius:var(--lp-radius-block);padding:var(--sp-2) var(--sp-4) var(--sp-3);margin-bottom:var(--sp-5)}
.ns .table{font-size:var(--lp-small);letter-spacing:inherit}
.ns .table th{background:none;font-size:var(--lp-micro);font-weight:var(--lp-w-regular);color:var(--lp-muted);padding-top:var(--sp-4);padding-bottom:var(--sp-3)}
.ns .table tr{border-color:var(--ns-row-rule)}
.ns .table tbody tr:hover{background:var(--lp-page)}
.ns .table td.muted{color:var(--lp-muted);white-space:nowrap}
/* dashboard: project cards as flat grey cards, the empty state as a block */
.ns .btn[data-size=icon-sm]{width:var(--lp-btn-h-sm);height:var(--lp-btn-h-sm);padding:0}
.ns .btn[data-variant=destructive]{background:var(--lp-error);color:#fff}.ns .btn[data-variant=destructive]:hover{opacity:.9}
.ns .section-heading{align-items:center}
.ns .brand-grid{margin-bottom:0}
.ns .brand-grid+.chart-card,.ns .empty-state+.chart-card{margin-top:var(--sp-8)}  /* the Dashboard's Views chart under the projects */
.ns .brand-card{border-radius:var(--lp-radius-card);background:var(--lp-surface);padding:var(--sp-6);gap:var(--sp-4);transition:background-color .15s}
.ns .brand-card:hover{background:var(--lp-surface-2);box-shadow:none}
.ns .brand-card:focus-visible{outline:2px solid var(--lp-accent);outline-offset:2px}
.ns .brand-card strong{font-size:var(--lp-lead);line-height:var(--lp-lead-lh);font-weight:var(--lp-w-regular);letter-spacing:inherit}
.ns .brand-card strong a:hover{text-decoration:underline;text-decoration-color:var(--lp-accent);text-decoration-thickness:2px;text-underline-offset:4px}
.ns .brand-card .brand-meta{font-size:var(--lp-small);line-height:var(--lp-small-lh);color:var(--lp-body)}.ns .brand-card .brand-meta svg,.ns .external{color:var(--lp-muted)}
.ns .initials{border:0;background:var(--lp-page);color:var(--lp-body)}.ns .avatar-img{border:0}
.ns .brand-actions{top:var(--sp-4);right:var(--sp-4)}
.ns .empty-state{border-radius:var(--lp-radius-block);background:var(--lp-block);padding:var(--lp-block-py) var(--sp-8);text-align:center;color:var(--lp-body)}
.ns .empty-state h2{margin-bottom:var(--sp-2)}.ns .empty-state p{max-width:var(--lp-prose-max);margin:0 auto;font-size:var(--lp-text);line-height:var(--lp-text-lh);text-wrap:balance}
/* menus and dialogs */
.ns .dropdown-menu>[data-popover]{border-radius:var(--lp-radius-panel);padding:6px;box-shadow:var(--popover-shadow)}
.ns .dropdown-menu [role=menuitem]{height:var(--lp-btn-h-sm);border-radius:var(--sp-2);font-size:var(--lp-small);font-weight:var(--lp-w-regular);letter-spacing:inherit}
.ns .dropdown-menu [role=menuitem]:hover,.ns .dropdown-menu [role=menuitem]:focus-visible{background:var(--lp-surface-2)}
.ns .dialog>article{border:0;border-radius:var(--lp-radius-block);padding:var(--sp-8);box-shadow:var(--popover-shadow);font-family:var(--font-sans);letter-spacing:var(--lp-tracking)}
.ns .dialog>article>header>h2{font-size:var(--lp-h2-sm);line-height:var(--lp-h2-sm-lh);letter-spacing:var(--lp-h2-sm-track);font-weight:var(--lp-w-regular)}
.ns .dialog>article>header>p{font-size:var(--lp-small);line-height:var(--lp-small-lh);color:var(--lp-body)}
.ns .form .label{font-size:var(--lp-small);line-height:var(--lp-small-lh);color:var(--lp-ink)}
.ns .input,.ns .form .select{width:100%;height:var(--lp-input-h);padding:0 var(--sp-4);border-color:var(--lp-rule);border-radius:var(--lp-radius-panel);background-color:var(--lp-page);box-shadow:none;font-size:var(--lp-text);letter-spacing:inherit;transition:border-color .15s,box-shadow .15s}
.ns .input::placeholder{color:var(--lp-faint)}
.ns .input:focus-visible,.ns .select:focus-visible{outline:none;border-color:var(--lp-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--lp-accent) 25%,transparent)}
.ns .tb .input,.ns .form .tb .select{padding-left:40px}
.ns .select[disabled]{opacity:.6}
/* search tracker: brand keywords row, segmented sub-tabs, summary cards, sortable tables */
.ns .terms{margin:calc(-1 * var(--sp-3)) 0 var(--sp-6)}
.ns .terms-label{font-size:var(--lp-small);color:var(--lp-ink)}.ns .terms-label svg{color:var(--lp-muted)}.ns .terms-label .muted{color:var(--lp-muted)}
.ns .term{height:var(--lp-btn-h-sm);padding:0 6px 0 var(--sp-4);background:var(--lp-surface-2);font-size:var(--lp-small)}
.ns .term button:hover,.ns .term button:focus-visible{background:var(--lp-rule)}
.ns .term-add .input{width:200px;height:var(--lp-btn-h-sm);padding:0 var(--sp-4);border-radius:var(--radius-full);font-size:var(--lp-small)}
.ns .subtabs{gap:2px;width:max-content;max-width:100%;box-sizing:border-box;padding:3px;border:0;border-radius:var(--radius-full);background:var(--lp-surface);margin-bottom:var(--sp-6)}
.ns .subtabs button{height:var(--lp-btn-h-sm);margin:0;padding:0 var(--sp-4);border:0;border-radius:var(--radius-full);font-size:var(--lp-small);letter-spacing:inherit;color:var(--lp-body);transition:color .15s}
.ns .subtabs button:hover{color:var(--lp-ink)}.ns .subtabs button[aria-current=true]{background:var(--lp-page);color:var(--lp-ink);box-shadow:0 1px 2px rgba(0,0,0,.06)}
.ns .subtabs button:focus-visible{outline:2px solid var(--lp-accent);outline-offset:2px}
.ns .seg-card{border-radius:var(--lp-radius-card);background:var(--lp-surface);padding:var(--sp-5);gap:var(--sp-4)}
.ns .seg-card h3{font-size:var(--lp-small);line-height:var(--lp-small-lh);font-weight:var(--lp-w-regular);letter-spacing:inherit}.ns .seg-card h3 svg{color:var(--lp-muted)}
.ns .seg-legend{font-size:var(--lp-micro);line-height:var(--lp-micro-lh);color:var(--lp-body)}.ns .seg-legend b{color:var(--lp-ink)}
.ns .seg-bar{height:8px;gap:3px}.ns .seg-bar i{border-radius:var(--radius-full)}
.ns .list-controls{margin-bottom:var(--sp-4)}
.ns .list-controls .input{height:var(--ns-control-h);border-radius:var(--radius-full);font-size:var(--lp-small)}
.ns .table th.sortable{padding:0}
.ns .th-btn{min-height:44px;padding:0 var(--table-px);font-weight:var(--lp-w-regular);letter-spacing:inherit}.ns .th-btn:hover,.ns th[aria-sort=ascending] .th-btn,.ns th[aria-sort=descending] .th-btn{color:var(--lp-ink)}
.ns .kw-table .th-btn{padding:0 var(--sp-3)}
.ns .kw-link,.ns button.kw-link{font-weight:var(--lp-w-regular);letter-spacing:inherit}
.ns .kw-link:hover,.ns button.kw-link:hover,.ns .video-title:hover{text-decoration:underline;text-decoration-color:var(--lp-accent);text-decoration-thickness:2px;text-underline-offset:4px}
.ns .tag{height:24px;padding:0 10px;border-radius:var(--radius-full);font-size:var(--lp-micro);font-weight:var(--lp-w-regular)}
.ns .position,.ns .date-cell,.ns .vol small,.ns .count-cell .muted{color:var(--lp-muted)}
.ns .row-actions .btn[data-size=icon-sm]{width:var(--control-h-sm);height:var(--control-h-sm);background:none;color:var(--lp-muted)}.ns .row-actions .btn[data-size=icon-sm]:hover,.ns .row-actions .btn[aria-expanded=true]{background:var(--lp-surface-2);color:var(--lp-ink)}
.ns .form .textarea{padding:var(--sp-3) var(--sp-4);border-color:var(--lp-rule);border-radius:var(--lp-radius-panel);background:var(--lp-page);box-shadow:none;font-size:var(--lp-text);line-height:var(--lp-text-lh);letter-spacing:inherit}
.ns .form .textarea::placeholder{color:var(--lp-faint)}
.ns .form .textarea:focus-visible{outline:none;border-color:var(--lp-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--lp-accent) 25%,transparent)}
.ns .chart-grid.three .ns-panel{padding:var(--sp-4)}
.ns .fetching{font-size:var(--lp-micro);color:var(--lp-muted)}
/* settings: one narrow column of blocks */
.ns-column{max-width:var(--lp-column)}
.ns-column .chart-card{margin-bottom:var(--sp-4)}
.ns .kv{font-size:var(--lp-small);line-height:var(--lp-small-lh);gap:var(--sp-3) var(--sp-8);margin-bottom:var(--sp-5)}
.ns .kv dt{font-weight:var(--lp-w-regular);color:var(--lp-body)}.ns .kv dd{color:var(--lp-ink);overflow-wrap:anywhere}
.ns-panel>.subtext{font-size:var(--lp-small);line-height:var(--lp-small-lh);margin-bottom:var(--sp-5)}
.ns-panel .form{max-width:none}
.ns .form>.muted,.ns .form>.error{font-size:var(--lp-small);line-height:var(--lp-small-lh);margin:0}.ns .form>.muted:empty{display:none}
@media(max-width:800px){.ns .section-heading{align-items:flex-start}.ns .toolbar>.btn{flex-basis:100%}}  /* the heading stacks there; keep it left */
@media(max-width:640px){
.ns h1{font-size:var(--lp-h2-sm);line-height:var(--lp-h2-sm-lh);letter-spacing:var(--lp-h2-sm-track)}
.ns .chart-card{padding:var(--sp-4)}.ns-panel{padding:var(--sp-4)}
.ns .kpi strong{font-size:var(--ns-kpi-sm)}
}