*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; caret-color: transparent; }
input, textarea, select, [contenteditable] { caret-color: auto; }


:focus-visible { outline: 2px solid var(--focus-ring-color); outline-offset: 2px; }


tr:focus-visible,
.dropdown-item:focus-visible,

.sort-th-btn:focus-visible,
.scan-item:focus-visible { outline-offset: -2px; }


.btn-bare {
  font: inherit;
  color: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
  text-align: inherit;
  background: none;
  border: 0;
  padding: 0;
  margin: 0;
  appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
  text-decoration: none;
}

.btn-bare-block { display: block; width: 100%; }

:root {
  
  color-scheme: light;
  --bg: #f5f5f0;
  --bg-card: #ffffff;
  --bg-hover: #f0f0eb;
  --bg-inset: #eeeee8;
  
  --bg-elev: #f5f5f0;
  --border: #e5e5e0;
  --border-strong: #d4d4cf;
  --text: #1a1a1a;
  --text-dim: #606874;
  --text-muted: #697179;
  --charcoal: #1a1a1a;
  --charcoal-light: #2a2a2a;
  --accent: #f97316;
  --accent-light: #fb923c;
  --accent-dark: #ea580c;
  --accent-bg: #fff7ed;
  
  --focus-ring-color: var(--accent-dark);
  --green: #22c55e;
  --red: #ef4444;
  
  
  --red-dark: #dc2626;
  --green-dark: #16a34a;
  --yellow: #eab308;
  
  
  --blue: #2563eb;
  --orange: #f97316;
  
  
  --amber: #8a6d00;
  --amber-bg: #fff8e1;
  --amber-border: #f3d28a;
  --fit: #dcfce7;
  --fit-text: #166534;
  --poor-fit: #fee2e2;
  --poor-fit-text: #991b1b;
  --weak-fit: #fef9c3;
  --weak-fit-text: #854d0e;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.04);
  --shadow: 0 4px 6px rgba(0,0,0,0.05), 0 2px 4px rgba(0,0,0,0.04), 0 10px 20px rgba(0,0,0,0.03);
  --shadow-lg: 0 10px 25px rgba(0,0,0,0.08), 0 6px 10px rgba(0,0,0,0.05), 0 20px 40px rgba(0,0,0,0.04);
  --shadow-xl: 0 15px 35px rgba(0,0,0,0.1), 0 10px 15px rgba(0,0,0,0.06), 0 25px 50px rgba(0,0,0,0.06);
  --shadow-dark: 0 10px 25px rgba(0,0,0,0.2), 0 6px 10px rgba(0,0,0,0.15);
}


[data-theme="dark"] {
  color-scheme: dark; 
  --bg: #111113;
  --bg-card: #1c1c1f;
  --bg-hover: #252528;
  --bg-inset: #18181b;
  
  --bg-elev: #2c2c30;
  --border: #2e2e33;
  --border-strong: #3a3a40;
  --text: #e8e8ec;
  --text-dim: #8b8b95;
  --text-muted: #8a8a94;
  --charcoal: #e8e8ec;
  --charcoal-light: #d4d4da;
  --accent-bg: rgba(249,115,22,0.12);
  
  --focus-ring-color: var(--accent-light);
  --fit: #16351e;
  --fit-text: #86efac;
  --poor-fit: #351616;
  --poor-fit-text: #fca5a5;
  --weak-fit: #352e0e;
  --weak-fit-text: #fde68a;
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.3), 0 1px 2px rgba(0,0,0,0.2);
  --shadow: 0 4px 6px rgba(0,0,0,0.3), 0 2px 4px rgba(0,0,0,0.2), 0 10px 20px rgba(0,0,0,0.15);
  --shadow-lg: 0 10px 25px rgba(0,0,0,0.4), 0 6px 10px rgba(0,0,0,0.3), 0 20px 40px rgba(0,0,0,0.2);
  --shadow-xl: 0 15px 35px rgba(0,0,0,0.5), 0 10px 15px rgba(0,0,0,0.3), 0 25px 50px rgba(0,0,0,0.25);
  --shadow-dark: 0 10px 25px rgba(0,0,0,0.6), 0 6px 10px rgba(0,0,0,0.4);
}

[data-theme="dark"] .header {
  background: rgba(17, 17, 19, 0.85);
}

[data-theme="dark"] .hero-badge {
  background: var(--bg-card);
  color: var(--text);
}

[data-theme="dark"] .hero-btn-secondary {
  color: var(--text);
  border-color: var(--border);
}
[data-theme="dark"] .hero-btn-secondary:hover {
  border-color: var(--text);
}

[data-theme="dark"] .landing-feature-card.dark {
  background: #0e0e10;
  border-color: #1a1a1d;
}

[data-theme="dark"] .landing-stat-card:nth-child(2) {
  background: #0e0e10;
  border-color: #1a1a1d;
}

[data-theme="dark"] .hiw-num {
  background: #0e0e10;
}

[data-theme="dark"] .cta-card {
  background: #0e0e10;
}

[data-theme="dark"] .tag-market { background: #1e2a3f; color: #7cb9f7; }
[data-theme="dark"] .tag-strongfit, [data-theme="dark"] .class-STRONG-FIT, [data-theme="dark"] .class-STRONG_FIT { background: #0f2918; color: #4ade80; }
[data-theme="dark"] .tag-nofit, [data-theme="dark"] .class-NO-FIT, [data-theme="dark"] .class-NO_FIT { background: #2a0f0f; color: #f87171; }
[data-theme="dark"] .class-PENDING { background: var(--bg-inset); color: var(--text-muted); }

[data-theme="dark"] .chip {
  background: rgba(249,115,22,0.12);
  border-color: rgba(249,115,22,0.25);
  color: var(--accent-light);
}

[data-theme="dark"] .company-logo {
  background: var(--bg-inset);
}

[data-theme="dark"] .chart-loading {
  background: rgba(17, 17, 19, 0.8);
}


[data-theme="dark"] .card-dark {
  background: #0e0e10;
  border-color: #1a1a1d;
}



:where(a, a:visited) { color: var(--accent); text-decoration: none; }
:where(a:hover) { text-decoration: underline; }



.theme-toggle {
  background: none;
  border: 1px solid var(--border);
  color: var(--text-dim);
  width: 32px; height: 32px;
  border-radius: var(--radius-sm);
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: all .2s;
  font-size: 1rem;
  padding: 0;
  flex-shrink: 0;
}
.theme-toggle:hover {
  color: var(--accent);
  border-color: var(--accent);
  background: var(--accent-bg);
}

html { scroll-behavior: smooth; overflow-x: hidden; }

body {
  font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  background: var(--bg);
  color: var(--text);
  line-height: 1.6;
  min-height: 100vh;
  
  display: flow-root;
  overflow-x: hidden;
  overflow-x: clip;
}


html { scroll-padding-top: 84px; }

h1, h2, h3, h4, h5, h6 {
  font-family: 'Space Grotesk', sans-serif;
  line-height: 1.2;
}


.site-footer {
  padding: 20px 24px; padding-bottom: max(20px, env(safe-area-inset-bottom)); margin-top: 40px;
  border-top: 1px solid var(--border);
  text-align: center; font-size:0.75rem; color: var(--text-muted);
  line-height: 1.5;
}
.footer-link { color: var(--text-muted); text-decoration: underline; }
.footer-link:hover { color: var(--text-dim); }

.footer-operator { font-style: normal; }


.busy { opacity: .6; }


.ai-modal { max-width: 320px; margin: 0 auto; text-align: center; padding: 40px 32px; }
.ai-modal-content { display: flex; flex-direction: column; align-items: center; gap: 12px; }
.ai-modal-content h3 { font-size: 1.1rem; }
.ai-modal-content .text-dim { font-size:0.85rem; }

.filter-progress { width: 100%; display: flex; flex-direction: column; gap: 10px; }
.filter-progress-steps { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 10px; }
.filter-progress-step { font-size:0.72rem; color: var(--text-dim); opacity: .5; }
.filter-progress-step.done { opacity: .9; color: var(--text); }
.filter-progress-step.active { opacity: 1; color: var(--accent); font-weight: 600; }


.header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  
  padding: max(14px, env(safe-area-inset-top)) max(24px, env(safe-area-inset-right)) 14px max(24px, env(safe-area-inset-left));
  border-bottom: 1px solid var(--border);
  background: rgba(245, 245, 240, 0.85);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  position: sticky;
  top: 0;
  z-index: 100;
}

.header-left { display: flex; align-items: center; gap: 12px; }
.header h1 {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 1.2rem; font-weight: 700; color: var(--charcoal);
}
.stock-count { color: var(--text-dim); font-size:0.85rem; }

.nav-logo-icon {
  width: 32px; height: 32px;
  background: var(--accent);
  border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  color: white; font-family: 'Space Grotesk', sans-serif;
  font-size: 13px; font-weight: 700;
  transform: rotate(-3deg);
  box-shadow: var(--shadow-sm);
  flex-shrink: 0;
}

.user-menu { position: relative; }
.user-menu-trigger { cursor: pointer; }
.user-menu-dropdown {
  position: absolute; right: 0; top: 100%; margin-top: 4px;
  background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius);
  padding: 12px; min-width: 200px; z-index: 200;
  display: flex; flex-direction: column; gap: 6px;
  box-shadow: var(--shadow-lg);
}
.user-menu-header { display: flex; flex-direction: column; gap: 2px; }
.user-menu-header small { color: var(--text-dim); font-size:0.8rem; }
.user-menu-dropdown hr { border: none; border-top: 1px solid var(--border); margin: 4px 0; }
.user-menu-dropdown .btn { text-align: left; width: 100%; }



.symbol-menu-dropdown { min-width: 230px; }

.symbol-menu-item {
  text-align: left;
  padding: 7px 14px;
}

.symbol-menu-item.danger { color: var(--red); }

.btn.is-starred { color: var(--orange); }
.symbol-menu-item:hover:not(:disabled) { background: var(--bg-hover, rgba(0, 0, 0, 0.05)); }
.symbol-menu-item.active { color: var(--accent); font-weight: 500; }

.symbol-menu-item:disabled { opacity: 0.5; cursor: default; }


.is-updating { opacity: 0.55; transition: opacity 120ms ease; }


.btn {
  background: var(--bg-card);
  color: var(--text);
  border: 1px solid var(--border);
  padding: 4px 12px;
  border-radius: var(--radius-sm);
  cursor: pointer;
  font-family: 'DM Sans', sans-serif;
  font-size:0.8rem;
  font-weight: 500;
  transition: all .2s;
  box-shadow: var(--shadow-sm);
  text-decoration: none;
}
.btn:hover { background: var(--bg-hover); border-color: var(--border-strong); transform: translateY(-1px); box-shadow: var(--shadow); text-decoration: none; }
.btn.active {
  background: var(--accent); border-color: var(--accent); color: #fff;
  box-shadow: 0 4px 12px rgba(249,115,22,0.3);
}
.btn.active:hover { background: var(--accent-dark); }
.btn-sm { padding: 4px 12px; font-size:0.8rem; }
.btn-back { padding: 4px 12px; font-size:0.8rem; }
.btn:disabled { opacity: .5; cursor: not-allowed; }


.btn-primary {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--accent); color: white;
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 600; font-size:0.8rem;
  padding: 4px 12px; border-radius: var(--radius-sm);
  text-decoration: none; border: none; cursor: pointer;
  box-shadow: 0 4px 14px rgba(249,115,22,0.3);
  transition: transform .2s, box-shadow .3s, background .2s;
}
.btn-primary:hover:not(:disabled) { background: var(--accent-dark); transform: translateY(-2px); box-shadow: 0 6px 20px rgba(249,115,22,0.4); }
.btn-primary:disabled { opacity: .5; cursor: not-allowed; transform: none; box-shadow: none; }






.btn-danger {
  background: var(--red); color: #fff; border-color: var(--red);
  font-weight: 600; white-space: nowrap;
}
.btn-danger:hover {
  background: var(--red-dark); border-color: var(--red-dark);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px color-mix(in srgb, var(--red) 35%, transparent);
}
.btn-danger:disabled { opacity: .5; cursor: not-allowed; transform: none; box-shadow: none; }



.btn-quiet-danger { color: var(--red); }
.btn-quiet-danger:hover { color: var(--red-dark); border-color: var(--red); }

.btn-quiet-success { color: var(--green); }
.btn-quiet-success:hover { color: var(--green-dark); border-color: var(--green); }
.btn-quiet-danger:disabled,
.btn-quiet-success:disabled { opacity: .5; cursor: not-allowed; }



.btn-status { color: #fff; font-weight: 600; }
.btn-status.is-on { background: var(--green); border-color: var(--green); }
.btn-status.is-on:hover { background: var(--green-dark); border-color: var(--green-dark); }
.btn-status.is-off { background: var(--red); border-color: var(--red); }
.btn-status.is-off:hover { background: var(--red-dark); border-color: var(--red-dark); }



.btn-error-pill {
  background: color-mix(in srgb, var(--red) 12%, var(--bg-card));
  color: color-mix(in srgb, var(--red) 62%, var(--text));
  border: 1px solid color-mix(in srgb, var(--red) 35%, transparent);
}

.btn-error-pill:hover {
  background: color-mix(in srgb, var(--red) 20%, var(--bg-card));
  border-color: color-mix(in srgb, var(--red) 35%, transparent);
}


.tag, .tag-sm {
  display: inline-block;
  padding: 2px 10px;
  border-radius: 20px;
  font-size:0.75rem;
  font-weight: 600;
  letter-spacing: .02em;
}
.tag { font-size:0.8rem; padding: 3px 12px; }
.tag-market { background: #e0f2fe; color: #0369a1; }
.tag-score { background: var(--bg-inset); color: var(--text); }
.tag-fit, .class-FIT { background: var(--fit); color: var(--fit-text); }
.tag-strongfit, .class-STRONG-FIT, .class-STRONG_FIT { background: #bbf7d0; color: #14532d; }
.tag-poorfit, .class-POOR-FIT, .class-POOR_FIT { background: var(--poor-fit); color: var(--poor-fit-text); }
.tag-nofit, .class-NO-FIT, .class-NO_FIT { background: #fecaca; color: #7f1d1d; }
.tag-weakfit, .class-WEAK-FIT, .class-WEAK_FIT { background: var(--weak-fit); color: var(--weak-fit-text); }
.class-PENDING { background: var(--bg-inset); color: var(--text-muted); }

.tag-muted { background: var(--bg-inset); color: var(--text-dim); font-weight: 500; }

.tag-impersonated {
  background: color-mix(in srgb, var(--orange) 16%, var(--bg-card));
  color: var(--orange);
  white-space: nowrap;
}

.tag-removable {
  background: var(--bg-inset);
  border: 1px solid var(--border);
  color: var(--text);
  font: inherit;
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 1.2;
  cursor: pointer;
  transition: background .15s, border-color .15s;
}
.tag-removable:hover { background: var(--bg-hover); border-color: var(--border-strong); }
.text-green { color: #16a34a; }
.text-red { color: #dc2626; }
.text-muted { color: var(--text-muted); }


.filters {
  display: flex; flex-wrap: wrap; gap: 12px;
  padding: 16px 24px;
  background: var(--bg-card);
  border-bottom: 1px solid var(--border);
  align-items: end;
  border-radius: var(--radius-lg) var(--radius-lg) 0 0;
  box-shadow: var(--shadow-sm);
}


[data-test="section-scan-results"] .filters {
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  margin-bottom: 16px;
}


.filter-group { display: flex; flex-direction: column; gap: 8px; }

.filters .list-picker .scan-source-header {
  justify-content: flex-start;
  gap: 8px;
  width: fit-content;
}

.filters .list-picker .sidebar-label { margin-bottom: 0; }

.list-picker .text-dim, .list-picker .text-error { font-size: 0.8rem; }
.list-picker .empty-state { padding: 0; gap: 0; }
.list-picker .empty-state p { font-size: 0.8rem; margin: 0; }

.filter-group > label { font-size:0.75rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: .05em; font-family: 'Space Grotesk', sans-serif; font-weight: 600; }
.filter-group select, .filter-group input {
  background: var(--bg);
  color: var(--text);
  border: 1px solid var(--border);
  padding: 6px 10px;
  border-radius: var(--radius-sm);
  font-size:0.85rem;
  min-width: 100px;
  font-family: 'DM Sans', sans-serif;
}
.filter-group select { min-width: 140px; }
.filter-group input[type="text"] { min-width: 180px; }
.filter-group input[type="number"] { width: 70px; }
.filter-checkbox { justify-content: flex-end; padding-bottom: 6px; }
.filter-checkbox label { display: flex; align-items: center; gap: 4px; font-size:0.85rem; color: var(--text); text-transform: none; cursor: pointer; white-space: nowrap; }
.filter-checkbox input[type="checkbox"] { min-width: auto; width: 16px; }


[data-test="panel-scan-results"] {
  display: flex;
  flex-direction: column;
  height: calc(100dvh - var(--sd-header-h) - var(--sd-pinned-h, 0px));
  min-height: 320px;
}

.card.scan-results-card {
  padding: 0;
  overflow: hidden;
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.scan-results-card > .table-wrap {
  padding: 8px;
  flex: 1;
  min-height: 0;
  max-height: none;
  overflow: auto;
}



.table-wrap {
  overflow-x: auto;
  padding: 0 8px;
  scrollbar-width: thin;
  scrollbar-color: var(--border-strong) transparent;
}
.table-wrap::-webkit-scrollbar { width: 8px; height: 8px; }
.table-wrap::-webkit-scrollbar-track { background: transparent; }
.table-wrap::-webkit-scrollbar-thumb {
  background: var(--border-strong);
  border-radius: 4px;
}
.table-wrap::-webkit-scrollbar-thumb:hover { background: var(--text-muted); }

.stock-table {
  width: 100%;
  border-collapse: collapse;
  font-size:0.85rem;
  background: var(--bg-card);
  border-radius: 0 0 var(--radius-lg) var(--radius-lg);
  overflow: hidden;
}

.stock-table th {
  position: sticky; top: 0;
  background: var(--bg-card);
  padding: 10px 12px;
  text-align: left;
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 600;
  color: var(--text-dim);
  font-size:0.75rem;
  text-transform: uppercase;
  letter-spacing: .04em;
  border-bottom: 2px solid var(--border);
  cursor: pointer;
  user-select: none;
  white-space: nowrap;
}

.stock-table th:hover { color: var(--text); }

.stock-table th.sort-asc::after,
.stock-table th .sort-asc::after { content: ' \25b2'; font-size:0.65rem; opacity: 1; }
.stock-table th.sort-desc::after,
.stock-table th .sort-desc::after { content: ' \25bc'; font-size:0.65rem; opacity: 1; }

.stock-table td {
  padding: 8px 12px;
  border-bottom: 1px solid var(--border);
  white-space: nowrap;
}

.stock-table tbody tr { cursor: pointer; transition: background .15s; }
.stock-table tbody tr:hover { background: var(--bg-hover); }

.stock-table.table-static tbody tr { cursor: default; }
.stock-table.table-static tbody tr:hover { background: transparent; }


.stock-table.table-static tbody tr.row-link { cursor: pointer; }
.stock-table.table-static tbody tr.row-link:hover { background: var(--bg-hover); }

.stock-table .col-sticky-left { position: sticky; left: 0; background: var(--bg-card); z-index: 1; }
.stock-table thead .col-sticky-left { z-index: 2; }
.stock-table tbody tr:hover .col-sticky-left { background: var(--bg-hover); }

.stock-table.table-static tbody tr:hover .col-sticky-left { background: var(--bg-card); }
.stock-table.table-static tbody tr.row-link:hover .col-sticky-left { background: var(--bg-hover); }

.col-symbol { font-weight: 600; color: var(--accent); }
.col-symbol a { color: inherit; text-decoration: none; }
.col-name { max-width: 200px; overflow: hidden; text-overflow: ellipsis; color: var(--text-dim); }
.col-num { text-align: right; font-variant-numeric: tabular-nums; }
.col-center { text-align: center; }

.col-rank { width: 2.5rem; color: var(--text-dim); font-variant-numeric: tabular-nums; }


.stock-table td.col-elastic { max-width: 0; width: 100%; }
.stock-table td.col-elastic,
.stock-table td.col-elastic > div { overflow: hidden; text-overflow: ellipsis; }


.stock-table td.col-elastic > .elastic-row { display: flex; align-items: center; gap: 4px; }
.stock-table td.col-elastic > .elastic-row > .elastic-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}


.stock-table td.cell-warn {
  background: color-mix(in srgb, var(--orange) 18%, transparent);
  color: var(--orange);
  font-weight: 600;
  cursor: help;
}
.stock-table td.cell-warn::after { content: " \26A0"; font-size:0.85em; }


.stock-table td.cell-error {
  background: color-mix(in srgb, var(--red) 18%, transparent);
  color: var(--red);
  font-weight: 600;
  cursor: help;
}
.stock-table td.cell-error::after { content: " \2298"; font-size:0.85em; }


.stock-table tr.row-link td.cell-warn,
.stock-table tr.row-link td.cell-error { position: relative; z-index: 1; }

.stock-table tr.row-link td.cell-warn.col-sticky-left,
.stock-table tr.row-link td.cell-error.col-sticky-left { position: sticky; z-index: 2; }


.dq-row-flag {
  position: relative;
  z-index: 1;
  margin-left: 4px;
  font-size:0.85em;
  cursor: help;
}
.dq-row-flag-warning { color: var(--orange); }
.dq-row-flag-error { color: var(--red); }


.analyst-link {
  color: var(--accent);
  text-decoration: none;
}
.analyst-link:hover { text-decoration: underline; }


.stock-table td.news-headline-cell {
  white-space: normal;
  overflow-wrap: anywhere;
}

.score-pill {
  display: inline-block;
  padding: 2px 10px;
  border-radius: 20px;
  font-size:0.8rem;
  font-weight: 600;
}
.score-high { background: var(--fit); color: var(--fit-text); }
.score-mid { background: var(--weak-fit); color: var(--weak-fit-text); }
.score-low { background: var(--poor-fit); color: var(--poor-fit-text); }


.stale-aged {
  filter: saturate(0.45) opacity(0.72);
  outline: 1px dashed var(--text-muted);
  outline-offset: 1px;
}
.stale-aged::after {
  content: " \23f0"; 
  font-size: 0.85em;
}
.stale-invalidated {
  outline: 1px dashed var(--poor-fit);
  outline-offset: 1px;
}
.stale-invalidated::after {
  content: " \26a0"; 
  font-size: 0.85em;
}


.score-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.held-dot { color: var(--accent); font-size: 1rem; }


.detail-view { padding: 0 24px 40px; max-width: 1200px; margin: 0 auto; }

.detail-header {
  padding: 20px 0;
  display: flex;
  align-items: flex-start;
  gap: 20px;
}

.detail-title h2 { font-size: 1.4rem; display: flex; align-items: center; gap: 10px; }
.symbol-badge {
  background: var(--accent);
  color: #fff;
  padding: 2px 10px;
  border-radius: 8px;
  font-size: 1rem;
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
}
.detail-meta { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }

.tab-strip {
  display: flex;
  align-items: center;
  gap: 0;
  flex-wrap: wrap;
  border-bottom: 2px solid var(--border);
  margin-bottom: 1.5rem;
}


.card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 20px;
  margin-bottom: 16px;
  box-shadow: var(--shadow);
  transition: transform .3s cubic-bezier(0.22, 1, 0.36, 1), box-shadow .3s;
}
.card:hover {
  box-shadow: var(--shadow-lg);
}

.card h3 { font-size: 1rem; margin-bottom: 12px; color: var(--text); }


.notice-banner {
  padding: 8px 12px;
  background: var(--surface-2, rgba(255, 193, 7, 0.12));
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  flex-wrap: wrap;
}


.card-dark {
  background: var(--charcoal);
  color: #fff;
  border-color: var(--charcoal-light);
}
.card-dark h3 { color: #fff; }
.card-dark .text-dim { color: var(--text-muted); }


.card-description { background: var(--bg-card); }
.description-row { display: flex; gap: 16px; align-items: flex-start; }
.company-logo { width: 56px; height: 56px; border-radius: var(--radius); object-fit: contain; background: var(--bg); padding: 4px; flex-shrink: 0; }
.description-text p { font-size:0.9rem; color: var(--text-dim); line-height: 1.6; margin-bottom: 8px; }
.description-meta { display: flex; flex-wrap: wrap; gap: 16px; font-size:0.8rem; color: var(--text-muted); }
.description-meta a { color: var(--accent); text-decoration: none; }
.description-meta a:hover { text-decoration: underline; }


.card-verdict { border-left: 4px solid var(--border); }
.card-verdict h3 { display: flex; align-items: center; margin-bottom: 12px; }
.verdict-body {
  padding: 10px 14px; background: var(--bg); border-radius: var(--radius-sm);
  font-size:0.85rem; color: var(--text-dim); line-height: 1.6;
}
.verdict-body p { margin-bottom: 8px; }
.verdict-body p:last-child { margin-bottom: 0; }
.verdict-body strong { color: var(--text); }
.verdict-fit { border-left-color: var(--green); }
.verdict-strong-fit { border-left-color: var(--green); }
.verdict-poor-fit { border-left-color: var(--red); }
.verdict-no-fit { border-left-color: var(--red); }
.verdict-weak-fit { border-left-color: var(--yellow); }
.card-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.card-header h3 { margin-bottom: 0; }

.card-holdings { border-color: var(--accent); border-width: 2px; }


.metrics-row {
  display: flex; gap: 12px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}
.metric-card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 14px 20px;
  flex: 1;
  min-width: 140px;
  box-shadow: var(--shadow-sm);
}
.metric-label { font-size:0.75rem; color: var(--text-dim); text-transform: uppercase; letter-spacing: .04em; font-family: 'Space Grotesk', sans-serif; font-weight: 600; }
.metric-value { font-size: 1.2rem; font-weight: 600; margin-top: 4px; font-family: 'Space Grotesk', sans-serif; }


.holdings-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 12px; }
.holding-item { display: flex; flex-direction: column; }
.holding-label { font-size:0.75rem; color: var(--text-dim); text-transform: uppercase; font-family: 'Space Grotesk', sans-serif; font-weight: 600; }
.holding-value { font-size: 1.1rem; font-weight: 600; font-family: 'Space Grotesk', sans-serif; }
.holding-total .holding-value { font-size: 1.2rem; }
.holdings-history { margin-top: 16px; padding-top: 12px; border-top: 1px solid var(--border); cursor: pointer; }
.holdings-history h4 { font-size:0.85rem; color: var(--text-dim); margin-bottom: 8px; }
.toggle-arrow { font-size:0.7rem; margin-left: 4px; }
.recommendation { margin-top: 12px; color: var(--text-dim); font-style: italic; font-size:0.9rem; line-height: 1.5; }


.scoring-grid { display: flex; flex-direction: column; gap: 12px; }
.scoring-item {
  padding: 12px;
  background: var(--bg);
  border-radius: var(--radius-sm);
  border-left: 4px solid var(--border);
}

.scoring-item:has(> .scoring-header .rating-pass) { border-left-color: var(--green); }
.scoring-item:has(> .scoring-header .rating-marginal) { border-left-color: var(--yellow); }
.scoring-item:has(> .scoring-header .rating-fail) { border-left-color: var(--red); }




.scoring-ref-toggle {
  position: absolute;
  left: -8px;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  color: var(--text-dim);
  font-size:0.7rem;
  line-height: 1;
  width: 10px;
  height: 10px;
  text-align: center;
}
.scoring-ref-toggle:hover { color: var(--text); }

.scoring-ref-name { user-select: none; margin-left: 6px; }

.scoring-subrows {
  margin-top: 8px;
  padding-left: 16px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.scoring-subrows .scoring-item {
  border: 1px solid var(--border);
}

.scoring-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; position: relative; }
.scoring-name { font-weight: 600; font-size:0.9rem; }
.scoring-badge {
  padding: 2px 10px;
  border-radius: 20px;
  font-size:0.75rem;
  font-weight: 700;
}
.rating-pass { background: var(--fit); color: var(--fit-text); }
.rating-marginal { background: var(--weak-fit); color: var(--weak-fit-text); }
.rating-fail { background: var(--poor-fit); color: var(--poor-fit-text); }
.scoring-badges { display: flex; gap: 6px; align-items: center; }

.scoring-override {
  letter-spacing: .02em;
}

.scoring-unrated {
  background: var(--bg-offset);
  color: var(--text-dim);
  border: 1px dashed var(--border);
  letter-spacing: .02em;
  font-weight: 600;
}

.importance-badge {
  letter-spacing: .03em;
  text-transform: uppercase;
  font-size:0.7rem;
  padding: 1px 8px;
}


.importance-critical { background: var(--red); color: #fff; }
.importance-major { background: var(--yellow); color: #1f1f1f; }
.importance-standard { background: var(--green); color: #1f1f1f; }
.importance-nice_to_have { background: var(--blue); color: #fff; }
.critical-fail-badge {
  background: var(--red);
  color: #fff;
  font-size:0.7rem;
  letter-spacing: .03em;
  text-transform: uppercase;
}

.importance-select {
  font-size:0.75rem;
  padding: 2px 6px;
  border-radius: 4px;
  border: 1px solid var(--border, #444);
  font-weight: 600;
  
  background: var(--bg-card);
  color: var(--text);
}

.importance-select option {
  background: var(--bg-card);
  color: var(--text);
  font-weight: 600;
}


.importance-select.importance-critical { background: var(--red); color: #fff; }
.importance-select.importance-major { background: var(--yellow); color: #1f1f1f; }
.importance-select.importance-standard { background: var(--green); color: #1f1f1f; }
.importance-select.importance-nice_to_have { background: var(--blue); color: #fff; }


.capability-part {
  padding: 2px 8px;
  border-radius: 3px;
  font-size: 0.75rem;
  font-weight: 600;
}
.capability-part-a { background: color-mix(in srgb, var(--blue) 15%, transparent); color: #1d4ed8; }
.capability-part-b { background: rgba(155,89,182,0.15); color: var(--purple, #9b59b6); }
.capability-part-other { background: rgba(120,120,120,0.15); color: var(--text); }
[data-theme="dark"] .capability-part-a { background: #17233f; color: #93b4fc; }

.scoring-edit-btn {
  background: transparent;
  border: 0;
  padding: 0 0 0 4px;
  margin: 0;
  cursor: pointer;
  color: var(--text-dim);
  font-size:0.8rem;
  line-height: 1;
  opacity: .55;
  transition: opacity 120ms ease, color 120ms ease;
}
.scoring-edit-btn:hover:not(:disabled) {
  opacity: 1;
  color: var(--accent, var(--text));
}
.scoring-edit-btn:disabled {
  cursor: not-allowed;
  opacity: .25;
}
.scoring-metrics {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 6px;
}
.scoring-metric {
  display: inline-flex;
  gap: 4px;
  align-items: baseline;
  
  flex-wrap: wrap;
  padding: 2px 8px;
  border-radius: 4px;
  font-size:0.78rem;
  background: var(--bg-card);
  border: 1px solid var(--border);
}
.scoring-metric .metric-label {
  color: var(--text-dim);
  font-weight: 500;
  font-size: inherit;
}
.scoring-metric .metric-value {
  font-weight: 700;
  color: var(--text);
  font-size: inherit;
  margin-top: 0;
}
.scoring-metric.metric-positive .metric-value { color: var(--green); }

.scoring-metric.metric-marginal .metric-value { color: var(--weak-fit-text); }
.scoring-metric.metric-negative .metric-value { color: var(--red); }


.scoring-metric-primary {
  border-left: 3px solid var(--accent);
  background: var(--bg);
}
.scoring-metric-primary .metric-value { font-weight: 800; }

.scoring-metric-primary .metric-rule {
  color: var(--text-dim);
  font-weight: 500;
  font-size: 0.72rem;
}


.metric-series {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 8px;
}
.metric-series .series-point {
  display: inline-flex;
  align-items: baseline;
  gap: 3px;
}
.metric-series .series-period {
  color: var(--text-dim);
  font-size: 0.72rem;
  font-variant-numeric: tabular-nums;
}

.metric-series .series-point .metric-value { color: var(--text); }
.metric-series .series-point.metric-positive .metric-value { color: var(--green); }
.metric-series .series-point.metric-negative .metric-value { color: var(--red); }

.metric-series .series-more {
  appearance: none;
  background: transparent;
  border: 1px solid var(--accent);
  border-radius: 3px;
  color: var(--accent);
  cursor: pointer;
  font: inherit;
  font-size: 0.7rem;
  font-weight: 700;
  line-height: 1;
  padding: 1px 5px;
}
.metric-series .series-more:hover { background: color-mix(in srgb, var(--accent) 15%, transparent); }

.metric-series .series-earlier {
  color: var(--text-dim);
  font-size: 0.7rem;
}


.scoring-clauses {
  margin-top: 8px;
  padding-left: 16px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: 0.78rem;
}
.scoring-clause {
  display: flex;
  align-items: baseline;
  gap: 8px;
  padding: 1px 0;
}

.scoring-clause.clause-op {
  color: var(--text-dim);
  text-transform: uppercase;
  letter-spacing: .06em;
  font-size: 0.7rem;
  font-weight: 700;
}

.scoring-clause .clause-verdict { font-weight: 700; }
.scoring-clause .clause-verdict.metric-positive { color: var(--green); }
.scoring-clause .clause-verdict.metric-negative { color: var(--red); }

.clause-d0 { padding-left: 0; }
.clause-d1 { padding-left: 12px; }
.clause-d2 { padding-left: 24px; }
.clause-d3 { padding-left: 36px; }
.clause-d4 { padding-left: 48px; }

.scoring-detail { font-size:0.85rem; color: var(--text-dim); line-height: 1.5; }


.analysis-more { margin: -2px 0 10px; }
.analysis-more-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: var(--sd-tap);
  padding: 0;
  border: 0;
  background: none;
  color: var(--accent);
  font-size: 0.8rem;
  font-weight: 600;
  cursor: pointer;
}
.analysis-more-btn[disabled] { color: var(--text-dim); cursor: default; }
.analysis-more-error { margin: 0 0 4px; font-size: 0.8rem; color: var(--red); }

.analysis-more-body {
  margin: 2px 0 0;
  padding-left: 10px;
  border-left: 2px solid var(--border);
  font-size: 0.85rem;
  line-height: 1.6;
  white-space: pre-line;
  color: var(--text-dim);
}

.yearly-breakdown { margin-top: 8px; display: flex; flex-wrap: wrap; gap: 8px; font-size:0.8rem; color: var(--text-muted); }
.yearly-item { display: flex; gap: 12px; padding: 4px 8px; background: var(--bg-card); border-radius: 4px; border: 1px solid var(--border); }


.financial-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 12px; }
.fin-item { display: flex; flex-direction: column; }
.fin-label { font-size:0.75rem; color: var(--text-dim); text-transform: uppercase; font-family: 'Space Grotesk', sans-serif; font-weight: 600; }

.fin-basis { font-weight: 400; opacity: 0.75; }

.col-basis { font-weight: 400; opacity: 0.7; text-transform: none; }

.fin-value { font-size: 1.05rem; font-weight: 600; font-family: 'Space Grotesk', sans-serif; }


.analyst-bar { display: flex; height: 32px; border-radius: var(--radius-sm); overflow: hidden; font-size:0.8rem; font-weight: 600; }
.analyst-buy { background: var(--green); color: #fff; display: flex; align-items: center; justify-content: center; }
.analyst-hold { background: var(--yellow); color: #000; display: flex; align-items: center; justify-content: center; }
.analyst-sell { background: var(--red); color: #fff; display: flex; align-items: center; justify-content: center; }
.price-target { margin-top: 8px; color: var(--text-dim); font-size:0.9rem; }

.grade-action-upgrade { color: var(--green); font-weight: 600; }
.grade-action-downgrade { color: var(--red); font-weight: 600; }
.grade-action-hold { color: var(--yellow); font-weight: 600; }
.grade-action-init { color: var(--text-dim); font-weight: 600; }


.two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (max-width: 768px) { .two-col { grid-template-columns: 1fr; } }
.data-row-4 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 16px; margin-bottom: 20px; }
.data-row-4 > .card { margin-bottom: 0; }
.data-row-3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 16px; margin-bottom: 20px; }
.data-row-3 > .card { margin-bottom: 0; }
.data-row-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.data-row-2 > .card { margin-bottom: 0; }
@media (max-width: 900px) { .data-row-4 { grid-template-columns: 1fr 1fr; } .data-row-3 { grid-template-columns: 1fr; } .data-row-2 { grid-template-columns: 1fr; } }

.risk-list, .catalyst-list { list-style: none; }
.risk-list li, .catalyst-list li {
  padding: 6px 0;
  border-bottom: 1px solid var(--border);
  font-size:0.85rem;
  color: var(--text-dim);
  line-height: 1.5;
}
.risk-list li:last-child, .catalyst-list li:last-child { border-bottom: none; }
.risk-list li::before { content: '\26A0'; margin-right: 8px; color: var(--red); }
.catalyst-list li::before { content: '\2713'; margin-right: 8px; color: var(--green); }


.charts-section { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.charts-section .card:first-child { grid-column: 1 / -1; }
@media (max-width: 900px) { .charts-section { grid-template-columns: 1fr; } }


.charts-timeframe { grid-column: 1 / -1; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.charts-timeframe-label { font-size: 12px; color: var(--text-dim); text-transform: uppercase; letter-spacing: .04em; }
.charts-timeframe + .card { grid-column: 1 / -1; }


.chart-container { position: relative; height: 300px; }
.chart-loading {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  color: var(--text-dim); font-size:0.9rem;
  background: rgba(255, 255, 255, 0.8);
  border-radius: var(--radius-sm);
}
.chart-periods { display: flex; gap: 4px; }

.charts-basis { display: flex; min-width: 0; gap: 4px; }

.charts-basis-fixed { font-size: 12px; align-self: center; }

.vintage-toggle { display: inline-flex; gap: 4px; }

.charts-basis-note { flex: 1 1 100%; margin: 0; font-size: 12px; }


.pl-positive { color: #16a34a; }
.pl-negative { color: #dc2626; }


.measure-pass { color: #16a34a; font-weight: 600; }
.measure-marginal { color: #ca8a04; }
.measure-fail { color: #dc2626; font-weight: 600; }


.loading {
  padding: 60px;
  text-align: center;
  color: var(--text-dim);
  font-size: 1rem;
}


.page-content { max-width: 1200px; margin: 0 auto; padding: 24px; }
.page-content > h2:first-child { margin: 0 0 20px; }
.list-view { padding: 0 8px 40px; }
.list-header { display: flex; align-items: center; gap: 16px; padding: 16px 8px; }


.scan-head-anchor {
  position: sticky;
  top: var(--sd-header-h);
  z-index: 90;
  background: var(--bg);
}


.list-header-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

.inline-add { position: relative; display: inline-flex; align-items: center; }

.inline-add-popover {
  position: absolute; left: 0; top: 100%; margin-top: 6px; z-index: 200;
  display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: var(--radius); padding: 8px; box-shadow: var(--shadow-lg);
}

.inline-add-popover .sym-ac-drop { right: auto; min-width: 300px; }

.inline-add-popover--op { flex-direction: column; align-items: flex-start; gap: 6px; }
.op-add-row { display: flex; align-items: center; gap: 6px; flex-wrap: nowrap; }
.page-center { display: flex; align-items: center; justify-content: center; min-height: calc(100vh - 60px); }


.user-list { display: flex; flex-direction: column; gap: 8px; margin: 16px 0; }
.user-item {
  display: flex; justify-content: space-between; align-items: center;
  padding: 12px 16px; background: var(--bg); border: 1px solid var(--border);
  border-radius: var(--radius); cursor: pointer; transition: all .2s;
}
.user-item:hover { background: var(--bg-hover); transform: translateY(-2px); box-shadow: var(--shadow); }
.user-name { font-weight: 600; }


.input {
  background: var(--bg); color: var(--text); border: 1px solid var(--border);
  padding: 8px 12px; border-radius: var(--radius-sm); font-size:0.9rem; width: 100%;
  font-family: 'DM Sans', sans-serif;
}

.input:focus {
  border-color: var(--focus-ring-color); outline: none;
  box-shadow: 0 0 0 2px var(--focus-ring-color);
}


.form-label { display: block; margin-bottom: 0.3rem; font-size: 0.85rem; color: var(--text-dim); font-weight: 500; }
.form-input {
  background: var(--bg); color: var(--text); border: 1px solid var(--border);
  padding: 8px 12px; border-radius: var(--radius-sm); font-size:0.9rem; width: 100%;
  font-family: 'DM Sans', sans-serif;
}

.form-input:focus {
  border-color: var(--focus-ring-color); outline: none;
  box-shadow: 0 0 0 2px var(--focus-ring-color);
}


.sym-ac { position: relative; display: inline-block; }

.sym-ac-input { width: 100% !important; }
.sym-ac-drop {
  position: absolute; top: 100%; left: 0; right: 0; z-index: 200;
  background: var(--bg-card); border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm); box-shadow: var(--shadow-lg);
  max-height: 260px; overflow-y: auto; margin-top: 2px;
}

.sym-ac-drop--above { top: auto; bottom: 100%; margin-top: 0; margin-bottom: 2px; }
.sym-ac-item {
  display: flex; align-items: center; gap: 8px;
  padding: 6px 10px; cursor: pointer; font-size:0.85rem;
  border-bottom: 1px solid var(--border);
}
.sym-ac-item:last-child { border-bottom: none; }
.sym-ac-item:hover, .sym-ac-item.active { background: var(--bg-hover); }
.sym-ac-ticker { font-weight: 700; min-width: 56px; font-family: 'Space Grotesk', sans-serif; color: var(--text); }
.sym-ac-name { flex: 1; color: var(--text-dim); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sym-ac-exchange { font-size:0.7rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: .03em; }

.textarea { resize: vertical; font-family: inherit; }
.form-group { margin-bottom: 12px; }
.form-group label { display: block; font-size:0.75rem; color: var(--text-dim); text-transform: uppercase; letter-spacing: .05em; margin-bottom: 4px; font-family: 'Space Grotesk', sans-serif; font-weight: 600; }
.form-row { display: flex; gap: 8px; }
.form-row .input { flex: 1; }
.form-actions { display: flex; gap: 8px; justify-content: flex-end; margin-top: 16px; }
.params-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 12px; }
.text-error { color: var(--red); font-size:0.85rem; }
.text-dim { color: var(--text-dim); font-size:0.85rem; }

.price-chart-note { font-size: 0.85rem; margin: 0 0 0.5rem 0; }
.price-chart-note--error { color: var(--red); }

.text-ok { color: var(--green); }
.text-warn { color: var(--orange); }

.text-note { color: var(--amber); }
.text-bad { color: var(--red); }
.text-idle { opacity: 0.4; }

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}
.time-badge { font-size:0.8rem; white-space: nowrap; }


.strategies-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 20px; margin-top: 20px; }
.strategy-card {
  cursor: pointer;
  transition: transform .3s cubic-bezier(0.22, 1, 0.36, 1), box-shadow .3s;
}
.strategy-card:nth-child(3n+1) { transform: rotate(-1deg); }
.strategy-card:nth-child(3n+2) { transform: rotate(0.8deg); }
.strategy-card:nth-child(3n+3) { transform: rotate(-0.5deg); }
.strategy-card:hover {
  transform: rotate(0) translateY(-6px) !important;
  box-shadow: var(--shadow-xl);
  z-index: 5;
}
.strategy-header { display: flex; justify-content: space-between; align-items: center; gap: 10px; }

.strategy-title { display: flex; align-items: center; gap: 12px; min-width: 0; }
.strategy-icon { width: 56px; height: 56px; border-radius: 14px; flex-shrink: 0; box-shadow: var(--shadow-sm); }
.strategy-icon-sm { width: 22px; height: 22px; border-radius: 6px; flex-shrink: 0; vertical-align: middle; }
.strategy-new { border-style: dashed; border-color: var(--border-strong); }
.strategy-new:hover { border-color: var(--accent); }

.strategy-icon-md { width: 36px; height: 36px; border-radius: 10px; flex-shrink: 0; box-shadow: var(--shadow-sm); }
.strategy-icon-btn { background: none; border: none; padding: 0; cursor: pointer; line-height: 0; border-radius: 10px; }
.strategy-icon-btn:hover { box-shadow: 0 0 0 2px var(--accent); }

.icon-editor-preview { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.icon-editor-preview-img { width: 64px; height: 64px; }
.icon-editor-group { margin-bottom: 14px; }
.icon-swatch-grid { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.icon-swatch { width: 40px; height: 40px; padding: 2px; border: 2px solid var(--border); border-radius: 10px; background: var(--bg-hover); cursor: pointer; line-height: 0; }
.icon-swatch img { width: 100%; height: 100%; border-radius: 7px; }
.icon-swatch:hover { border-color: var(--border-strong); }
.icon-swatch-active { border-color: var(--accent); }

.icon-editor-group-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.icon-mark-toggle { display: flex; gap: 4px; }
.icon-letter-input { width: 56px; margin-top: 6px; text-align: center; text-transform: uppercase; font-weight: 700; font-size: 1.1rem; }
.icon-color-swatch { display: inline-flex; align-items: center; justify-content: center; overflow: hidden; }
.icon-color-swatch input[type="color"] { width: 100%; height: 100%; padding: 0; border: none; background: none; cursor: pointer; }

.icon-rotation-row { display: flex; align-items: center; gap: 10px; margin-top: 6px; }
.icon-rotation-slider { flex: 1; accent-color: var(--accent); cursor: pointer; }
.icon-rotation-value { min-width: 38px; text-align: right; font-variant-numeric: tabular-nums; color: var(--text-dim); font-size:0.85rem; }
.badge-pending {
  font-size:0.7rem; font-weight: 600; padding: 2px 8px; border-radius: 9999px;
  background: var(--yellow, #eab308); color: #000; white-space: nowrap;
}
.qa-question { padding: 10px 0; border-bottom: 1px solid var(--border); }
.qa-question:last-child { border-bottom: none; }
.qa-radio-label, .qa-check-label {
  display: flex; align-items: center; gap: 6px;
  padding: 6px 12px; border-radius: 6px; cursor: pointer;
  font-size:0.85rem; border: 1px solid var(--border); transition: all .15s;
}
.qa-radio-label:hover, .qa-check-label:hover { border-color: var(--accent); }
.qa-radio-label.active, .qa-check-label.active {
  background: var(--accent); color: #fff; border-color: var(--accent);
}
.qa-radio-label input, .qa-check-label input { display: none; }



.wizard-optional {
  display: inline-block; vertical-align: middle; margin-left: 6px;
  padding: 1px 8px; border: 1px solid var(--border); border-radius: 20px;
  font-size: 0.68rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase;
  color: var(--text-dim); background: var(--bg);
}
.wizard-heading-note { font-weight: normal; font-size: 0.8rem; }

.wizard-mode-note { margin: 0 0 8px; }
.src-intro { margin: 0 0 8px; }
.src-group { margin: 0 0 12px; }
.src-group-label {
  font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.04em;
  margin: 0 0 6px; display: flex; align-items: center; gap: 8px;
}
.src-tiles {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px;
}
.src-tile {
  display: flex; flex-direction: column; border-radius: 6px;
  border: 1px solid var(--border); background: var(--bg-card); transition: border-color .15s;
}

.src-tile:hover { border-color: var(--text-dim); }

.src-tile.selected {
  border-color: var(--accent); background: var(--accent-bg);
  box-shadow: 0 0 0 2px var(--accent);
}
.src-tile-main {
  display: flex; flex-direction: column; align-items: center; gap: 6px; width: 100%; text-align: center;
  padding: 10px 8px 8px; border: none; border-radius: 6px; background: transparent;
  color: var(--text); font: inherit; cursor: pointer;
}

.src-tile-icon { display: inline-flex; width: 36px; height: 36px; }
.src-tile-icon svg { width: 36px; height: 36px; border-radius: 10px; box-shadow: var(--shadow-sm); }
.src-tile-kind { font-size: 0.62rem; }

.src-tile-main:focus-visible { outline-offset: -2px; }

.src-tile-name { display: flex; align-items: baseline; justify-content: center; gap: 4px; }

.src-tile-check { color: var(--focus-ring-color); font-size: 0.85rem; line-height: 1.2; font-weight: 700; }
.src-tile-main:disabled { opacity: .5; cursor: not-allowed; }
.src-tile-title { font-weight: 600; font-size: 0.85rem; line-height: 1.2; }
.src-tile-desc { font-size: 0.8rem; }
.src-tile-tags { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 2px; }
.src-tile-mode { display: flex; justify-content: center; align-items: center; gap: 6px; padding: 0 8px 8px; font-size: 0.72rem; }
.src-picked { margin: 8px 0 0; }

.hover-card-wrap { display: block; width: 100%; }
.hover-card {
  position: fixed; top: 0; left: 0; width: 320px; max-width: calc(100vw - 16px);
  max-height: calc(100vh - 16px); overflow: hidden;
  background: var(--card-bg, var(--bg-card)); border: 1px solid var(--border); border-radius: var(--radius-sm);
  padding: 12px 14px; box-shadow: 0 8px 24px rgba(0, 0, 0, .45);
  font-size: 0.78rem; font-weight: 400; color: var(--text); text-align: left; line-height: 1.45;
  visibility: hidden; opacity: 0; pointer-events: none;
  transition: opacity .15s, visibility 0s linear .15s; z-index: 1000; white-space: normal;
}
.hover-card.hover-card-open { visibility: visible; opacity: 1; transition: opacity .15s; }
.hover-card-head { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.hover-card-icon { display: inline-flex; width: 28px; height: 28px; flex: none; }
.hover-card-icon svg { width: 28px; height: 28px; border-radius: 8px; }
.hover-card-heading { display: flex; flex-direction: column; gap: 2px; align-items: flex-start; min-width: 0; }
.hover-card-title { font-size: 0.88rem; line-height: 1.2; }
.hover-card-desc { margin: 0 0 8px; }
.hover-card-section { margin: 0 0 8px; }
.hover-card-label {
  display: block; font-size: 0.66rem; text-transform: uppercase; letter-spacing: 0.04em;
  color: var(--text-dim); margin-bottom: 3px;
}
.hover-card-list { margin: 0; padding: 0 0 0 16px; }
.hover-card-list li { margin: 0 0 2px; }
.hover-card-chips { display: flex; flex-wrap: wrap; gap: 4px; margin: 0 0 8px; }
.hover-card-meta { display: flex; flex-wrap: wrap; gap: 4px 10px; font-size: 0.72rem; margin: 0 0 8px; }
.hover-card-hint { margin: 0; font-size: 0.72rem; border-top: 1px solid var(--border); padding-top: 6px; }
.wizard-template-note { margin: 0 0 8px; }



.modal-overlay {
  
  position: fixed; inset: 0; right: var(--docked-panel-gutter);
  background: rgba(0,0,0,0.4);
  
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  display: flex; align-items: center; justify-content: center; z-index: 200;
  transition: right 0.25s ease;
}
.modal-card {
  width: 90%; max-width: 600px; max-height: 90vh; overflow-y: auto;
  box-shadow: var(--shadow-xl);
}

:root { --docked-panel-gutter: 0px; }
html.help-chat-open,
html.notes-panel-open { --docked-panel-gutter: var(--chat-width); }


.dialog-overlay { z-index: 10000; }
.dialog-card { max-width: 440px; padding: 24px 28px; }
.dialog-title { margin: 0 0 8px; }
.dialog-message {
  color: var(--text-dim); margin: 0 0 16px; line-height: 1.5;
  
  white-space: pre-line;
  overflow-wrap: break-word;
}

.dialog-input {
  width: 100%; box-sizing: border-box; margin-bottom: 16px;
  background: var(--bg); color: var(--text);
  border: 1px solid var(--border); border-radius: var(--radius-sm);
  padding: 8px 12px; font-size:0.9rem; font-family: 'DM Sans', sans-serif;
}

.dialog-input:focus {
  border-color: var(--focus-ring-color); outline: none;
  box-shadow: 0 0 0 2px var(--focus-ring-color);
}


.rail-add-wrap { display: inline-flex; }
.rail-add-menu { display: flex; flex-direction: column; gap: 10px; }
.rail-add-name { margin: 0; }
.rail-add-choice {
  display: flex; align-items: flex-start; gap: 8px; text-align: left;
  padding: 6px 8px; border-radius: var(--radius-sm); cursor: pointer;
  color: var(--text); font-family: inherit;
}
.rail-add-choice:hover { background: var(--bg-hover); }
.rail-add-choice input[type="radio"] { margin: 3px 0 0; flex: none; }
.rail-add-choice-title { display: block; font-weight: 600; font-size:0.9rem; }
.rail-add-choice-desc { display: block; font-size:0.78rem; color: var(--text-dim); }
.rail-add-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 4px; }

.rail-add-strategy { display: flex; flex-direction: column; gap: 4px; }
.rail-add-strategy .rail-add-choice-desc { padding-left: 2px; }

.scheduled-ops { margin-top: 14px; border-top: 1px solid var(--border); padding-top: 12px; }
.scheduled-ops-summary { margin-left: 8px; font-size: 0.85rem; }
.scheduled-ops-body { margin-top: 10px; }
.scheduled-ops-actions { display: flex; justify-content: flex-end; margin-bottom: 8px; }
.dialog-actions { display: flex; gap: 8px; justify-content: flex-end; }

.dialog-actions-stacked { flex-direction: column; align-items: stretch; }
.dialog-actions-stacked .btn { text-align: left; }
.dialog-choice-detail { display: block; font-size: 0.78rem; opacity: 0.85; margin-top: 2px; }


.modal-field { margin-bottom: 16px; }
.modal-field-label { font-weight: 500; display: block; margin-bottom: 4px; }
.modal-field-control { width: 100%; }
.modal-field-row { display: flex; gap: 8px; margin-bottom: 16px; }
.modal-field-row > * { flex: 1; }


.chooser-stack { display: flex; flex-direction: column; gap: 10px; }
.chooser-radio { display: flex; align-items: center; gap: 8px; }
.chooser-sub { margin-left: 24px; max-width: 280px; }
.chooser-note { margin-left: 24px; }


.strategy-layout {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 20px;
  align-items: start;
}

.strategy-layout.is-single { grid-template-columns: 1fr; }
.strategy-sidebar { display: flex; flex-direction: column; gap: 16px; }
.strategy-main { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
@media (max-width: 800px) {
  .strategy-layout { grid-template-columns: 1fr; }
}

.strategy-actions-menu { position: relative; margin-left: auto; flex: 0 0 auto; }
.strategy-actions-trigger { min-width: 40px; font-size: 1.15rem; line-height: 1; }
.strategy-actions-dropdown {
  position: absolute;
  top: calc(100% + 4px);
  right: 0;
  z-index: 20;
  min-width: 180px;
  padding: 4px 0;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--bg-card);
  box-shadow: var(--shadow-md);
}
.strategy-actions-dropdown .btn {
  display: block;
  width: 100%;
  padding: 7px 12px;
  border: 0;
  text-align: left;
  white-space: nowrap;
}
@media (max-width: 500px) {
  
  .strategy-actions-menu { align-self: flex-start; }
}

.card-link-footer { margin-top: 8px; text-align: right; }
.card-link-footer a { font-size: 0.85rem; color: var(--link); }



.newsletter-page { max-width: 1200px; margin: auto; padding: 1.5rem; }

.newsletter-layout {
  display: grid;
  grid-template-columns: 320px 1fr;
  gap: 20px;
  align-items: start;
}
.newsletter-sidebar { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.newsletter-main { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.newsletter-sidebar .scan-item.active { background: var(--bg-hover); border-color: var(--accent); }
@media (max-width: 1060px) {
  .newsletter-layout { grid-template-columns: 1fr; }
}


.nl-panel-delivery { display: flex; flex-direction: column; gap: 0.75rem; min-width: 0; }



.nl-shelf {
  display: flex; flex-direction: column; align-items: stretch; gap: 4px;
  padding: 6px 8px;
  border: 1px dashed var(--border); border-radius: var(--radius-sm);
  transition: background .12s, border-color .12s;
}
.nl-shelf-label {
  font-weight: 600; font-size:0.78rem; color: var(--text-dim);
  text-transform: uppercase; letter-spacing: .04em;
}
.nl-shelf-dragover { border-color: var(--accent); border-style: solid; background: var(--bg-hover); }

.nl-shelf-card {
  display: flex; align-items: center; gap: 8px; min-width: 0;
  padding: 5px 10px; border: 1px solid var(--border); border-radius: var(--radius-sm);
  background: var(--bg-card); cursor: grab; user-select: none;
}
.nl-shelf-card:active { cursor: grabbing; }
.nl-shelf-card.active { border-color: var(--accent); background: var(--bg-hover); }
.nl-shelf-grip { color: var(--text-dim); font-weight: 700; letter-spacing: -2px; cursor: grab; }
.nl-shelf-name { font-weight: 600; font-size:0.85rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nl-shelf-name-input {
  flex: 1; min-width: 0; font-size:0.85rem; padding: 2px 6px;
  border: 1px solid var(--accent); border-radius: var(--radius-sm);
  background: var(--bg-card); color: var(--text);
}
.nl-shelf-edit {
  border: none; background: none; cursor: pointer; padding: 0 2px;
  color: var(--text-dim); font-size:0.8rem;
}
.nl-shelf-edit:hover { color: var(--accent); }

.nl-shelf-status {
  margin-left: auto; flex-shrink: 0;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%;
}
.nl-shelf-create { align-self: flex-start; }

.nl-detail-header { display: flex; align-items: flex-start; gap: 0.75rem; flex-wrap: wrap; }
.nl-detail-identity { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; min-width: 0; flex: 1; }
.nl-detail-actions { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.nl-btn-toggle { min-width: 4.9rem; }

.nl-menu-dropdown {
  position: absolute; right: 0; left: auto; top: 100%; margin-top: 4px;
  background: var(--bg-card); border: 1px solid var(--border); border-radius: 6px;
  padding: 4px 0; z-index: 50; min-width: 230px; box-shadow: var(--shadow-lg);
  text-align: left; font-size: 0.9rem; font-weight: 400;
}

.nl-menu-item {
  text-align: left;
  padding: 7px 14px;
}
.nl-menu-item:hover:not(:disabled) { background: var(--bg-hover); }
.nl-menu-item:disabled { opacity: 0.5; cursor: default; }
.nl-menu-danger { color: var(--red); }


.newsletter-section-block {
  border: 1px solid var(--border); border-radius: var(--radius-sm);
  padding: 8px 10px; margin-bottom: 8px; background: var(--bg);
}
.newsletter-section-block.inactive { opacity: 0.6; }
.nsb-header { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.nsb-title { font-weight: 600; }
.nsb-body { margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--border); }

.nl-chip-group { position: relative; margin-bottom: 6px; }


.state-pill-cloud { display: flex; flex-wrap: wrap; gap: 5px; align-items: center; }
.state-pill {
  display: inline-flex; align-items: center; gap: 3px;
  padding: 2px 10px; border-radius: 20px;
  font-size:0.76rem; font-weight: 600; white-space: nowrap;
  border: 1px solid var(--border); background: transparent;
  color: var(--text); cursor: pointer;
  transition: background .12s, border-color .12s, color .12s, opacity .12s;
}
.state-pill:hover:not(.state-locked) { border-color: var(--text-dim); }
.state-pill.state-default { color: var(--text-dim); border-style: dashed; }
.state-pill.state-on {
  background: var(--green); border-color: var(--green); color: #fff;
}
.state-pill.state-off {
  border-color: var(--red); color: var(--red); text-decoration: line-through;
  background: color-mix(in srgb, var(--red) 10%, transparent);
}
.state-pill.state-locked { cursor: default; opacity: .8; }
.state-pill .pill-lock { font-size:0.7rem; }


.state-legend {
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px;
  font-size:0.74rem; color: var(--text-dim); margin: 2px 0 4px;
}
.state-legend .legend-item { display: inline-flex; align-items: center; gap: 5px; }
.state-legend .state-pill { cursor: default; pointer-events: none; padding: 1px 8px; }


.btn-inline.btn-add-row {
  width: auto; height: auto; padding: 2px 10px; gap: 3px;
  white-space: nowrap; border-radius: 20px;
  font-size:0.74rem;
}

.btn-inline.btn-show-all { border-style: dashed; color: var(--text-dim); }
.btn-inline.btn-show-all:hover { color: #fff; }

.btn-inline.btn-inline-text {
  width: auto; height: auto; padding: 2px 8px; white-space: nowrap;
}


.symbol-layout {
  display: grid;
  grid-template-columns: 300px 1fr;
  gap: 20px;
  align-items: start;
}
.symbol-sidebar { display: flex; flex-direction: column; gap: 16px; }
.symbol-main { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
@media (max-width: 900px) {
  .symbol-layout { grid-template-columns: 1fr; }
}


.portfolio-layout {
  display: grid;
  grid-template-columns: 220px 1fr;
  gap: 20px;
  align-items: start;
}
.portfolio-main { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.portfolio-rail { display: flex; flex-direction: column; gap: 1px; }
.rail-group { display: flex; flex-direction: column; }
.rail-items { display: flex; flex-direction: column; }
.rail-head, .rail-item {
  display: block;
  text-decoration: none;
  color: var(--text-dim);
  border-radius: 6px;
  border-left: 2px solid transparent;
}
.rail-head { padding: 7px 10px; font-weight: 600; font-size:0.9rem; }
.rail-item { padding: 5px 10px 5px 24px; font-size:0.85rem; }
.rail-head:hover, .rail-item:hover { background: var(--bg-hover); color: var(--text); }
.rail-head.active, .rail-item.active {
  color: var(--text);
  background: var(--bg-card);
  border-left-color: var(--orange);
  font-weight: 700;
}
.rail-empty { padding: 4px 10px 4px 24px; font-size:0.8rem; color: var(--text-dim); opacity: .7; }

.rail-head-row, .rail-item-row { display: flex; align-items: center; }
.rail-head-row .rail-head, .rail-item-row .rail-item { flex: 1 1 auto; min-width: 0; }
.rail-add, .rail-archive {
  flex-shrink: 0; background: none; border: none; cursor: pointer;
  color: var(--text-dim); line-height: 1; padding: 4px 8px; border-radius: 6px;
}
.rail-add { font-size: 1.1rem; font-weight: 700; }
.rail-add:hover { background: var(--bg-hover); color: var(--text); }
.rail-archive { font-size: 1rem; opacity: 0; }

.rail-item-row:hover .rail-archive,
.rail-item-row:focus-within .rail-archive { opacity: .55; }
.rail-archive:hover, .rail-archive:focus-visible { opacity: 1; background: var(--bg-hover); color: var(--red); }
@media (hover: none) { .rail-archive { opacity: .45; } }
.rail-sep { height: 1px; background: var(--border); margin: 8px 4px; }
@media (max-width: 900px) {
  .portfolio-layout { grid-template-columns: 1fr; }
}


.admin-frame {
  max-width: 1600px;
  margin: auto;
  padding: 1.5rem;
}


.admin-layout {
  display: grid;
  grid-template-columns: 220px 1fr;
  gap: 20px;
  align-items: start;
}
.admin-main { display: flex; flex-direction: column; gap: 16px; min-width: 0; }

.admin-scope-bar {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  padding: 6px 10px;
  border: 1px solid var(--border); border-radius: var(--radius-sm);
  background: var(--bg-card);
}
.admin-scope-label {
  font-size: 0.7rem; text-transform: uppercase; letter-spacing: .05em;
  color: var(--text-dim); font-family: 'Space Grotesk', sans-serif; font-weight: 600;
}
.admin-scope-chip { display: inline-flex; align-items: center; gap: 6px; }
.admin-scope-who { font-weight: 600; }
.admin-scope-inert, .admin-scope-empty { font-size: 0.8rem; }

.admin-scope-clear {
  appearance: none; -webkit-appearance: none;
  background: none; border: none; padding: 0;
  font-size: 0.8rem; color: var(--text-dim); cursor: pointer;
  text-decoration: underline;
}
.admin-scope-clear:hover { color: var(--text); }

.admin-costs-results { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.admin-rail { display: flex; flex-direction: column; gap: 1px; }
.admin-rail .rail-group { margin-top: 6px; }

.rail-cat-head {
  display: flex; align-items: center; gap: 6px; width: 100%;
  padding: 7px 10px; border: none; background: none; cursor: pointer;
  text-align: left; font-weight: 700; font-size:0.78rem; letter-spacing: .03em;
  text-transform: uppercase; color: var(--text-dim); border-radius: 6px;
}
.rail-cat-head:hover { background: var(--bg-hover); color: var(--text); }
.rail-chevron { flex: none; font-size:0.7rem; width: .8em; color: var(--text-dim); }
.rail-cat-title { flex: 1 1 auto; min-width: 0; }
.rail-cat-items { display: flex; flex-direction: column; }

.admin-rail .rail-item { display: flex; align-items: center; justify-content: space-between; gap: 6px; }
.rail-badge {
  flex: none; background: var(--red, #d9534f); color: #fff; border-radius: 10px;
  padding: 0 .45rem; font-size:0.72rem; font-weight: 700; line-height: 1.5;
}

.rail-footer {
  display: flex; flex-direction: column; gap: 4px;
  margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--border);
}
.rail-panic {
  background: var(--red); color: #fff; font-weight: 700; text-align: center;
  border: none; cursor: pointer;
}
.rail-panic:hover { filter: brightness(1.08); color: #fff; }
.rail-panic:disabled { opacity: .6; cursor: default; }
@media (max-width: 900px) {
  .admin-layout { grid-template-columns: 1fr; }
}


.score-bars { display: flex; flex-direction: column; gap: 10px; }
.score-bar-label { display: flex; justify-content: space-between; font-size:0.82rem; margin-bottom: 3px; }
.score-bar-track { height: 6px; background: var(--bg-inset); border-radius: 3px; overflow: hidden; }
.score-bar-fill { height: 100%; border-radius: 3px; transition: width .3s; }
.bar-pass { background: var(--green); }
.bar-marginal { background: var(--yellow); }
.bar-fail { background: var(--red); }


.metrics-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
  gap: 10px;
}
.metric-item {
  padding: 8px;
  background: var(--bg);
  border-radius: var(--radius-sm);
  border: 1px solid var(--border);
}
.metric-item .metric-label { font-size:0.7rem; }
.metric-item .metric-value { font-size:0.95rem; margin-top: 2px; }


.scan-controls { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.scan-market-check { display: flex; align-items: center; gap: 4px; font-size:0.9rem; cursor: pointer; }
.scan-market-check input { width: 16px; height: 16px; }
.scan-progress { margin-top: 12px; }
.progress-bar { height: 8px; background: var(--bg-inset); border-radius: 4px; overflow: hidden; margin-bottom: 6px; }
.progress-fill { height: 100%; background: var(--accent); transition: width .3s; border-radius: 4px; }

.allowance-gauge-head { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; margin-bottom: 6px; }
.allowance-gauge-reserve { margin-top: 6px; }
.scan-list { display: flex; flex-direction: column; gap: 8px; }
.scan-item {
  display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: center;
  padding: 10px 12px; background: var(--bg); border-radius: var(--radius-sm);
  cursor: pointer; transition: all .15s; border: 1px solid transparent;
}
.scan-item:hover { background: var(--bg-hover); border-color: var(--border); }

.scan-item-progress { flex: 0 0 100%; margin-top: 2px; cursor: default; }
.scan-date { font-weight: 600; }
.edit-icon { cursor: pointer; opacity: .3; font-size:0.8rem; }
.edit-icon:hover { opacity: .8; }
.strategy-sidebar .scan-item { font-size:0.85rem; }


.params-display { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 8px; }
.param-item { display: flex; flex-direction: column; padding: 8px; background: var(--bg); border-radius: var(--radius-sm); border: 1px solid var(--border); }
.param-key { font-size:0.75rem; color: var(--text-dim); text-transform: uppercase; font-family: 'Space Grotesk', sans-serif; font-weight: 600; }
.param-val { font-weight: 600; }


.param-row {
  display: flex;
  align-items: baseline;
  gap: 12px;
  padding: 6px 0;
}
.param-row + .param-row { border-top: 1px solid var(--border); }
.param-row .param-key { min-width: 120px; }



.upload-zone {
  border: 2px dashed var(--border-strong); border-radius: var(--radius);
  padding: 0; text-align: center; color: var(--text-dim);
  cursor: pointer; transition: all .2s;
}
.upload-zone:hover { border-color: var(--accent); background: var(--accent-bg); }
.upload-zone-btn { padding: 32px; }

.csv-weights { margin-bottom: 16px; }
.csv-weights p { margin: 0 0 4px; }
.csv-weights .csv-weights-total { margin: 0 0 8px; font-size: 0.85rem; }
.csv-weights label { display: block; font-weight: 500; margin-bottom: 4px; }
.csv-skipped { margin-bottom: 12px; }
.csv-skipped p { margin: 0 0 4px; font-size: 0.85rem; }
.csv-skipped ul { margin: 0; padding-left: 18px; font-size: 0.85rem; }
.file-list { margin-top: 12px; }
.file-item {
  display: flex; gap: 12px; align-items: center;
  padding: 8px 12px; background: var(--bg); border-radius: var(--radius-sm);
  margin-bottom: 4px; border: 1px solid var(--border);
}
.file-item span:first-child { flex: 1; }



.scan-source-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; position: relative; }
.scan-source-header .dropdown-wrap { position: static; }
.btn-inline {
  background: var(--bg-hover); border: 1px solid var(--border-strong, var(--border)); color: var(--accent);
  width: 22px; height: 22px; border-radius: 4px; cursor: pointer;
  font-size:0.85rem; display: inline-flex; align-items: center; justify-content: center;
  transition: all .15s;
  box-shadow: var(--shadow-sm);
}
.btn-inline:hover { background: var(--accent); color: #fff; border-color: var(--accent); }

.chip-row { display: flex; flex-wrap: wrap; gap: 4px; }
.chip {
  display: inline-flex; align-items: center; gap: 3px;
  padding: 1px 8px; background: var(--accent-bg); border: 1px solid #fed7aa;
  border-radius: 20px; font-size:0.75rem; font-weight: 600; white-space: nowrap;
  color: var(--accent-dark);
}

.market-opt-code { flex: 0 0 auto; }
.market-opt-desc {
  color: var(--text-dim); font-size: 0.72rem;
  flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis;
}

.market-picker-described .dropdown-menu { max-width: min(360px, 90vw); }


.market-opt-aggregate > label { display: flex; align-items: center; gap: 6px; cursor: pointer; flex: 1 1 auto; min-width: 0; }
.market-opt-aggregate > .help-icon { margin-left: auto; flex: 0 0 auto; }

.chip-x { cursor: pointer; color: var(--red); opacity: 0.5; font-size:0.85rem; line-height: 1; transition: opacity .15s; }
.chip-x:hover { opacity: 1; }


.chip.chip-list { background: var(--bg-hover); border-color: var(--border-strong, var(--border)); color: var(--text); }
.chip-kind {
  font-size: 0.62rem; text-transform: uppercase; letter-spacing: .06em;
  font-weight: 700; color: var(--text-dim); margin-left: 4px;
}

.chip.chip-unavailable { border-style: dashed; color: var(--text-dim); }

.scan-source-entry { display: flex; align-items: center; gap: 6px; padding: 8px 10px; }
.scan-source-entry .sym-ac { flex: 1; min-width: 0; width: 170px; }

.scan-source-list .dropdown-menu { min-width: 260px; padding-top: 0; }


.dropdown-caption {
  padding: 4px 12px; font-size: 0.68rem; text-transform: uppercase;
  letter-spacing: .06em; font-weight: 700; color: var(--text-dim);
  border-top: 1px solid var(--border);
}


.input-strategies-table {
  width: 100%;
  margin-bottom: 8px;
  font-size:0.8rem;
  border-collapse: collapse;
  table-layout: auto;
  
  position: relative;
  z-index: 50;
}
.input-strategies-table tr {
  border-bottom: 1px solid var(--border-soft, var(--border));
}
.input-strategies-table tr:last-child { border-bottom: none; }
.input-strategies-name {
  padding: 4px 6px 4px 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 0;     
}
.input-strategies-mode {
  padding: 4px 0;
  white-space: nowrap;
  width: 1%;        
}
.input-strategies-remove {
  padding: 4px 0 4px 6px;
  text-align: right;
  width: 1%;
}
.seg-toggle {
  display: inline-flex;
  border: 1px solid var(--border);
  border-radius: 4px;
  overflow: hidden;
  background: var(--bg);
}
.seg-btn {
  appearance: none;
  -webkit-appearance: none;
  background: transparent;
  border: none;
  border-left: 1px solid var(--border);
  padding: 2px 8px;
  font-size:0.72rem;
  font-weight: 500;
  color: var(--text-dim);
  cursor: pointer;
  line-height: 1.2;
  transition: background .12s, color .12s;
}
.seg-btn:first-child { border-left: none; }
.seg-btn:hover:not(:disabled):not([aria-disabled="true"]) {
  background: var(--bg-hover);
  color: var(--text);
}
.seg-btn.seg-active {
  background: var(--accent);
  color: var(--accent-fg, #fff);
  font-weight: 600;
}

.seg-btn:disabled,
.seg-btn[aria-disabled="true"] {
  opacity: .45;
  cursor: not-allowed;
}

.dropdown-wrap { position: relative; }

.dropdown-menu {
  position: absolute; right: 0; top: 24px; z-index: 60;
  background: var(--bg-elev); border: 1px solid var(--border); border-radius: var(--radius);
  padding: 6px 0; min-width: 180px; box-shadow: var(--shadow-lg);
}
.dropdown-item {
  display: flex; align-items: center; gap: 6px;
  padding: 5px 12px; font-size:0.8rem; cursor: pointer; white-space: nowrap;
}
.dropdown-item:hover { background: var(--bg-hover); }
.dropdown-item input { width: 14px; height: 14px; }
.dropdown-backdrop { position: fixed; inset: 0; z-index: 49; }
.dropdown-menu-search { padding-top: 0; }
.dropdown-search {
  width: 100%; padding: 7px 12px; border: none;
  border-bottom: 1px solid var(--border);
  
  background: var(--bg-elev); color: var(--text);
  font-size:0.8rem;
  border-radius: var(--radius) var(--radius) 0 0;
  
}

.dropdown-search:focus-visible { outline-offset: -2px; }
.dropdown-search::placeholder { color: var(--text-muted); }
.dropdown-scroll { max-height: 240px; overflow-y: auto; }



.btn-add-inline {
  width: 28px; height: 28px; padding: 0; font-size: 1.2rem; font-weight: 700;
  line-height: 1; display: flex; align-items: center; justify-content: center;
  border-radius: 50%; flex-shrink: 0;
}
.create-wizard {
  background: var(--bg); border: 1px solid var(--border); border-radius: var(--radius);
  padding: 12px; margin-bottom: 12px; display: flex; flex-direction: column; gap: 8px;
}
.create-wizard-actions { display: flex; gap: 8px; justify-content: flex-end; }

.lists-grid { display: flex; flex-direction: column; gap: 8px; }
.list-card {
  padding: 10px 14px; background: var(--bg-card); border: 1px solid var(--border);
  border-radius: var(--radius); cursor: pointer; transition: all .2s;
  box-shadow: var(--shadow-sm);
}
.list-card:hover { background: var(--bg-hover); transform: translateY(-2px); box-shadow: var(--shadow); }
.list-card.expanded { background: var(--bg-card); border-color: var(--accent); box-shadow: var(--shadow-lg); }
.list-card-header { display: flex; justify-content: space-between; align-items: center; }
.list-name { font-weight: 600; font-size:0.9rem; }
.list-card-body { margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--border); cursor: default; }


.watchlist-tags { display: flex; flex-wrap: wrap; gap: 4px; }
.watchlist-tag {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 2px 8px; background: var(--bg); border: 1px solid var(--border);
  border-radius: 20px; font-size:0.8rem; font-weight: 600;
}
.watchlist-remove {
  cursor: pointer; color: var(--text-muted); font-size: 1rem; line-height: 1;
}
.watchlist-remove:hover { color: var(--red); }


.col-ai { width: 36px; min-width: 36px; max-width: 36px; user-select: none; caret-color: transparent; }
.ai-btn {
  cursor: pointer; font-size: 1rem; color: var(--accent); opacity: .5;
  transition: opacity .15s; user-select: none;
}
.ai-btn:hover { opacity: 1; }

.ai-btn.ai-cancel {
  background: none; border: 0; padding: 0; line-height: 1;
  display: inline-flex; align-items: center; justify-content: center;
}

.ai-btn.ai-cancel:hover:not(:disabled) .ai-spinner {
  --ia-accent: var(--red); --ia-accent-dark: var(--red-dark); --ia-ink: var(--red);
  --ia-up: var(--red); --ia-down: var(--red-dark);
}
.ai-btn.ai-cancel:disabled { cursor: default; opacity: .5; }
.ai-done { opacity: .35; }
.ai-done:hover { opacity: .8; }
.ai-failed { color: var(--red); opacity: .7; }
.ai-spinner {
  display: inline-block; width: .85em; height: .85em;
  vertical-align: middle; flex-shrink: 0;
}

.ai-spinner-sm { width: .6em; height: .6em; }
.ai-spinner-md {  }
.ai-spinner-lg { width: 1.5rem; height: 1.5rem; }

.ai-spinner-xl { width: 3rem; height: 3rem; }


.ai-spinner > .idle-anim { display: block; width: 100%; height: 100%; overflow: hidden; }
.idle-anim { --ia-dl: 0s; }
.idle-anim .ia-fa { fill: var(--ia-accent, var(--accent)); }
.idle-anim .ia-fad { fill: var(--ia-accent-dark, var(--accent-dark)); }
.idle-anim .ia-fi { fill: var(--ia-ink, var(--text-dim)); }
.idle-anim .ia-fs { fill: var(--accent-bg); }
.idle-anim .ia-fb { fill: var(--bg-card); }
.idle-anim .ia-fu { fill: var(--ia-up, var(--green)); }
.idle-anim .ia-fdn { fill: var(--ia-down, var(--red)); }
.idle-anim .ia-sa { stroke: var(--ia-accent, var(--accent)); fill: none; }
.idle-anim .ia-sad { stroke: var(--ia-accent-dark, var(--accent-dark)); stroke-opacity: .45; }
.idle-anim .ia-si { stroke: var(--ia-ink, var(--text-dim)); }
.idle-anim .ia-so { stroke: var(--border-strong); fill: none; }
.idle-anim .ia-su { stroke: var(--ia-up, var(--green)); }
.idle-anim .ia-sdn { stroke: var(--ia-down, var(--red)); }
.idle-anim .ia-nofill { fill: none; }
.idle-anim .ia-trail { stroke-opacity: .35; }


.idle-anim .ia-lv1 { --ia-d: 5.2s; animation: ia-lv1 var(--ia-d) ease-in-out var(--ia-dl) infinite; }
.idle-anim .ia-lv2 { --ia-d: 3.8s; --ia-dl: -1.2s; animation: ia-lv2 var(--ia-d) ease-in-out var(--ia-dl) infinite; }
.idle-anim .ia-lv3 { --ia-d: 4.6s; --ia-dl: -2.6s; animation: ia-lv3 var(--ia-d) ease-in-out var(--ia-dl) infinite; }
@keyframes ia-lv1 { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-19px); } }
@keyframes ia-lv2 { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-13px); } }
@keyframes ia-lv3 { 0%, 100% { transform: translate(0, 0); } 50% { transform: translate(-2px, -17px); } }


.idle-anim .ia-hm { --ia-d: 1.6s; transform-origin: 24px 24px; animation: ia-spin var(--ia-d) linear var(--ia-dl) infinite; }
.idle-anim .ia-hh { --ia-d: 19.2s; transform-origin: 24px 24px; animation: ia-hour var(--ia-d) linear var(--ia-dl) infinite; }
@keyframes ia-spin { to { transform: rotate(360deg); } }
@keyframes ia-hour { from { transform: rotate(120deg); } to { transform: rotate(480deg); } }


.idle-anim .ia-ga { --ia-d: 4s; transform-origin: 20.4px 20.4px; animation: ia-spin var(--ia-d) linear var(--ia-dl) infinite; }
.idle-anim .ia-gb { --ia-d: 2.4s; transform-origin: 31.7px 31.7px; animation: ia-gear-b var(--ia-d) linear var(--ia-dl) infinite; }
@keyframes ia-gear-b { from { transform: rotate(30deg); } to { transform: rotate(-330deg); } }


.idle-anim .ia-hg { --ia-d: 3.6s; transform-origin: 24px 24px; animation: ia-hg var(--ia-d) cubic-bezier(.6, 0, .3, 1) var(--ia-dl) infinite; }
.idle-anim .ia-hgt { --ia-d: 3.6s; transform-origin: 24px 23px; animation: ia-hgt var(--ia-d) linear var(--ia-dl) infinite; }
.idle-anim .ia-hgb { --ia-d: 3.6s; transform-origin: 24px 38px; animation: ia-hgb var(--ia-d) linear var(--ia-dl) infinite; }
.idle-anim .ia-hgs { --ia-d: 3.6s; animation: ia-hgs var(--ia-d) linear var(--ia-dl) infinite, ia-hgf var(--ia-d) linear var(--ia-dl) infinite; }
@keyframes ia-hg { 0%, 78% { transform: rotate(0); } 100% { transform: rotate(180deg); } }
@keyframes ia-hgt { 0% { transform: scale(1); } 74%, 100% { transform: scale(0); } }
@keyframes ia-hgb { 0% { transform: scale(0); } 74%, 100% { transform: scale(1); } }
@keyframes ia-hgs { 0% { opacity: 0; } 4%, 72% { opacity: 1; } 75%, 100% { opacity: 0; } }
@keyframes ia-hgf { to { stroke-dashoffset: -36; } }


.idle-anim .ia-cd { --ia-d: 1.4s; transform-box: fill-box; transform-origin: center; animation: ia-cd var(--ia-d) ease-in-out var(--ia-dl) infinite; }
.idle-anim .ia-cd2 { --ia-dl: -.35s; }
.idle-anim .ia-cd3 { --ia-dl: -.7s; }
.idle-anim .ia-cd4 { --ia-dl: -1.05s; }
@keyframes ia-cd { 0%, 100% { transform: translateY(4px) scaleY(.55); } 50% { transform: translateY(-4px) scaleY(1.05); } }


.idle-anim .ia-tk { --ia-d: 1.8s; animation: ia-tk var(--ia-d) linear var(--ia-dl) infinite; }
.idle-anim .ia-tkd { --ia-d: 1.8s; animation: ia-tkd var(--ia-d) linear var(--ia-dl) infinite; }
@keyframes ia-tk { to { transform: translateX(-18px); } }

@keyframes ia-tkd {
  0%, 100% { transform: translateY(0); } 16.667% { transform: translateY(-6px); }
  33.333% { transform: translateY(-3px); } 50% { transform: translateY(-12px); }
  66.667% { transform: translateY(-7px); } 83.333% { transform: translateY(-9px); }
}


.idle-anim .ia-ncl { --ia-d: 1.3s; transform-origin: 12px 10px; animation: ia-ncl var(--ia-d) var(--ia-dl) infinite; }
.idle-anim .ia-ncr { --ia-d: 1.3s; transform-origin: 36px 10px; animation: ia-ncr var(--ia-d) var(--ia-dl) infinite; }
@keyframes ia-ncl { 0% { transform: rotate(0); animation-timing-function: ease-out; } 25% { transform: rotate(21deg); animation-timing-function: ease-in; } 50%, 100% { transform: rotate(0); } }
@keyframes ia-ncr { 0%, 50% { transform: rotate(0); animation-timing-function: ease-out; } 75% { transform: rotate(-21deg); animation-timing-function: ease-in; } 100% { transform: rotate(0); } }


.idle-anim .ia-cf { --ia-d: 1.4s; animation: ia-cf var(--ia-d) var(--ia-dl) infinite; }
.idle-anim .ia-cs { --ia-d: 1.4s; animation: ia-cs var(--ia-d) ease-in-out var(--ia-dl) infinite; }
@keyframes ia-cf {
  0% { transform: translateY(-34px); animation-timing-function: cubic-bezier(.5, 0, 1, 1); }
  50%, 60% { transform: translateY(0); animation-timing-function: ease-in-out; }
  100% { transform: translateY(5px); }
}
@keyframes ia-cs { 0%, 60% { transform: translateY(0); } 100% { transform: translateY(5px); } }


.idle-anim .ia-mt { --ia-d: .6s; transform-origin: 24px 39px; animation: ia-mt var(--ia-d) ease-in-out var(--ia-dl) infinite alternate; }
@keyframes ia-mt { from { transform: rotate(-24deg); } to { transform: rotate(24deg); } }


.idle-anim .ia-ob { --ia-d: 2.4s; transform-origin: 24px 24px; animation: ia-spin var(--ia-d) linear var(--ia-dl) infinite; }
.idle-anim .ia-ob2 { --ia-d: 1.5s; transform-origin: 24px 24px; animation: ia-spin var(--ia-d) linear var(--ia-dl) infinite reverse; }


.idle-anim .ia-bk { --ia-d: 1.8s; transform-origin: 24px 24px; animation: ia-bk var(--ia-d) var(--ia-dl) infinite; }

@keyframes ia-bk {
  0%, 15% { transform: scaleX(1); opacity: 0; animation-timing-function: step-end; }
  15.01% { transform: scaleX(1); opacity: 1; animation-timing-function: ease-in-out; }
  74.99% { transform: scaleX(-1); opacity: 1; animation-timing-function: step-end; }
  75%, 100% { transform: scaleX(-1); opacity: 0; }
}


.idle-anim .ia-pst { --ia-d: 3.6s; transform-origin: 24px 34px; animation: ia-pst var(--ia-d) ease-in-out var(--ia-dl) infinite; }
.idle-anim .ia-lf { --ia-d: 3.6s; transform-origin: 0 0; animation: ia-lf var(--ia-d) var(--ia-dl) infinite; }
.idle-anim .ia-lf1 { --ia-dl: -.6s; }
.idle-anim .ia-lf2 { --ia-dl: -.4s; }
.idle-anim .ia-lf3 { --ia-dl: -.2s; }
@keyframes ia-pst { 0% { transform: scaleY(.25); } 35%, 88% { transform: scaleY(1); } 100% { transform: scaleY(.25); } }
@keyframes ia-lf {
  0%, 40% { transform: scale(0); opacity: 1; }
  48% { transform: scale(1.15); } 52%, 66% { transform: scale(1); opacity: 1; animation-timing-function: ease-in; }
  86%, 100% { transform: translate(3px, 20px) rotate(80deg) scale(.9); opacity: 0; }
}


.idle-anim .ia-twx { --ia-d: 2.4s; animation: ia-twx var(--ia-d) linear var(--ia-dl) infinite; }
.idle-anim .ia-twy { --ia-d: .8s; animation: ia-twy var(--ia-d) var(--ia-dl) infinite; }
.idle-anim .ia-twr { --ia-d: .8s; transform-origin: 0 33px; animation: ia-spin var(--ia-d) linear var(--ia-dl) infinite; }
@keyframes ia-twx { from { transform: translateX(-10px); } to { transform: translateX(58px); } }
@keyframes ia-twy { 0%, 100% { transform: translateY(0); animation-timing-function: ease-out; } 50% { transform: translateY(-9px); animation-timing-function: ease-in; } }


.idle-anim .ia-sp { --ia-d: 4.8s; stroke-dasharray: 100; animation: ia-sp var(--ia-d) linear var(--ia-dl) infinite; }
.idle-anim .ia-spd { --ia-d: 4.8s; transform-origin: 24px 24px; animation: ia-spd var(--ia-d) linear var(--ia-dl) infinite; }
@keyframes ia-sp { 0% { stroke-dashoffset: 100; } 60% { stroke-dashoffset: 0; } 100% { stroke-dashoffset: -100; } }
@keyframes ia-spd {
  0% { transform: rotate(0deg) translateY(-16px); }
  7.74% { transform: rotate(90deg) translateY(-15px); }
  14.98% { transform: rotate(180deg) translateY(-14px); }
  21.72% { transform: rotate(270deg) translateY(-13px); }
  27.96% { transform: rotate(360deg) translateY(-12px); }
  33.71% { transform: rotate(450deg) translateY(-11px); }
  38.96% { transform: rotate(540deg) translateY(-10px); }
  43.71% { transform: rotate(630deg) translateY(-9px); }
  47.96% { transform: rotate(720deg) translateY(-8px); }
  51.71% { transform: rotate(810deg) translateY(-7px); }
  54.97% { transform: rotate(900deg) translateY(-6px); }
  57.73% { transform: rotate(990deg) translateY(-5px); }
  60% { transform: rotate(1080deg) translateY(-4px); }
  100% { transform: rotate(1080deg) translateY(-16px); }
}


.idle-anim .ia-mu { --ia-d: 2.4s; animation: ia-mu var(--ia-d) linear var(--ia-dl) infinite; }
@keyframes ia-mu { to { transform: translateX(-24px); } }


.idle-anim .ia-wm { --ia-d: 3s; transform-origin: 24px 18px; animation: ia-spin var(--ia-d) linear var(--ia-dl) infinite; }


.idle-anim .ia-st { --ia-d: 2.4s; animation: ia-st var(--ia-d) ease-out var(--ia-dl) infinite; }
.idle-anim .ia-st2 { --ia-dl: -.8s; }
.idle-anim .ia-st3 { --ia-dl: -1.6s; }
@keyframes ia-st { 0% { transform: translateY(4px); opacity: 0; } 30% { opacity: .85; } 100% { transform: translateY(-6px); opacity: 0; } }


.idle-anim .ia-sweep { fill: var(--ia-accent, var(--accent)); fill-opacity: .28; }
.idle-anim .ia-rd { --ia-d: 2.4s; transform-origin: 24px 24px; animation: ia-spin var(--ia-d) linear var(--ia-dl) infinite; }
.idle-anim .ia-bp1 { --ia-d: 2.4s; animation: ia-bp1 var(--ia-d) linear var(--ia-dl) infinite; }
.idle-anim .ia-bp2 { --ia-d: 2.4s; animation: ia-bp2 var(--ia-d) linear var(--ia-dl) infinite; }
@keyframes ia-bp1 { 0%, 3% { opacity: .15; } 4% { opacity: 1; } 60%, 100% { opacity: .15; } }
@keyframes ia-bp2 { 0%, 45% { opacity: .15; } 46% { opacity: 1; } 100% { opacity: .15; } }


.idle-anim .ia-shadow { fill: var(--ia-ink, var(--text-dim)); opacity: .3; }
.idle-anim .ia-bl { --ia-d: 1.1s; transform-origin: 24px 40px; animation: ia-bl var(--ia-d) var(--ia-dl) infinite; }
.idle-anim .ia-bsh { --ia-d: 1.1s; transform-origin: 24px 42px; animation: ia-bsh var(--ia-d) var(--ia-dl) infinite; }
@keyframes ia-bl {
  0%, 100% { transform: translateY(-22px) scale(1, 1); animation-timing-function: ease-in; }
  45% { transform: translateY(0) scale(1, 1); animation-timing-function: ease-out; }
  50% { transform: translateY(0) scale(1.2, .8); animation-timing-function: ease-out; }
  55% { transform: translateY(0) scale(1, 1); animation-timing-function: ease-out; }
}
@keyframes ia-bsh {
  0%, 100% { transform: scaleX(.45); animation-timing-function: ease-in; }
  45%, 55% { transform: scaleX(1); animation-timing-function: ease-out; }
}


.idle-anim .ia-dr { --ia-d: .9s; animation: ia-dr var(--ia-d) ease-in var(--ia-dl) infinite; }
.idle-anim .ia-dr2 { --ia-dl: -.3s; }
.idle-anim .ia-dr3 { --ia-dl: -.6s; }
.idle-anim .ia-dr4 { --ia-dl: -.15s; }
.idle-anim .ia-rp { --ia-d: .9s; transform-origin: 24px 44px; animation: ia-rp var(--ia-d) ease-out var(--ia-dl) infinite; }
@keyframes ia-dr { 0% { transform: translateY(0); opacity: 1; } 80% { opacity: 1; } 100% { transform: translateY(16px); opacity: 0; } }
@keyframes ia-rp { 0% { transform: scale(.2); opacity: 1; } 100% { transform: scale(1); opacity: 0; } }


.idle-anim .ia-mx { stroke: var(--ia-accent, var(--accent)); fill: none; stroke-width: 1.2; stroke-linecap: round; stroke-linejoin: round; }
.idle-anim .ia-mx1 { opacity: .25; }
.idle-anim .ia-mx2 { opacity: .45; }
.idle-anim .ia-mx3 { opacity: .7; }
.idle-anim .ia-mx4 { opacity: 1; }


.idle-anim .ia-spoon { --ia-d: .9s; transform-origin: 29px 3px; animation: ia-spoon var(--ia-d) ease-in-out var(--ia-dl) infinite alternate; }
.idle-anim .ia-pb { --ia-d: 1.8s; transform-box: fill-box; transform-origin: center; animation: ia-pb var(--ia-d) ease-out var(--ia-dl) infinite; }
.idle-anim .ia-pb2 { --ia-dl: -.6s; }
.idle-anim .ia-pb3 { --ia-dl: -1.2s; }
@keyframes ia-spoon { from { transform: rotate(-13deg); } to { transform: rotate(13deg); } }
@keyframes ia-pb { 0% { transform: translateY(2px) scale(.5); opacity: 0; } 25% { opacity: 1; } 85% { opacity: 1; } 100% { transform: translateY(-9px) scale(1.15); opacity: 0; } }


.idle-anim .ia-fbub { --ia-d: 1.6s; animation: ia-fbub var(--ia-d) ease-in var(--ia-dl) infinite; }
.idle-anim .ia-fbub2 { --ia-dl: -.4s; }
.idle-anim .ia-fbub3 { --ia-dl: -.8s; }
.idle-anim .ia-fbub4 { --ia-dl: -1.2s; }
.idle-anim .ia-vap { --ia-d: 1.6s; transform-box: fill-box; transform-origin: center; animation: ia-vap var(--ia-d) ease-out var(--ia-dl) infinite; }
.idle-anim .ia-vap2 { --ia-dl: -.8s; }
@keyframes ia-fbub { 0% { transform: translateY(0); opacity: 0; } 12% { opacity: 1; } 85% { opacity: 1; } 100% { transform: translateY(-13px); opacity: 0; } }
@keyframes ia-vap { 0% { transform: translateY(0) scale(.6); opacity: 0; } 30% { opacity: .9; } 100% { transform: translateY(-7px) scale(1.4); opacity: 0; } }


.idle-anim .ia-dnc { --ia-d: 2.4s; transform-origin: 24px 0; animation: ia-dnc var(--ia-d) var(--ia-dl) infinite; }
.idle-anim .ia-key { --ia-d: 2.4s; transform-origin: 43px 38px; animation: ia-dnc var(--ia-d) var(--ia-dl) infinite; }
.idle-anim .ia-note { --ia-d: 2.4s; animation: ia-note var(--ia-d) ease-out var(--ia-dl) infinite; }
@keyframes ia-dnc {
  0%, 100% { transform: scaleX(1); animation-timing-function: ease-in; }
  25% { transform: scaleX(0); animation-timing-function: ease-out; }
  50% { transform: scaleX(-1); animation-timing-function: ease-in; }
  75% { transform: scaleX(0); animation-timing-function: ease-out; }
}
@keyframes ia-note { 0% { transform: translate(-2px, 8px); opacity: 0; } 30% { opacity: 1; } 100% { transform: translate(3px, -4px); opacity: 0; } }


.idle-anim .ia-orb { --ia-d: 5s; transform-origin: 24px 24px; animation: ia-spin var(--ia-d) linear var(--ia-dl) infinite reverse; }
.idle-anim .ia-jawu { --ia-d: 1s; transform-origin: 29.5px 11px; animation: ia-jawu var(--ia-d) var(--ia-dl) infinite; }
.idle-anim .ia-jawl { --ia-d: 1s; transform-origin: 29.5px 11px; animation: ia-jawl var(--ia-d) var(--ia-dl) infinite; }
.idle-anim .ia-gulp { --ia-d: 1s; transform-origin: 24px 24px; animation: ia-gulp var(--ia-d) ease-in var(--ia-dl) infinite; }
@keyframes ia-jawu {
  0%, 100% { transform: rotate(0); }
  35% { transform: rotate(-16deg); animation-timing-function: cubic-bezier(.6, 0, 1, 1); }
  50% { transform: rotate(0); }
}
@keyframes ia-jawl {
  0%, 100% { transform: rotate(0); }
  35% { transform: rotate(14deg); animation-timing-function: cubic-bezier(.6, 0, 1, 1); }
  50% { transform: rotate(0); }
}
@keyframes ia-gulp {
  0%, 48% { transform: rotate(0); opacity: 0; }
  55% { opacity: 1; }
  90% { opacity: 1; }
  100% { transform: rotate(150deg); opacity: 0; }
}


.idle-anim .ia-dg { --ia-d: 1.5s; transform-origin: 24px 24px; animation: ia-spin var(--ia-d) linear var(--ia-dl) infinite reverse; }
.idle-anim .ia-tail { --ia-d: .22s; transform-origin: 13.9px 21.5px; animation: ia-tail var(--ia-d) ease-in-out var(--ia-dl) infinite alternate; }
@keyframes ia-tail { from { transform: rotate(-18deg); } to { transform: rotate(18deg); } }


.idle-anim .ia-cb { --ia-d: 1.8s; transform-origin: 24px 42px; animation: ia-cb var(--ia-d) ease-in-out var(--ia-dl) infinite alternate; }
.idle-anim .ia-z { --ia-d: 2.6s; transform-origin: 39px 26px; animation: ia-z var(--ia-d) ease-out var(--ia-dl) infinite; }
.idle-anim .ia-z2 { --ia-dl: -1.3s; }
@keyframes ia-cb { from { transform: scaleY(1); } to { transform: scaleY(1.07); } }
@keyframes ia-z { 0% { transform: translate(-5px, 9px) scale(.45); opacity: 0; } 30% { opacity: 1; } 100% { transform: translate(3px, -9px) scale(1.15); opacity: 0; } }


.idle-anim .ia-shx { --ia-d: 2.6s; animation: ia-shx var(--ia-d) linear var(--ia-dl) infinite; }
.idle-anim .ia-shy { --ia-d: 2.6s; animation: ia-shy var(--ia-d) var(--ia-dl) infinite; }
.idle-anim .ia-shlf { --ia-d: 2.6s; transform-origin: 4.5px 34px; animation: ia-shlf var(--ia-d) ease-in-out var(--ia-dl) infinite; }
.idle-anim .ia-shlb { --ia-d: 2.6s; transform-origin: -4.5px 34px; animation: ia-shlb var(--ia-d) ease-in-out var(--ia-dl) infinite; }
@keyframes ia-shx { from { transform: translateX(-14px); } to { transform: translateX(62px); } }
@keyframes ia-shy {
  0%, 24% { transform: translateY(0); animation-timing-function: ease-out; }
  50% { transform: translateY(-15px); animation-timing-function: ease-in; }
  76%, 100% { transform: translateY(0); }
}
@keyframes ia-shlf { 0%, 24%, 76%, 100% { transform: rotate(0); } 50% { transform: rotate(-40deg); } }
@keyframes ia-shlb { 0%, 24%, 76%, 100% { transform: rotate(0); } 50% { transform: rotate(40deg); } }


.idle-anim .ia-mxa { --ia-d: 1.4s; animation: ia-mxf var(--ia-d) linear var(--ia-dl) infinite; }
.idle-anim .ia-mxb { --ia-d: 1.9s; animation: ia-mxf var(--ia-d) linear var(--ia-dl) infinite; }
.idle-anim .ia-mxc { --ia-d: 1.1s; animation: ia-mxf var(--ia-d) linear var(--ia-dl) infinite; }
.idle-anim .ia-mxd { --ia-d: 1.6s; animation: ia-mxf var(--ia-d) linear var(--ia-dl) infinite; }
@keyframes ia-mxf { to { transform: translateY(28px); } }


.idle-anim .ia-slsc { --ia-d: 1.4s; animation: ia-slsc var(--ia-d) linear var(--ia-dl) infinite; }
.idle-anim .ia-sla { --ia-d: 1.4s; transform-origin: 31px 25.5px; animation: ia-sla var(--ia-d) ease-in-out var(--ia-dl) infinite; }
.idle-anim .ia-slc { --ia-d: 1.4s; transform-box: fill-box; transform-origin: center; animation: ia-slc var(--ia-d) ease-in-out var(--ia-dl) infinite; }
.idle-anim .ia-slc0 { --amp: 0.0; --tilt: 53.85; }
.idle-anim .ia-slc1 { --amp: 2.07; --tilt: 52.9; }
.idle-anim .ia-slc2 { --amp: 4.0; --tilt: 49.86; }
.idle-anim .ia-slc3 { --amp: 5.66; --tilt: 44.07; }
.idle-anim .ia-slc4 { --amp: 6.93; --tilt: 34.39; }
.idle-anim .ia-slc5 { --amp: 7.73; --tilt: 19.51; }
.idle-anim .ia-slc6 { --amp: 8.0; --tilt: 0.0; }
.idle-anim .ia-slc7 { --amp: 7.73; --tilt: -19.51; }
.idle-anim .ia-slc8 { --amp: 6.93; --tilt: -34.39; }
.idle-anim .ia-slc9 { --amp: 5.66; --tilt: -44.07; }
.idle-anim .ia-slc10 { --amp: 4.0; --tilt: -49.86; }
.idle-anim .ia-slc11 { --amp: 2.07; --tilt: -52.9; }
.idle-anim .ia-slc12 { --amp: 0.0; --tilt: -53.85; }
@keyframes ia-slsc { to { transform: translate(-16px, -9px); } }
@keyframes ia-sla { to { transform: rotate(180deg); } }
@keyframes ia-slc {
  from { transform: translateY(calc(var(--amp) * -1px)) rotate(calc(var(--tilt) * 1deg)); }
  to { transform: translateY(calc(var(--amp) * 1px)) rotate(calc(var(--tilt) * -1deg)); }
}


.idle-anim .ia-jg1, .idle-anim .ia-jg2, .idle-anim .ia-jg3 { --ia-d: 1.8s; animation: var(--ia-jg) var(--ia-d) linear var(--ia-dl) infinite; }
.idle-anim .ia-jg1 { --ia-jg: ia-jg1; }
.idle-anim .ia-jg2 { --ia-jg: ia-jg2; }
.idle-anim .ia-jg3 { --ia-jg: ia-jg3; }
@keyframes ia-jg1 {
  0.0% { transform: translate(0.0px, 0.0px); }
  4.167% { transform: translate(2.85px, 0.61px); }
  8.333% { transform: translate(5.5px, 2.41px); }
  12.5% { transform: translate(7.78px, 5.27px); }
  16.667% { transform: translate(9.53px, 9.0px); }
  20.833% { transform: translate(10.63px, 13.34px); }
  25.0% { transform: translate(11.0px, 18.0px); }
  29.167% { transform: translate(10.63px, 13.34px); }
  33.333% { transform: translate(9.53px, 9.0px); }
  37.5% { transform: translate(7.78px, 5.27px); }
  41.667% { transform: translate(5.5px, 2.41px); }
  45.833% { transform: translate(2.85px, 0.61px); }
  50.0% { transform: translate(0.0px, 0.0px); }
  54.167% { transform: translate(-2.85px, 0.61px); }
  58.333% { transform: translate(-5.5px, 2.41px); }
  62.5% { transform: translate(-7.78px, 5.27px); }
  66.667% { transform: translate(-9.53px, 9.0px); }
  70.833% { transform: translate(-10.63px, 13.34px); }
  75.0% { transform: translate(-11.0px, 18.0px); }
  79.167% { transform: translate(-10.63px, 13.34px); }
  83.333% { transform: translate(-9.53px, 9.0px); }
  87.5% { transform: translate(-7.78px, 5.27px); }
  91.667% { transform: translate(-5.5px, 2.41px); }
  95.833% { transform: translate(-2.85px, 0.61px); }
  100.0% { transform: translate(0.0px, 0.0px); }
}
@keyframes ia-jg2 {
  0.0% { transform: translate(9.53px, 9.0px); }
  4.167% { transform: translate(7.78px, 5.27px); }
  8.333% { transform: translate(5.5px, 2.41px); }
  12.5% { transform: translate(2.85px, 0.61px); }
  16.667% { transform: translate(0.0px, 0.0px); }
  20.833% { transform: translate(-2.85px, 0.61px); }
  25.0% { transform: translate(-5.5px, 2.41px); }
  29.167% { transform: translate(-7.78px, 5.27px); }
  33.333% { transform: translate(-9.53px, 9.0px); }
  37.5% { transform: translate(-10.63px, 13.34px); }
  41.667% { transform: translate(-11.0px, 18.0px); }
  45.833% { transform: translate(-10.63px, 13.34px); }
  50.0% { transform: translate(-9.53px, 9.0px); }
  54.167% { transform: translate(-7.78px, 5.27px); }
  58.333% { transform: translate(-5.5px, 2.41px); }
  62.5% { transform: translate(-2.85px, 0.61px); }
  66.667% { transform: translate(0.0px, 0.0px); }
  70.833% { transform: translate(2.85px, 0.61px); }
  75.0% { transform: translate(5.5px, 2.41px); }
  79.167% { transform: translate(7.78px, 5.27px); }
  83.333% { transform: translate(9.53px, 9.0px); }
  87.5% { transform: translate(10.63px, 13.34px); }
  91.667% { transform: translate(11.0px, 18.0px); }
  95.833% { transform: translate(10.63px, 13.34px); }
  100.0% { transform: translate(9.53px, 9.0px); }
}
@keyframes ia-jg3 {
  0.0% { transform: translate(-9.53px, 9.0px); }
  4.167% { transform: translate(-10.63px, 13.34px); }
  8.333% { transform: translate(-11.0px, 18.0px); }
  12.5% { transform: translate(-10.63px, 13.34px); }
  16.667% { transform: translate(-9.53px, 9.0px); }
  20.833% { transform: translate(-7.78px, 5.27px); }
  25.0% { transform: translate(-5.5px, 2.41px); }
  29.167% { transform: translate(-2.85px, 0.61px); }
  33.333% { transform: translate(0.0px, 0.0px); }
  37.5% { transform: translate(2.85px, 0.61px); }
  41.667% { transform: translate(5.5px, 2.41px); }
  45.833% { transform: translate(7.78px, 5.27px); }
  50.0% { transform: translate(9.53px, 9.0px); }
  54.167% { transform: translate(10.63px, 13.34px); }
  58.333% { transform: translate(11.0px, 18.0px); }
  62.5% { transform: translate(10.63px, 13.34px); }
  66.667% { transform: translate(9.53px, 9.0px); }
  70.833% { transform: translate(7.78px, 5.27px); }
  75.0% { transform: translate(5.5px, 2.41px); }
  79.167% { transform: translate(2.85px, 0.61px); }
  83.333% { transform: translate(0.0px, 0.0px); }
  87.5% { transform: translate(-2.85px, 0.61px); }
  91.667% { transform: translate(-5.5px, 2.41px); }
  95.833% { transform: translate(-7.78px, 5.27px); }
  100.0% { transform: translate(-9.53px, 9.0px); }
}


.idle-anim .ia-bep { --ia-d: 3s; animation: ia-bep var(--ia-d) linear var(--ia-dl) infinite; }
.idle-anim .ia-bef { --ia-d: 3s; animation: ia-bef var(--ia-d) step-end var(--ia-dl) infinite; }
.idle-anim .ia-bew { --ia-d: .09s; transform-origin: 0 -2px; animation: ia-bew var(--ia-d) linear var(--ia-dl) infinite alternate; }
@keyframes ia-bep {
  0.0% { transform: translate(24.0px, 15.0px); }
  4.167% { transform: translate(27.36px, 18.0px); }
  8.333% { transform: translate(30.5px, 20.2px); }
  12.5% { transform: translate(33.19px, 21.0px); }
  16.667% { transform: translate(35.26px, 20.2px); }
  20.833% { transform: translate(36.56px, 18.0px); }
  25.0% { transform: translate(37.0px, 15.0px); }
  29.167% { transform: translate(36.56px, 12.0px); }
  33.333% { transform: translate(35.26px, 9.8px); }
  37.5% { transform: translate(33.19px, 9.0px); }
  41.667% { transform: translate(30.5px, 9.8px); }
  45.833% { transform: translate(27.36px, 12.0px); }
  50.0% { transform: translate(24.0px, 15.0px); }
  54.167% { transform: translate(20.64px, 18.0px); }
  58.333% { transform: translate(17.5px, 20.2px); }
  62.5% { transform: translate(14.81px, 21.0px); }
  66.667% { transform: translate(12.74px, 20.2px); }
  70.833% { transform: translate(11.44px, 18.0px); }
  75.0% { transform: translate(11.0px, 15.0px); }
  79.167% { transform: translate(11.44px, 12.0px); }
  83.333% { transform: translate(12.74px, 9.8px); }
  87.5% { transform: translate(14.81px, 9.0px); }
  91.667% { transform: translate(17.5px, 9.8px); }
  95.833% { transform: translate(20.64px, 12.0px); }
  100.0% { transform: translate(24.0px, 15.0px); }
}
@keyframes ia-bef { 0% { transform: scaleX(1); } 25% { transform: scaleX(-1); } 75%, 100% { transform: scaleX(1); } }
@keyframes ia-bew { from { transform: scaleY(1); } to { transform: scaleY(.35); } }


.idle-anim .ia-pgc { --ia-d: 2s; animation: ia-pgc var(--ia-d) var(--ia-dl) infinite; }
.idle-anim .ia-pgb { --ia-d: 2s; transform-origin: 22px 42px; animation: ia-pgb var(--ia-d) var(--ia-dl) infinite; }
@keyframes ia-pgc {
  0% { transform: translateY(-16px); animation-timing-function: cubic-bezier(.5, 0, 1, 1); }
  45%, 100% { transform: translateY(14px); }
}
@keyframes ia-pgb {
  0%, 44% { transform: scale(1, 1); }
  50% { transform: scale(1.04, .93); animation-timing-function: ease-out; }
  58% { transform: scale(.98, 1.03); }
  66%, 100% { transform: scale(1, 1); }
}


.idle-anim .ia-sgr { stroke: var(--bg-card); stroke-opacity: .25; }
.idle-anim .ia-sgl { stroke: var(--bg-card); stroke-opacity: .45; }
.idle-anim .ia-vn { --ia-d: 1.8s; transform-origin: 21px 26px; animation: ia-spin var(--ia-d) linear var(--ia-dl) infinite; }


.idle-anim .ia-hw { --ia-d: 1.6s; transform-origin: 24px 24px; animation: ia-spin var(--ia-d) linear var(--ia-dl) infinite; }
.idle-anim .ia-hbd { --ia-d: .2s; animation: ia-hbd var(--ia-d) ease-in-out var(--ia-dl) infinite alternate; }
.idle-anim .ia-hlf { --ia-d: .4s; transform-origin: 27.5px 35px; animation: ia-hlf var(--ia-d) ease-in-out var(--ia-dl) infinite alternate; }
.idle-anim .ia-hlb { --ia-d: .4s; transform-origin: 20px 35px; animation: ia-hlb var(--ia-d) ease-in-out var(--ia-dl) infinite alternate; }
@keyframes ia-hbd { from { transform: translateY(0); } to { transform: translateY(-1.2px); } }
@keyframes ia-hlf { from { transform: rotate(-35deg); } to { transform: rotate(35deg); } }
@keyframes ia-hlb { from { transform: rotate(35deg); } to { transform: rotate(-35deg); } }


.idle-anim .ia-yy { --ia-d: 2.2s; animation: ia-yy var(--ia-d) var(--ia-dl) infinite; }
.idle-anim .ia-yst { --ia-d: 2.2s; transform-origin: 24px 6px; animation: ia-yst var(--ia-d) var(--ia-dl) infinite; }
.idle-anim .ia-yys { --ia-d: .5s; transform-origin: 24px 12px; animation: ia-spin var(--ia-d) linear var(--ia-dl) infinite; }
@keyframes ia-yy {
  0%, 100% { transform: translateY(0); animation-timing-function: ease-in; }
  40%, 60% { transform: translateY(24px); animation-timing-function: ease-out; }
}
@keyframes ia-yst {
  0%, 100% { transform: scaleY(1); animation-timing-function: ease-in; }
  40%, 60% { transform: scaleY(5); animation-timing-function: ease-out; }
}


.loading-block {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 10px; padding: 24px 16px;
  color: var(--text-dim); font-size:0.95rem; text-align: center;
}
.loading-block.loading-block-compact { flex-direction: row; gap: 12px; padding: 8px 0; }
.loading-block-label { line-height: 1.2; }


.loading-block.ai-refresh-block { padding: 40px 16px; font-size: 1.05rem; }
.ai-refresh-block .ai-spinner-xl { width: 6rem; height: 6rem; }


.skeleton-stack { display: flex; flex-direction: column; }
.skeleton-block {
  display: block;
  border-radius: var(--radius-sm);
  background-color: var(--border);
  background-image: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.45) 50%,
    rgba(255, 255, 255, 0) 100%
  );
  background-repeat: no-repeat;
  background-size: 60% 100%;
  background-position: -80% 0;
  animation: skeleton-shimmer 1.4s ease-in-out infinite;
}
@keyframes skeleton-shimmer {
  0% { background-position: -80% 0; }
  100% { background-position: 180% 0; }
}


.empty-state {
  display: flex; flex-direction: column; align-items: center;
  gap: 12px; padding: 24px 16px;
  color: var(--text-dim); text-align: center;
}
.empty-state > p { margin: 0; }
.empty-row-cell {
  opacity: .5; text-align: center; padding: 12px 8px;
}


.card-unavailable {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 14px 12px;
  border: 1px solid var(--border); border-left: 3px solid var(--orange);
  border-radius: 6px;
  color: var(--orange);
}
.card-unavailable strong { font-size: 0.85rem; }


.tab-link {
  border-radius: 0; opacity: .7;
}


.tab-link.active {
  font-weight: 700; opacity: 1;
  background: var(--bg-card); border-color: var(--border); color: var(--text);
  border-bottom: 2px solid var(--orange);
  box-shadow: none;
}
.tab-link.active:hover { background: var(--bg-hover); }


.toast-host {
  
  position: fixed; bottom: max(1rem, env(safe-area-inset-bottom)); right: max(1rem, env(safe-area-inset-right)); z-index: 10001;
  display: flex; flex-direction: column; gap: 8px;
  max-width: min(420px, calc(100vw - 2rem));
  pointer-events: none;
}
.toast {
  pointer-events: auto;
  padding: 10px 14px; border-radius: var(--radius-sm, 6px);
  background: var(--bg-card); color: var(--text);
  border: 1px solid var(--border);
  box-shadow: 0 4px 12px rgba(0, 0, 0, .15);
  font-size:0.9rem; line-height: 1.4;
  cursor: pointer; user-select: none;
  animation: toast-in .18s ease-out;
}
.toast-info    { border-left: 3px solid var(--accent); }
.toast-success { border-left: 3px solid var(--green, #28a745); }
.toast-error   { border-left: 3px solid var(--red, #d9534f); }
@keyframes toast-in {
  from { transform: translateY(8px); opacity: 0; }
  to   { transform: translateY(0); opacity: 1; }
}



.sort-th-wrap { display: flex; align-items: center; gap: 4px; height: 100%; }
.sort-th-btn {
  
  align-self: stretch;
  flex: 1 1 auto;
  min-width: 0;
  font: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
  color: inherit;
  background: none;
  border: 0;
  padding: 0;
  margin: 0;
  text-align: inherit;
  white-space: inherit;
  cursor: pointer;
  user-select: none;
}


.stock-table th.sort-th,
.data-table th.sort-th { padding: 0; }
.stock-table th.sort-th .sort-th-btn { padding: 10px 12px; }
.data-table th.sort-th .sort-th-btn { padding: 8px 12px; }


.sort-asc::after  { content: " \25B2"; opacity: .55; font-size:0.8em; }
.sort-desc::after { content: " \25BC"; opacity: .55; font-size:0.8em; }


.stat-tile-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(var(--stat-tile-min, 160px), 1fr));
  gap: .75rem;
  margin-bottom: 1rem;
}
.stat-tile {
  padding: 1rem;
  display: flex; flex-direction: column; gap: 4px;
}
.stat-tile-label { font-size:0.85rem; opacity: .7; }
.stat-tile-value { font-size: 1.5rem; font-weight: 700; }
.stat-tile-sub { font-size:0.8rem; opacity: .6; }


.page-header { margin: 1.5rem 0 0.5rem; }
.page-header-flush { margin: 0 0 0.5rem; }
.page-header-title { margin: 0; }
.page-header-subtitle { margin: 0.25rem 0 0; color: var(--text-dim); }



.row-link { position: relative; }
tr.row-link { position: relative; cursor: pointer; }
.row-link-cell { color: inherit; text-decoration: none; }
.row-link-cell::before { content: ""; position: absolute; inset: 0; z-index: 0; }

.row-link-cell:focus-visible { outline: none; }
.row-link-cell:focus-visible::before {
  outline: 2px solid var(--focus-ring-color);
  outline-offset: -2px;
}
.row-link .row-link-actions { position: relative; z-index: 1; }

.row-link .row-link-dimmed { opacity: .45; pointer-events: none; }


.analysis-engines { display: flex; gap: 8px; flex-wrap: wrap; }


.connections-list { display: flex; flex-direction: column; gap: 8px; }
.connection-item {
  display: flex; justify-content: space-between; align-items: center;
  padding: 12px 16px; background: var(--bg-card); border-radius: var(--radius);
  border: 1px solid var(--border); box-shadow: var(--shadow-sm);
}
.connection-info { display: flex; align-items: center; gap: 12px; }
.connection-name { font-weight: 600; }
.connection-actions { display: flex; gap: 8px; }


.wizard-columns { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 16px; }
.wizard-col { display: flex; flex-direction: column; }
.wizard-col textarea { flex: 1; }
@media (max-width: 900px) { .wizard-columns { grid-template-columns: 1fr; } }


.wizard-rail {
  display: flex; gap: 4px; margin: 8px 0 16px; flex-wrap: wrap;
}
.wizard-rail-step {
  display: flex; align-items: center; gap: 8px;
  padding: 6px 12px; border: 1px solid var(--border); border-radius: 6px;
  background: var(--bg); color: var(--text-dim); cursor: pointer;
  font-size:0.82rem; transition: background .12s, border-color .12s;
}
.wizard-rail-step:disabled { cursor: default; opacity: .55; }
.wizard-rail-step.rail-active { border-color: var(--accent); color: var(--text); background: var(--bg-hover); }
.wizard-rail-step.rail-done { color: var(--text); }
.wizard-rail-num {
  display: inline-flex; align-items: center; justify-content: center;
  width: 20px; height: 20px; border-radius: 50%;
  background: var(--border); color: var(--text); font-size:0.72rem; font-weight: 600;
}
.wizard-rail-step.rail-active .wizard-rail-num { background: var(--accent); color: #fff; }
.wizard-rail-step.rail-done .wizard-rail-num { background: var(--green, #2e7d32); color: #fff; }

.wizard-rail-step.rail-skipped {
  opacity: .45; border-style: dashed; background: transparent;
}
.wizard-rail-step.rail-skipped .wizard-rail-num {
  background: transparent; border: 1px dashed var(--border);
  color: var(--text-dim); text-decoration: line-through;
}
.wizard-rail-step.rail-skipped .wizard-rail-title { text-decoration: line-through; }
.wizard-rail-skipped-note { font-size: 0.7rem; font-style: italic; letter-spacing: .02em; }
.wizard-step { display: flex; flex-direction: column; min-height: 320px; margin-bottom: 16px; }

.quick-scan-cost { font-size: 0.85rem; }
.wizard-nav { display: flex; align-items: center; gap: 8px; margin-top: 8px; }

.wizard-nav-spacer { flex: 1; }

.wizard-nav-hint { font-size: 0.82rem; color: var(--text-dim); }

.wizard-nav .btn { flex-shrink: 0; }

.wizard-nav-top { margin-top: 0; margin-bottom: 12px; }


.top-ranks-scan { font-size: 0.8rem; }
.top-ranks-note { font-size: 0.85rem; margin: 4px 0 0; display: flex; align-items: center; gap: 8px; }
.top-ranks-table { width: 100%; border-collapse: collapse; margin-top: 4px; }
.top-ranks-table td {
  padding: 5px 10px 5px 0;
  border-bottom: 1px solid var(--border);
  vertical-align: middle;
}
.top-ranks-table td:last-child { padding-right: 0; text-align: right; }
.top-ranks-row:last-child td { border-bottom: none; }
.top-ranks-rank { width: 1.6rem; font-size: 0.8rem; color: var(--text-dim); text-align: right; }
.top-ranks-symbol { font-weight: 600; white-space: nowrap; }

.top-ranks-name {
  width: 100%;
  max-width: 0;
  font-size: 0.85rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.top-ranks-score { white-space: nowrap; text-align: right; }

.top-ranks-ai { width: 1.5rem; white-space: nowrap; }
.top-ranks-all { margin-top: 10px; }


.rescan-markets-error { font-size: 0.75rem; margin-top: 4px; }
.rescan-modal-actions { display: flex; gap: 8px; margin-top: 16px; }

.top-ranks-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

.top-ranks-progress { margin: 6px 0 12px; }
.top-ranks-progress-head {
  display: flex; align-items: center; gap: 6px;
  font-size: 0.85rem; margin: 0 0 6px;
}


.top-ranks-split { display: block; }
.top-ranks-card.has-sim-panel .top-ranks-split {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 20px;
}
.top-ranks-card.has-sim-panel .top-ranks-sim {
  border-left: 1px solid var(--border);
  padding-left: 20px;
}
@media (max-width: 900px) {
  .top-ranks-card.has-sim-panel .top-ranks-split { grid-template-columns: minmax(0, 1fr); }
  .top-ranks-card.has-sim-panel .top-ranks-sim {
    border-left: none;
    padding-left: 0;
    border-top: 1px solid var(--border);
    padding-top: 12px;
  }
}
.latest-sim-head { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; margin-bottom: 8px; }
.latest-sim-head h3 { margin: 0; }
.latest-sim-kind { font-size: 0.8rem; }

.latest-sim-panel.is-running { display: flex; flex-direction: column; }
.latest-sim-progress {
  flex: 1; display: flex; flex-direction: column; justify-content: center;
  gap: 8px; padding: 12px 0; text-align: center;
}
.latest-sim-progress > .ai-spinner { align-self: center; }
.latest-sim-phase { font-size: 0.85rem; margin: 0; }
.latest-sim-duration { font-size: 0.85rem; margin: 6px 0 0; }
.latest-sim-failed { font-size: 0.85rem; margin: 4px 0; }
.latest-sim-facts { margin: 0; }
.latest-sim-fact {
  display: flex; justify-content: space-between; gap: 12px;
  padding: 5px 0; border-bottom: 1px solid var(--border);
}
.latest-sim-fact:last-child { border-bottom: none; }
.latest-sim-fact dt { color: var(--text-dim); font-size: 0.85rem; }
.latest-sim-fact dd { margin: 0; font-weight: 600; font-variant-numeric: tabular-nums; }
.latest-sim-fact dd.is-up { color: var(--green-dark); }
.latest-sim-fact dd.is-down { color: var(--red-dark); }
.latest-sim-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 10px; }
@media (max-width: 700px) { .wizard-rail-title { display: none; } }


.wizard-simple-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  align-items: start;
  margin-top: 12px;
}
.wizard-simple-col { display: flex; flex-direction: column; min-width: 0; }
.wizard-simple-col-title { margin: 0 0 4px; font-size: 0.95rem; }
.wizard-simple-col-note { font-size: 0.82rem; margin: 0 0 8px; }
.wizard-simple-text { flex: 1; font-size: 0.9rem; }

.wizard-simple-tiles { max-height: 320px; overflow-y: auto; }
.wizard-simple-nav { margin-top: 16px; }
@media (max-width: 700px) {
  .wizard-simple-grid { grid-template-columns: 1fr; }
  .wizard-simple-tiles { max-height: none; }
}


.onboard-heading { margin-bottom: 8px; }
.onboard-lede { margin-bottom: 16px; }
.onboard-card { margin-bottom: 16px; }
.onboard-card-note { font-size: 14px; margin: 0 0 12px; }
.onboard-card-note-tight { font-size: 13px; margin: 0; }


.onboard-exit { font-size: 13px; margin: 16px 0 0; text-align: center; }


.wizard-layout { display: flex; min-height: calc(100vh - 57px); }
.wizard-sidebar {
  width: 280px; min-width: 280px;
  background: var(--bg-card);
  border-right: 1px solid var(--border);
  padding: 16px;
  display: flex; flex-direction: column; gap: 4px;
}
.sidebar-section { padding: 12px 0; border-bottom: 1px solid var(--border); }
.sidebar-label { font-size:0.75rem; color: var(--text-dim); text-transform: uppercase; letter-spacing: .05em; display: block; margin-bottom: 6px; font-family: 'Space Grotesk', sans-serif; font-weight: 600; }
.sidebar-actions { display: flex; gap: 8px; margin-top: auto; padding-top: 16px; border-bottom: none; }

.wizard-main {
  flex: 1;
  display: flex; flex-direction: column;
  padding: 20px 24px;
}
.wizard-editor-header {
  display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px;
}
.wizard-editor-header h2 { font-size: 1.1rem; }
.wizard-textarea {
  flex: 1; min-height: 300px;
  background: var(--bg); color: var(--text);
  border: 1px solid var(--border); border-radius: var(--radius-sm);
  padding: 16px; font-size:0.9rem; line-height: 1.6;
  font-family: 'DM Sans', sans-serif;
}


.source-list { display: flex; flex-direction: column; gap: 2px; }
.source-item {
  display: flex; align-items: center; gap: 6px;
  padding: 6px 10px; border-radius: var(--radius-sm);
  font-size:0.85rem;
  cursor: pointer; transition: all .15s;
}
.source-item:hover { background: var(--bg-hover); }
.source-item.active { background: var(--accent); color: #fff; }
.source-item.loading { opacity: .7; }
.source-icon { font-size: 1rem; width: 20px; text-align: center; }
.source-name { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.source-status { font-size:0.75rem; }


.md-content { font-size:0.9rem; line-height: 1.7; color: var(--text-dim); }
.md-content h1, .md-content h2, .md-content h3 { color: var(--text); margin: 16px 0 8px; font-family: 'Space Grotesk', sans-serif; }
.md-content p { margin-bottom: 8px; }
.md-content ul, .md-content ol { margin-left: 20px; margin-bottom: 8px; }


.header-right { display: flex; gap: 8px; align-items: center; }
.header-right a { text-decoration: none; }


.section-label {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 600; font-size:0.8rem;
  text-transform: uppercase; letter-spacing: .15em;
  color: var(--accent); margin-bottom: 8px;
}
.section-heading {
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 700; letter-spacing: -0.02em;
  margin-bottom: 40px; max-width: 600px;
}


.profile-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; margin-top: 12px; }


.profile-identity {
  display: grid;
  grid-template-columns: minmax(150px, auto) minmax(240px, 1fr);
  gap: 12px;
  margin-top: 12px;
}
.profile-identity > .profile-field-full { grid-column: 1 / -1; }
.profile-identity .profile-field-value { overflow-wrap: anywhere; }
@media (max-width: 600px) {
  .profile-identity { grid-template-columns: minmax(0, 1fr); }
}
.tier-current { font-size:0.95rem; color: var(--text-dim); }

.profile-plan-status { margin-bottom: 12px; }
.profile-plan-subscribe { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-bottom: 12px; }
.data-table { border-collapse: collapse; }
.data-table td { padding: 6px 12px; border-bottom: 1px solid var(--border); font-size:0.9rem; }


.data-table { --col-sticky-1-w: 16rem; --col-sticky-2-w: 10rem; }

.row-pin-link { display: block; color: inherit; text-decoration: none; }
@media (min-width: 769px) {
  
  .data-table .row-pin-link { overflow: hidden; text-overflow: ellipsis; }
  .data-table .col-sticky-left,
  .data-table .col-sticky-left-2 {
    position: sticky;
    z-index: 1;
    background: var(--row-bg, var(--bg));
    overflow: hidden;
    text-overflow: ellipsis;
  }
  
  .data-table thead .col-sticky-left,
  .data-table thead .col-sticky-left-2 { z-index: 3; }
  .data-table .col-sticky-left {
    left: 0;
    width: var(--col-sticky-1-w);
    max-width: var(--col-sticky-1-w);
  }
  .data-table .col-sticky-left-2 {
    left: var(--col-sticky-1-w);
    width: var(--col-sticky-2-w);
    max-width: var(--col-sticky-2-w);
  }
  
  .data-table .col-sticky-left-2::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 1px;
    background: var(--border-strong);
  }
}


.data-table tr.row-suspended {
  --row-bg: color-mix(in srgb, #dc3545 8%, var(--bg));
  background: var(--row-bg);
}


.users-table-region {
  overflow: auto;
  
  min-height: 240px;
}


@media (min-width: 901px) {
  
  body.sd-app-shell { overflow: hidden; }
  body.sd-app-shell #app {
    height: 100dvh;
    display: flex;
    flex-direction: column;
  }
  
  body.sd-app-shell > #app > .header { flex: 0 0 auto; }
  
  body.sd-app-shell > #app > .site-footer { display: none; }
  body.sd-app-shell .admin-frame {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
  }
  body.sd-app-shell .admin-layout {
    flex: 1 1 auto;
    min-height: 0;
    align-items: stretch;
  }
  
  body.sd-app-shell .admin-rail { min-height: 0; overflow-y: auto; overflow-x: clip; }
  
  body.sd-app-shell .admin-main { min-height: 0; overflow-y: auto; overflow-x: clip; }
  
  body.sd-app-shell .admin-main > * { flex: 0 0 auto; }
  body.sd-app-shell .admin-main > .users-table-region { flex: 1 1 auto; }
}


@media (min-width: 901px) {
  .users-stats.stat-tile-grid { gap: .5rem; margin-bottom: .75rem; }
  .users-stats .stat-tile { padding: .5rem .75rem; gap: 0; }
  .users-stats .stat-tile-label { font-size: .75rem; }
  .users-stats .stat-tile-value { font-size: 1.15rem; line-height: 1.3; }
  .users-stats .stat-tile-sub { font-size: .7rem; line-height: 1.3; }
}

.users-table-region .users-table { width: 100%; white-space: nowrap; }
.users-table-region .data-table th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: var(--bg);
}

.users-table-region .data-table thead .col-sticky-left,
.users-table-region .data-table thead .col-sticky-left-2 { z-index: 3; }
.users-table-region .data-table th::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 2px;
  background: var(--border);
}


.users-filters { display: flex; gap: 0.5rem; margin-bottom: 1rem; flex-wrap: wrap; }
.users-filters-search { flex: 1; min-width: 200px; }
.users-filter-select { width: auto; }
.users-scope-all-note { margin: -0.5rem 0 1rem; font-size: 0.8rem; }
.users-match-count { margin: -0.5rem 0 1rem; font-size: 0.8rem; }
.tag-suspended { background: var(--red, #dc3545); color: white; margin-right: 0.4rem; }

.tag-internal { background: var(--bg-inset); color: var(--text-dim); font-weight: 600; margin-right: 0.4rem; }

.admin-measurement-card { padding: 1rem; margin-bottom: 1rem; }
.admin-measurement-card h3 { margin-top: 0; }
.admin-measurement-toggle { display: flex; gap: 0.5rem; align-items: center; }
.users-row-actions { white-space: nowrap; }
.users-row-actions .btn + .btn { margin-left: 0.25rem; }
.admin-pager { margin-top: 1rem; display: flex; gap: 0.5rem; align-items: center; }



.pricing-page { max-width: 1040px; margin: 0 auto; padding: 60px 24px 80px; }
.pricing-head { text-align: center; }
.pricing-page .section-heading { text-align: center; margin: 0 auto 12px; }
.pricing-subtitle { text-align: center; color: var(--text-dim); font-size: 1.1rem; max-width: 560px; margin: 0 auto 28px; }

.pricing-plan {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 380px);
  grid-template-areas: "includes panel";
  gap: 40px;
  align-items: start;
  margin-top: 32px;
}
.pricing-panel { grid-area: panel; }
.pricing-includes { grid-area: includes; }


.pricing-panel {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 24px;
  box-shadow: var(--shadow-lg);
}
.pricing-panel.current { border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent), var(--shadow-lg); }
.pricing-panel-body { display: flex; flex-direction: column; }


.pricing-card-skeleton { gap: 14px; }
.pricing-includes-skeleton { margin-top: 8px; }

.pricing-price {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700; font-size: 3rem;
  color: var(--text); letter-spacing: -0.03em;
  line-height: 1.05;
}
.pricing-price-unit { font-size: 1rem; font-weight: 500; color: var(--text-dim); letter-spacing: 0; }

.pricing-price-was { font-size: 0.55em; font-weight: 600; margin-right: 4px; }
.pricing-terms { font-size: 0.875rem; color: var(--text-dim); margin: 6px 0 20px; line-height: 1.45; }


.pricing-cta { width: 100%; justify-content: center; text-align: center; min-height: 44px; font-size: 1rem; }
.pricing-reassure { font-size: 0.8125rem; text-align: center; margin: 10px 0 0; }


.pricing-includes-title {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 1.25rem; margin: 4px 0 16px;
}

.pricing-groups { display: flex; flex-direction: column; gap: 18px; }
.pricing-group-label {
  font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em;
  color: var(--accent); margin: 0 0 6px;
}
.pricing-features { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.pricing-feature {
  display: flex; align-items: flex-start; gap: 8px;
  padding: 6px 0; font-size: 0.9375rem; color: var(--text);
  line-height: 1.4;
}
.pricing-feature-icon { flex-shrink: 0; font-size: 0.85rem; margin-top: 2px; }
.pricing-feature-icon.check { color: var(--green); }
.pricing-feature-icon.dash { color: var(--text-muted); }


.pricing-allowance-note {
  font-size: 0.875rem; margin: 20px 0 0;
  padding-top: 16px; border-top: 1px solid var(--border);
}


.pricing-top-up {
  display: flex; align-items: center; justify-content: space-between; gap: 24px;
  margin-top: 48px; padding: 20px 24px;
  background: var(--bg-inset); border-radius: var(--radius-lg);
}
.pricing-top-up-title { font-size: 1rem; margin: 0 0 4px; }
.pricing-top-up-name { color: var(--accent); }
.pricing-top-up-note { font-size: 0.875rem; margin: 0; max-width: 620px; }
.pricing-top-up-side { flex-shrink: 0; text-align: right; }
.pricing-top-up-price { font-weight: 700; font-size: 1rem; margin-bottom: 6px; }
.pricing-top-up-who { font-size: 0.8125rem; margin: 0; }


.pricing-questions {
  display: flex; flex-wrap: wrap; justify-content: center; align-items: center;
  gap: 6px 20px; margin-top: 32px; font-size: 0.9rem;
}
.pricing-questions-label { font-weight: 700; }

@media (max-width: 899px) {
  .pricing-plan { grid-template-columns: minmax(0, 1fr); grid-template-areas: "panel" "includes"; gap: 28px; }
  .pricing-panel { width: 100%; max-width: 480px; justify-self: center; }
}
@media (max-width: 600px) {
  .pricing-page { padding: 40px 16px 60px; }
  .pricing-top-up { flex-direction: column; align-items: stretch; }
  .pricing-top-up-side { text-align: left; }
}




.landing { overflow-x: hidden; overflow-x: clip; }


.landing-hero {
  min-height: calc(100vh - 60px);
  display: flex; align-items: center; justify-content: center;
  padding: 80px 40px;
  position: relative;
}

.hero-stack {
  position: relative;
  max-width: 900px; width: 100%;
}

.hero-accent-rect {
  position: absolute;
  top: -30px; right: -40px;
  width: 360px; height: 200px;
  background: var(--accent);
  border-radius: 16px;
  transform: rotate(3deg);
  z-index: 1;
  box-shadow: var(--shadow-lg);
}

.hero-accent-rect-2 {
  position: absolute;
  bottom: -20px; left: -30px;
  width: 200px; height: 140px;
  background: var(--accent-light);
  border-radius: 12px;
  transform: rotate(-5deg);
  z-index: 1;
  opacity: 0.6;
  box-shadow: var(--shadow);
}

.hero-dark-card {
  position: relative; z-index: 3;
  background: #181a20 !important;
  border-radius: 20px;
  padding: 60px 56px;
  box-shadow: var(--shadow-dark);
  transform: rotate(-1.5deg);
}

.hero-dark-card h1 {
  color: #fff !important;
  font-size: clamp(2.5rem, 6vw, 4.5rem);
  font-weight: 700;
  letter-spacing: -0.03em;
}

.hero-dark-card h1 span { color: var(--accent); }

.hero-white-card {
  position: relative; z-index: 4;
  background: var(--bg-card);
  border-radius: 16px;
  padding: 32px 40px;
  margin-top: -20px;
  margin-left: 40px;
  margin-right: -20px;
  box-shadow: var(--shadow-lg);
  transform: rotate(0.5deg);
}

.hero-white-card p {
  font-size: 1.15rem;
  color: var(--text-dim);
  line-height: 1.7;
  max-width: 560px;
}

.hero-actions { display: flex; gap: 16px; margin-top: 24px; flex-wrap: wrap; }

.hero-btn-secondary {
  display: inline-flex; align-items: center; gap: 8px;
  background: transparent; color: var(--charcoal);
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 600; font-size: 1rem;
  padding: 12px 24px; border-radius: 10px;
  text-decoration: none;
  border: 2px solid var(--border);
  cursor: pointer;
  transition: transform .2s, border-color .2s, box-shadow .2s;
}
.hero-btn-secondary:hover { border-color: var(--charcoal); transform: translateY(-2px); box-shadow: var(--shadow); }

.hero-badge {
  position: absolute;
  top: -50px; left: 50px; z-index: 5;
  background: var(--bg-card);
  border-radius: 50px;
  padding: 10px 20px;
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 600; font-size: 0.85rem;
  box-shadow: var(--shadow-lg);
  transform: rotate(-4deg);
  color: var(--charcoal);
}

.hero-badge::before {
  content: '';
  display: inline-block;
  width: 8px; height: 8px;
  background: var(--green);
  border-radius: 50%;
  margin-right: 8px;
  animation: pulse-dot 2s infinite;
}

@keyframes pulse-dot {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.4; }
}


.landing-features {
  padding: 80px 40px 100px;
  max-width: 1200px; margin: 0 auto;
}

.landing-features-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  position: relative;
  min-height: 700px;
}

.landing-feature-card {
  position: relative;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 36px 32px;
  box-shadow: var(--shadow-lg);
  transition: transform .4s cubic-bezier(0.22, 1, 0.36, 1), box-shadow .4s ease;
  cursor: default;
}

.landing-feature-card:hover {
  transform: translateY(-8px) rotate(0deg) !important;
  box-shadow: var(--shadow-xl);
  z-index: 10 !important;
}

.landing-feature-card:nth-child(1) { transform: rotate(-2deg); z-index: 6; margin-right: -10px; margin-bottom: -20px; }
.landing-feature-card:nth-child(2) { transform: rotate(1.5deg); z-index: 5; margin-top: 30px; margin-left: -10px; margin-right: -10px; }
.landing-feature-card:nth-child(3) { transform: rotate(-1deg); z-index: 4; margin-top: 10px; margin-left: -10px; }
.landing-feature-card:nth-child(4) { transform: rotate(1deg); z-index: 3; margin-right: -10px; margin-top: -20px; }
.landing-feature-card:nth-child(5) { transform: rotate(-1.8deg); z-index: 7; margin-left: -10px; margin-right: -10px; margin-top: -10px; }
.landing-feature-card:nth-child(6) { transform: rotate(2deg); z-index: 2; margin-left: -10px; margin-top: -30px; }

.landing-feature-card.dark {
  background: var(--charcoal);
  color: #fff;
  border-color: var(--charcoal-light);
}
.landing-feature-card.dark .feature-desc { color: #9ca3af; }
.landing-feature-card.dark .feature-number { color: var(--accent); }

.feature-icon {
  width: 52px; height: 52px;
  border-radius: 14px;
  display: flex; align-items: center; justify-content: center;
  font-size: 24px;
  margin-bottom: 20px;
  background: var(--accent-bg);
  color: var(--accent);
  box-shadow: var(--shadow-sm);
}
.landing-feature-card.dark .feature-icon { background: rgba(249, 115, 22, 0.15); }

.feature-number {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700; font-size:0.75rem;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: .1em;
  margin-bottom: 10px;
}
.feature-title { font-size: 1.35rem; font-weight: 700; margin-bottom: 10px; letter-spacing: -0.01em; }
.feature-desc { font-size:0.95rem; color: var(--text-dim); line-height: 1.65; }


.landing-stats {
  padding: 60px 40px 100px;
  max-width: 1200px; margin: 0 auto;
  text-align: center;
}

.landing-stats-row {
  display: flex; justify-content: center; gap: 20px; flex-wrap: wrap;
}

.landing-stat-card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 28px 36px;
  box-shadow: var(--shadow-lg);
  text-align: center;
  transition: transform .4s cubic-bezier(0.22, 1, 0.36, 1), box-shadow .3s;
  flex: 0 0 auto; min-width: 170px;
}
.landing-stat-card:hover { transform: translateY(-6px) rotate(0deg) !important; box-shadow: var(--shadow-xl); z-index: 5; }
.landing-stat-card:nth-child(1) { transform: rotate(-3deg) translateY(10px); }
.landing-stat-card:nth-child(2) { transform: rotate(1.5deg) translateY(-8px); background: var(--charcoal); color: #fff; border-color: var(--charcoal-light); }
.landing-stat-card:nth-child(3) { transform: rotate(-1deg) translateY(5px); }
.landing-stat-card:nth-child(4) { transform: rotate(2.5deg) translateY(-12px); }

.stat-number {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 2.5rem; font-weight: 700;
  letter-spacing: -0.03em;
  color: var(--accent); line-height: 1; margin-bottom: 6px;
}
.landing-stat-card:nth-child(2) .stat-number { color: var(--accent-light); }

.stat-label { font-size:0.85rem; font-weight: 500; color: var(--text-dim); }
.landing-stat-card:nth-child(2) .stat-label { color: #9ca3af; }


.landing-marquee {
  padding: 40px 0; overflow: hidden;
}

.marquee-track {
  display: flex; width: max-content;
  animation: marquee-scroll 30s linear infinite;
}
.marquee-track:hover { animation-play-state: paused; }

.marquee-content {
  display: flex; align-items: center;
  flex-shrink: 0;
}

.marquee-item {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 1.4rem; font-weight: 700;
  color: var(--charcoal);
  white-space: nowrap;
  padding: 14px 24px;
  opacity: 0.2;
  transition: opacity .3s;
}
.marquee-item:hover { opacity: 1; }

.marquee-dot {
  width: 8px; height: 8px;
  background: var(--accent);
  border-radius: 50%;
  flex-shrink: 0;
}

@keyframes marquee-scroll {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}


.landing-how {
  padding: 80px 40px;
  max-width: 1100px; margin: 0 auto;
}

.hiw-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 40px; margin-top: 50px;
  position: relative;
}

.hiw-cards::before {
  content: '';
  position: absolute; top: 32px; left: 15%; right: 15%;
  height: 3px;
  background: linear-gradient(90deg, var(--accent), var(--accent-light), var(--accent));
  border-radius: 2px; z-index: 0; opacity: 0.3;
}

.hiw-card { position: relative; z-index: 1; text-align: center; }

.hiw-num {
  width: 64px; height: 64px;
  border-radius: 16px;
  background: var(--charcoal); color: var(--accent);
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700; font-size: 1.5rem;
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto 24px;
  box-shadow: var(--shadow-dark);
  transition: transform .3s;
}
.hiw-card:nth-child(1) .hiw-num { transform: rotate(-4deg); }
.hiw-card:nth-child(2) .hiw-num { transform: rotate(2deg); }
.hiw-card:nth-child(3) .hiw-num { transform: rotate(-3deg); }
.hiw-card:hover .hiw-num { transform: rotate(0deg) scale(1.1); }

.hiw-body {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 32px 24px;
  box-shadow: var(--shadow-lg);
  transition: transform .3s, box-shadow .3s;
}
.hiw-card:nth-child(1) .hiw-body { transform: rotate(1deg); }
.hiw-card:nth-child(2) .hiw-body { transform: rotate(-0.8deg); }
.hiw-card:nth-child(3) .hiw-body { transform: rotate(1.5deg); }
.hiw-card:hover .hiw-body { transform: rotate(0deg) translateY(-4px); box-shadow: var(--shadow-xl); }

.hiw-title { font-size: 1.15rem; font-weight: 700; margin-bottom: 8px; }
.hiw-desc { font-size:0.92rem; color: var(--text-dim); line-height: 1.65; }


.landing-cta {
  padding: 60px 40px 100px;
  max-width: 900px; margin: 0 auto;
  position: relative;
}

.cta-bg-card {
  position: absolute;
  top: 50px; left: 20px; right: 60px; bottom: 70px;
  background: var(--accent);
  border-radius: 24px;
  transform: rotate(2deg);
  box-shadow: var(--shadow-lg);
}

.cta-card {
  position: relative; z-index: 2;
  background: var(--charcoal);
  border-radius: 24px;
  padding: 72px 56px;
  text-align: center;
  box-shadow: var(--shadow-dark);
  transform: rotate(-1deg);
  transition: transform .4s;
}
.cta-card:hover { transform: rotate(0deg); }

.cta-card h2 {
  color: #fff;
  font-size: clamp(2rem, 4vw, 2.8rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  margin-bottom: 16px;
}
.cta-card h2 span { color: var(--accent); }
.cta-card p { color: #9ca3af; font-size: 1.1rem; max-width: 480px; margin: 0 auto 32px; line-height: 1.7; }


.reveal {
  opacity: 0;
  transition: opacity .8s cubic-bezier(0.22, 1, 0.36, 1), transform .8s cubic-bezier(0.22, 1, 0.36, 1);
}
.reveal.from-left { transform: translateX(-60px) rotate(4deg); }
.reveal.from-right { transform: translateX(60px) rotate(-4deg); }
.reveal.from-bottom { transform: translateY(60px) rotate(2deg); }
.reveal.from-bottom-alt { transform: translateY(60px) rotate(-2deg); }
.reveal.from-scale { transform: scale(0.85) rotate(-1deg); }
.reveal.visible { opacity: 1; transform: none; }


.landing-feature-card.reveal.visible:nth-child(1) { transform: rotate(-2deg); }
.landing-feature-card.reveal.visible:nth-child(2) { transform: rotate(1.5deg); }
.landing-feature-card.reveal.visible:nth-child(3) { transform: rotate(-1deg); }
.landing-feature-card.reveal.visible:nth-child(4) { transform: rotate(1deg); }
.landing-feature-card.reveal.visible:nth-child(5) { transform: rotate(-1.8deg); }
.landing-feature-card.reveal.visible:nth-child(6) { transform: rotate(2deg); }

.landing-stat-card.reveal.visible:nth-child(1) { transform: rotate(-3deg) translateY(10px); }
.landing-stat-card.reveal.visible:nth-child(2) { transform: rotate(1.5deg) translateY(-8px); }
.landing-stat-card.reveal.visible:nth-child(3) { transform: rotate(-1deg) translateY(5px); }
.landing-stat-card.reveal.visible:nth-child(4) { transform: rotate(2.5deg) translateY(-12px); }




@media (max-width: 1024px) {
  .metrics-row { gap: 8px; }
  .metric-card { min-width: 120px; padding: 10px 14px; }
  .page-content { padding: 16px; }
  .wizard-sidebar { width: 240px; min-width: 240px; }

  .landing-features-grid {
    grid-template-columns: 1fr 1fr;
    min-height: auto; gap: 16px;
  }
  .landing-feature-card:nth-child(1),
  .landing-feature-card:nth-child(2),
  .landing-feature-card:nth-child(3),
  .landing-feature-card:nth-child(4),
  .landing-feature-card:nth-child(5),
  .landing-feature-card:nth-child(6) { margin: 0; }
  .landing-feature-card:nth-child(odd) { transform: rotate(-1deg); }
  .landing-feature-card:nth-child(even) { transform: rotate(1deg); }
  .landing-feature-card.reveal.visible:nth-child(odd) { transform: rotate(-1deg); }
  .landing-feature-card.reveal.visible:nth-child(even) { transform: rotate(1deg); }

  .hiw-cards { grid-template-columns: 1fr; gap: 30px; }
  .hiw-cards::before { display: none; }
}


@media (max-width: 768px) {
  .header { padding: max(10px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) 10px max(12px, env(safe-area-inset-left)); flex-wrap: wrap; gap: 8px; }
  .header h1 { font-size: 1rem; }
  
  .header-left { flex: 1 1 0; min-width: 0; gap: 8px; }
  .header-left h1 { min-width: 0; }
  .header-left h1 .btn-bare {
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .header-right { flex: 0 0 auto; gap: 4px; }
  .header-right .btn-sm { padding: 4px 8px; font-size:0.75rem; }

  .page-content { padding: 12px; }
  .detail-view { padding: 0 12px 24px; }

  
  .detail-header { flex-wrap: wrap; gap: 12px; padding: 16px 0; }
  .detail-header .detail-title { order: 3; flex-basis: 100%; }
  .detail-header-actions { flex-shrink: 1; }
  
  
  .symbol-menu-dropdown { max-width: calc(100vw - 24px);
                          min-width: min(230px, calc(100vw - 24px)); }

  .filters { padding: 12px; gap: 8px; }
  .filter-group select, .filter-group input { min-width: 100px; font-size:0.8rem; }

  .strategies-grid { grid-template-columns: 1fr; }
  .strategy-card:nth-child(3n+1),
  .strategy-card:nth-child(3n+2),
  .strategy-card:nth-child(3n+3) { transform: none; }

  .params-grid { grid-template-columns: 1fr; }
  .metrics-row { flex-direction: column; }
  .metric-card { min-width: auto; }

  .wizard-layout { flex-direction: column; }
  .wizard-sidebar { width: 100%; min-width: auto; border-right: none; border-bottom: 1px solid var(--border); }
  .sidebar-actions { margin-top: 8px; }
  .wizard-textarea { min-height: 200px; }

  .holdings-grid { grid-template-columns: repeat(2, 1fr); }
  .financial-grid { grid-template-columns: repeat(2, 1fr); }
  .params-display { grid-template-columns: 1fr; }

  .connection-item { flex-direction: column; align-items: flex-start; gap: 8px; }

  .stock-table { font-size:0.75rem; }
  .stock-table th, .stock-table td { padding: 6px 8px; }

  .modal-card { width: 95%; }

  
  .landing-hero { padding: 60px 20px; }
  .hero-accent-rect { width: 180px; height: 120px; right: -15px; top: -15px; }
  .hero-accent-rect-2 { width: 120px; height: 90px; left: -10px; bottom: -10px; }
  .hero-dark-card { padding: 36px 28px; transform: rotate(-0.5deg); }
  .hero-white-card { margin-left: 10px; margin-right: 0; padding: 24px; }
  .hero-badge { left: 20px; top: -40px; font-size:0.75rem; padding: 8px 14px; }

  .landing-features, .landing-stats, .landing-how, .landing-cta { padding-left: 20px; padding-right: 20px; }

  .landing-features-grid { grid-template-columns: 1fr; }
  .landing-feature-card:nth-child(odd),
  .landing-feature-card:nth-child(even) { transform: none; }
  .landing-feature-card.reveal.visible:nth-child(odd),
  .landing-feature-card.reveal.visible:nth-child(even) { transform: none; }

  .landing-stats-row { flex-direction: column; align-items: center; }
  .landing-stat-card { min-width: 240px; }
  .landing-stat-card:nth-child(1),
  .landing-stat-card:nth-child(2),
  .landing-stat-card:nth-child(3),
  .landing-stat-card:nth-child(4) { transform: none; }
  .landing-stat-card.reveal.visible:nth-child(1),
  .landing-stat-card.reveal.visible:nth-child(2),
  .landing-stat-card.reveal.visible:nth-child(3),
  .landing-stat-card.reveal.visible:nth-child(4) { transform: none; }

  .cta-bg-card { left: 10px; right: 30px; top: 40px; bottom: 60px; }
  .cta-card { padding: 48px 28px; transform: rotate(0deg); }

  .marquee-item { font-size: 1.1rem; }
}




.modal-box {
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: var(--radius-lg); padding: 28px 32px;
  width: 90%; max-width: 480px; max-height: 90vh; overflow-y: auto;
  box-shadow: var(--shadow-xl);
}
.modal-box h3 { margin-bottom: 16px; }
.modal-box .form-group { margin-bottom: 12px; }
.modal-box .form-group label { display: block; font-size:0.85rem; color: var(--text-dim); margin-bottom: 4px; }
.modal-box .input-range { width: 80%; vertical-align: middle; }

.sim-summary {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 12px; margin-bottom: 20px;
}
.sim-card {
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: var(--radius); padding: 16px;
  text-align: center; box-shadow: var(--shadow-sm);
}
.sim-card.positive { border-left: 3px solid var(--green); }
.sim-card.negative { border-left: 3px solid var(--red); }
.sim-card.neutral { border-left: 3px solid var(--text-muted); }
.sim-card-label { font-size:0.75rem; color: var(--text-dim); text-transform: uppercase; letter-spacing: .05em; margin-bottom: 4px; }
.sim-card-value {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700; font-size: 1.3rem;
}
.sim-card.positive .sim-card-value { color: var(--green); }
.sim-card.negative .sim-card-value { color: var(--red); }


.sim-warnings {
  margin-top: 8px; padding: 10px 12px;
  border-left: 3px solid var(--yellow);
  background: color-mix(in srgb, var(--yellow) 12%, transparent);
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  font-size:0.8rem; color: var(--text);
}
.sim-warnings-item { display: flex; gap: 8px; align-items: flex-start; }
.sim-warnings-item + .sim-warnings-item { margin-top: 6px; }

.sim-warnings-more {
  position: relative;
  padding: 0 0 0 4px;
  border: 0; background: none;
  color: var(--accent); font: inherit; font-weight: 600;
  cursor: pointer;
}
.sim-warnings-more::after {
  content: "";
  position: absolute;
  left: 0; right: 0; top: 50%;
  height: var(--sd-tap);
  transform: translateY(-50%);
}

.sim-warnings-modal { font-size: 0.9rem; cursor: auto; }
.sim-warnings-modal p { margin: 0 0 12px; line-height: 1.5; }
.sim-warnings-modal-actions { display: flex; justify-content: flex-end; }

.table-scroll { overflow-x: auto; }
.data-table th {
  padding: 8px 12px; text-align: left; font-size:0.8rem;
  color: var(--text-dim); border-bottom: 2px solid var(--border);
  white-space: nowrap;
}
.tag-buy { background: var(--fit); color: var(--fit-text); padding: 2px 8px; border-radius: 4px; font-size:0.8rem; font-weight: 600; }
.tag-sell { background: var(--poor-fit); color: var(--poor-fit-text); padding: 2px 8px; border-radius: 4px; font-size:0.8rem; font-weight: 600; }

.sim-step-detail {
  margin-top: 16px; padding: 16px;
  background: var(--bg-inset); border-radius: var(--radius);
  border: 1px solid var(--border);
}
.expandable-header {
  display: flex; align-items: center; gap: 6px;
  cursor: pointer; padding: 6px 0;
  user-select: none;
}
.expandable-header:hover { opacity: 0.8; }
.expand-arrow { font-size:0.7rem; color: var(--text-dim); width: 12px; }

@media (max-width: 768px) {
  .sim-summary { grid-template-columns: repeat(2, 1fr); }
  .modal-box { width: 95%; padding: 20px; }
}


.dash-overview h2 { margin-bottom: 16px; }



.dash-highlights {
  border-left: 3px solid var(--accent);
}
.dash-highlights-header {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 12px;
}
.dash-highlights-header h3 { margin-bottom: 0; }
.dash-hl-actions { display: flex; gap: 8px; align-items: center; }
.hl-hist-entry { padding: 14px 20px; }
.hl-hist-header {
  display: flex; align-items: center; gap: 10px; cursor: pointer;
  font-weight: 500; font-size:0.9rem; user-select: none;
}
.hl-hist-header:hover { color: var(--accent); }
.hl-hist-arrow {
  font-size:0.65rem; transition: transform .15s; color: var(--text-dim);
  display: inline-block; width: 12px;
}
.hl-hist-arrow.open { transform: rotate(90deg); }
.dash-hl-content { line-height: 1.65; font-size:0.9rem; }

.dash-hl-stale {
  font-size: 0.8rem;
  color: var(--text-dim);
  background: var(--surface-2, rgba(127,127,127,0.08));
  border: 1px solid var(--border, rgba(127,127,127,0.2));
  border-radius: 6px;
  padding: 6px 10px;
  margin: 0 0 12px;
}
.dash-hl-stale a { color: var(--accent); text-decoration: none; font-weight: 600; }
.dash-hl-stale a:hover { text-decoration: underline; }

.dash-hl-title { font-size: 1.05rem; font-weight: 700; margin: 0 0 12px; color: var(--text); line-height: 1.3; }
.dash-hl-content h3 { font-size:0.95rem; margin: 16px 0 6px; color: var(--accent); }
.dash-hl-content h3:first-child { margin-top: 0; }
.dash-hl-content ul { margin: 4px 0 12px 18px; }
.dash-hl-content li { margin-bottom: 4px; }
.dash-hl-content p { margin-bottom: 8px; }
.dash-hl-content strong { color: var(--text); }

.dash-hl-content hr { display: none; }
.hl-ticker-link { color: inherit; text-decoration: none; cursor: pointer; }
.hl-ticker-link:hover strong { color: var(--accent); }
.dash-hl-meta { margin-top: 12px; font-size:0.75rem; text-align: right; }
.dash-hl-placeholder { font-size:0.9rem; line-height: 1.5; padding: 8px 0; }

.dash-getting-started-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.dash-hl-error { color: var(--red); font-size:0.9rem; padding: 8px 0; }
.dash-hl-generating {
  display: flex; align-items: center; gap: 12px;
  padding: 16px 0; font-size:0.9rem; color: var(--text-dim);
}

.dash-hl-progress {
  flex: 1; min-width: 0; height: 8px; border-radius: 4px;
  background: var(--border); overflow: hidden;
}
.dash-hl-progress-fill {
  height: 100%; background: var(--accent); border-radius: 4px;
  transition: width 0.4s ease;
}


.dash-newsletter-latest {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 8px 0; cursor: pointer;
}
.dash-newsletter-latest:hover .dash-nl-title { color: var(--accent); }
.dash-nl-title { font-weight: 600; font-size:0.9rem; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }


.stored-report-card { padding: 24px; }
.newsletter-web { color: var(--text); font-size:0.9rem; line-height: 1.6; }

.newsletter-web a { color: var(--accent); }
.newsletter-web h1, .newsletter-web h2, .newsletter-web h3 { color: var(--text); }
.newsletter-web table { max-width: 100%; }
.newsletter-web img { max-width: 100%; height: auto; }
.newsletter-web hr { display: none; }


.dash-section {
  margin-bottom: 24px; padding: 20px;
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: var(--radius);
}
.dash-section h3 {
  font-size: 1rem; font-weight: 600; margin-bottom: 12px;
  display: flex; align-items: center; gap: 8px;
}
.dash-empty p { color: var(--text-dim); font-size:0.9rem; }
.dash-sub-label {
  font-size:0.75rem; font-weight: 600; text-transform: uppercase;
  color: var(--text-dim); margin-bottom: 6px; letter-spacing: .03em;
}


.dash-agg-row {
  display: flex; gap: 24px; flex-wrap: wrap; margin-bottom: 16px;
  padding: 12px 16px; background: var(--bg-inset); border-radius: var(--radius-sm);
}
.dash-stat { display: flex; flex-direction: column; gap: 2px; }
.dash-stat-label { font-size:0.75rem; color: var(--text-dim); text-transform: uppercase; letter-spacing: .03em; }
.dash-stat-value { font-size: 1.15rem; font-weight: 600; font-family: 'Space Grotesk', sans-serif; }


.dash-cards {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 12px;
}


.dash-portfolio-header {
  display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px;
}
.dash-portfolio-header h3 { margin-bottom: 0; }
.dash-portfolio-sync { display: flex; align-items: center; gap: 10px; }


.dash-portfolio-card { cursor: pointer; padding: 14px; transition: box-shadow .15s; }
.dash-portfolio-card:hover { box-shadow: var(--shadow); }
.dash-portfolio-name { font-weight: 600; margin-bottom: 6px; }
.dash-portfolio-stats { display: flex; gap: 10px; align-items: baseline; font-size:0.9rem; flex-wrap: wrap; }
.dash-movers { margin-top: 6px; display: flex; gap: 8px; flex-wrap: wrap; }
.dash-mover { font-size:0.78rem; font-weight: 500; padding: 1px 6px; border-radius: 4px; }


.dash-strategy-card { cursor: pointer; padding: 14px; transition: box-shadow .15s; }
.dash-strategy-card:hover { box-shadow: var(--shadow); }
.dash-strategy-name { font-weight: 600; margin-bottom: 4px; }
.dash-strategy-meta { font-size:0.8rem; display: flex; gap: 8px; align-items: center; }
.dash-strategy-scan { margin-top: 6px; font-size:0.85rem; display: flex; flex-direction: column; gap: 4px; }
.dash-tag {
  font-size:0.7rem; padding: 1px 6px; border-radius: 3px;
  background: var(--accent-bg); color: var(--accent); font-weight: 600;
}


.dash-class-bar {
  display: flex; height: 5px; border-radius: 3px; overflow: hidden;
  background: var(--bg-inset); margin-top: 2px;
}
.dash-class-seg { min-width: 3px; }
.cls-fit { background: var(--green); }
.cls-poor-fit { background: var(--red); }
.cls-weak-fit { background: var(--yellow); }
.cls-other { background: var(--text-muted); }


.dash-class-pills { display: inline-flex; gap: 4px; }
.dash-class-pill {
  font-size:0.7rem; font-weight: 600; padding: 1px 5px;
  border-radius: 3px; color: #fff;
}
.dash-class-pill.cls-fit { background: var(--green); }
.dash-class-pill.cls-poor-fit { background: var(--red); }
.dash-class-pill.cls-weak-fit { background: var(--yellow); color: #854d0e; }
.dash-class-pill.cls-other { background: var(--text-muted); }


.dash-two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }

.dash-two-col--single { grid-template-columns: 1fr; }


.dash-decision-row {
  display: flex; align-items: center; gap: 8px; padding: 6px 0;
  border-bottom: 1px solid var(--border); cursor: pointer; font-size:0.85rem;
}
.dash-decision-row:last-child { border-bottom: none; }
.dash-decision-row:hover { background: var(--bg-hover); margin: 0 -8px; padding: 6px 8px; border-radius: 4px; }
.dash-decision-symbol { font-weight: 600; min-width: 50px; }
.dash-decision-type { font-size:0.7rem; font-weight: 600; padding: 1px 6px; border-radius: 3px; }
.dash-decision-price { font-size:0.8rem; color: var(--text-dim); white-space: nowrap; }
.dash-decision-return { font-weight: 600; min-width: 55px; text-align: right; }
.dash-decision-strat { font-size:0.75rem; margin-left: auto; }
.dtype-buy { background: var(--fit); color: var(--fit-text); }
.dtype-sell { background: var(--poor-fit); color: var(--poor-fit-text); }
.dtype-hold, .dtype-watch { background: var(--weak-fit); color: var(--weak-fit-text); }


.dash-badge {
  font-size:0.7rem; font-weight: 600; padding: 2px 7px;
  border-radius: 4px; margin-left: 2px;
}


.dash-scan-row {
  padding: 8px 0; border-bottom: 1px solid var(--border);
  cursor: pointer; font-size:0.85rem;
}
.dash-scan-row:last-child { border-bottom: none; }
.dash-scan-row:hover { background: var(--bg-hover); margin: 0 -8px; padding: 8px 8px; border-radius: 4px; }
.dash-scan-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 3px; }
.dash-scan-name { font-weight: 600; }
.dash-scan-stats { display: flex; gap: 10px; align-items: center; }


.dash-holding-row {
  display: flex; align-items: center; gap: 8px; padding: 5px 0;
  border-bottom: 1px solid var(--border); cursor: pointer; font-size:0.85rem;
}
.dash-holding-row:last-child { border-bottom: none; }
.dash-holding-row:hover { background: var(--bg-hover); margin: 0 -8px; padding: 5px 8px; border-radius: 4px; }
.dash-holding-sym { font-weight: 600; min-width: 50px; }
.dash-holding-co { min-width: 100px; font-size:0.8rem; }
.dash-holding-score { font-weight: 600; min-width: 35px; text-align: right; }
.dash-holding-class { font-size:0.7rem; font-weight: 600; padding: 1px 6px; border-radius: 3px; }


.dash-attention-item {
  display: flex; align-items: center; gap: 8px; padding: 8px 10px;
  border-left: 3px solid var(--yellow); margin-bottom: 6px;
  background: var(--bg-inset); border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  font-size:0.85rem; cursor: pointer;
}
.dash-attention-item:hover { background: var(--bg-hover); }
.attn-stale_score { border-left-color: var(--orange); }
.attn-old_decision { border-left-color: var(--yellow); }
.attn-interrupted_scan { border-left-color: var(--red); }
.dash-attn-icon { font-size: 1rem; }



.dash-activity-list {
  max-height: 320px;
  overflow-y: auto;
  padding-right: 12px;
  scrollbar-width: thin;
  scrollbar-color: var(--border-strong) transparent;
}
.dash-activity-list::-webkit-scrollbar { width: 8px; height: 8px; }
.dash-activity-list::-webkit-scrollbar-track { background: transparent; }
.dash-activity-list::-webkit-scrollbar-thumb {
  background: var(--border-strong);
  border-radius: 4px;
}
.dash-activity-list::-webkit-scrollbar-thumb:hover { background: var(--text-muted); }
.dash-activity-row {
  display: flex; align-items: center; gap: 8px; padding: 6px 0;
  border-bottom: 1px solid var(--border); font-size:0.85rem;
}
.dash-activity-row:last-child { border-bottom: none; }
.dash-activity-row.clickable { cursor: pointer; }
.dash-activity-row.clickable:hover { background: var(--bg-hover); margin: 0 -8px; padding: 6px 8px; border-radius: 4px; }
.dash-act-icon { font-size:0.95rem; width: 22px; text-align: center; }
.dash-act-desc { flex: 1; }
.dash-act-time { font-size:0.75rem; white-space: nowrap; min-width: 55px; text-align: right; }


.monitoring-stats-banner {
  display: flex; gap: 12px; margin-bottom: 16px; flex-wrap: wrap;
}
.monitoring-stats-banner .stat-card {
  flex: 1; min-width: 120px; padding: 12px 16px; border-radius: 8px;
  background: var(--bg-card); border: 1px solid var(--border); cursor: pointer;
  text-align: center; transition: border-color 0.15s;
}
.monitoring-stats-banner .stat-card:hover { border-color: var(--accent); }
.monitoring-stats-banner .stat-card .stat-value { font-size: 1.5rem; font-weight: 700; color: var(--text); }
.monitoring-stats-banner .stat-card .stat-label { font-size: 0.75rem; color: var(--text-dim); margin-top: 2px; }
.monitoring-stats-banner .stat-attention .stat-value { color: var(--orange); }

.row-caution { background: color-mix(in srgb, var(--yellow) 12%, transparent) !important; }
.row-invalidated { background: color-mix(in srgb, var(--red) 10%, transparent) !important; }
.row-exceeded { background: color-mix(in srgb, var(--green) 10%, transparent) !important; }

.rating-exceed { background: var(--fit); color: var(--fit-text); }

.btn-xs {
  padding: 2px 8px; font-size: 0.7rem; border-radius: 4px;
  border: 1px solid var(--border); background: var(--bg-card); color: var(--text);
  cursor: pointer; transition: background 0.15s;
}
.btn-xs:hover { background: var(--bg-hover); }
.btn-xs:disabled { opacity: 0.5; cursor: default; }

.input-sm { padding: 2px 6px; font-size: 0.75rem; height: 26px; }


@media (max-width: 768px) {
  .dash-two-col { grid-template-columns: 1fr; }
  .dash-agg-row { gap: 16px; }
  .dash-cards { grid-template-columns: 1fr; }
  .dash-decision-price { display: none; }
  .dash-holding-co { display: none; }
  .monitoring-stats-banner { gap: 8px; }
  .monitoring-stats-banner .stat-card { min-width: 90px; padding: 8px 12px; }
}



.dash-rail {
  position: absolute;
  right: 16px;
  width: 260px;
  z-index: 5;
  
  top: 84px;
}

@media (max-width: 1199px) {
  .dash-rail { width: 224px; }
}
@media (max-width: 900px) { .dash-rail { display: none; } }


.referral-vignette .ref-min-btn {
  position: absolute;
  top: 6px; right: 8px;
  width: 22px; height: 22px;
  padding: 0;
  border: none; background: transparent;
  color: var(--text-dim); cursor: pointer;
  font-size: 1.1rem; line-height: 1;
  border-radius: 4px;
  display: flex; align-items: center; justify-content: center;
}
.referral-vignette .ref-min-btn:hover {
  background: var(--bg-hover); color: var(--text);
}


.dash-rail.is-min {
  width: auto;
  max-width: none;
}
.ref-pill {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 12px 6px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 16px;
  color: var(--text);
  cursor: pointer;
  font-size:0.72rem; font-weight: 600; letter-spacing: .04em;
  box-shadow: var(--shadow-sm);
  font-family: inherit;
  writing-mode: vertical-rl;
  transform: rotate(180deg);
}
.ref-pill:hover {
  border-color: var(--accent);
  background: var(--bg-hover);
}
.ref-pill .ref-pill-icon {
  color: var(--accent);
  font-size:0.9rem;
  writing-mode: horizontal-tb;
  transform: rotate(180deg);
}



.referral-vignette-wrap {
  position: relative;
  padding: 10px 6px 6px 10px;  
}
.referral-vignette-wrap::before {
  
  content: '';
  position: absolute;
  top: -4px; right: -4px;
  width: 80px; height: 50px;
  background: var(--accent);
  border-radius: 10px;
  transform: rotate(6deg);
  z-index: 0;
  opacity: 0.18;
}
.referral-vignette {
  position: relative; z-index: 1;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 16px 18px;
  box-shadow: var(--shadow-sm, 0 2px 6px rgba(0,0,0,.05));
}

.referral-vignette .ref-eyebrow {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700; font-size:0.62rem;
  color: var(--text-dim);
  text-transform: uppercase; letter-spacing: .12em;
  margin-bottom: 4px;
}

.referral-vignette h4 {
  color: var(--text);
  margin: 0 0 8px 0;
  font-size: 1rem; font-weight: 600;
  letter-spacing: -0.01em; line-height: 1.25;
}
.referral-vignette h4 .accent-word { color: var(--accent); }

.referral-vignette p.ref-pitch {
  font-size:0.75rem; line-height: 1.5;
  color: var(--text-dim); margin: 0 0 12px;
}
.referral-vignette p.ref-pitch strong { color: var(--text); font-weight: 600; }

.referral-vignette .ref-link-row {
  display: flex; gap: 6px;
}
.referral-vignette input.ref-link {
  flex: 1; min-width: 0;
  padding: 6px 8px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm, 4px);
  background: var(--bg-inset);
  color: var(--text);
  font-family: ui-monospace, monospace;
  font-size:0.72rem;
}
.referral-vignette input.ref-link:focus {
  border-color: var(--accent);
}
.referral-vignette button.ref-copy {
  padding: 6px 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm, 4px);
  background: var(--bg-card);
  color: var(--text);
  cursor: pointer;
  font-size:0.73rem;
  font-weight: 600;
}
.referral-vignette button.ref-copy:hover {
  background: var(--bg-hover);
  border-color: var(--accent);
}


.referral-card-wrap {
  position: relative;
  margin-top: 20px;
  padding: 14px 12px 8px 14px;
}
.referral-card-wrap::before {
  content: '';
  position: absolute;
  top: -8px; right: 24px;
  width: 180px; height: 70px;
  background: var(--accent);
  border-radius: 12px;
  transform: rotate(-3deg);
  z-index: 0;
  opacity: 0.18;
}
.referral-card {
  position: relative; z-index: 1;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 22px 26px;
  box-shadow: var(--shadow-sm, 0 2px 6px rgba(0,0,0,.05));
}
.referral-card .ref-eyebrow {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700; font-size:0.68rem;
  color: var(--text-dim);
  text-transform: uppercase; letter-spacing: .14em;
  margin-bottom: 6px;
}
.referral-card h3 {
  margin: 0 0 10px 0;
  font-size: 1.25rem; font-weight: 700;
  letter-spacing: -0.01em;
}
.referral-card h3 .accent-word { color: var(--accent); }
.referral-card .ref-pitch {
  margin: 0 0 16px 0;
  font-size:0.9rem;
  color: var(--text-dim);
  line-height: 1.6;
}
.referral-card .ref-pitch strong { color: var(--text); font-weight: 600; }
.referral-card .ref-link-row { display: flex; gap: 8px; }
.referral-card input.ref-link {
  flex: 1; min-width: 0;
  padding: 9px 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm, 4px);
  background: var(--bg-inset);
  color: var(--text);
  font-family: ui-monospace, monospace;
  font-size:0.85rem;
}
.referral-card input.ref-link:focus {
  border-color: var(--accent);
}
.referral-card button.ref-copy {
  padding: 9px 18px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm, 4px);
  background: var(--bg-card);
  color: var(--text);
  cursor: pointer;
  font-size:0.85rem;
  font-weight: 600;
}
.referral-card button.ref-copy:hover {
  background: var(--bg-hover);
  border-color: var(--accent);
}

@media (max-width: 720px) {
  .referral-card-wrap::before { width: 120px; height: 60px; right: 8px; }
  .referral-card .ref-link-row { flex-direction: column; }
  .referral-card button.ref-copy { width: 100%; }
}


.pricing-billing-toggle {
  display: flex; justify-content: center; gap: 4px;
  margin: 0 auto 20px; width: max-content; max-width: 100%;
  background: var(--bg-inset); padding: 4px; border-radius: 999px;
}
.pricing-billing-toggle button {
  padding: 8px 18px; border: none; border-radius: 999px;
  background: transparent; cursor: pointer; font-size: 0.85rem; font-weight: 600;
  color: var(--text-dim);
}
.pricing-billing-toggle button.active {
  background: var(--bg-card); color: var(--text);
  box-shadow: 0 1px 3px rgba(0,0,0,0.08);
}


.pricing-savings-badge {
  display: inline-block; margin-left: 6px; padding: 2px 8px;
  background: var(--green); color: #fff;
  font-size: 0.65rem; font-weight: 700; border-radius: 999px;
  text-transform: uppercase; letter-spacing: 0.04em;
}


:root { --chat-width: 420px; }

html.help-chat-expanded { --chat-width: min(900px, 65vw); }

.help-chat { position: fixed; bottom: 24px; right: 24px; z-index: 9999; }


.help-chat-fab {
  width: 52px; height: 52px; border-radius: 50%; border: none;
  background: var(--accent); color: #fff; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 4px 16px rgba(0,0,0,0.18);
  transition: transform 0.2s, background 0.2s;
}
.help-chat-fab:hover { transform: scale(1.08); }


.assistant-launcher {
  flex: none;
  width: var(--sd-tap); height: var(--sd-tap);
  display: inline-flex; align-items: center; justify-content: center;
  padding: 0; border: 0; background: none;
  color: var(--accent); cursor: pointer;
}


.help-chat-panel {
  position: fixed; top: 0; right: 0; bottom: 0;
  width: var(--chat-width); min-width: var(--chat-width); max-width: var(--chat-width);
  background: var(--bg-card); border-left: 1px solid var(--border);
  box-shadow: -4px 0 24px rgba(0,0,0,0.12);
  display: flex; flex-direction: column; overflow: hidden;
  z-index: 10000;
}


html.help-chat-open #app { margin-right: var(--chat-width); transition: margin-right 0.25s ease; }
html:not(.help-chat-open) #app { transition: margin-right 0.25s ease; }

.help-chat-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 18px; border-bottom: 1px solid var(--border);
  font-weight: 600; font-size: 0.95rem;
  min-height: 52px;
}
.help-chat-hdr-btn {
  background: none; border: none; color: var(--text-dim);
  cursor: pointer; padding: 4px; border-radius: 4px;
  display: flex; align-items: center;
}
.help-chat-hdr-btn:hover { background: var(--bg-hover); color: var(--text); }

.help-chat-body {
  flex: 1; overflow-y: auto; padding: 18px;
  display: flex; flex-direction: column; gap: 14px;
}

.help-chat-empty {
  text-align: center; color: var(--text-dim);
  margin: auto; padding: 20px;
}
.help-chat-empty p { margin: 0; line-height: 1.5; }

.help-chat-msg { display: flex; }
.help-chat-msg-user { justify-content: flex-end; }
.help-chat-msg-assistant { justify-content: flex-start; }

.help-chat-msg-content {
  max-width: 92%; padding: 10px 14px; border-radius: 12px;
  font-size: 0.85rem; line-height: 1.55; word-wrap: break-word;
  overflow-wrap: break-word; overflow: hidden;
}
.help-chat-msg-user .help-chat-msg-content {
  background: var(--accent); color: #fff; border-bottom-right-radius: 4px;
}
.help-chat-msg-assistant .help-chat-msg-content {
  background: var(--bg-hover); color: var(--text); border-bottom-left-radius: 4px;
}
.help-chat-msg-assistant .help-chat-msg-content p { margin: 0 0 6px; }
.help-chat-msg-assistant .help-chat-msg-content p:last-child { margin-bottom: 0; }
.help-chat-msg-assistant .help-chat-msg-content code {
  background: var(--border); padding: 1px 4px; border-radius: 3px; font-size: 0.82rem;
}


.help-chat-typing {
  display: flex; gap: 4px; padding: 10px 14px !important; align-items: center;
}
.help-chat-typing span {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--text-dim); animation: chatDot 1.4s infinite;
}
.help-chat-typing span:nth-child(2) { animation-delay: 0.2s; }
.help-chat-typing span:nth-child(3) { animation-delay: 0.4s; }
@keyframes chatDot {
  0%, 80%, 100% { opacity: 0.3; transform: scale(0.8); }
  40% { opacity: 1; transform: scale(1); }
}

.help-chat-input {
  display: flex; align-items: flex-end; gap: 8px;
  padding: 14px 18px; border-top: 1px solid var(--border);
}
.help-chat-input textarea {
  flex: 1; resize: none; border: 1px solid var(--border);
  border-radius: 8px; padding: 8px 12px; font-size: 0.85rem;
  font-family: inherit; background: var(--bg); color: var(--text);
  max-height: 100px; line-height: 1.4;
}
.help-chat-input textarea:focus { border-color: var(--accent); }
.help-chat-input textarea:disabled { opacity: 0.6; }

.help-chat-send {
  background: var(--accent); color: #fff; border: none;
  border-radius: 8px; padding: 8px; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: opacity 0.15s;
}
.help-chat-send:disabled { opacity: 0.4; cursor: default; }
.help-chat-send:not(:disabled):hover { opacity: 0.85; }

.help-chat-composer-btn {
  background: none; border: 1px solid var(--border); color: var(--text-dim);
  border-radius: 8px; padding: 8px; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: color 0.15s, border-color 0.15s;
}
.help-chat-composer-btn:hover { color: var(--text); border-color: var(--text-dim); }


.cr-template-drawer {
  flex: 0 1 auto; max-height: 45%; overflow-y: auto;
  padding: 10px 18px; border-top: 1px solid var(--border);
  background: var(--bg);
}

.cr-template-drawer-head {
  display: flex; align-items: center; justify-content: flex-end;
  gap: 8px; font-size: 0.74rem;
}
.cr-template-drawer-head > span { margin-right: auto; }
.cr-template-toggle.active { color: var(--accent); border-color: var(--accent); }


.cr-template-staged {
  display: flex; align-items: center; flex-wrap: wrap; gap: 6px;
  padding: 8px 18px 0; font-size: 0.76rem;
}
.cr-template-staged-title { font-weight: 600; }
.cr-template-staged-cost { margin-left: auto; }


.cr-template-offer { display: block; margin-top: 8px; }


.help-chat-disconnected {
  padding: 14px 18px; text-align: center; font-size: 0.82rem;
  color: var(--red); background: var(--bg-hover); border-top: 1px solid var(--border);
  line-height: 1.5;
}


.chat-fade-enter-active, .chat-fade-leave-active { transition: transform 0.25s ease; }
.chat-fade-enter-from, .chat-fade-leave-to { transform: translateX(100%); }


.page-intro {
  position: fixed; right: 24px; bottom: 88px; z-index: 9998;
  width: min(360px, calc(100vw - 48px));
  background: var(--bg-card); color: var(--text);
  border: 1px solid var(--border); border-radius: 12px;
  border-bottom-right-radius: 4px;
  box-shadow: 0 8px 28px rgba(0,0,0,0.18);
  padding: 14px 16px; font-size: 0.85rem; line-height: 1.55;
}
.page-intro-head {
  display: flex; align-items: flex-start; gap: 8px; margin-bottom: 6px;
}
.page-intro-title { font-weight: 600; font-size: 0.92rem; flex: 1; }
.page-intro-close {
  background: none; border: none; color: var(--text-dim);
  cursor: pointer; padding: 2px; border-radius: 4px;
  display: flex; align-items: center; flex: none;
}
.page-intro-close:hover { background: var(--bg-hover); color: var(--text); }
.page-intro-body { margin: 0; }
.page-intro-hint { margin: 8px 0 0; font-size: 0.78rem; }
.page-intro-actions {
  display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px;
}
.page-intro-never { color: var(--text-dim); }


@media (max-width: 640px) {
  .page-intro {
    right: 0; left: 0; bottom: 0; width: auto;
    border-radius: 12px 12px 0 0; border-left: none; border-right: none;
    padding-bottom: calc(14px + 76px + env(safe-area-inset-bottom, 0px));
  }
}


.help-chat-panel.help-chat-fullscreen {
  transition: width 0.2s ease, min-width 0.2s ease, max-width 0.2s ease;
}
@media (prefers-reduced-motion: reduce) {
  
  *, *::before, *::after {
    transition-duration: 0.01ms !important;
    transition-delay: 0ms !important;
    animation-duration: 0.01ms !important;
    animation-delay: 0ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
  }
  
  .idle-anim * { animation-duration: var(--ia-d) !important; animation-iteration-count: infinite !important; }
  .help-chat-typing span { animation-duration: 1.4s !important; animation-iteration-count: infinite !important; }
  
  .help-chat-panel.help-chat-fullscreen { transition: none; }
}


.chat-inline-card {
  margin-top: 8px; padding: 8px 10px;
  border: 1px solid var(--border); border-radius: 8px;
  background: var(--bg); color: var(--text);
  font-size: 0.82rem;
}
.chat-inline-card-title { font-weight: 600; margin-bottom: 6px; font-size: 0.82rem; }
.chat-inline-card-chart { position: relative; height: 180px; width: 100%; }
.help-chat-fullscreen .chat-inline-card-chart { height: 320px; }
.chat-inline-card-kpi { text-align: center; padding: 6px 0; }
.chat-inline-card-kpi .metric-value { font-size: 1.6rem; font-weight: 700; }
.chat-inline-card-kpi .chat-inline-card-subtitle {
  color: var(--text-dim); font-size: 0.78rem; margin-top: 2px;
}
.chat-inline-card-grid { overflow-x: auto; }
.chat-inline-card-grid table { width: 100%; border-collapse: collapse; }
.chat-inline-card-grid th, .chat-inline-card-grid td {
  text-align: left; padding: 4px 6px; border-bottom: 1px solid var(--border);
}
.help-chat-msg-assistant .help-chat-msg-content .chat-inline-card-text p:last-child { margin-bottom: 0; }


.chat-action-card {
  margin-top: 8px; padding: 8px 10px;
  border: 1px solid var(--accent, var(--border)); border-radius: 8px;
  background: var(--bg); color: var(--text);
  font-size: 0.82rem;
}
.chat-action-summary { margin-bottom: 6px; }
.chat-action-facts { margin: 0 0 6px; padding-left: 1.1em; font-size: 0.85em; overflow-wrap: anywhere; }
.chat-action-buttons { display: flex; gap: 8px; }
.chat-action-resolved { font-size: 0.78rem; }


.notes-panel {
  position: fixed; top: 0; right: 0; bottom: 0;
  width: var(--chat-width); min-width: var(--chat-width); max-width: var(--chat-width);
  background: var(--bg-card); border-left: 1px solid var(--border);
  box-shadow: -4px 0 24px rgba(0,0,0,0.12);
  display: flex; flex-direction: column; overflow: hidden;
  z-index: 10000;
}
html.notes-panel-open #app { margin-right: var(--chat-width); transition: margin-right 0.25s ease; }
html:not(.notes-panel-open) #app { transition: margin-right 0.25s ease; }
html.notes-panel-open .help-chat { display: none; }

.notes-panel-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 18px; border-bottom: 1px solid var(--border);
  font-weight: 600; font-size: 0.95rem; min-height: 52px;
}
.notes-panel-body {
  flex: 1; overflow-y: auto; padding: 18px;
  display: flex; flex-direction: column; gap: 12px;
}
.notes-empty { text-align: center; margin: auto; padding: 20px; }
.notes-form { padding: 12px; }
.notes-card { padding: 12px; }
.notes-card.notes-alerted { border-left: 3px solid var(--orange); }

.note-alert-status { font-size: 0.78rem; margin-bottom: 8px; }
.notes-card-header {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 6px;
}
.notes-card-text { font-size: 0.88rem; line-height: 1.5; white-space: pre-wrap; }
.notes-card-alert {
  margin-top: 8px; padding-top: 6px; border-top: 1px solid var(--border);
  font-size: 0.82rem; line-height: 1.4;
}
.notes-alert-badge {
  display: inline-flex; align-items: center; justify-content: center;
  width: 20px; height: 20px; border-radius: 50%;
  font-size: 0.72rem; font-weight: 700;
  background: var(--bg-hover); color: var(--text-dim);
}
.notes-alert-badge.alerted { background: var(--orange); color: #fff; }


.filter-modal-overlay {
  position: fixed; inset: 0; z-index: 10001;
  background: rgba(0,0,0,0.55);
  display: flex; align-items: center; justify-content: center;
  padding: 24px;
}
.filter-modal {
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: var(--radius-lg); box-shadow: 0 20px 60px rgba(0,0,0,0.35);
  width: min(1200px, 100%); max-height: calc(100vh - 48px);
  display: flex; flex-direction: column; overflow: hidden;
}
.filter-modal-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 20px; border-bottom: 1px solid var(--border);
}
.filter-modal-header h3 { margin: 0; font-size: 1rem; }
.filter-modal-body {
  flex: 1; overflow-y: auto; padding: 20px 24px;
}
.filter-modal-footer {
  display: flex; align-items: center; justify-content: flex-end; gap: 10px;
  padding: 12px 20px; border-top: 1px solid var(--border);
}


.filter-editor-page { display: flex; flex-direction: column; gap: 0; }


.filter-editor-layout { display: block; }

.filter-editor-layout {
  --fe-line-h: 34px;
  --fe-caret-x: 6px;
  --fe-caret-w: 18px;
  
  --fe-head-text-x: 24px;
  --fe-head-pad-r: 6px;
  
  --fe-card-pad-y: 12px;
  --fe-card-pad-x: 14px;
}
.filter-editor-main {
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: var(--radius-lg); padding: 24px 28px;
}

.filter-editor-ref {
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: var(--radius-lg); padding: 16px;
}
.fe-ref-heading {
  font-size:0.82rem; margin: 0; padding: 6px 0; cursor: pointer;
  user-select: none; color: var(--text);
}
.fe-ref-heading:hover { color: var(--accent); }

h4.fe-ref-heading { padding: 0; }
h4.fe-ref-heading > .btn-bare { padding: 6px 0; }

.fe-ref-section { border-bottom: 1px solid var(--border); }
.fe-ref-section:last-child { border-bottom: none; }
.fe-ref-body { padding: 4px 0 10px; }
.fe-ref-item {
  display: flex; gap: 8px; align-items: baseline; padding: 2px 4px;
  font-size:0.78rem; cursor: pointer; border-radius: 4px;
}
.fe-ref-item:hover { background: var(--bg); }
.fe-ref-item code {
  font-size:0.75rem; background: var(--bg); padding: 1px 5px;
  border-radius: 3px; white-space: nowrap; color: var(--accent);
}

.fe-reference { margin-top: 20px; }
.fe-ref-disclose {
  display: flex; align-items: center; gap: 6px; width: 100%;
  padding: 10px 2px; border: 0; border-top: 1px solid var(--border);
  background: none; color: var(--text); cursor: pointer;
  font-family: 'Space Grotesk', sans-serif; font-size: 0.72rem;
  font-weight: 600; letter-spacing: .06em; text-transform: uppercase;
}
.fe-ref-disclose:hover { color: var(--accent); }
.fe-reference .filter-editor-ref { margin-bottom: 12px; }

.fe-reference .fe-ref-body {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 0 20px;
}
.fe-ref-links { display: flex; flex-wrap: wrap; gap: 18px; margin: 0; padding: 0 2px 4px; }
.fe-ref-links a { font-size: 0.78rem; color: var(--accent-dark); text-decoration: none; }
.fe-ref-links a:hover { text-decoration: underline; }


.fe-collapsed > *:not(.fe-sum) { display: none; }
.fe-sum {
  position: relative;
  display: flex; align-items: stretch; gap: 4px; margin-bottom: 8px;
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: var(--radius-sm);
}
.fe-sum:hover { border-color: var(--border-strong); background: var(--bg-inset); }

.filter-criterion-header .fe-sum-move { border-left: 0; align-self: stretch; }
.filter-criterion-header .fe-moves-lead { margin-left: auto; }

.fe-head-break { display: none; }

.fe-card-caret,
.fe-sum-caret {
  position: absolute; left: var(--fe-caret-x); top: 0; height: var(--fe-line-h);
  display: inline-flex; align-items: center; justify-content: center;
  width: var(--fe-caret-w); border: 0; background: none; padding: 0;
  color: var(--text-muted); font-size: 0.7rem; line-height: 1;
}
.fe-card-caret { cursor: pointer; }
.fe-card-caret:hover { color: var(--accent); }

.filter-criterion-header {
  position: relative;
  
  display: flex; align-items: center; gap: 8px;
  
  min-height: calc(var(--fe-line-h) + 1px);
  margin: calc(-1 * var(--fe-card-pad-y)) calc(-1 * var(--fe-card-pad-x)) 8px;
  padding: 0 var(--fe-head-pad-r) 0 var(--fe-head-text-x);
  background: var(--bg-card);
  border-bottom: 1px solid var(--border);
  border-radius: var(--radius-sm) var(--radius-sm) 0 0;
}

.fe-band-row {
  padding-top: 2px;
  border-top: 0;
}


.fe-ref-row { display: flex; align-items: center; gap: 2px; }
.fe-ref-row .fe-ref-item { flex: 1; min-width: 0; }
.fe-ref-add {
  flex: none; width: 24px; min-height: 24px; border-radius: 4px;
  color: var(--text-muted); font-size: 0.95rem; line-height: 1; cursor: pointer;
  border: 1px solid transparent;
}
.fe-ref-row:hover .fe-ref-add, .fe-ref-add:focus-visible {
  color: var(--accent); border-color: var(--border-strong); background: var(--bg-card);
}


.fe-sum:hover .fe-sum-caret { color: var(--accent); }

.fe-sum-open {
  flex: 1; min-width: 0; display: flex; align-items: center; gap: 10px;
  min-height: var(--fe-line-h);
  padding: 0 var(--fe-head-pad-r) 0 var(--fe-head-text-x);
  border: 0; background: none; color: var(--text);
  font-family: inherit; text-align: left; cursor: pointer;
}

.fe-sum-name {
  font-size: 0.9rem; font-weight: 600; flex: none; padding: 2px 4px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 40%;
}

.fe-sum-importance { flex: none; }

.fe-sum-rule {
  flex: 1; min-width: 0; font-size: 0.82rem; color: var(--text-dim);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

.fe-sum-meta {
  flex: none; font-size: 0.6875rem; letter-spacing: 0.04em;
  text-transform: uppercase; color: var(--text-muted);
}
.fe-sum-move {
  flex: none; width: 30px; display: inline-flex; align-items: center;
  justify-content: center; border: 0; border-left: 1px solid var(--border);
  background: none; color: var(--text-dim); font-size: 0.75rem; cursor: pointer;
}
.fe-sum-move:hover:not(:disabled) { color: var(--accent); background: var(--bg-hover); }
.fe-sum-move:disabled { opacity: 0.35; cursor: default; }


.fe-find {
  margin-left: auto; width: 200px; padding: 4px 9px;
  border: 1px solid var(--border); border-radius: 6px;
  background: var(--bg-card); color: var(--text);
  font-family: inherit; font-size: 0.8rem;
}
.fe-find:focus { border-color: var(--accent); }
.fe-find-count { font-size: 0.75rem; }


.fe-drag-row { display: flex; align-items: flex-start; gap: 6px; }
.fe-drag-body { flex: 1; min-width: 0; }
.fe-drag-handle {
  cursor: grab; padding: 4px 2px; line-height: 1;
  color: var(--text-dim); font-size: 0.95rem;
  background: none; border: none; border-radius: 4px;
}
.fe-drag-handle:hover { color: var(--accent); background: var(--bg); }
.fe-drag-handle:active { cursor: grabbing; }

.fe-drag-handle[aria-pressed="true"] {
  color: var(--bg-card); background: var(--accent);
}
.fe-drag-row-grabbed > .fe-drag-body { outline: 2px dashed var(--accent); outline-offset: 3px; }
.fe-drag-handle-inline { align-self: center; }
.fe-drop-zone { height: 0; border-radius: 4px; transition: height 90ms ease, background 90ms ease; }
body.fe-drag-active .fe-drop-zone { height: 10px; background: var(--bg); }
body.fe-drag-active .fe-drop-zone-hot { height: 18px; background: var(--accent); }


.filter-adherence { display: flex; gap: 6px; margin-bottom: 20px; align-items: center; }
.filter-adherence label { font-size:0.8rem; color: var(--text-dim); margin-right: 8px; font-weight: 600; }

.fe-pair { display: contents; }
.filter-adherence .adherence-opt {
  padding: 4px 12px; border: 1px solid var(--border); border-radius: 6px;
  font-size:0.8rem; cursor: pointer; background: var(--bg);
  color: var(--text-dim); transition: all .15s;
}
.filter-adherence .adherence-opt:hover { border-color: var(--accent); color: var(--text); }
.filter-adherence .adherence-opt.active {
  background: var(--accent); color: #fff; border-color: var(--accent);
}


.filter-condition-row .fe-basis-select { width: auto; min-width: 94px; }

.filter-condition-row .fe-basis-select.fe-basis-select-override {
  border-color: var(--accent); color: var(--accent); font-weight: 600;
}

.filter-condition-row .fe-basis-select:disabled { opacity: 0.55; cursor: not-allowed; }

.filter-condition-row .filter-row-error {
  font-size: 0.8rem; color: var(--red); font-weight: 600;
}


.fe-basis-overrides {
  display: flex; flex-wrap: wrap; gap: 6px; align-items: center;
  margin: -14px 0 20px;
}
.fe-basis-overrides-label {
  font-size: 0.8rem; color: var(--text-dim); font-weight: 600; margin-right: 2px;
}
.fe-basis-chip {
  font-size: 0.75rem; padding: 2px 8px; border-radius: 12px;
  background: var(--accent-bg); border: 1px solid var(--accent);
  color: var(--text);
}


.filter-editor-main .filter-group {
  border-left: 3px solid var(--accent); padding: 10px 0 10px 16px;
  margin-bottom: 8px;
}
.filter-editor-main .filter-group.group-and { border-color: #3b82f6; }
.filter-editor-main .filter-group.group-or { border-color: #22c55e; }


.filter-editor-layout select,
.filter-editor-layout input { min-width: 0; }

@media not all and (max-width: 600px) {
  .filter-editor-layout .importance-select { width: 140px; }
}

.filter-group-header {
  display: flex; align-items: center; gap: 8px; margin-bottom: 10px;
}
.filter-group-label {
  font-size:0.7rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .06em; padding: 2px 8px; border-radius: 4px;
  cursor: pointer; user-select: none;
}

.filter-group-label-static { cursor: default; }
.group-and > .filter-group-header .filter-group-label { background: #dbeafe; color: #1d4ed8; }
.group-or > .filter-group-header .filter-group-label { background: #dcfce7; color: #15803d; }
[data-theme="dark"] .group-and > .filter-group-header .filter-group-label { background: #1e3a5f; color: #93c5fd; }
[data-theme="dark"] .group-or > .filter-group-header .filter-group-label { background: #14532d; color: #86efac; }


.filter-not-badge {
  display: inline-block; font-size:0.65rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .06em;
  padding: 1px 6px; border-radius: 3px; margin-right: 6px;
  background: #fecaca; color: #b91c1c; vertical-align: middle;
}
[data-theme="dark"] .filter-not-badge { background: #450a0a; color: #fca5a5; }


.filter-criterion {
  background: var(--bg); border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  
  padding: var(--fe-card-pad-y) var(--fe-card-pad-x);
  margin-bottom: 8px; transition: border-color .15s;
}
.filter-criterion:hover { border-color: var(--text-dim); }

.filter-criterion-header span.crit-name { display: block; min-width: 0; }
.filter-criterion-header .crit-name {
  font-weight: 600; font-size:0.9rem; flex: 1;
  border: none; background: transparent; color: var(--text);
  font-family: inherit; padding: 2px 4px; border-radius: 4px;
}

.filter-criterion-header .crit-name:focus {
  background: var(--bg-card); outline: none; box-shadow: 0 0 0 2px var(--focus-ring-color);
}

.filter-criterion-header .crit-name.crit-name-missing {
  box-shadow: inset 0 0 0 1px var(--red);
}
.filter-criterion-header .crit-name.crit-name-missing::placeholder {
  color: var(--red); opacity: 0.85;
}

.filter-criterion .crit-desc.crit-name-missing {
  box-shadow: inset 0 0 0 1px var(--red);
}
.filter-criterion .crit-desc.crit-name-missing::placeholder {
  color: var(--red); opacity: 0.85;
}

.filter-criterion .crit-desc {
  display: block; box-sizing: border-box; width: 100%;
  font-size:0.75rem; color: var(--text-dim);
  border: none; background: transparent; font-family: inherit;
  padding: 2px 4px; margin-bottom: 8px; border-radius: 4px; min-width: 0;
}

.filter-criterion .crit-desc:focus {
  background: var(--bg-card); outline: none; box-shadow: 0 0 0 2px var(--focus-ring-color);
}

.filter-criterion .crit-desc.crit-name-missing:focus,
.filter-criterion-header .crit-name.crit-name-missing:focus {
  background: var(--bg-card); outline: none;
  box-shadow: inset 0 0 0 1px var(--red), 0 0 0 2px var(--focus-ring-color);
}
.filter-criterion-header .btn-remove {
  background: none; border: none; color: var(--red); cursor: pointer;
  font-size: 1.1rem; padding: 0 4px; opacity: 0.5; transition: opacity .15s;
}
.filter-criterion-header .btn-remove:hover { opacity: 1; }


.filter-condition-row {
  display: flex; gap: 6px; align-items: center; margin-bottom: 6px;
  flex-wrap: wrap;
}
.filter-condition-row select, .filter-condition-row input {
  padding: 4px 8px; border: 1px solid var(--border); border-radius: 6px;
  font-size:0.8rem; font-family: inherit; background: var(--bg-card);
  color: var(--text);
}
.filter-condition-row select:focus, .filter-condition-row input:focus {
  border-color: var(--accent);
}
.filter-condition-row .field-input { width: 180px; }
.filter-condition-row .op-select { width: 70px; }
.filter-condition-row .val-input { width: 120px; }


.fe-fieldpick { position: relative; display: inline-flex; align-items: center; }
.fe-fieldpick-pop {
  position: absolute; top: calc(100% + 4px); left: 0; z-index: 40;
  width: 420px; max-height: 340px; overflow-y: auto;
  background: var(--bg-card); border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm); box-shadow: var(--shadow-lg);
  padding: 4px 0;
}
.fe-fieldpick-sechead, .fe-fieldpick-opt {
  display: flex; align-items: baseline; gap: 8px; width: 100%;
  padding: 5px 12px; font-size: 0.78rem; text-align: left;
}
.fe-fieldpick-sechead { justify-content: space-between; font-weight: 600; }
.fe-fieldpick-sechead:hover, .fe-fieldpick-opt:hover { background: var(--bg-hover); }
.fe-fieldpick-opt code {
  font-size: 0.75rem; background: var(--bg); padding: 1px 5px; border-radius: 3px;
  color: var(--accent); white-space: nowrap;
}

.fe-fieldpick-opt-active {
  background: var(--accent-bg); box-shadow: inset 3px 0 0 var(--accent);
}
.fe-fieldpick-grphead {
  font-size: 0.64rem; letter-spacing: .06em; text-transform: uppercase;
  color: var(--text-muted); padding: 8px 12px 2px;
  font-family: 'Space Grotesk', sans-serif;
}
.fe-fieldpick-none { font-size: 0.78rem; color: var(--text-dim); padding: 10px 12px; margin: 0; }


.crit-value { position: relative; display: inline-flex; align-items: center; }
.filter-condition-row .crit-value-btn {
  width: 160px; text-align: left; cursor: pointer;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.filter-condition-row .crit-value-btn:hover { border-color: var(--accent); }

.crit-value .dropdown-wrap { position: static; }

.crit-value-many { max-width: 260px; }
.crit-value-many .scan-source-header { gap: 4px; }
.crit-value-many .sidebar-label { display: none; }
.filter-condition-row .btn-remove-cond {
  background: none; border: none; color: var(--red); cursor: pointer;
  font-size:0.9rem; padding: 0 2px; opacity: 0.4;
}
.filter-condition-row .btn-remove-cond:hover { opacity: 1; }
.filter-condition-row .btn-add-cond {
  background: none; border: 1px dashed var(--border); color: var(--text-dim);
  cursor: pointer; font-size:0.75rem; padding: 3px 8px; border-radius: 4px;
}
.filter-condition-row .btn-add-cond:hover { border-color: var(--accent); color: var(--accent); }

.filter-condition-row .ref-label,
.filter-scoring-body .ref-label {
  font-size:0.75rem; color: var(--text-dim); padding: 0 2px;
}

.filter-condition-row .fe-decision-rule {
  font-size:0.75rem; color: var(--text-dim);
}


.filter-timing-row {
  border-top: 1px dashed var(--border);
  padding-top: 6px;
}
.filter-timing-row .op-select { width: auto; min-width: 70px; }


.filter-scoring-toggle {
  font-size:0.75rem; color: var(--text-dim); cursor: pointer;
  user-select: none; margin-top: 4px; display: inline-block;
}
.filter-scoring-toggle:hover { color: var(--accent); }
.filter-scoring-body {
  margin-top: 6px; padding: 8px 10px; background: var(--bg-card);
  border: 1px solid var(--border); border-radius: 6px;
}
.filter-scoring-tier {
  display: flex; gap: 6px; align-items: center; margin-bottom: 4px;
  font-size:0.78rem;
}
.filter-scoring-tier .tier-label {
  font-weight: 600; width: 65px; text-transform: capitalize;
}
.tier-label-pass { color: var(--green); }
.tier-label-marginal { color: var(--yellow); }
.tier-label-fail { color: var(--red); }
.filter-scoring-tier select, .filter-scoring-tier input {
  padding: 2px 6px; border: 1px solid var(--border); border-radius: 4px;
  font-size:0.75rem; font-family: inherit; background: var(--bg);
  color: var(--text);
}
.filter-scoring-tier .op-select { width: 60px; }
.filter-scoring-tier .val-input { width: 80px; }


.fe-inline-tier {
  font-size: 0.72rem; font-weight: 700; letter-spacing: .02em;
  text-transform: uppercase; padding: 0 1px;
}
.filter-condition-row .fe-inline-tier + .op-select { margin-left: 2px; }

.fe-inline-band { display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }


.fe-axis-wrap { margin: 2px 0 10px; }
.fe-axis { position: relative; height: 96px; margin: 0 34px; }

.fe-axis-bars {
  position: absolute; left: 0; right: 0; top: 0; height: 40px; overflow: hidden;
}
.fe-axis-bars i {
  position: absolute; bottom: 0; background: var(--border-strong); opacity: 0.5;
  border-radius: 1px 1px 0 0; min-height: 1px;
}

.fe-axis-track {
  position: absolute; left: 0; right: 0; top: 44px; height: 6px; border-radius: 3px;
  background: linear-gradient(90deg, var(--poor-fit) 0%, var(--weak-fit) 50%, var(--fit) 100%);
}
.fe-axis-lower .fe-axis-track {
  background: linear-gradient(90deg, var(--fit) 0%, var(--weak-fit) 50%, var(--poor-fit) 100%);
}

.fe-axis-bare .fe-axis-track { background: var(--bg-inset); }
.fe-axis-scale {
  position: absolute; left: 0; right: 0; top: 54px;
  display: flex; justify-content: space-between;
  font-size: 0.68rem; color: var(--text-muted); font-variant-numeric: tabular-nums;
}
.fe-pin { position: absolute; top: 24px; transform: translateX(-50%); text-align: center; }
.fe-pin-mark { display: block; width: 2px; height: 26px; margin: 0 auto; background: var(--text); }
.fe-pin-lab {
  display: block; margin-top: 26px; font-size: 0.68rem; font-weight: 600;
  white-space: nowrap; font-variant-numeric: tabular-nums;
}
.fe-pin-fail .fe-pin-mark { background: var(--red); }
.fe-pin-fail .fe-pin-lab { color: var(--red-dark); }
.fe-pin-pass .fe-pin-mark { background: var(--green); }
.fe-pin-pass .fe-pin-lab { color: var(--green-dark); }

.fe-pin-gate { top: 0; }
.fe-pin-gate .fe-pin-mark { background: var(--accent); height: 50px; }
.fe-pin-gate .fe-pin-lab { color: var(--accent-dark); margin-top: 2px; }

.fe-axis-stacked { height: 112px; }
.fe-axis-stacked .fe-pin-pass .fe-pin-lab { margin-top: 42px; }
.fe-axis-legend { margin: 0 0 4px; font-size: 0.75rem; color: var(--text-muted); }
.fe-axis-warn { margin: 0 0 4px; font-size: 0.75rem; color: var(--red-dark); line-height: 1.45; }
.fe-axis-warn strong { font-weight: 700; }

@media (max-width: 600px) {
  
  .fe-ref-add { width: var(--sd-tap, 44px); min-height: var(--sd-tap, 44px); }
  
  .filter-editor-layout {
    --fe-line-h: var(--sd-tap, 44px);
    --fe-caret-w: 24px;
    --fe-head-text-x: 30px;
    --fe-card-pad-y: 10px;
    --fe-card-pad-x: 10px;
  }
  
  .filter-criterion-header .fe-head-break {
    display: block; flex: 0 0 100%; height: 0;
  }
}

@media (max-width: 600px) {
  
  .fe-axis { margin: 0 22px; }
  .fe-pin-lab { font-size: 0.7rem; }
  .fe-axis-legend, .fe-axis-warn { font-size: 0.8rem; }
}


.filter-add-row {
  display: flex; gap: 8px; margin-top: 8px;
}
.filter-add-btn {
  background: none; border: 1px dashed var(--border); color: var(--text-dim);
  cursor: pointer; font-size:0.78rem; padding: 6px 14px; border-radius: 6px;
  transition: all .15s;
}
.filter-add-btn:hover { border-color: var(--accent); color: var(--accent); }


.filter-macro { margin-top: 20px; }
.filter-macro h4 { font-size:0.85rem; margin-bottom: 8px; cursor: pointer; }
.filter-macro h4:hover { color: var(--accent); }

.filter-macro-hint { font-size: 0.75rem; margin: 0 0 4px; }
.filter-macro textarea {
  width: 100%; min-height: 60px; padding: 8px 10px;
  border: 1px solid var(--border); border-radius: 6px;
  font-family: inherit; font-size:0.82rem; resize: vertical;
  background: var(--bg); color: var(--text);
}
.filter-macro textarea:focus { border-color: var(--accent); }



.filter-save-bar {
  display: flex; gap: 8px; align-items: center; flex-wrap: wrap;
}
.filter-save-bar .btn { min-width: 120px; }
.filter-save-bar .save-status {
  font-size:0.82rem; display: flex; align-items: center; margin-left: auto;
}


.data-quality { margin-top: 12px; }
.data-quality-heading {
  margin: 0 0 6px; font-size:0.85rem; color: var(--text-dim);
  text-transform: uppercase; letter-spacing: .02em;
}
.data-quality-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.data-quality-item { display: flex; gap: 8px; align-items: baseline; flex-wrap: wrap; }
.data-quality-detail { font-size:0.85rem; color: var(--text); flex: 1 1 240px; }
.dq-token-warning {
  background: color-mix(in srgb, var(--orange) 18%, transparent); color: var(--orange);
  white-space: nowrap;
}
.dq-token-error {
  background: color-mix(in srgb, var(--red) 18%, transparent); color: var(--red);
  white-space: nowrap;
}


.source-attribution {
  text-align: right; margin-top: 4px; margin-bottom: 2px;
}
.source-link {
  font-size:0.7rem; color: var(--text-dim);
}
.source-link a {
  color: var(--accent); text-decoration: none; opacity: 0.8;
}
.source-link a:hover { opacity: 1; text-decoration: underline; }
.external-links {
  display: flex; flex-wrap: wrap; gap: 8px;
}
.ext-link {
  display: inline-block; padding: 4px 12px; border-radius: 6px;
  border: 1px solid var(--border); font-size:0.8rem;
  color: var(--accent); text-decoration: none;
  transition: background 0.15s, border-color 0.15s;
}
.ext-link:hover {
  background: var(--accent-soft); border-color: var(--accent);
}
.research-source-list {
  list-style: none; padding: 0; margin: 0;
}
.research-source-list li {
  padding: 4px 0; font-size:0.82rem; border-bottom: 1px solid var(--border);
}
.research-source-list li:last-child { border-bottom: none; }
.research-source-list a {
  color: var(--accent); text-decoration: none;
}
.research-source-list a:hover { text-decoration: underline; }


.cr-page-list { display: flex; flex-direction: column; gap: 8px; }
.cr-page-card { cursor: pointer; transition: box-shadow .2s; }
.cr-page-card:hover { box-shadow: var(--shadow-lg); }

.cr-toolbar {
  display: flex; align-items: center; gap: 8px;
  padding: 8px 0; margin-bottom: 12px; flex-wrap: wrap;
}
.cr-draft-indicator {
  background: rgba(249, 115, 22, 0.1); color: var(--orange);
  padding: 4px 10px; border-radius: 12px;
  font-size:0.75rem; font-weight: 600;
}
.cr-content { display: flex; gap: 16px; }
.cr-widgets-area { flex: 1; min-width: 0; }

.custom-widgets { display: flex; flex-wrap: wrap; gap: 16px; align-items: stretch; }
.custom-widget-full { width: 100%; }
.custom-widget-half { width: calc(50% - 8px); display: flex; }
.custom-widget-half > .card { flex: 1; display: flex; flex-direction: column; }

.custom-widget-half-right { width: calc(50% - 8px); margin-left: auto; display: flex; }
.custom-widget-half-right > .card { flex: 1; display: flex; flex-direction: column; }
.custom-widget-draft .card {
  border-color: var(--orange); border-style: dashed;
}
.custom-widget-chart { min-height: 250px; position: relative; flex: 1; display: flex; flex-direction: column; }
.custom-widget-chart canvas { flex: 1; max-height: 350px; }


.drilldown-drop-zone {
  height: 0;
  margin: 0;
  border: 0 dashed transparent;
  background: transparent;
  border-radius: 5px;
  overflow: hidden;
  visibility: hidden;
  
}
body.drilldown-drag-active .drilldown-drop-zone {
  height: 22px;
  margin: 6px 0;
  border-width: 1px;
  border-color: var(--accent, #3b82f6);
  background: color-mix(in srgb, var(--accent, #3b82f6) 10%, transparent);
  visibility: visible;
}
body.drilldown-drag-active .drilldown-drop-zone-hot {
  height: 40px;
  background: color-mix(in srgb, var(--accent, #3b82f6) 30%, transparent);
  border-style: solid;
  border-width: 2px;
}


.drilldown-drop-palette {
  position: fixed;
  top: 80px;
  left: 16px;
  z-index: 10050;
  width: 320px;
  max-height: calc(100vh - 120px);
  overflow-y: auto;
  background: var(--bg-card, #fff);
  border: 2px solid var(--accent, #3b82f6);
  border-radius: 10px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.25);
  padding: 10px;
  font-size: 0.85rem;
  
  visibility: hidden;
  opacity: 0;
  transition: opacity .12s ease-out;
}
body.drilldown-drag-active .drilldown-drop-palette {
  visibility: visible;
  opacity: 1;
}
.drilldown-drop-palette-title {
  font-weight: 700;
  color: var(--text-dim, #64748b);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-size: 0.7rem;
  margin-bottom: 8px;
  padding: 0 4px;
}
.drilldown-drop-palette-item {
  display: flex;
  gap: 10px;
  align-items: center;
  padding: 10px 12px;
  margin-bottom: 4px;
  border-radius: 6px;
  border: 1px dashed var(--accent, #3b82f6);
  background: color-mix(in srgb, var(--accent, #3b82f6) 6%, transparent);
  cursor: copy;
  transition: background .12s ease-out, transform .12s ease-out;
}
.drilldown-drop-palette-item-hot {
  background: color-mix(in srgb, var(--accent, #3b82f6) 35%, transparent);
  border-style: solid;
  border-width: 2px;
  transform: translateX(4px);
}
.drilldown-drop-palette-pos {
  font-family: var(--font-mono, monospace);
  font-size: 0.75rem;
  font-weight: 700;
  color: var(--accent, #3b82f6);
  min-width: 38px;
  text-align: right;
}
.drilldown-drop-palette-label { flex: 1; color: var(--text, #0f172a); }
.drilldown-custom-card[draggable="true"] { cursor: grab; }
.drilldown-custom-card[draggable="true"]:active { cursor: grabbing; }

.drilldown-custom-card td p { margin: 0; display: inline; }
.drilldown-card-pair-edge { transition: background .12s ease-out; }
.drilldown-card-pair-edge.pair-edge-hot {
  background: color-mix(in srgb, var(--accent, #3b82f6) 35%, transparent);
}


.drilldown-custom-card.custom-widget-half,
.drilldown-custom-card.custom-widget-half-right {
  flex-direction: column;
}

.drilldown-card-title-row {
  justify-content: flex-start !important;
}
.drilldown-card-body-row { display: flex; gap: 8px; align-items: stretch; }
.drilldown-card-body-row > .drilldown-card-body { flex: 1; min-width: 0; }
.drilldown-card-toolbar-vertical {
  display: flex; flex-direction: column; gap: 2px;
  flex: 0 0 auto;
}
.drilldown-card-toolbar-vertical .btn { padding: 2px 6px; min-width: 28px; }
.drilldown-card-btn-delete { color: var(--red, #ef4444); }
.drilldown-card-btn-delete:hover:not(:disabled) {
  background: color-mix(in srgb, var(--red, #ef4444) 18%, transparent);
}
.drilldown-card-btn-edit { color: var(--accent, #3b82f6); }
.drilldown-card-btn-edit:hover:not(:disabled) {
  background: color-mix(in srgb, var(--accent, #3b82f6) 18%, transparent);
}


.drilldown-preview-modal {
  max-width: 1200px; width: 96%; max-height: 92vh; overflow: auto;
  display: flex; flex-direction: column; gap: 12px;
}
.drilldown-preview-picker {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
}
.drilldown-preview-hint { padding: 24px; text-align: center; }


body.drilldown-edit-mode .header {
  position: static !important;
}

body.drilldown-drag-active .header,
body.drilldown-drag-active .header * {
  pointer-events: none;
}


body.fe-drag-active .header {
  position: static !important;
}
body.fe-drag-active .header,
body.fe-drag-active .header * {
  pointer-events: none;
}
@media (max-width: 700px) {
  .custom-widget-half-right { width: 100%; margin-left: 0; }
}

.cr-param-bar { display: flex; gap: 12px; align-items: center; margin-bottom: 8px; flex-wrap: wrap; }
.cr-param-group { display: flex; align-items: center; gap: 6px; }
.cr-param-label { font-size:0.75rem; color: var(--text-muted); font-weight: 500; }
.cr-param-buttons { display: flex; gap: 2px; background: var(--bg); border-radius: var(--radius-sm); padding: 2px; }
.cr-param-btn { font-size:0.72rem; padding: 3px 10px; border-radius: 6px; opacity: .6; transition: all .15s; }
.cr-param-btn:hover { opacity: .9; }
.cr-param-active { opacity: 1; background: var(--orange); color: #fff; font-weight: 600; }
.cr-param-active:hover { opacity: 1; }


@media (max-width: 768px) {
  :root { --chat-width: 100%; }
  .help-chat-panel { min-width: 0; max-width: none; }
  html.help-chat-open #app { margin-right: 0; }
  .custom-widget-half { width: 100%; }
  
  html.help-chat-open,
  html.notes-panel-open { --docked-panel-gutter: 0px; }
}


.help-icon {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 14px;
  height: 14px;
  margin-left: 5px;
  border-radius: 50%;
  border: 1px solid var(--border);
  background: var(--bg);
  color: var(--text-dim);
  font-size:0.65rem;
  font-weight: 700;
  font-family: 'Inter', sans-serif;
  text-transform: none;
  letter-spacing: 0;
  cursor: help;
  user-select: none;
  transition: color .15s, border-color .15s;
  vertical-align: middle;
}
.help-icon:hover, .help-icon:focus {
  color: var(--text);
  border-color: var(--accent, var(--orange));
}
.help-icon-mark {
  line-height: 1;
  pointer-events: none;
}
.help-popover {
  position: fixed;
  top: 0;
  left: 0;
  min-width: 240px;
  max-width: 320px;
  background: var(--card-bg, var(--bg-card));
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 10px 12px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .45);
  font-size:0.78rem;
  font-weight: 400;
  color: var(--text);
  text-align: left;
  text-transform: none;
  letter-spacing: 0;
  line-height: 1.45;
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  transition: opacity .15s, visibility 0s linear .15s;
  z-index: 1000;
  white-space: normal;
}
.help-popover.help-popover-open {
  visibility: visible;
  opacity: 1;
  transition: opacity .15s;
}
.help-popover .help-summary {
  display: block;
  margin-bottom: 6px;
  color: var(--text);
  font-weight: 600;
}


.help-popover .help-popover-section {
  display: block;
  margin-top: 6px;
  color: var(--text-dim);
}
.help-popover .help-popover-section strong {
  color: var(--text);
  font-weight: 600;
  margin-right: 4px;
}




.btn, .btn-sm, .btn-back, .btn-primary, .btn-danger, .btn-xs,
button, a, [role="button"], .edit-icon, .ai-btn, .chip-x {
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}


.btn:active { transform: translateY(0); box-shadow: var(--shadow-sm); filter: brightness(0.96); }
.btn-primary:active,
.btn-danger:active { transform: translateY(0); filter: brightness(0.94); }


html { overscroll-behavior-y: contain; }
@supports (min-height: 100dvh) {
  body { min-height: 100dvh; }
}


@media (pointer: coarse) {
  .btn, .btn-sm, .btn-back, .btn-primary, .btn-danger {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  
  .user-menu-dropdown .btn { justify-content: flex-start; }
  
  .seg-btn {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  
  .switch-toggle {
    min-height: 44px;
  }
  input[type="checkbox"], input[type="radio"] {
    min-width: 20px;
    min-height: 20px;
  }
}


@media (hover: none) {
  .edit-icon, .ai-btn, .ai-done, .chip-x,
  .filter-criterion-header .btn-remove,
  .filter-condition-row .btn-remove-cond {
    opacity: 1;
  }
}




.nav-links { display: flex; align-items: center; gap: 8px; }

@media (min-width: 769px) {
  .nav-links { flex-wrap: wrap; justify-content: flex-end; }
}


.switch-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  line-height: inherit;
}
.switch-track {
  position: relative;
  flex: 0 0 auto;
  width: 18px;
  height: 10px;
  border: 1px solid var(--border-strong);
  border-radius: 5px;
  background: var(--bg);
  transition: background .15s, border-color .15s;
}
.switch-knob {
  position: absolute;
  top: 1px;
  left: 1px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--text-dim);
  transition: transform .15s, background .15s;
}

.switch-track-on {
  background: var(--accent-bg);
  border-color: var(--accent);
}
.switch-track-on .switch-knob {
  transform: translateX(8px);
  background: var(--text);
}

.switch-toggle:disabled { opacity: .5; cursor: not-allowed; }

.nav-hamburger {
  display: none;
  background: var(--bg-card);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  cursor: pointer;
  padding: 6px;
  align-items: center;
  justify-content: center;
}

@media (max-width: 768px) {
  .nav-hamburger { display: inline-flex; min-height: 44px; min-width: 44px; }

  
  .nav-links {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: min(82vw, 300px);
    flex-direction: column;
    align-items: stretch;
    gap: 4px;
    background: var(--bg-card);
    border-left: 1px solid var(--border);
    box-shadow: -8px 0 24px rgba(0, 0, 0, 0.18);
    padding: max(16px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) 16px;
    transform: translateX(100%);
    transition: transform 0.25s ease;
    z-index: 200;
    overflow-y: auto;
    overscroll-behavior: contain;
  }
  .nav-links.nav-drawer-open { transform: translateX(0); }
  
  .nav-drawer-rule {
    width: 100%;
    margin: 6px 0;
    border: 0;
    border-top: var(--sd-hairline) solid var(--border);
  }
  
  .nav-links .btn { width: 100%; justify-content: flex-start; text-align: left; }
  .nav-links .sym-ac { width: 100% !important; max-width: none; }

  .nav-drawer-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.4);
    z-index: 199;
  }
}


@media (max-width: 768px) {
  .tab-strip {
    flex-wrap: nowrap !important;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
  }
  .tab-strip > * { flex-shrink: 0; }
}



.show-mobile { display: none; }


.fold-line { white-space: normal; }

@media (max-width: 768px) {
  .hide-mobile { display: none; }
  
  .show-mobile { display: revert; }
  
  .fold-line { display: block; }
  
  .stock-table th { padding: 10px 8px; }
  
  .stock-table th.sort-th .sort-th-btn { padding: 10px 8px; }
  .stock-table td { padding: 8px 8px; }
  
  .stock-table td.wrap-mobile { white-space: normal; }
}


@media (max-width: 600px) {
  

  .form-row { flex-direction: column; }

  
  .modal-card {
    width: 100% !important;
    max-width: none !important;
    max-height: 100dvh !important;
    border-radius: 0;
  }
}


@media (max-width: 768px) {
  .chart-container { height: 200px; }
}
@media (max-height: 500px) and (orientation: landscape) {
  .chart-container { height: 150px; }
}


@media (max-width: 768px) {
  .toast-host {
    left: 0;
    right: 0;
    align-items: center;
    max-width: none;
    padding-left: 12px;
    padding-right: 12px;
  }
}



.doc-layout {
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
  gap: 2rem;
  
  max-width: 1200px;
  margin: 0 auto;
  padding: 1.5rem 1rem 4rem;
  align-items: start;
}
.doc-toc {
  
  position: sticky;
  top: 84px;
  max-height: calc(100vh - 84px - 2rem);
  overflow-y: auto;
  
  overscroll-behavior: contain;
  
  scrollbar-width: thin;
  scrollbar-color: var(--border-strong) transparent;
  border-right: 1px solid var(--border);
  padding-right: 1rem;
}
.doc-toc::-webkit-scrollbar { width: 8px; height: 8px; }
.doc-toc::-webkit-scrollbar-track { background: transparent; }
.doc-toc::-webkit-scrollbar-thumb {
  background: var(--border-strong);
  border-radius: 4px;
}
.doc-toc::-webkit-scrollbar-thumb:hover { background: var(--text-muted); }

.doc-toc .doc-toc-link:focus-visible,
.doc-toc .doc-toc-toggle:focus-visible,
.doc-toc-filter:focus-visible { outline-offset: -2px; }
.doc-toc-filter {
  width: 100%;
  box-sizing: border-box;
  margin-bottom: 0.6rem;
  padding: 6px 10px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--border);
  background: var(--bg-card);
  color: var(--text);
  font: inherit;
  font-size: 0.85rem;
}
.doc-toc-title {
  font-family: "Space Grotesk", sans-serif;
  font-weight: 600;
  font-size: 0.8rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--text-muted);
  margin-bottom: 0.75rem;
}
.doc-toc-nav { display: flex; flex-direction: column; gap: 1px; }
.doc-toc-group { display: flex; flex-direction: column; gap: 1px; }

.doc-toc-grouphead { display: grid; grid-template-columns: 1.1rem minmax(0, 1fr); align-items: start; }
.doc-toc-toggle {
  padding: 0.32rem 0;
  color: var(--text-muted);
  font-size: 0.7rem;
  line-height: 1.3;
  text-align: left;
}
.doc-toc-toggle:hover { color: var(--text); }
.doc-toc-caret { display: block; }
.doc-toc-caret-none { padding: 0.32rem 0; }
.doc-toc-children { display: flex; flex-direction: column; gap: 1px; }
.doc-toc-link {
  display: block;
  padding: 0.32rem 0.6rem;
  border-radius: var(--radius-sm);
  border-left: 2px solid transparent;
  color: var(--text-dim);
  font-size: 0.9rem;
  line-height: 1.3;
  text-decoration: none;
  transition: background 0.12s, color 0.12s, border-color 0.12s;
}
.doc-toc-link:hover { background: var(--bg-hover); color: var(--text); }
.doc-toc-l1 { font-weight: 600; color: var(--text); }
.doc-toc-l2 { padding-left: 1.4rem; font-size: 0.84rem; }
.doc-toc-on {
  color: var(--accent);
  background: var(--accent-bg);
  border-left-color: var(--accent);
  font-weight: 600;
}
.doc-body { min-width: 0; }
.doc-intro { margin-bottom: 1.5rem; }
.doc-intro h1 { margin: 0 0 0.25rem; }

.doc-section { margin-bottom: 2.75rem; }
.doc-h1 {
  font-family: "Space Grotesk", sans-serif;
  margin: 0 0 0.6rem;
  padding-bottom: 0.4rem;
  border-bottom: 2px solid var(--border);
}
.doc-h2 { margin: 1.4rem 0 0.5rem; color: var(--text); }
.doc-section .md-content { color: var(--text-dim); line-height: 1.6; }
.doc-section .md-content ul { margin: 0.5rem 0 0.5rem 1.1rem; }
.doc-section .md-content li { margin: 0.2rem 0; }
.doc-section .md-content code {
  background: var(--bg-inset);
  padding: 0.05rem 0.3rem;
  border-radius: var(--radius-sm);
  font-size: 0.88em;
}

.doc-section .md-content a {
  color: var(--accent);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.doc-section .md-content a:hover { color: var(--accent-strong, var(--accent)); }


.doc-section .md-content a.doc-link-signin {
  color: var(--text-dim);
  text-decoration-style: dotted;
  cursor: pointer;
}
.doc-section .md-content a.doc-link-signin:hover { color: var(--accent); }


.doc-figure { margin: 1.25rem 0 0; }
.doc-figure img {
  display: block;
  max-width: 100%;
  height: auto;
  border: 1px solid var(--border);
  border-radius: var(--radius-md, 8px);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15);
}

.doc-figure .doc-shot-dark { display: none; }
[data-theme="dark"] .doc-figure .doc-shot-light { display: none; }
[data-theme="dark"] .doc-figure .doc-shot-dark { display: block; }
.doc-figure figcaption {
  margin-top: 0.4rem;
  font-size: 0.82rem;
  color: var(--text-muted, var(--text-dim));
  font-style: italic;
}


.contact-form { padding: 1rem; display: flex; flex-direction: column; gap: 0.6rem; max-width: 560px; }
.contact-form-label { font-size: 0.85rem; color: var(--text-dim); }
.contact-form-select,
.contact-form-textarea {
  width: 100%;
  box-sizing: border-box;
  padding: 8px 10px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--border);
  background: var(--bg-card);
  color: var(--text);
  font: inherit;
}
.contact-form-textarea { resize: vertical; }
.contact-form-actions { display: flex; align-items: center; gap: 0.75rem; }

.privacy-agent-row { display: flex; gap: 8px; align-items: flex-start; }
.contact-form-thanks { font-size: 0.85rem; color: var(--green, #2e9e5b); }
.contact-form-error { font-size: 0.85rem; color: var(--red); }

@media (max-width: 768px) {
  .doc-layout { grid-template-columns: 1fr; gap: 1rem; }
  .doc-toc {
    
    position: static;
    
    height: 40vh;
    border-right: 0;
    border-bottom: 1px solid var(--border);
    padding-right: 0;
    padding-bottom: 0.75rem;
  }
}



.position-chart .chart-topbar,
.explore-chart .chart-topbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 2px 0;
}

.position-chart .chart-topbar-actions,
.explore-chart .chart-topbar-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}
.position-chart .enc-glyph { opacity: 0.75; }
.position-chart .enc-name { color: var(--text-muted); }


.position-chart .chart-summary,
.explore-chart .chart-summary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px;
  flex: 1 1 auto;
  background: transparent;
  border: none;
  cursor: pointer;
  text-align: left;
  padding: 2px 4px;
  border-radius: var(--radius-sm);
  font-size: 0.75rem;
  color: var(--text-dim);
}
.position-chart .chart-summary:hover,
.explore-chart .chart-summary:hover { background: var(--bg-elev); }

.explore-chart .chart-summary-static {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px;
  flex: 1 1 auto;
  padding: 2px 4px;
  font-size: 0.75rem;
  color: var(--text-dim);
}
.position-chart .chart-summary-item { display: inline-flex; align-items: center; gap: 5px; }

.position-chart .chart-summary-count,
.explore-chart .chart-summary-count { color: var(--text-dim); font-size: 0.75rem; }



.chart-config-card {
  margin-top: 16px;
  scrollbar-width: thin;
  scrollbar-color: var(--border-strong) transparent;
}
.chart-config-card::-webkit-scrollbar { width: 8px; height: 8px; }
.chart-config-card::-webkit-scrollbar-track { background: transparent; }
.chart-config-card::-webkit-scrollbar-thumb {
  background: var(--border-strong);
  border-radius: 4px;
}
.chart-config-card::-webkit-scrollbar-thumb:hover { background: var(--text-muted); }

.chart-body-split { display: flex; align-items: flex-start; gap: 16px; }
.chart-body-split .chart-plot-col { flex: 1 1 auto; min-width: 0; }

.chart-body-split .chart-config-card {
  order: -1;
  
  flex: 1 1 50%;
  min-width: 50%;
  margin-top: 0;
  align-self: stretch;
  max-height: 660px;
  overflow-y: auto;
}
@media (max-width: 900px) {
  .chart-body-split { flex-direction: column; }
  .chart-body-split .chart-config-card {
    order: 0;
    flex-basis: auto;
    min-width: auto;
    width: 100%;
    max-height: none;
    overflow-y: visible;
  }
}
.chart-config-head { display: flex; align-items: center; gap: 8px; }
.chart-config-head h3 { margin: 0; }

.template-badge {
  font-size:0.7rem; font-weight: 600; padding: 2px 8px; border-radius: 9999px;
  background: var(--accent); color: #fff; white-space: nowrap;
}

.template-badge-stale { background: var(--amber); }

.template-manager-card { max-width: 560px; width: 100%; }
.template-manager-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.template-manager-head h3 { margin: 0; }
.template-manager-table { width: 100%; border-collapse: collapse; }
.template-manager-table th { text-align: left; font-size: 0.8rem; color: var(--text-dim); padding: 4px 8px; }
.template-manager-table td { padding: 4px 8px; }

.template-manager-table tbody tr.row-link:hover { background: var(--bg-hover); }
.template-manager-table td .row-link-cell { display: inline-block; width: 100%; }

.template-manager-actions { margin: 0 0 12px; }
.template-manager-new { display: flex; gap: 8px; align-items: center; margin: 0 0 12px; flex-wrap: wrap; }
.template-manager-new .input { flex: 1 1 140px; min-width: 0; }

.template-manager-new select.input { flex: 0 0 auto; width: auto; }

.template-editor-subhead { margin: 0 0 12px; font-size: 0.9rem; }
.template-editor-toolbar { max-width: 520px; margin-bottom: 12px; }

.chip.chip-source {
  background: var(--bg-hover); border-color: var(--border-strong, var(--border));
  color: var(--text);
}

.template-editor-identity { gap: 6px; margin-left: auto; }
.template-editor-hint { font-size: 0.75rem; margin-top: 4px; }
.template-editor-note { font-size: 0.85rem; }
.tab-add-menu-label {
  font-size: 0.7rem; font-weight: 600; color: var(--text-dim);
  text-transform: uppercase; letter-spacing: 0.04em;
  padding: 6px 10px 2px; white-space: nowrap;
}
.tab-add-menu-group + .tab-add-menu-group { border-top: 1px solid var(--border); margin-top: 4px; padding-top: 2px; }
.tab-add-menu-group { display: flex; flex-direction: column; }

.chart-config-head > :last-child:not(h3):not(.chart-view-name):not(.chart-view-name-static) {
  margin-left: auto;
}

.chart-limit-label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.8rem;
  color: var(--text-dim);
}
.chart-limit-input {
  width: 64px;
  height: 26px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--text);
  font-size: 0.8rem;
  padding: 0 6px;
}
.chart-config-search {
  width: 100%;
  margin: 8px 0;
}

.chart-config-add { margin: 4px 0 10px; }
.chart-catalog-panel {
  margin-top: 8px;
  max-height: 320px;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: var(--border-strong) transparent;
}
.chart-catalog-panel::-webkit-scrollbar { width: 8px; }
.chart-catalog-panel::-webkit-scrollbar-track { background: transparent; }
.chart-catalog-panel::-webkit-scrollbar-thumb {
  background: var(--border-strong);
  border-radius: 4px;
}
.chart-catalog-note {
  margin-left: auto;
  padding-left: 8px;
  font-size: 0.7rem;
  color: var(--text-muted);
  white-space: nowrap;
}
.chart-catalog-present,
.chart-catalog-absent {
  opacity: 0.55;
  cursor: default;
}
.chart-catalog-present:hover,
.chart-catalog-absent:hover { background: transparent; }

.tab-add {
  position: relative;
  display: inline-flex;
}
.tab-add-menu {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 20;
  display: flex;
  flex-direction: column;
  
  min-width: 230px;
  padding: 4px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--bg-card);
  box-shadow: var(--shadow-md, 0 4px 12px rgb(0 0 0 / 25%));
}

.tab-add-menu button {
  padding: 6px 10px;
  border: 0;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--text);
  font-family: inherit;
  font-size: 0.85rem;
  text-align: left;
  cursor: pointer;
}
.tab-add-menu button:hover {
  background: var(--bg-hover);
}

.chart-view-name {
  width: 160px;
  height: 26px;
  padding: 0 6px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--text);
  font-size: 0.85rem;
}

.chart-view-name-static {
  font-size: 0.85rem;
  color: var(--text-dim);
}

.chart-col-check {
  display: inline-flex;
  align-items: center;
}

.chart-col-order {
  margin: 8px 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.chart-col-order li {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.8rem;
}
.chart-col-name {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.chart-col-order .chart-view-btn:disabled {
  opacity: 0.35;
  cursor: default;
}


.chart-config-exclude {
  margin: 0 0 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--border);
}
.chart-axis-scales {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 0 0 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--border);
}
.chart-axis-scale-row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.chart-axis-scale-name {
  flex: 1 1 auto;
  min-width: 0;
  font-size: 0.8rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.chart-scale-toggle {
  display: inline-flex;
  gap: 4px;
}

.chart-config-tree {
  max-height: 55vh;
  overflow-y: auto;
  padding-right: 6px;
  scrollbar-width: thin;
  scrollbar-color: var(--border-strong) transparent;
}
.chart-config-tree::-webkit-scrollbar { width: 8px; height: 8px; }
.chart-config-tree::-webkit-scrollbar-track { background: transparent; }
.chart-config-tree::-webkit-scrollbar-thumb {
  background: var(--border-strong);
  border-radius: 4px;
}
.chart-config-tree::-webkit-scrollbar-thumb:hover { background: var(--text-muted); }

.chart-vtoggle-btn { min-width: 44px; flex: 0 0 auto; }
.chart-config-group + .chart-config-group { margin-top: 14px; }
.chart-config-group-head {
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-muted);
  padding: 4px 0;
  border-bottom: 1px solid var(--border);
}

.chart-config-sub {
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--bg-card);
  padding: 2px 0 4px;
  margin-top: 8px;
}

.chart-config-sub-alt { background: var(--bg-elev); }

.chart-config-sub .chart-config-row:hover {
  background: color-mix(in srgb, var(--accent) 12%, transparent);
}
.chart-config-sub-head {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.7rem;
  color: var(--text-muted);
  padding: 6px 8px 2px 10px;
}

.chart-config-sub-copy {
  display: flex;
  flex: 1 1 auto;
  min-width: 0;
  flex-direction: column;
  gap: 2px;
}
.chart-config-sub-name {
  color: var(--text);
  font-size: 0.8rem;
  font-weight: 600;
}
.chart-config-sub-description {
  color: var(--text-dim);
  font-size: 0.75rem;
  line-height: 1.35;
  white-space: normal;
}
.chart-config-sub-type {
  color: var(--text-muted);
  font-size: 0.7rem;
}

.chart-config-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  padding: 4px 0 8px 20px;
  font-size: 0.75rem;
  color: var(--text-dim);
}
.chart-filter-range { display: inline-flex; align-items: center; gap: 4px; }
.chart-filter-range input {
  width: 60px;
  height: 22px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--text);
  font-size: 0.75rem;
  padding: 0 4px;
}
.chart-filter-val { display: inline-flex; align-items: center; gap: 4px; }

.chart-filter-mode {
  display: inline-flex;
  gap: 4px;
}

.chart-config-filter .chart-filter-mode { flex: 0 0 100%; }

.chart-chan-btn.chart-filter-btn { padding: 0; }

.chart-filter-separator {
  align-self: center;
  width: 1px;
  height: 16px;
  background: var(--border);
}

.chart-config-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 3px 0 3px 10px;
}
.chart-config-row:hover { background: var(--bg-elev); }
.chart-config-dim { font-size: 0.85rem; }

.chart-config-window {
  height: 24px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--text-dim);
  font-size: 0.75rem;
}
.chart-mode-btn { min-width: 44px; }
.chart-config-channels { display: inline-flex; gap: 4px; flex: 0 0 auto; margin-left: auto; }
.chart-chan-btn {
  min-width: 26px;
  height: 24px;
  
  padding: 0 8px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--text-dim);
  cursor: pointer;
  font-size: 0.75rem;
}
.chart-chan-btn:hover:not(:disabled) { border-color: var(--accent); }
.chart-chan-btn.active {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

.chart-chan-btn:disabled { opacity: 0.3; cursor: not-allowed; }
.position-chart .canvas-wrap { position: relative; height: 460px; }

.position-chart.chart-expanded .canvas-wrap { height: 620px; }
.position-chart.chart-expanded .chart-config-tree { max-height: none; overflow-y: visible; }

.position-chart .chart-view-controls {
  position: absolute;
  top: 6px;
  right: 6px;
  z-index: 2;
  display: flex;
  gap: 4px;
}
.position-chart .chart-view-btn {
  width: 28px;
  height: 28px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--bg-elev);
  color: var(--text-dim);
  cursor: pointer;
  font-size: 0.9rem;
  line-height: 1;
}
.position-chart .chart-view-btn:hover { border-color: var(--accent); color: var(--text); }

.position-chart.chart-fullscreen {
  position: fixed;
  inset: 0;
  z-index: 1000;
  background: var(--bg);
  padding: 12px;
  overflow: auto;
}
.position-chart.chart-fullscreen .canvas-wrap { height: calc(100vh - 120px); }

.position-chart .chart-plot-empty {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  color: var(--text-dim);
  font-size: 0.85rem;
}


.explore-chart .chart-plot-empty {
  position: static;
  min-height: 220px;
}
.explore-layout { display: flex; align-items: flex-start; gap: 14px; }
.explore-plot-wrap { flex: 1 1 auto; min-width: 0; position: relative; }
.explore-svg { width: 100%; height: auto; display: block; }
.explore-seg { cursor: pointer; }

.explore-seg:focus:not(:focus-visible) { outline: none; }
.explore-shape { stroke: var(--bg); stroke-width: 1; transition: opacity 0.12s ease; }
.explore-seg.dimmed .explore-shape { opacity: 0.35; }
.explore-seg.selected .explore-shape { stroke: var(--accent); stroke-width: 2.5; }

.explore-seg:focus-visible .explore-shape { stroke: var(--accent); stroke-width: 2.5; }
.explore-slice-label { font-size: 12px; fill: var(--text); pointer-events: none; }
.explore-slice-leader { fill: none; stroke: var(--text-dim); stroke-width: 1.25; pointer-events: none; }
.explore-tile-label { font-size: 12px; font-weight: 600; fill: var(--text); pointer-events: none; }
.explore-tile-value { font-size: 11px; fill: var(--text); opacity: 0.85; pointer-events: none; }
.explore-axis-label { font-size: 11px; fill: var(--text-dim); }
.explore-cell { stroke: var(--border); }
.explore-cell-empty { fill: transparent; }
.explore-cell-value { font-size: 11px; fill: var(--text); pointer-events: none; }

.explore-drill { cursor: pointer; }
.explore-drill:focus:not(:focus-visible) { outline: none; }
.explore-drill-disc {
  fill: var(--accent);
  stroke: var(--bg);
  stroke-width: 2;
}
.explore-drill:hover .explore-drill-disc { stroke: var(--text); }
.explore-drill:focus-visible .explore-drill-disc { stroke: var(--text); stroke-width: 2.5; }
.explore-drill-glyph {
  fill: none;
  stroke: #fff;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  pointer-events: none;
}
.explore-omission { font-size: 0.8rem; margin: 2px 0 6px; }
.explore-members-empty { padding: 8px; }
.explore-crumbs { display: flex; align-items: center; flex-wrap: wrap; gap: 4px; margin: 2px 0 6px; }
.explore-crumb {
  background: transparent;
  border: none;
  color: var(--accent);
  cursor: pointer;
  font-size: 0.85rem;
  padding: 2px 4px;
  border-radius: var(--radius-sm);
}
.explore-crumb:hover { background: var(--bg-elev); }
.explore-crumb-sep { color: var(--text-muted); }
.explore-crumb-here { font-size: 0.85rem; color: var(--text); padding: 2px 4px; }
.explore-selection {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 8px;
  font-size: 0.85rem;
}
.explore-selection-label { color: var(--text); }
.explore-legend { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.explore-legend-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: transparent;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  color: var(--text);
  cursor: pointer;
  font-size: 0.75rem;
  padding: 3px 8px;
}

.explore-legend-chip:hover { border-color: var(--text-dim); }

.explore-legend-chip.selected {
  border-color: var(--accent); background: var(--accent-bg);
  box-shadow: 0 0 0 2px var(--accent);
}
.explore-swatch { width: 10px; height: 10px; border-radius: 2px; display: inline-block; }

.explore-members {
  flex: 0 0 var(--explore-member-basis, 250px);
  max-width: 55%;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  overflow: hidden;
}
.explore-members-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  border-bottom: 1px solid var(--border);
  font-size: 0.85rem;
}
.explore-members-list { max-height: 420px; overflow: auto; }

.explore-members-table { width: 100%; table-layout: fixed; border-collapse: collapse; }

.explore-members-table th.explore-member-value-th { min-width: 74px; }
.explore-members-table th {
  
  position: sticky;
  top: 0;
  z-index: 1;
  background: var(--bg-card);
  text-align: left;
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 600;
  color: var(--text-dim);
  
  font-size: 0.7rem;
  border-bottom: 1px solid var(--border);
  white-space: nowrap;
}

.explore-members-table th.sort-th { padding: 0; }
.explore-members-table th.sort-th .sort-th-btn {
  display: flex;
  align-items: center;
  gap: 2px;
  padding: 5px 10px;
}


.explore-members-table:not(.explore-members-wide) th.explore-member-value-th { width: 42%; }
.explore-members-table.explore-members-wide { table-layout: auto; }
.explore-members-table th.explore-member-value-th .sort-th-btn {
  justify-content: flex-end;
  padding-left: 8px;
  padding-right: 8px;
}

.explore-member-th-label { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.explore-members-table th .sort-th-btn::after { flex: 0 0 auto; }

.explore-members-table tbody tr:hover { background: var(--bg-elev); }
.explore-member-cell { padding: 0; }

.explore-member-row {
  display: flex;
  align-items: baseline;
  padding: 4px 10px;
  font-size: 0.8rem;
  color: var(--text);
  text-decoration: none;
}

td.explore-member-value {
  padding: 4px 10px;
  font-size: 0.8rem;
  color: var(--text-dim);
  white-space: nowrap;
}
.explore-type-row { display: flex; gap: 6px; margin: 8px 0; }
.explore-agg-rows, .explore-bin-rows { display: flex; flex-direction: column; gap: 6px; margin: 6px 0; }
.explore-agg-row, .explore-bin-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  font-size: 0.8rem;
}
.explore-agg-label { color: var(--text-dim); }
.explore-bin-field { display: inline-flex; align-items: center; gap: 4px; color: var(--text-dim); }
.explore-bin-field input[type="number"] { width: 60px; }
.explore-bin-field input[type="text"] { width: 130px; }
@media (max-width: 860px) {
  .explore-layout { flex-direction: column; }
  .explore-members { flex: 1 1 auto; width: 100%; max-width: 100%; }
}


.position-chart .chart-picker {
  position: absolute;
  z-index: 20;
  min-width: 140px;
  max-height: 220px;
  overflow-y: auto;
  background: var(--bg-elev);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  box-shadow: var(--shadow);
  padding: 4px;
}
.position-chart .chart-picker-title {
  font-size: 0.7rem;
  color: var(--text-muted);
  padding: 2px 6px 4px;
}

.position-chart .chart-picker-item {
  display: block;
  width: 100%;
  text-align: left;
  background: transparent;
  border: none;
  border-radius: var(--radius-sm);
  color: var(--text);
  text-decoration: none;
  font-size: 0.8rem;
  line-height: 1.2;
  padding: 4px 6px;
  cursor: pointer;
}
.position-chart .chart-picker-item:hover { background: var(--bg-hover); }


.chart-config-card .chart-exclude { position: relative; display: inline-flex; align-items: center; }

.chart-config-card .chart-exclude-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.chart-config-card .chart-exclude-panel {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 20;
  min-width: 240px;
  background: var(--bg-elev);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  box-shadow: var(--shadow);
  padding: 6px;
}
.chart-config-card .chart-exclude-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font-size: 0.7rem;
  color: var(--text-muted);
  padding: 0 2px 6px;
}

.chart-config-card .chart-exclude-refs {
  border-top: 1px solid var(--border);
  margin-top: 6px;
  padding-top: 6px;
  max-height: 160px;
  overflow-y: auto;
}
.chart-config-card .chart-exclude-ref {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font-size: 0.8rem;
  padding: 2px 0;
}
.chart-config-card .chart-ref-stale { color: var(--red); font-style: italic; }
.chart-config-card .chart-ref-remove {
  border: none;
  background: transparent;
  color: var(--text-dim);
  cursor: pointer;
  font-size: 1rem;
  line-height: 1;
}
.chart-config-card .chart-exclude-add {
  display: flex;
  flex-direction: column;
  gap: 3px;
  margin-top: 6px;
  font-size: 0.75rem;
  color: var(--text-dim);
}


.chart-config-card .chart-exclude-search {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 2px 2px 4px;
}

.chart-config-card .chart-exclude-chips {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
  font-size: 0.75rem;
  margin: 6px 0 2px;
  min-height: 22px;
}

.ai-btn.ai-not-ready {
  opacity: 0.4;
  cursor: not-allowed;
}


.profile-shell { max-width: 700px; margin: 0 auto; }


.profile-card { margin-bottom: 20px; }


.profile-error-card { border: 1px solid var(--red); }
.profile-error-title { margin-top: 0; color: var(--red); }
.profile-resubscribe {
  margin-bottom: 20px;
  border: 1px solid var(--orange);
  background: rgba(249, 115, 22, 0.08);
}
.profile-resubscribe-title { margin-top: 0; color: var(--orange); }


.profile-card-lede { margin-bottom: 12px; }


.profile-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.profile-row-wrap { flex-wrap: wrap; }
.profile-row-title { font-weight: 600; }
.profile-row-note { margin-top: 2px; }

.profile-row-ending { margin-top: 2px; color: var(--text); font-weight: 600; }
.profile-row-lede { margin: 0; }
.profile-sub-note { margin-top: 4px; }

.profile-row-action { white-space: nowrap; }
.profile-actions { display: flex; gap: 8px; align-items: center; }
.profile-clerk-row { margin-top: 12px; }


.profile-segmented {
  display: flex;
  gap: 4px;
  background: var(--bg-inset);
  border-radius: var(--radius-sm);
  padding: 3px;
}
.profile-segmented .btn { border: none; box-shadow: none; }


.profile-choice-list { display: flex; flex-direction: column; gap: 8px; }
.profile-choice { display: flex; align-items: center; gap: 8px; cursor: pointer; }

.profile-choice-top { align-items: flex-start; }


.danger-zone { border: 1px solid var(--red); }
.profile-danger-title { color: var(--red); }
.profile-danger-title-flush { margin-top: 0; }
.profile-delete-modal { max-width: 440px; }
.profile-delete-list { margin: 12px 0; padding-left: 20px; line-height: 1.8; }
.profile-delete-warning { font-weight: 600; }
.profile-modal-actions { margin-top: 16px; display: flex; gap: 8px; justify-content: flex-end; }

.deactivated-note { margin: 12px 0; }


.pricing-eyebrow { text-align: center; }


.pricing-banner {
  display: block;
  width: 100%;
  max-width: 560px;
  margin: 0 auto 1.25rem;
  padding: 0.6rem 1rem;
  border-radius: 8px;
  text-align: center;
  font-weight: 600;
}
.pricing-banner-beta { background: var(--accent); color: #fff; }
.pricing-banner-trial {
  background: var(--accent-bg);
  color: var(--text);
  border: 1px solid var(--accent);
  cursor: pointer;
}
.pricing-banner-comp {
  background: var(--bg-inset);
  color: var(--text);
  border: 1px solid var(--border);
  font-weight: 400;
}


.pricing-code-row { display: flex; align-items: center; gap: 8px; margin: 0 0 14px; }
.pricing-code-label { font-size: 0.85em; }

.pricing-code-result { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: -6px 0 14px; font-size: 0.85rem; }
.pricing-code-result-ok { color: var(--green); }
.pricing-code-result-error { color: var(--red); }
.pricing-code-result-note { color: var(--text-dim); }
.pricing-code-input {
  flex: 1; min-width: 0;
  padding: 6px 10px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--bg-inset);
  color: var(--text);
  text-transform: uppercase;
}


.btn.pricing-cta-inert:disabled { opacity: 0.6; }



.scope-note {
  font-weight: normal;
  font-size: 0.8rem;
}
.cluster-note {
  font-size: 0.85rem;
  margin: -0.3rem 0 0.6rem;
}


.analytics-chart-controls {
  display: flex;
  gap: 0.5rem;
  align-items: center;
  flex-wrap: wrap;
  margin-bottom: 0.5rem;
}
.analytics-nothing-charted {
  margin: 0;
  padding: 2rem 0;
  text-align: center;
  color: var(--text-dim);
}

.analytics-chart-col {
  width: 1%;
  white-space: nowrap;
  text-align: center;
}


.sched-panel { padding: 1rem; margin-bottom: 1.5rem; }
.sched-panel > h3 { margin-top: 0; }
.sched-controls { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; }
.sched-controls label { font-size: 0.85rem; }
.sched-num {
  width: 80px; padding: 4px 8px; border: 1px solid var(--border);
  border-radius: 4px; background: var(--bg); color: var(--text);
}
.sched-note { font-size: 0.8rem; }
.sched-lag { font-size: 0.8rem; margin-top: 0.5rem; }
.sched-fleet { font-size: 0.8rem; margin-top: 0.5rem; }
.sched-bands { margin-top: 0.75rem; }
.sched-bands table { width: 100%; font-size: 0.8rem; }
.sched-bands th, .sched-bands td { text-align: right; }
.sched-bands th:first-child, .sched-bands td:first-child { text-align: left; }
.sched-bands-hint { font-size: 0.75rem; margin-top: 0.35rem; }


.model-slot-warn { color: var(--orange); margin-left: 0.5rem; }


.flow-header { display: flex; align-items: flex-start; gap: 20px; padding: 20px 0; }
.flow-header-compact { align-items: center; gap: 16px; padding: 0; margin-bottom: 20px; flex-wrap: wrap; }
.flow-header-identity { display: flex; align-items: center; gap: 10px; }
.flow-header-compact .detail-title h2 { margin: 0; font-size: 1.1rem; }
.flow-header-actions { display: flex; align-items: center; gap: 8px; margin-left: auto; }

@media (max-width: 768px) {
  .flow-header { flex-wrap: wrap; gap: 12px; padding: 16px 0; }
  .flow-header-compact { padding: 0; }
  .flow-header:not(.flow-header-compact) .flow-header-identity { order: 3; flex-basis: 100%; }
}


.analytics-panel {
  padding: 1rem;
  margin-top: 1rem;
}

.analytics-panel-first {
  margin-top: 0;
}

.card .analytics-panel-title {
  margin: 0 0 0.5rem;
}
.analytics-scroll {
  overflow-x: auto;
}
.analytics-scroll-gap {
  margin-top: 0.75rem;
}

.analytics-panel-note {
  margin: 0.5rem 0 0;
}
.analytics-table {
  width: 100%;
}
.analytics-chart {
  height: 300px;
}

.analytics-chart-sm {
  height: 280px;
}
.analytics-chart-xs {
  height: 240px;
}
.analytics-chart-gap {
  margin-top: 0.75rem;
}
.analytics-toolbar {
  display: flex;
  gap: 0.75rem;
  align-items: center;
  flex-wrap: wrap;
  margin-bottom: 0.75rem;
}
.analytics-live-error {
  color: var(--red);
}
.analytics-truncated-note {
  margin: 0 0 0.5rem;
}




.lp-toolbar { display: flex; gap: 0.5rem; align-items: center; margin-bottom: 1rem; }
.lp-error-card { padding: 1.5rem; max-width: 520px; }
.lp-error-title { margin: 0 0 0.35rem; font-weight: 600; }
.lp-error-body { margin: 0 0 0.9rem; color: var(--text-dim); }
.lp-table-card { padding: 1rem; margin-bottom: 1.5rem; overflow-x: auto; }
.lp-select-col { width: 2rem; }
.lp-name { font-weight: 600; }
.lp-sub { font-size: 0.8rem; }
.lp-count { font-size: 0.75rem; }
.lp-missing { color: var(--red); }


.lp-serving { display: inline-flex; gap: 0.35rem; align-items: center; justify-content: flex-end; flex-wrap: wrap; }
.lp-serving-platform { display: inline-flex; gap: 0.15rem; align-items: center; }
.lp-serving-platform .btn-status:disabled { opacity: 0.35; cursor: not-allowed; }
.lp-note { margin: 0.75rem 0 0; font-size: 0.8rem; }
.lp-compare-card { padding: 1rem; }
.lp-compare-head { display: flex; gap: 0.75rem; align-items: center; flex-wrap: wrap; margin-bottom: 0.75rem; }
.lp-compare-head h3 { margin: 0; }
.lp-inconclusive { margin: 0 0 0.75rem; }


.account-banner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  flex-wrap: wrap;
  padding: 8px 16px;
  font-size: 0.875rem;
  border-bottom: 1px solid var(--border);
  background: var(--bg-inset);
}

.account-banner a,
.account-banner .account-banner-cta {
  color: var(--accent);
  font-weight: 600;
  white-space: nowrap;
}
.account-banner-calm {
  color: var(--text-dim, var(--text));
}
.account-banner-urgent {
  color: var(--text);
  border-bottom-color: var(--accent);
}
.account-banner-ended {
  color: var(--red, #dc3545);
  border-bottom-color: var(--red, #dc3545);
}




:root {
  --sd-gutter: 16px;      
  --sd-tap: 44px;         
  --sd-bar-h: 48px;       
  --sd-chip-ink: 30px;    
  --sd-hairline: 1px;
  
  --sd-jump-h: calc(var(--sd-chip-ink) + 14px + var(--sd-hairline));
  
  --sd-label-size: 0.75rem;
  --sd-row-size: 1rem;
  --sd-hero-size: 2.125rem;
}


@media (max-width: 600px) {
  
  :root { --sd-type-ramp: 1.0625; }
  html { font-size: calc(100% * var(--sd-type-ramp)); }

  
  .cta-bg-card { transform: rotate(0deg); }

  
  .header h1 { font-size: calc(1rem / var(--sd-type-ramp)); }
  .header-right .btn-sm { font-size: calc(0.75rem / var(--sd-type-ramp)); }
}


.sd-row-v, .sd-hero-value, .sd-metric-v, .sd-num {
  font-variant-numeric: tabular-nums;
}


.sd-bar {
  position: sticky;
  top: 0;
  
  z-index: 60;
  display: flex;
  align-items: center;
  gap: 8px;
  height: var(--sd-bar-h);
  padding: 0 4px;
  background: var(--bg-card);
  border-bottom: var(--sd-hairline) solid var(--border);
}
.sd-bar-title {
  flex: 1;
  min-width: 0;
  font-size: 1.0625rem;
  font-weight: 600;
  line-height: 1.25;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sd-bar-btn {
  flex: none;
  width: var(--sd-tap);
  height: var(--sd-tap);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  background: none;
  color: var(--text);
  cursor: pointer;
}


.sd-jump {
  position: sticky;
  top: var(--sd-bar-h);
  z-index: 59;
  display: flex;
  gap: 5px;
  
  padding: 7px 12px;
  background: var(--bg-card);
  border-bottom: var(--sd-hairline) solid var(--border);
  overflow-x: auto;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.sd-jump::-webkit-scrollbar { display: none; }

.sd-jump.is-overflowing {
  -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 34px), transparent);
  mask-image: linear-gradient(to right, #000 calc(100% - 34px), transparent);
}
.sd-jump-chip {
  position: relative;
  flex: none;
  min-height: var(--sd-chip-ink);
  padding: 0 10px;
  border: var(--sd-hairline) solid var(--border);
  border-radius: calc(var(--sd-chip-ink) / 2);
  background: transparent;
  color: var(--text-dim);
  font-size: 0.78125rem;   
  font-weight: 600;
  white-space: nowrap;
  cursor: pointer;
}

.sd-jump-chip.is-active {
  border-color: transparent;
  background: var(--text);
  color: var(--bg-card);
}

.sd-jump-chip::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  height: var(--sd-tap);
  transform: translateY(-50%);
}


.sd-label {
  display: flex;
  align-items: baseline;
  gap: 8px;
  padding: 18px var(--sd-gutter) 6px;
  font-size: var(--sd-label-size);
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--text-muted);
}
.sd-label-action { margin-left: auto; font-size: 0.8125rem; font-weight: 600; }
.sd-row {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: var(--sd-tap);
  padding: 6px var(--sd-gutter);
  background: var(--bg-card);
  border-bottom: var(--sd-hairline) solid var(--border);
  font-size: var(--sd-row-size);
  line-height: 1.4;
}
.sd-row-k { flex: 0 1 auto; min-width: 0; }
.sd-row-v { margin-left: auto; font-weight: 700; text-align: right; }
.sd-row-chev { flex: none; color: var(--text-muted); font-size: 1.25rem; }


.sd-hero {
  padding: 14px var(--sd-gutter) 12px;
  background: var(--bg-card);
  border-bottom: var(--sd-hairline) solid var(--border);
}
.sd-hero-label {
  font-size: var(--sd-label-size);
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--text-muted);
}
.sd-hero-value {
  margin: 2px 0;
  font-size: var(--sd-hero-size);
  font-weight: 700;
  line-height: 1.15;
}
.sd-hero-value.is-up { color: var(--green); }
.sd-hero-value.is-down { color: var(--red); }
.sd-hero-sub { font-size: 0.8125rem; color: var(--text-dim); }


.sd-metrics {
  display: grid;
  grid-template-columns: 1fr 1fr;
  background: var(--bg-card);
  border-bottom: var(--sd-hairline) solid var(--border);
}
.sd-metric {
  display: flex;
  align-items: baseline;
  gap: 8px;
  
  padding: 8px var(--sd-gutter);
  
  line-height: 1.4;
  border-bottom: var(--sd-hairline) solid var(--border);
}

.sd-metric-k { font-size: 0.875rem; color: var(--text-dim); }
.sd-metric-v { margin-left: auto; font-size: 1.0625rem; font-weight: 700; }

.sd-metric:last-child:nth-child(odd) { grid-column: 1 / -1; }


.sd-filterbar {
  display: flex;
  gap: 8px;
  align-items: center;
  padding: 10px var(--sd-gutter);
  background: var(--bg-card);
  border-bottom: var(--sd-hairline) solid var(--border);
  overflow-x: auto;
}
.sd-filter-btn {
  flex: none;
  min-height: 36px;
  padding: 0 14px;
  border: var(--sd-hairline) solid var(--border);
  border-radius: 18px;
  background: var(--bg-inset);
  color: var(--text);
  font-size: 0.875rem;
  font-weight: 600;
  cursor: pointer;
}
.sd-filter-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 20px;
  height: 20px;
  margin-left: 6px;
  border-radius: 10px;
  background: var(--accent);
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
}
.sd-filter-summary { font-size: 0.875rem; color: var(--text-dim); white-space: nowrap; }


@media (max-width: 600px) {
  

  body.sd-page .header { display: none; }

  .sd-surface { padding-left: 0; padding-right: 0; }
  .sd-surface .card {
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    margin: 0;
    padding: 0;
  }
  .sd-surface .card:hover { box-shadow: none; }
  .sd-surface .card h3 {
    margin: 0;
    padding: 18px var(--sd-gutter) 6px;
    font-size: var(--sd-label-size);
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--text-muted);
  }

  
  input, select, textarea { font-size: 1rem !important; }
}


@media (pointer: coarse) {
  
  
  .header .btn-bare,
  .theme-toggle,
  .footer-link,
  [data-test="banner-demo"] a {
    position: relative;
  }
  .header .btn-bare::after,
  .theme-toggle::after,
  .footer-link::after,
  [data-test="banner-demo"] a::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    height: var(--sd-tap);
    transform: translateY(-50%);
  }

  
  .header-left h1 .btn-bare {
    min-height: var(--sd-tap);
    line-height: var(--sd-tap);
  }

  
  @media (max-width: 600px) {
    .site-footer .footer-link { display: inline-block; line-height: 48px; }
  }
}




@media (max-width: 600px) {
  
  
  .landing-hero {
    min-height: 0;
    padding: 16px var(--sd-gutter) 24px;
    display: block;
  }
  .hero-stack { max-width: none; }

  
  .hero-accent-rect,
  .hero-accent-rect-2 { display: none; }

  
  .hero-badge {
    position: static;
    
    transform: none;
    padding: 0 0 10px;
    background: none;
    border-radius: 0;
    box-shadow: none;
    font-size: var(--sd-label-size);
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--text-muted);
  }
  .hero-badge::before { display: none; }

  
  .hero-dark-card {
    background: transparent !important;
    padding: 0;
    border-radius: 0;
    box-shadow: none;
    transform: none;
  }
  .hero-dark-card h1 {
    color: var(--text) !important;
    font-size: 2.125rem;
    line-height: 1.1;
  }
  .hero-white-card {
    margin: 0;
    
    transform: none;
    padding: 14px 0 0;
    background: transparent;
    border-radius: 0;
    box-shadow: none;
  }

  
  .hero-actions {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
    margin-top: 20px;
  }
  .hero-actions > .btn-primary,
  .hero-actions > .hero-btn-secondary,
  .hero-actions > .btn {
    width: 100%;
    justify-content: center;
  }

  
  .landing-features { padding: 8px 0 24px; }
  
  .landing-features > .section-label,
  .landing-features > .section-heading,
  .landing-stats > .section-label,
  .landing-stats > .section-heading {
    padding-inline: var(--sd-gutter);
  }
  .landing-features-grid {
    grid-template-columns: 1fr;
    min-height: 0;
    gap: 0;
  }
  .landing-features-grid .landing-feature-card {
    transform: none;
    margin: 0;
    padding: 12px var(--sd-gutter);
    background: var(--bg-card);
    border: 0;
    border-bottom: var(--sd-hairline) solid var(--border);
    border-radius: 0;
    box-shadow: none;
    display: grid;
    grid-template-columns: 2rem 1fr;
    column-gap: 12px;
    align-items: baseline;
  }
  
  .landing-features-grid .landing-feature-card.dark {
    background: var(--bg-card);
    color: var(--text);
    border-color: var(--border);
  }
  .landing-features-grid .landing-feature-card.dark .feature-desc { color: var(--text-dim); }
  .landing-features-grid .landing-feature-card.dark .feature-number { color: var(--text-muted); }
  .landing-feature-card .feature-icon { display: none; }
  .landing-feature-card .feature-number {
    grid-column: 1;
    grid-row: 1 / span 2;
    font-size: var(--sd-label-size);
  }
  

  .landing-feature-card .feature-number-suffix { display: none; }
  .landing-feature-card .feature-title { grid-column: 2; margin: 0 0 2px; font-size: 1rem; }
  .landing-feature-card .feature-desc { grid-column: 2; margin: 0; font-size: 0.875rem; }

  
  .landing-stats { padding: 8px 0 24px; }
  .landing-stats-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
  }
  .landing-stats-row .landing-stat-card {
    transform: none;
    margin: 0;
    
    min-width: 0;
    
    color: var(--text);
    padding: 12px var(--sd-gutter);
    background: var(--bg-card);
    border: 0;
    border-bottom: var(--sd-hairline) solid var(--border);
    border-radius: 0;
    box-shadow: none;
  }

  .landing-stats-row .landing-stat-card:nth-child(2) .stat-number { color: var(--accent); }
  .landing-stats-row .landing-stat-card:nth-child(2) .stat-label { color: var(--text-dim); }

  
  .landing-marquee,
  .marquee-track {
    pointer-events: none;
    touch-action: pan-y;
  }
}




@media (max-width: 600px) {
  
  .sd-surface { padding-top: 0; }

  
  
  .sd-item {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 2px 8px;
    min-height: var(--sd-tap);
    padding: 8px var(--sd-gutter);
    background: var(--bg-card);
    border-bottom: var(--sd-hairline) solid var(--border);
    color: var(--text);
    text-decoration: none;
    font-size: var(--sd-row-size);
    line-height: 1.35;
  }
  
  .sd-item > * { pointer-events: none; }
  
  .sd-item.row-link > * { pointer-events: auto; }
  
  
  .sd-item.row-link > .row-link-cell { position: static; }
  .sd-item.row-link > .row-link-cell::after { content: none; }
  .top-ranks-ai-compact { flex: none; display: inline-flex; align-items: center; }
  .top-ranks-ai-compact::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    height: var(--sd-tap);
    transform: translateY(-50%);
  }
  
  .top-ranks-progress,
  .top-ranks-note {
    padding-left: var(--sd-gutter);
    padding-right: var(--sd-gutter);
  }
  .sd-item-name { font-weight: 700; }
  
  .sd-item-danger { color: var(--red); }
  
  button.sd-item {
    width: 100%;
    text-align: left;
    font-family: inherit;
    border-left: 0;
    border-right: 0;
    border-top: 0;
    cursor: pointer;
  }
  .sd-item-icon { flex: none; font-size: 1rem; }
  
  .sd-item-text {
    flex: 1 1 auto;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .sd-item-side {
    margin-left: auto;
    flex: none;
    font-size: 0.8125rem;
    color: var(--text-dim);
  }
  
  .sd-item-sub {
    flex-basis: 100%;
    min-width: 0;
    margin: 0;
    font-size: 0.8125rem;
    color: var(--text-dim);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  
  .sd-item-title {
    flex-basis: 100%;
    min-width: 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-weight: 600;
  }

  
  .sd-block {
    padding: 10px var(--sd-gutter) 14px;
    background: var(--bg-card);
    border-bottom: var(--sd-hairline) solid var(--border);
  }
  .sd-block > :first-child { margin-top: 0; }
  .sd-block > :last-child { margin-bottom: 0; }

  
  
  .sd-actions {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 12px var(--sd-gutter);
    background: var(--bg-card);
    border-bottom: var(--sd-hairline) solid var(--border);
  }
  .sd-actions > .btn,
  .sd-actions > .btn-primary,
  .sd-actions > button,
  .sd-actions > a {
    width: 100%;
    min-height: var(--sd-tap);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
  }

  
  
  .sd-surface .help-icon {
    width: var(--sd-tap);
    height: var(--sd-tap);
    margin-left: 0;
    border: 0;
    background: none;
  }
  
  .sd-surface .help-icon .help-icon-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border: 1px solid var(--border);
    border-radius: 50%;
    background: var(--bg);
  }
  .sd-surface .help-icon:hover .help-icon-mark,
  .sd-surface .help-icon:focus .help-icon-mark {
    border-color: var(--accent, var(--orange));
  }

  
  
  .sd-clamp {
    display: -webkit-box;
    -webkit-line-clamp: 12;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  
  .sd-clamp.is-open {
    display: block;
    -webkit-line-clamp: none;
    overflow: visible;
  }
  
  .sd-clamp > :first-child { margin-top: 0; }
  .sd-clamp h1, .sd-clamp h2, .sd-clamp h3, .sd-clamp h4 {
    margin: 12px 0 4px;
    font-size: 1rem;
  }
  .sd-clamp p, .sd-clamp ul, .sd-clamp ol { margin: 0 0 8px; }

  
  
  .sd-textarea-tall {
    width: 100%;
    min-height: 40vh;
    resize: vertical;
  }

  
  
  .stat-tile-grid {
    grid-template-columns: 1fr 1fr;
    gap: 0;
    margin-bottom: 12px;
  }
  .stat-tile {
    
    min-width: 0;
    flex-direction: row;
    align-items: baseline;
    gap: 8px;
    padding: 6px var(--sd-gutter);
    border: 0;
    border-bottom: var(--sd-hairline) solid var(--border);
    border-radius: 0;
    box-shadow: none;
  }
  .stat-tile-label { font-size: 0.875rem; opacity: 1; color: var(--text-dim); }
  .stat-tile-value {
    margin-left: auto;
    font-size: 1.0625rem;
    font-variant-numeric: tabular-nums;
    text-align: right;
  }
  
  .stat-tile-sub { flex-basis: 100%; margin-left: 0; text-align: right; }
  
  .stat-tile:last-child:nth-child(odd) { grid-column: 1 / -1; }

  
  
  .data-row-4 {
    grid-template-columns: 1fr 1fr;
    gap: 0;
  }
  .data-row-4 > .card {
    min-width: 0;
    padding: 8px var(--sd-gutter);
    border: 0;
    border-bottom: var(--sd-hairline) solid var(--border);
    border-radius: 0;
    box-shadow: none;
  }

  
  
  .sd-scroll {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  
  
  .sd-stack { display: block; }
}




@media (max-width: 600px) {
  
  .sd-rowlink {
    display: block;
    width: 100%;
    padding: 0;
    border: 0;
    background: none;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
  }
  
  .sd-rowlink .sd-row-k {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .sd-rowlink .sd-row-v {
    flex: none;
    font-weight: 500;
    color: var(--text-dim);
    font-size: 0.8125rem;
  }
  
  .sd-bleed { margin-inline: calc(var(--sd-gutter) * -1); }

  
  .sd-rowpanel {
    padding: 10px var(--sd-gutter) 14px;
    background: var(--bg-inset);
    border-bottom: var(--sd-hairline) solid var(--border);
    font-size: 0.875rem;
  }
  .sd-rowpanel-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
  }
  .sd-rowpanel-actions > .btn {
    flex: 1 1 auto;
    min-height: var(--sd-tap);
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  .sd-rowpanel-turn { margin-bottom: 0.5rem; }
  .sd-rowpanel-turn span { white-space: pre-wrap; }

  
  .sd-actionstack {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 12px var(--sd-gutter);
    background: var(--bg-card);
    border-bottom: var(--sd-hairline) solid var(--border);
  }
  .sd-actionstack > .btn,
  .sd-actionstack > .btn-primary {
    display: flex;
    width: 100%;
    min-height: var(--sd-tap);
    align-items: center;
    justify-content: center;
    
  }

  

  
  .profile-shell > h2,
  .profile-shell > .tab-strip { padding-inline: var(--sd-gutter); }
  .profile-shell .card {
    margin-inline: 0;
    padding-inline: var(--sd-gutter);
    border-left: 0;
    border-right: 0;
    border-radius: 0;
    box-shadow: none;
  }
  .profile-shell .card:hover { box-shadow: none; }

  
  .profile-shell .referral-card-wrap { padding-inline: 0; }
  .profile-shell .referral-card {
    padding-inline: var(--sd-gutter);
    border-left: 0;
    border-right: 0;
    border-radius: 0;
  }

  
  .tab-strip.is-overflowing {
    -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 28px), transparent);
    mask-image: linear-gradient(to right, #000 calc(100% - 28px), transparent);
  }

  
  .profile-shell .profile-plan-subscribe .btn,
  .profile-shell .profile-plan-subscribe .btn-primary,
  .profile-shell [data-test="section-top-up"] .btn-primary { min-height: var(--sd-tap); }

  

  
  .sd-listpage .detail-header,
  .sd-listpage .sd-listpage-subtitle,
  .sd-listpage .filters,
  .sd-listpage .error-pill { padding-inline: var(--sd-gutter); }
  
  
  .sd-listpage .detail-header .btn-back { margin-inline-start: calc(var(--sd-gutter) * -1 + 4px); }

  
  .newsletter-page { padding-inline: 0; }
  .newsletter-page > h2,
  .newsletter-page > .newsletter-lede { padding-inline: var(--sd-gutter); }
  .newsletter-page .newsletter-main > .card,
  .newsletter-page .newsletter-sidebar > .card {
    margin-inline: 0;
    border-left: 0;
    border-right: 0;
    border-radius: 0;
    box-shadow: none;
  }
}




@media (max-width: 600px) {

  
  .list-view:has(> .portfolio-layout) { padding-left: 0; padding-right: 0; }
  .list-view:has(> .portfolio-layout) > .page-header { display: none; }
  .list-view:has(> .portfolio-layout) > .portfolio-layout { gap: 0; }
  .list-view:has(> .portfolio-layout) > .portfolio-layout > .portfolio-main {
    padding: 0 8px;
  }

  .sd-secnav {
    background: var(--bg-card);
    border-bottom: var(--sd-hairline) solid var(--border);
  }
  .sd-secnav-btn {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    min-height: 56px;
    padding: 6px var(--sd-gutter);
    border: 0;
    background: none;
    color: var(--text);
    text-align: left;
    cursor: pointer;
  }
  .sd-secnav-text { display: flex; flex-direction: column; min-width: 0; }
  .sd-secnav-kicker {
    font-size: var(--sd-label-size);
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--text-muted);
  }
  
  .sd-secnav-name {
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.25;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .sd-secnav-chev { margin-left: auto; flex: none; color: var(--text-muted); }

  
  
  .sd-sheet-backdrop {
    position: fixed;
    inset: 0;
    z-index: 200;
    background: rgba(0, 0, 0, 0.45);
  }
  .portfolio-rail.is-sheet,
  .filters.is-sheet { display: none; }
  .portfolio-rail.is-sheet.is-open,
  .filters.is-sheet.is-open {
    display: block;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 201;
    max-height: 72vh;
    overflow-y: auto;
    margin: 0;
    padding: 0 0 12px;
    background: var(--bg-card);
    border: var(--sd-hairline) solid var(--border);
    border-radius: 14px 14px 0 0;
    box-shadow: 0 -8px 32px rgba(0, 0, 0, 0.28);
  }
  .sd-sheet-head {
    position: sticky;
    top: 0;
    z-index: 1;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px var(--sd-gutter);
    background: var(--bg-card);
    border-bottom: var(--sd-hairline) solid var(--border);
  }
  .sd-sheet-title {
    font-size: var(--sd-label-size);
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--text-muted);
  }
  .sd-sheet-close {
    margin-left: auto;
    width: var(--sd-tap);
    height: var(--sd-tap);
    flex: none;
    border: 0;
    background: none;
    color: var(--text);
    font-size: 1.5rem;
    line-height: 1;
    cursor: pointer;
  }

  
  .portfolio-rail.is-sheet.is-open .rail-head,
  .portfolio-rail.is-sheet.is-open .rail-item {
    display: flex;
    align-items: center;
    min-height: var(--sd-tap);
    padding: 0 var(--sd-gutter);
  }
  .portfolio-rail.is-sheet.is-open .rail-add,
  .portfolio-rail.is-sheet.is-open .rail-archive {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: var(--sd-tap);
    min-height: var(--sd-tap);
    opacity: 1;
  }
  .portfolio-rail.is-sheet.is-open .rail-empty { padding: 8px var(--sd-gutter); }

  
  .filters.is-sheet.is-open .filter-group {
    width: 100%;
    padding: 8px var(--sd-gutter);
  }
  .filters.is-sheet.is-open .filter-group select,
  .filters.is-sheet.is-open .filter-group input {
    width: 100%;
    min-width: 0;
    min-height: var(--sd-tap);
  }
  .sd-filter-btn { min-height: var(--sd-tap); }

  
  .stock-table .ai-btn { position: relative; }
  .stock-table .ai-btn::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    height: var(--sd-tap);
    transform: translateY(-50%);
  }
  
  .stock-table th.sort-th .sort-th-btn { padding: 13px 8px; }
  
  .stock-table tbody tr.row-link { height: var(--sd-tap); }
  
  .help-icon { width: 24px; height: 24px; font-size: 0.75rem; }
  .help-icon::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    height: var(--sd-tap);
    transform: translateY(-50%);
  }
  
  .list-header .edit-icon {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: var(--sd-tap);
    
    opacity: 1;
  }
  .edit-icon-label { font-size: 0.875rem; font-weight: 600; }

  
  .portfolio-main .empty-state { padding: 20px var(--sd-gutter); }
  .portfolio-main .empty-state .btn-primary {
    width: 100%;
    min-height: var(--sd-tap);
  }

  
  .strategies-grid { gap: 0; }
  .sd-surface .strategy-card {
    background: var(--bg-card);
    border-bottom: var(--sd-hairline) solid var(--border);
    border-radius: 0;
  }
  .sd-surface .strategy-card .strategy-header {
    min-height: var(--sd-tap);
    padding: 8px var(--sd-gutter);
  }
  .sd-surface .strategy-card .strategy-title { gap: 10px; }
  .sd-surface .strategy-card .strategy-icon { width: 32px; height: 32px; }
  .sd-surface .strategy-card h3 {
    margin: 0;
    padding: 0;
    font-size: 0.9375rem;
    font-weight: 600;
    letter-spacing: normal;
    text-transform: none;
    color: var(--text);
  }
  .sd-listhead {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 4px var(--sd-gutter) 10px;
  }
  .sd-listhead-title { margin: 0; font-size: 1.25rem; line-height: 1.2; }
  .sd-listhead-action { margin-left: auto; flex: none; }
}




:root {
  --sd-header-h: calc(55px + max(10px, env(safe-area-inset-top, 0px)));
}

@media (max-width: 600px) {
  
  body.sd-under-header .header { min-height: var(--sd-header-h); }
  
  body.sd-under-header .sd-jump {
    top: var(--sd-header-h);
    padding-left: var(--sd-gutter);
    padding-right: var(--sd-gutter);
  }

  
  .sd-totop {
    position: fixed;
    right: var(--sd-gutter);
    bottom: calc(var(--sd-gutter) + env(safe-area-inset-bottom, 0px));
    z-index: 58;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: var(--sd-tap);
    padding: 0 16px;
    border: var(--sd-hairline) solid var(--border);
    border-radius: calc(var(--sd-tap) / 2);
    background: var(--bg-card);
    color: var(--text);
    font-size: 0.8125rem;
    font-weight: 600;
    box-shadow: var(--shadow-lg);
    cursor: pointer;
  }

  
  .sd-longform .md-content a,
  
  .privacy-lede a,
  .doc-body .md-content a {
    padding-block: 15px;
    
    overflow-wrap: anywhere;
  }

  
  .privacy-lede { line-height: 2; }
  .privacy-lede a { padding-block: 5px; }

  
  .sd-longform .md-content li.sd-link-row {
    display: flex;
    align-items: center;
    min-height: var(--sd-tap);
  }
}




@media (max-width: 600px) {
  .pricing-page.pricing-compact { padding: 0 var(--sd-gutter) 32px; }
  .pricing-compact .pricing-head { padding-top: 10px; }
  .pricing-compact .section-heading {
    font-size: 1.625rem;
    line-height: 1.15;
    margin-bottom: 6px;
  }

  
  .pricing-compact .pricing-banner {
    margin: 6px 0 10px;
    padding: 8px 12px;
    font-size: 0.8125rem;
  }

  .pricing-compact .pricing-plan { margin-top: 12px; }
  .pricing-compact .pricing-panel { padding: 16px; }
  .pricing-compact .pricing-billing-toggle { margin-bottom: 12px; }
  .pricing-compact .pricing-price { font-size: 2.5rem; }
  
  .pricing-compact .pricing-billing-toggle button,
  .pricing-compact .pricing-cta,
  .pricing-compact .pricing-top-up .btn { min-height: var(--sd-tap); }
  .pricing-compact .pricing-questions a {
    display: inline-flex; align-items: center; min-height: var(--sd-tap);
  }
}




.sd-longform { max-width: 800px; margin: 0 auto; }

@media (max-width: 600px) {
  
  .sd-longform { padding-left: 0; padding-right: 0; }
  .sd-longform > .md-content { padding-inline: var(--sd-gutter); }
  
  .sd-longform .md-content {
    font-size: var(--sd-row-size);
    line-height: 1.65;
    
    overflow-wrap: break-word;
  }
  
  .sd-longform .md-content h2 {
    scroll-margin-top: calc(var(--sd-header-h) + var(--sd-jump-h));
  }

  
  
  .sd-longform .md-content table {
    display: block;
    width: 100%;
    border-collapse: collapse;
  }
  .sd-longform .md-content thead { display: none; }
  .sd-longform .md-content tbody { display: block; }
  .sd-longform .md-content tr {
    display: block;
    padding: 10px 0;
    border-bottom: var(--sd-hairline) solid var(--border);
  }
  .sd-longform .md-content td { display: block; padding: 3px 0; }
  .sd-longform .md-content td:first-child {
    font-weight: 700;
    color: var(--text);
  }
  .sd-longform .md-content td[data-th]::before {
    content: attr(data-th);
    display: block;
    font-size: var(--sd-label-size);
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--text-muted);
  }

  
  .contact-form-select,
  .contact-form-textarea { min-height: var(--sd-tap); }
  .contact-form-actions .btn,
  .contact-form-actions .btn-primary { min-height: var(--sd-tap); }
  
  .privacy-agent-row {
    min-height: var(--sd-tap);
    align-items: center;
  }
  .privacy-agent-row input[type="checkbox"] {
    flex: none;
    width: 22px;
    height: 22px;
  }
}




@media (max-width: 600px) {
  .doc-layout.doc-compact {
    display: block;
    padding: 0 0 32px;
  }

  
  .doc-compact .doc-bar {
    position: sticky;
    top: var(--sd-header-h);
    
    z-index: 60;
    display: flex;
    align-items: center;
    gap: 10px;
    
    height: var(--sd-bar-h);
    padding: 0 var(--sd-gutter);
    background: var(--bg-card);
    border-bottom: var(--sd-hairline) solid var(--border);
  }
  
  body.sd-under-header .doc-compact .sd-jump {
    top: calc(var(--sd-header-h) + var(--sd-bar-h));
  }
  .doc-compact .doc-contents-btn {
    flex: none;
    
    min-height: var(--sd-tap);
    padding: 0 14px;
    border: var(--sd-hairline) solid var(--border);
    border-radius: 18px;
    background: var(--bg-inset);
    color: var(--text);
    font-size: 0.875rem;
    font-weight: 600;
    cursor: pointer;
  }
  .doc-compact .doc-bar-here {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: var(--sd-label-size);
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--text-muted);
  }

  
  .doc-compact .doc-body { padding: 0 var(--sd-gutter); }
  .doc-compact .doc-intro { margin-bottom: 1rem; }
  .doc-compact .doc-intro h1 { font-size: 1.5rem; line-height: 1.15; }
  .doc-compact .doc-section { margin-bottom: 1.75rem; }
  
  .doc-compact .doc-section {
    scroll-margin-top: calc(var(--sd-header-h) + var(--sd-bar-h) + var(--sd-jump-h));
  }
  .doc-compact .doc-section .md-content { font-size: var(--sd-row-size); }
  
  .doc-compact .doc-figure img { max-width: 100%; height: auto; }

  
  .doc-compact .modal-overlay { align-items: flex-end; }
  .doc-sheet {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-height: 88vh;
    padding-bottom: env(safe-area-inset-bottom, 0px);
    background: var(--bg-card);
    border-top-left-radius: 16px;
    border-top-right-radius: 16px;
    box-shadow: var(--shadow-xl);
  }
  .doc-sheet-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: var(--sd-tap);
    padding: 0 var(--sd-gutter);
    border-bottom: var(--sd-hairline) solid var(--border);
  }
  .doc-sheet-title {
    font-size: var(--sd-label-size);
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--text-muted);
  }
  .doc-sheet-close {
    width: var(--sd-tap);
    height: var(--sd-tap);
    margin-right: -8px;
    border: 0;
    background: none;
    color: var(--text);
    font-size: 1.5rem;
    line-height: 1;
    cursor: pointer;
  }
  .doc-sheet-filter {
    margin: 10px var(--sd-gutter);
    width: auto;
    
    min-height: var(--sd-tap);
  }
  .doc-sheet-nav {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding-bottom: 8px;
  }
  
  .doc-sheet-link {
    display: flex;
    align-items: center;
    min-height: var(--sd-tap);
    padding: 0 var(--sd-gutter);
    border-bottom: var(--sd-hairline) solid var(--border);
    color: var(--text);
    text-decoration: none;
    font-size: var(--sd-row-size);
  }
  .doc-sheet-l1 { font-weight: 700; }
  .doc-sheet-l2 { padding-left: calc(var(--sd-gutter) + 16px); color: var(--text-dim); }
  .doc-sheet-link.doc-toc-on { background: var(--bg-inset); }

  
  .doc-compact .contact-form { padding: 12px 0; max-width: none; }
}




@media (max-width: 600px) {
  
  .filter-editor-main,
  .filter-editor-ref {
    min-width: 0;
    
    padding: 12px var(--sd-gutter);
    border-left: 0;
    border-right: 0;
    border-radius: 0;
  }
  .filter-editor-ref { margin-top: 12px; }

  
  .filter-editor-main .filter-group {
    padding: 8px 0 8px 8px;
    border-left-width: 2px;
  }
  .filter-adherence,
  .filter-group-header,
  .filter-criterion-header,
  .filter-add-row,
  .fe-ref-item { flex-wrap: wrap; }
  .filter-adherence { margin-bottom: 12px; }
  
  .fe-drag-row { gap: 4px; }

  
  .filter-criterion-header .crit-name {
    flex: 1 1 100%;
    min-width: 0;
  }
  
  .filter-criterion-header span.crit-name {
    white-space: normal; overflow-wrap: anywhere;
    height: auto; line-height: 1.3;
    padding: calc((var(--fe-line-h) - 1.3em) / 2) 4px;
  }

  
  .filter-condition-row,
  .filter-timing-row {
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
  }
  .filter-condition-row .ref-label,
  .filter-condition-row .btn-add-cond,
  .filter-condition-row .btn-remove-cond,
  .filter-condition-row .help-icon,
  .filter-condition-row .fe-inline-tier { flex: 0 0 auto; }
  
  .filter-condition-row .fe-fieldpick,
  .filter-condition-row .field-input { flex: 1 1 100%; }
  .filter-condition-row .op-select,
  .filter-timing-row .op-select,
  .filter-scoring-tier .op-select {
    flex: 1 1 30%;
    width: auto !important;
    min-width: 0;
    box-sizing: border-box;
  }
  .filter-condition-row .val-input,
  .filter-condition-row .crit-value-btn,
  .filter-condition-row .fe-basis-select,
  .filter-scoring-tier .val-input {
    flex: 1 1 45%;
    width: auto !important;
    min-width: 0;
    box-sizing: border-box;
  }
  
  .fe-band-row .fe-inline-band {
    flex: 1 1 100%;
    
    min-width: 0;
    display: flex;
    gap: 8px;
    white-space: normal;
  }
  .fe-inline-band .op-select { flex: 1 1 30%; }
  .fe-inline-band .val-input { flex: 1 1 45%; }
  .crit-value { display: flex; flex: 1 1 45%; }
  .crit-value,
  .crit-value-many { max-width: none; min-width: 0; }
  .filter-scoring-tier { flex-wrap: wrap; }
  .filter-scoring-tier .tier-label { width: auto; }

  
  .fe-timing-fold {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    
    flex: 1 1 200px;
    min-height: var(--sd-tap);
    padding: 0 4px;
    font-size: var(--sd-row-size);
    color: var(--text);
    text-align: left;
  }
  .fe-timing-caret { flex: none; font-size: 0.75rem; color: var(--text-dim); }
  
  .filter-timing-row .ref-label + .op-select { flex-basis: 60%; }
  .fe-timing-fold-text { min-width: 0; }

  
  .filter-criterion-header .crit-name { order: -2; flex-basis: calc(100% - 40px); }
  .filter-criterion-header .btn-remove { order: -1; }
  
  
  .filter-criterion-header { column-gap: 4px; }
  .filter-criterion-header .importance-select {
    flex: 1 1 0;
    min-width: 0;
    width: auto;
  }
  .filter-criterion-header .fe-moves-lead { margin-left: 0; }

  
  .filter-criterion textarea.crit-desc {
    resize: none;
    line-height: 1.4;
    field-sizing: content;
  }

  
  .fe-settings {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px 12px;
    margin-bottom: 8px;
  }
  
  .filter-editor-main > .filter-group > .filter-group-header { margin-bottom: 0; }
  .fe-settings .filter-adherence {
    flex-wrap: wrap;
    gap: 4px 2px;
    margin-bottom: 0;
    min-width: 0;
  }
  .fe-settings .filter-adherence label { margin-right: 4px; }
  .filter-adherence .adherence-select {
    flex: 1 1 100%;
    min-width: 0;
    min-height: var(--sd-tap);
    font-size: 1rem;
    padding: 4px 8px;
    border: 1px solid var(--border);
    border-radius: 6px;
    background: var(--bg-card);
    color: var(--text);
  }

  
  .fe-add-wrap { display: block; }
  .fe-add-menu-btn { width: 100%; }
  .fe-add-menu,
  .fe-save-menu { top: auto; left: 0; right: auto; min-width: 220px; }
  .fe-add-menu { top: calc(100% + 4px); }
  .fe-save-menu { bottom: calc(100% + 4px); left: auto; right: 0; }
  .fe-add-menu .dropdown-item,
  .fe-save-menu .dropdown-item {
    width: 100%;
    min-height: var(--sd-tap);
    font-size: var(--sd-row-size);
    font-family: inherit;
    color: var(--text);
    text-align: left;
  }
  .fe-add-menu-sort { border-top: 1px solid var(--border); margin-top: 4px; padding-top: 8px; }
  .filter-editor-page .filter-save-bar .fe-save-more-wrap { flex: 0 0 auto; }
  .filter-editor-page .filter-save-bar .fe-save-more {
    flex: 0 0 auto;
    min-width: var(--sd-tap);
    padding-left: 0;
    padding-right: 0;
  }

  
  .fe-ref-item code { white-space: normal; overflow-wrap: anywhere; }

  
  .fe-find {
    width: 100%;
    margin-left: 0;
    font-size: 1rem;
    min-height: var(--sd-tap);
    box-sizing: border-box;
  }
  
  .fe-fieldpick { display: flex; }
  .fe-fieldpick-pop {
    left: 0;
    right: 0;
    width: auto;
    max-width: calc(100vw - 2 * var(--sd-gutter));
    box-sizing: border-box;
  }
  .fe-fieldpick-opt,
  .fe-fieldpick-sechead {
    min-height: var(--sd-tap);
    align-items: center;
    font-size: var(--sd-row-size);
  }
  .fe-fieldpick-opt { flex-wrap: wrap; row-gap: 0; }
  
  .fe-ref-links { flex-wrap: wrap; gap: 0 18px; }
  .fe-ref-links a {
    display: inline-flex;
    align-items: center;
    min-height: var(--sd-tap);
    font-size: var(--sd-row-size);
  }

  
  .filter-editor-layout .crit-name,
  .filter-editor-layout .crit-desc,
  .filter-editor-layout .field-input,
  .filter-editor-layout .val-input,
  .filter-editor-layout .op-select,
  .filter-editor-layout .fe-basis-select,
  .filter-editor-layout .importance-select,
  .filter-editor-layout .adherence-opt,
  .filter-editor-layout .btn-add-cond,
  .filter-editor-layout .btn-remove,
  .filter-editor-layout .btn-remove-cond,
  .filter-editor-layout .filter-add-btn,
  .filter-editor-layout .filter-group-label,
  .filter-editor-layout .filter-scoring-toggle,
  .filter-editor-layout .fe-ref-item,
  .filter-editor-layout .fe-ref-heading > .btn-bare,
  .filter-editor-layout .fe-drag-handle-inline,
  .filter-editor-layout .filter-macro h4 > .btn-bare,
  .fe-ref-disclose,
  .fe-sum-open,
  .fe-sum-move {
    min-height: var(--sd-tap);
    min-width: 24px;
    box-sizing: border-box;
  }
  
  .filter-editor-layout .btn-add-cond,
  .filter-editor-layout .filter-add-btn,
  .filter-editor-layout .filter-scoring-toggle,
  .filter-editor-layout .adherence-opt {
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  
  .filter-editor-layout .btn-remove,
  .filter-editor-layout .btn-remove-cond,
  .filter-editor-layout .filter-group-label,
  .filter-editor-layout .fe-drag-handle-inline,
  .filter-editor-layout .help-icon {
    position: relative;
    min-width: 24px;
    box-sizing: border-box;
  }
  .filter-editor-layout .btn-remove::after,
  .filter-editor-layout .btn-remove-cond::after,
  .filter-editor-layout .filter-group-label::after,
  .filter-editor-layout .fe-drag-handle-inline::after,
  .filter-editor-layout .help-icon::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    height: var(--sd-tap);
    transform: translateY(-50%);
  }
  .filter-editor-layout .fe-ref-item,
  .filter-editor-layout .fe-ref-heading > .btn-bare,
  .filter-editor-layout .filter-macro h4 > .btn-bare {
    display: flex;
    align-items: center;
  }
  
  .fe-drag-row > .fe-drag-handle { display: none; }

  
  
  .fe-sum-open { flex-wrap: wrap; row-gap: 2px; }
  
  
  .fe-sum-name {
    flex: 0 0 100%; max-width: 100%; font-size: 0.9375rem;
    
    white-space: normal; overflow-wrap: anywhere;
    height: auto; min-height: var(--fe-line-h); line-height: 1.3;
    padding: calc((var(--fe-line-h) - 1.3em) / 2) 4px;
    box-sizing: border-box;
  }
  .fe-sum-rule { white-space: normal; overflow-wrap: anywhere; }

  
  .fe-sum:not(.fe-sum-unscored) .fe-sum-meta { display: none; }
  
  .fe-sum-importance { font-size: 0.625rem; padding: 1px 6px; }
  .fe-sum-move { width: var(--sd-tap); }

  
  .fe-ref-disclose {
    margin-top: 12px;
    padding: 0 var(--sd-gutter);
    border-top: var(--sd-hairline) solid var(--border);
    background: var(--bg-card);
    font-family: inherit;
    font-size: var(--sd-label-size);
    font-weight: 700;
    letter-spacing: 0.07em;
  }
  
  .fe-reference .fe-ref-body { grid-template-columns: 1fr; }

  
  .filter-editor-page { padding-bottom: 84px; }
  .filter-editor-page .filter-save-bar {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 55;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px var(--sd-gutter);
    padding-bottom: max(8px, env(safe-area-inset-bottom));
    background: var(--bg-card);
    border-top: var(--sd-hairline) solid var(--border);
  }
  .filter-editor-page .filter-save-bar .btn {
    flex: 1;
    min-height: var(--sd-tap);
  }
  .filter-editor-page .filter-save-bar .save-status {
    flex: 1 1 100%;
    order: -1;
    font-size: 0.8125rem;
  }
}




@media (max-width: 600px) {
  
  .sd-wizard .wizard-nav {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 55;
    flex-wrap: wrap;
    margin-top: 0;
    padding: 8px var(--sd-gutter);
    padding-bottom: max(8px, env(safe-area-inset-bottom));
    background: var(--bg-card);
    border-top: var(--sd-hairline) solid var(--border);
  }
  
  .sd-wizard { padding-bottom: 92px; }
  .sd-wizard .wizard-nav .btn { min-height: var(--sd-tap); }
  
  .sd-wizard .wizard-nav .btn.active { flex: 1; }
  .sd-wizard .wizard-nav-spacer { flex: 0; }
  .sd-wizard .wizard-nav-hint,
  .sd-wizard .wizard-nav .save-status,
  .sd-wizard .wizard-nav .quick-scan-cost,
  .sd-wizard .wizard-nav .text-error {
    flex: 1 1 100%;
    order: -1;
    font-size: 0.8125rem;
  }

  
  .sd-wizard .wizard-nav .btn.active:disabled {
    opacity: 1;
    background: var(--bg-inset);
    border-color: var(--border);
    color: var(--text-muted);
  }
  .sd-wizard .wizard-nav-hint { color: var(--text-dim); }

  
  .sd-wizard .wizard-step { min-height: 0; }
  .sd-wizard [data-test="section-quick-scan-describe"] {
    min-height: calc(100vh - 250px);
  }
  .sd-wizard [data-test="section-quick-scan-describe"] .form-group {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
  }
  .sd-wizard [data-test="section-quick-scan-describe"] textarea {
    flex: 1;
    min-height: 300px;
  }

  
  .sd-wizard .wizard-rail-title { display: inline; }
  .sd-wizard .wizard-rail { gap: 6px; margin: 8px 0 12px; }
  
  .sd-wizard .src-tile-mode .switch-toggle { min-height: var(--sd-tap); padding: 4px 12px; }
  .sd-wizard .wizard-rail-step {
    min-height: var(--sd-tap);
    padding: 4px 10px;
    font-size: 0.8125rem;
  }

  
  .sd-wizard .flow-header {
    gap: 8px;
    padding: 12px 0;
    align-items: center;
  }
  
  .sd-wizard .flow-header-title,
  .sd-wizard .flow-header-identity {
    order: 3;
    flex: 1 1 100%;
    min-width: 0;
    font-size: 1.0625rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .sd-wizard .flow-header-identity h2 {
    min-width: 0;
    font-size: 1.0625rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  
  .sd-wizard .flow-header-identity,
  .sd-wizard .flow-header-identity h2 {
    min-height: var(--sd-tap);
    line-height: var(--sd-tap);
  }
  .sd-wizard .flow-header-actions { flex: none; margin-left: auto; gap: 6px; }
  .sd-wizard .flow-header .btn { flex: none; min-height: var(--sd-tap); }

  
  .sd-wizard .edit-icon,
  .sd-wizard .help-icon {
    position: relative;
    min-width: 24px;
    box-sizing: border-box;
  }
  .sd-wizard .edit-icon::after,
  .sd-wizard .help-icon::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    height: var(--sd-tap);
    transform: translateY(-50%);
  }

  
  .sd-wizard .filter-editor-page { padding-bottom: 0; }
}





.sd-resultbar {
  padding-block: 6px;
}
.sd-resultbar .sd-filter-btn {
  min-height: var(--sd-tap);
}
.sd-resultbar .sd-jump {
  position: static;
  top: auto;
  flex: 1 1 auto;
  min-width: 0;
  padding: 7px 0;
  background: transparent;
  border-bottom: 0;
}

.sd-viewswitch {
  flex: none;
  min-height: var(--sd-tap);
  padding: 0 12px;
  border: var(--sd-hairline) solid var(--border);
  border-radius: 18px;
  background: var(--bg-inset);
  color: var(--text);
  font-size: 0.875rem;
  font-weight: 600;
  white-space: nowrap;
  cursor: pointer;
}
.sd-viewswitch[aria-pressed="true"] {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}


.sd-candlist {
  border-top: var(--sd-hairline) solid var(--border);
}
.sd-candrow {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-height: 60px;
  justify-content: center;
  padding: 8px var(--sd-gutter);
  border-bottom: var(--sd-hairline) solid var(--border);
  color: inherit;
  text-decoration: none;
}
.sd-candrow-head {
  display: flex;
  align-items: baseline;
  gap: 8px;
  line-height: 1.25;
}
.sd-candrow-sym {
  flex: 0 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.01em;
}

.sd-candrow-metric {
  flex: 0 1 auto;
  min-width: 0;
  margin-left: auto;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 1.0625rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.sd-candrow-sub {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  line-height: 1.3;
  font-size: 0.8125rem;
  color: var(--text-dim);
  font-variant-numeric: tabular-nums;
}
.sd-candrow-lead,
.sd-candrow-cell {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sd-candrow-lead {
  font-weight: 600;
  color: var(--text-muted);
}
.sd-candrow-k { color: var(--text-muted); }

.sd-candrow-rank {
  flex: 0 0 auto;
  min-width: 1.5rem;
  color: var(--text-dim);
  font-size: 0.8125rem;
  font-variant-numeric: tabular-nums;
}

.sd-candrow-sub-name { grid-template-columns: minmax(0, 1fr) auto; }

.sd-candrow-ai {
  flex: none;
  min-width: var(--sd-tap);
  position: relative;
}
.sd-candrow-ai::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  height: var(--sd-tap);
  transform: translateY(-50%);
}
.sd-candrow-class { min-width: 0; }
.sd-candmore {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px var(--sd-gutter);
  color: var(--text-dim);
  font-size: 0.875rem;
}



.sd-tablescroll:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: -2px;
}


.sd-sheet {
  align-self: flex-end;
  width: 100%;
  max-width: none;
  max-height: 85vh;
  overflow-y: auto;
  margin: 0;
  padding: 12px 0 calc(12px + env(safe-area-inset-bottom, 0px));
  border-left: 0;
  border-right: 0;
  border-bottom: 0;
  border-radius: 14px 14px 0 0;
}
.sd-sheet-head {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 0 var(--sd-gutter) 8px;
}
.sd-sheet-title {
  flex: 1 1 auto;
  min-width: 0;
  font-size: var(--sd-label-size);
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--text-muted);
}


.sd-pagehead {
  border-bottom: var(--sd-hairline) solid var(--border);
}
.sd-pagehead-row {
  display: flex;
  align-items: center;
  gap: 4px;
  min-height: 48px;
  padding-inline: 4px;
}
.sd-pagehead-title {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 1.0625rem;
  font-weight: 600;
}
.sd-headbtn {
  flex: none;
  width: var(--sd-tap);
  height: var(--sd-tap);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  background: none;
  color: var(--text);
  font-size: 1rem;
  cursor: pointer;
}
.sd-headbtn.active { color: var(--accent); }


.sd-pagehead-row.scan-head-anchor,
.sd-pagehead-anchored .sd-actionrow,
.sd-pagehead-anchored .sd-pagehead-note {
  border-bottom: var(--sd-hairline) solid var(--border);
}

.sd-pagehead-anchored {
  display: contents;
  border-bottom: 0;
}


.sd-actionrow {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  padding: 0 var(--sd-gutter) 10px;
}

.sd-actionrow-solo { grid-template-columns: minmax(0, 1fr); }
.sd-pagehead-note {
  display: block;
  padding: 0 var(--sd-gutter) 8px;
  font-size: 0.8125rem;
  color: var(--text-dim);
}

@media (max-width: 600px) {
  
  .sd-scanpage { padding-inline: 0; }

  
  .sd-candmore .btn { min-height: var(--sd-tap); }
  .sd-sheet-head .btn {
    flex: none;
    min-height: var(--sd-tap);
    display: inline-flex;
    align-items: center;
  }
  
  .sd-sheet button,
  .sd-sheet select,
  .sd-sheet input,
  .sd-sheet textarea { min-height: var(--sd-tap); }
  .sd-sheet a[href] {
    display: inline-flex;
    align-items: center;
    min-height: var(--sd-tap);
  }
  
  .sd-actionrow > .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    min-width: 0;
    min-height: var(--sd-tap);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  
  .sd-scanpage .scan-results-card {
    margin-inline: 0;
    padding: 0;
    border-left: 0;
    border-right: 0;
    border-radius: 0;
    box-shadow: none;
  }
  .sd-scanpage .notice-banner {
    margin-inline: 0;
    border-left: 0;
    border-right: 0;
    border-radius: 0;
  }
  
  [data-test="panel-scan-results"].sd-rowsview {
    display: block;
    height: auto;
    min-height: 0;
  }

  
  .sd-scanpage .source-attribution a {
    display: inline-flex;
    align-items: center;
    min-height: var(--sd-tap);
  }

  
  .sd-pagehead-row .time-badge {
    flex: none;
    white-space: nowrap;
    font-size: 0.75rem;
  }
}





.sd-chartinspect {
  position: absolute;
  left: 8px;
  top: 8px;
  z-index: 5;
  min-width: 160px;
  max-width: calc(100% - 16px);
  padding: 8px 10px 10px;
  border: var(--sd-hairline) solid var(--border);
  border-radius: 10px;
  background: var(--bg-card);
  box-shadow: var(--shadow-lg, 0 6px 24px rgba(15, 23, 42, 0.18));
  font-size: 0.875rem;
}
.sd-chartinspect-head {
  display: flex;
  align-items: center;
  gap: 8px;
}
.sd-chartinspect-sym {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 700;
  font-size: 1rem;
}
.sd-chartinspect-close {
  flex: none;
  width: var(--sd-tap);
  height: var(--sd-tap);
  margin: calc(var(--sd-tap) / -4) -10px calc(var(--sd-tap) / -4) 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  background: none;
  color: var(--text-muted);
  font-size: 1.125rem;
  cursor: pointer;
}
.sd-chartinspect-co {
  margin-bottom: 4px;
  color: var(--text-dim);
  font-size: 0.75rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sd-chartinspect-row {
  display: flex;
  gap: 12px;
  align-items: baseline;
}
.sd-chartinspect-k {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--text-dim);
  font-size: 0.75rem;
}
.sd-chartinspect-v {
  flex: none;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}


.sd-chartsheet-bar {
  position: sticky;
  top: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  padding: 8px var(--sd-gutter);
  margin: 0 calc(var(--sd-gutter) * -1) 8px;
  background: var(--bg-card);
  border-bottom: var(--sd-hairline) solid var(--border);
}

@media (max-width: 600px) {
  
  .position-chart.chart-expanded .canvas-wrap,
  .position-chart .canvas-wrap { height: 300px; }
  
  .position-chart.chart-fullscreen .canvas-wrap { height: calc(100vh - 120px); }

  
  .sd-chartsheet button,
  .sd-chartsheet select,
  .sd-chartsheet input,
  .sd-chartsheet textarea { min-height: var(--sd-tap); }
  .sd-chartsheet a[href] {
    display: inline-flex;
    align-items: center;
    min-height: var(--sd-tap);
  }

  
  
  .chart-config-card.sd-chartsheet {
    position: fixed;
    inset: 0;
    z-index: 210;
    max-height: none;
    width: auto;
    max-width: none;
    margin: 0;
    padding: 0 var(--sd-gutter) calc(16px + env(safe-area-inset-bottom, 0px));
    border: 0;
    border-radius: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
  }

  
  .sd-chartsheet .chart-config-search { width: 100%; }
  .sd-chartsheet .chart-config-row { flex-wrap: wrap; }
  .sd-chartsheet .chart-config-dim { flex: 1 1 100%; min-width: 0; }
  .sd-chartsheet .chart-config-channels {
    margin-left: 0;
    flex-wrap: wrap;
  }

  
  .sd-chartpage .chart-summary {
    display: flex;
    flex-wrap: nowrap;
    gap: 10px;
    min-height: var(--sd-tap);
    overflow-x: auto;
    scrollbar-width: none;
  }
  .sd-chartpage .chart-summary > * { flex: none; }

  
  .sd-chartpage { padding-inline: 0; }
  .sd-chartpage .chart-topbar { padding-inline: var(--sd-gutter); }

  
  .sd-chartdata .table-wrap { max-width: 100%; }
  .sd-chartdata .table-wrap:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: -2px;
  }
}




@media (max-width: 600px) {
  
  
  .sd-surface .card-header { flex-wrap: wrap; row-gap: 14px; }
  
  .sd-surface [data-test="section-price-chart"] .card-header > div {
    flex: 1 1 100%;
    flex-wrap: wrap;
    min-width: 0;
    row-gap: 6px;
  }
  .sd-surface .chart-periods {
    flex: 1 1 100%;
    min-width: 0;
    overflow-x: auto;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
  .sd-surface .chart-periods::-webkit-scrollbar { display: none; }
  
  .sd-surface .charts-timeframe { flex-wrap: wrap; min-width: 0; }
  .sd-surface .charts-timeframe .chart-periods { flex: 1 1 0; }
  
  .sd-surface .charts-timeframe-label { display: none; }
  
  .sd-surface .chart-periods .btn { flex: none; }
  
  .sd-surface .charts-basis { flex: 1 1 100%; }
  .sd-surface .charts-basis .btn { flex: none; }

  
  .charts-tab-strip { margin-bottom: 0; min-width: 0; }
  .charts-compact-card { min-width: 0; }

  
  
  .sd-surface.page-content { padding-top: 0; padding-bottom: 0; }
  
  .sd-surface [data-test^="section-"] { scroll-margin-top: calc(var(--sd-bar-h) + 46px); }


  
  .sd-clamp-4 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    line-clamp: 4;
    overflow: hidden;
  }
  
  .sd-more-btn {
    display: block;
    width: 100%;
    min-height: var(--sd-tap);
    margin: 2px 0 6px;
    padding: 0;
    border: 0;
    background: none;
    color: var(--accent);
    font-size: 0.875rem;
    font-weight: 600;
    text-align: left;
    cursor: pointer;
  }

  
  .sd-surface .scoring-grid { gap: 6px; }
  .sd-surface .scoring-header { margin-bottom: 0; }
  .sd-surface .scoring-row-body { padding-bottom: 8px; }
  .scoring-row-toggle {
    flex: none;
    width: 32px;
    align-self: stretch;
    min-height: var(--sd-tap);
    margin-left: 4px;
    border: 0;
    background: none;
    color: var(--text-dim);
    font-size: 0.7rem;
    cursor: pointer;
  }

  
  .sd-surface .help-icon,
  .sd-surface .scoring-edit-btn,
  .sd-surface a:not(.btn) { position: relative; }
  .sd-surface .help-icon::after,
  .sd-surface .scoring-edit-btn::after,
  .sd-surface a:not(.btn)::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    height: var(--sd-tap);
    transform: translateY(-50%);
  }
  
  .sd-surface .scoring-header .help-icon { width: 24px; height: 24px; }
  .sd-surface .scoring-edit-btn { padding: 0 6px; }

  

  
  .sd-surface .scoring-name { display: flex; align-items: center; gap: 2px; min-width: 0; }

  
  .sd-surface .description-meta { padding-top: 14px; row-gap: 16px; }
  .sd-surface .external-links { gap: 14px 8px; }
  
  .sd-surface .scoring-item { padding: 6px 8px; }
  .sd-surface .scoring-header { min-height: 48px; }

  
  .sd-surface [data-test="news-list"] .analyst-link,
  .sd-surface .research-source-list a { display: block; }
  
  .sd-surface .source-link a { display: inline-block; line-height: 48px; }
}






:root {
  --wheel-explore: #0f766e;
  --wheel-strategize: #c2410c;
  --wheel-record: #7c3aed;
  --wheel-monitor: #2563eb;
}

[data-theme="dark"] {
  --wheel-explore: #2dd4bf;
  --wheel-strategize: #fb923c;
  --wheel-record: #a78bfa;
  --wheel-monitor: #60a5fa;
}



.lp-page { display: flex; flex-direction: column; }

.landing-beta-banner {
  text-align: center; padding: 0.55rem 1rem;
  background: var(--accent); color: #fff;
  font-weight: 600; font-size: 0.95rem;
}
.landing-beta-banner a { color: #fff; text-decoration: underline; margin-left: 0.4rem; }

.lp-hero { padding: 72px 40px 32px; max-width: 1100px; margin: 0 auto; width: 100%; }
.lp-hero.narrow { max-width: 780px; text-align: center; }


.lp-hero.stacked .hero-stack { margin-inline: auto; }


@media not all and (max-width: 600px) {
  .lp-hero.stacked { padding-bottom: 56px; }
  .lp-hero.stacked .hero-dark-card h1 { font-size: clamp(2.5rem, 6vw, 3.25rem); }
}

.lp-eyebrow {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 0.8rem; font-weight: 600; letter-spacing: 0.08em;
  text-transform: uppercase; color: var(--text-dim); margin-bottom: 16px;
}

.lp-headline {
  font-family: 'Space Grotesk', sans-serif;
  font-size: clamp(2.2rem, 5.5vw, 4rem);
  font-weight: 700; letter-spacing: -0.03em; line-height: 1.05;
  color: var(--charcoal); margin-bottom: 20px;
}
.lp-headline span { color: var(--accent); }

.lp-sub {
  font-size: 1.1rem; line-height: 1.7; color: var(--text-dim);
  max-width: 620px; margin-bottom: 28px;
}
.lp-hero.narrow .lp-sub { margin-left: auto; margin-right: auto; }

.lp-figure-section { padding: 24px 40px 72px; max-width: 1180px; margin: 0 auto; width: 100%; }
.lp-figure-section.wide { max-width: 1280px; }

.lp-figure-heading {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 0.8rem; font-weight: 600; letter-spacing: 0.1em;
  text-transform: uppercase; color: var(--text-dim);
  text-align: center; margin-bottom: 32px;
}

.lp-closing {
  padding: 64px 40px 96px; text-align: center;
  background: var(--bg-inset); border-top: 1px solid var(--border);
}
.lp-closing h2 {
  font-family: 'Space Grotesk', sans-serif;
  font-size: clamp(1.5rem, 3vw, 2.2rem); font-weight: 700;
  letter-spacing: -0.02em; color: var(--charcoal); margin-bottom: 10px;
}
.lp-closing p { color: var(--text-dim); margin-bottom: 24px; }


.lp-sim-thesis { max-width: 760px; margin: 0 auto 24px; text-align: center; color: var(--text-dim); line-height: 1.6; }
.lp-sim-chart { max-width: 860px; margin: 0 auto; }
.lp-sim-chart svg { display: block; width: 100%; height: auto; }
.lp-sim-grid line { stroke: var(--border); stroke-width: 1; }
.lp-sim-grid text { fill: var(--text-dim); font-size: 12px; paint-order: stroke; stroke: var(--bg); stroke-width: 4px; stroke-linejoin: round; }
.lp-sim-portfolio, .lp-sim-benchmark { fill: none; stroke-width: 2.5; stroke-linejoin: round; stroke-linecap: round; }
.lp-sim-portfolio { stroke: var(--accent); }
.lp-sim-benchmark { stroke: var(--text-dim); stroke-dasharray: 6 5; }
.lp-sim-legend { display: flex; gap: 20px; justify-content: center; margin-top: 8px; font-size: 0.9rem; color: var(--text-dim); }
.lp-sim-key::before { content: ""; display: inline-block; width: 22px; margin-right: 6px; vertical-align: middle; border-top: 3px solid var(--accent); }
.lp-sim-key.benchmark::before { border-top: 3px dashed var(--text-dim); }
.lp-sim-verdict { text-align: center; font-weight: 600; margin: 20px 0 8px; }
.lp-sim-figures { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px; max-width: 860px; margin: 16px auto 0; }
.lp-sim-figure { border: 1px solid var(--border); border-radius: 12px; background: var(--bg-card); padding: 14px 16px; }
.lp-sim-figure dt { font-size: 0.8rem; color: var(--text-dim); margin-bottom: 4px; }
.lp-sim-figure dd { margin: 0; font-family: 'Space Grotesk', sans-serif; font-size: 1.35rem; font-weight: 700; color: var(--charcoal); }
.lp-sim-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 16px; }
.lp-sim-card { border: 1px solid var(--border); border-radius: 12px; background: var(--bg-card); padding: 20px; }
.lp-sim-card h3 { font-family: 'Space Grotesk', sans-serif; font-size: 1.05rem; margin: 0 0 8px; color: var(--charcoal); }
.lp-sim-card p { margin: 0; color: var(--text-dim); line-height: 1.55; }
.lp-sim-plans { text-align: center; margin-top: 20px; color: var(--text-dim); }
.lp-sim-caveats ul { max-width: 760px; margin: 0 auto; padding-left: 1.25em; color: var(--text-dim); line-height: 1.6; }

@media (max-width: 620px) {
  .lp-sim-figures { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lp-sim-figure dd { font-size: 1.1rem; }
  .lp-sim-grid text { font-size: 22px; }
  .lp-sim-portfolio, .lp-sim-benchmark { stroke-width: 4; }
}



.landing-cta { display: flex; gap: 14px; flex-wrap: wrap; align-items: center; }
.landing-cta.centred { justify-content: center; }

.landing-cta-primary {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--accent); color: #fff;
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 600; font-size: 1rem;
  padding: 13px 26px; border-radius: 10px;
  border: 2px solid var(--accent); text-decoration: none; cursor: pointer;
  transition: transform .2s, background .2s, box-shadow .2s;
}
.landing-cta-primary:hover {
  background: var(--accent-dark); border-color: var(--accent-dark);
  transform: translateY(-2px); box-shadow: var(--shadow);
}

.landing-cta-soon { width: 100%; font-weight: 600; font-size: 1.05rem; margin: 4px 0; }
.landing-cta.centred .landing-cta-soon { text-align: center; }
.landing-cta-error { width: 100%; color: var(--red); font-size: 0.9rem; margin-top: 6px; }



.lp-spoke-link {
  display: block; text-decoration: none;
  padding: 14px 16px; border-radius: 12px;
  border: 1px solid var(--border); background: var(--bg-card);
  transition: transform .18s, border-color .18s, box-shadow .18s;
}
.lp-spoke-link:hover,
.lp-spoke-link:focus-visible {
  border-color: var(--q-colour, var(--accent));
  transform: translateY(-2px);
  box-shadow: var(--shadow);
}
.lp-spoke-link.compact { padding: 11px 13px; }

.lp-spoke-label {
  display: block;
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 600; font-size: 0.98rem; color: var(--charcoal);
}
.lp-spoke-link.compact .lp-spoke-label { font-size: 0.9rem; }

.lp-spoke-pitch {
  display: block; margin-top: 4px;
  font-size: 0.86rem; line-height: 1.5; color: var(--text-dim);
}
.lp-spoke-link.compact .lp-spoke-pitch {
  font-size: 0.8rem;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden;
}

.lp-spoke-more {
  display: block; margin-top: 8px;
  font-size: 0.78rem; font-weight: 600; color: var(--q-colour, var(--accent));
  opacity: 0; transition: opacity .18s;
}
.lp-spoke-link:hover .lp-spoke-more,
.lp-spoke-link:focus-visible .lp-spoke-more { opacity: 1; }



.lp-stacked { display: grid; gap: 20px; }
.lp-stack-panel {
  --q-colour: var(--accent);
  border: 1px solid var(--border); border-top: 3px solid var(--q-colour);
  border-radius: 14px; padding: 20px; background: var(--bg-card);
}
.lp-stack-head { margin-bottom: 14px; }
.lp-stack-dot {
  display: inline-block; width: 10px; height: 10px; border-radius: 50%;
  background: var(--q-colour); margin-right: 8px; vertical-align: middle;
}
.lp-stack-verb {
  display: inline; font-family: 'Space Grotesk', sans-serif;
  font-size: 1.25rem; font-weight: 700; color: var(--charcoal);
}
.lp-stack-blurb { margin-top: 6px; font-size: 0.9rem; color: var(--text-dim); }
.lp-stack-spokes { list-style: none; display: grid; gap: 10px; margin: 0; padding: 0; }

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



.lp-narrow-only { display: none; }


@media (max-width: 1059px) {
  .lp-wheel .lp-wide-only { display: none !important; }
  .lp-wheel .lp-narrow-only { display: grid; }
}

@media (max-width: 900px) {
  .lp-wide-only { display: none !important; }
  .lp-narrow-only { display: grid; }
  .lp-stacked-grid { grid-template-columns: minmax(0, 1fr); }
  .lp-hero { padding: 48px 20px 24px; }
  .lp-figure-section { padding: 16px 20px 56px; }
  .lp-closing { padding: 48px 20px 72px; }
}




.lp-wheel-line {
  font-family: 'Space Grotesk', sans-serif;
  font-size: clamp(1.9rem, 3.6vw, 3rem); font-weight: 700;
  letter-spacing: -0.02em; text-align: center; margin: 0;
  color: var(--charcoal);
}


.lp-wheel-sub {
  max-width: 46rem; margin: 0.75rem auto 0;
  text-align: center; font-size: 1.06rem; line-height: 1.5;
  color: var(--text-dim);
}



.lp-wheel {
  --wheel-floor: 23.75rem;
  
  --wheel-panel: 19rem;
  --wheel-panel-gap: 1.25rem;
  
}

.lp-wheel-stage {
  
  --stage: max(var(--wheel-floor),
               min(35rem, 58vw,
                   calc(100vw - 2 * (var(--wheel-panel) + var(--wheel-panel-gap)) - 2rem),
                   calc(2 * (100vh - var(--wheel-chrome, 260px)
                              - var(--wheel-panel-h, 19rem) - 1rem))));
  position: relative;
  width: var(--stage); aspect-ratio: 1;
  
  font-size: min(0.875rem, calc(var(--stage) / 40));
  
  margin: 18px auto 84px;
}


@media (max-height: 860px) {
  .lp-wheel .lp-figure-section { padding-top: 4px; }
  .lp-wheel .lp-wheel-line { font-size: clamp(1.5rem, 2.4vw, 2rem); }
  .lp-wheel .lp-wheel-sub { font-size: 0.95rem; margin-top: 0.5rem; }
}

.lp-wheel-svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.lp-wheel-svg g {
  transform-box: view-box; transform-origin: 200px 200px;
  transition: transform .2s ease;
}
.lp-wheel-svg g.raised { transform: scale(1.06); }
.lp-wheel-arc { transition: opacity .2s; }
.lp-wheel-svg g.dim .lp-wheel-arc { opacity: 0.3; }
.lp-wheel-hub { fill: var(--bg-card); stroke: var(--border); stroke-width: 2; }
.lp-wheel-hub-title {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 20px; font-weight: 700; fill: var(--charcoal);
}


.lp-wheel-verb {
  position: absolute; transform: translate(-50%, -50%);
  padding: 0.43em 0.86em; border: 0; border-radius: 0.64em;
  background: none; cursor: pointer; white-space: nowrap;
  font-family: 'Space Grotesk', sans-serif;
  font-size: 1.21em; font-weight: 700; letter-spacing: 0.01em;
  color: #fff;
  transition: opacity .2s, transform .2s;
}

[data-theme="dark"] .lp-wheel-verb { color: #111113; }

.lp-wheel-verb.dim { opacity: 1; color: var(--charcoal); }
[data-theme="dark"] .lp-wheel-verb.dim { color: var(--text-dim); }
.lp-wheel-verb.on { transform: translate(-50%, -50%) scale(1.07); }


.lp-wheel-actions {
  list-style: none; margin: 0; padding: 0;
  position: absolute; z-index: 2;
  display: grid; gap: 0.5rem;
  width: var(--wheel-panel);
}

.lp-wheel-actions.side-left {
  right: 100%; padding-right: var(--wheel-panel-gap); box-sizing: content-box;
}
.lp-wheel-actions.side-right {
  left: 100%; padding-left: var(--wheel-panel-gap); box-sizing: content-box;
}

.lp-wheel-actions.end-top { bottom: 50%; margin-bottom: 0.4rem; }
.lp-wheel-actions.end-bottom { top: 50%; margin-top: 0.4rem; }

.lp-wheel-action {
  width: 100%;
}



.lp-spoke-link.chip {
  
  display: block; white-space: normal;
  
  font-size: 0.95rem;
  padding: 0.62rem 0.8rem;
  border-left: 0.21em solid var(--q-colour, var(--accent));
  background-color: var(--bg-card);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.14);
}
.lp-spoke-link.chip .lp-spoke-label { font-size: 1em; line-height: 1.3; }


.lp-spoke-link.chip .lp-chip-line {
  display: block; margin-top: 0.3em;
  font-size: 0.86em; line-height: 1.35;
  color: var(--text-dim);
}


.lp-corner-verb {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 1.3rem; font-weight: 700; color: var(--q-colour);
  letter-spacing: -0.01em;
}
.lp-corner-blurb { font-size: 0.88rem; color: var(--text-dim); margin: 4px 0 12px; }
.lp-corner-spokes { list-style: none; display: grid; gap: 8px; margin: 0; padding: 0; text-align: left; }
.lp-corner-spokes.roomy { gap: 12px; }



.lp-compass-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 1.1fr) minmax(0, 1fr);
  grid-template-areas: ". n ." "w c e" ". s .";
  gap: 22px 30px; align-items: start;
}
.bearing-n { grid-area: n; }
.bearing-e { grid-area: e; }
.bearing-s { grid-area: s; }
.bearing-w { grid-area: w; text-align: right; }

.lp-compass-point {
  --q-colour: var(--accent);
  border: 1px solid var(--border); border-radius: 14px;
  padding: 16px 18px; background: var(--bg-card);
  transition: border-color .2s, box-shadow .2s;
}
.lp-compass-point.active { border-color: var(--q-colour); box-shadow: var(--shadow); }
.lp-compass-bearing {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 0.72rem; font-weight: 700; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--q-colour); margin-bottom: 2px;
}

.lp-compass-hub {
  grid-area: c; text-align: center;
  border: 1px solid var(--border); border-radius: 18px;
  padding: 26px 22px; background: var(--bg-inset);
}
.lp-compass-rose { width: 130px; height: 130px; margin-bottom: 12px; }
.rose-ring { fill: none; stroke: var(--border-strong); stroke-width: 1.5; }
.rose-ring.faint { stroke: var(--border); }
.rose-needle { fill: var(--accent); }
.rose-needle.faint { fill: var(--border-strong); }
.rose-pin { fill: var(--bg-card); stroke: var(--charcoal); stroke-width: 2; }
.lp-compass-hub-text {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 1.15rem; font-weight: 700; color: var(--charcoal); margin-bottom: 16px;
}



.lp-orbit-stage {
  position: relative; width: min(900px, 100%); margin: 0 auto;
  aspect-ratio: 1 / 1; overflow: visible;
}
.lp-orbit-rings { position: absolute; inset: 0; width: 100%; height: 100%; }
.lp-orbit-ring {
  fill: none; stroke-width: 0.45; opacity: 0.75;
  stroke-dasharray: 3 2.2;
  animation: lp-orbit-drift 26s linear infinite;
  transition: opacity .2s;
}
.lp-orbit-ring.dim { opacity: 0.22; }
@keyframes lp-orbit-drift { to { stroke-dashoffset: -100; } }

.lp-orbit-hub {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: 22%; aspect-ratio: 1 / 1; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: var(--bg-card); border: 2px solid var(--border);
}
.lp-orbit-hub-q {
  font-family: 'Space Grotesk', sans-serif;
  font-size: clamp(0.85rem, 1.5vw, 1.1rem); font-weight: 700;
  text-align: center; color: var(--charcoal);
}

.lp-orbit-chip {
  position: absolute; transform: translate(-50%, -50%);
  width: 9.2rem; padding: 9px 11px; border-radius: 11px;
  background: var(--bg-card); border: 1px solid var(--border);
  text-decoration: none; box-shadow: var(--shadow-sm);
  transition: opacity .2s, border-color .18s, box-shadow .18s;
}
.lp-orbit-chip:hover,
.lp-orbit-chip:focus-visible { border-color: var(--q-colour); box-shadow: var(--shadow); }
.lp-orbit-chip.dim { opacity: 0.35; }
.lp-orbit-chip .lp-spoke-label { font-size: 0.82rem; line-height: 1.25; }
.lp-chip-quadrant {
  display: block; margin-top: 3px;
  font-size: 0.66rem; font-weight: 700; letter-spacing: 0.08em;
  text-transform: uppercase; color: var(--q-colour);
}



.lp-dial-layout {
  display: grid; grid-template-columns: minmax(280px, 0.9fr) minmax(0, 1.1fr);
  gap: 40px; align-items: center;
}
.lp-dial-knob { display: grid; justify-items: center; gap: 18px; }
.lp-dial-svg { width: 260px; height: 260px; }
.lp-dial-arc { opacity: 0.28; transition: opacity .2s, transform .2s; transform-origin: 120px 120px; }
.lp-dial-arc.on { opacity: 1; transform: scale(1.05); }
.lp-dial-hub { fill: var(--bg-card); stroke: var(--border); stroke-width: 2; }
.lp-dial-hub-text {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 17px; font-weight: 700; fill: var(--charcoal);
}

.lp-dial-buttons { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.lp-dial-btn {
  --q-colour: var(--accent);
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 600; font-size: 0.9rem;
  padding: 9px 16px; border-radius: 20px; cursor: pointer;
  background: var(--bg-card); color: var(--charcoal);
  border: 2px solid var(--border);
  transition: border-color .18s, color .18s;
}
.lp-dial-btn.on { border-color: var(--q-colour); color: var(--q-colour); }

.lp-dial-panel {
  --q-colour: var(--accent);
  border: 1px solid var(--border); border-left: 3px solid var(--q-colour);
  border-radius: 14px; padding: 24px; background: var(--bg-card);
}




.lp-example-shell { position: relative; }


.lp-example-behind { pointer-events: none; filter: saturate(0.85); }


.lp-example-overlay {
  position: fixed; inset: 0; z-index: 900;
  background: rgba(17, 17, 19, 0.55);
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
}


.lp-example-modal {
  
  --lp-modal-w: 95vw;
  position: fixed; z-index: 901;
  top: 50%; left: 50%; transform: translate(-50%, -50%);
  width: var(--lp-modal-w); height: 95vh;
  overflow: auto; overscroll-behavior: contain;
  background: var(--bg); border-radius: 18px;
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.35);
}

.lp-example-modal:focus:not(:focus-visible) { outline: none; }
.lp-example-modal:focus-visible { outline: 3px solid var(--accent); outline-offset: -3px; }

.lp-example-close {
  position: sticky; top: 14px; float: right; margin-right: 18px;
  z-index: 1;
  width: 38px; height: 38px; border-radius: 50%;
  border: 1px solid var(--border); background: var(--bg-card);
  font-size: 1.4rem; line-height: 1; color: var(--text-dim); cursor: pointer;
}
.lp-example-close:hover { color: var(--charcoal); border-color: var(--charcoal); }


.lp-example-modal .lp-example { padding: 40px 24px 56px; }

@media (max-width: 900px) {
  
  .lp-example-modal { --lp-modal-w: 100vw; height: 100vh; border-radius: 0; }
}

.lp-example { max-width: 900px; margin: 0 auto; padding-bottom: 0; }

.lp-example-missing { padding: 80px 0; text-align: center; }
.lp-example-missing h1 {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 1.8rem; font-weight: 700; color: var(--charcoal); margin-bottom: 10px;
}
.lp-example-missing p { color: var(--text-dim); margin-bottom: 24px; }

.lp-example-nav { display: flex; align-items: center; gap: 14px; margin-bottom: 22px; }
.lp-example-nav a { color: var(--text-dim); text-decoration: none; font-weight: 600; font-size: 0.9rem; }
.lp-example-nav a:hover { color: var(--charcoal); }
.lp-example-quadrant {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 0.72rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--q-colour); border: 1px solid var(--q-colour);
  border-radius: 20px; padding: 3px 12px;
}

.lp-example-head { margin-bottom: 28px; }
.lp-example-head h1 {
  font-family: 'Space Grotesk', sans-serif;
  font-size: clamp(1.7rem, 4vw, 2.5rem); font-weight: 700;
  letter-spacing: -0.02em; color: var(--charcoal); margin-bottom: 12px;
}
.lp-example-pitch { font-size: 1.08rem; line-height: 1.7; color: var(--text-dim); }



.lp-snapshot {
  margin: 0 0 40px 50%; transform: translateX(-50%);
  width: min(1240px, calc(var(--lp-modal-w, 96vw) - 56px));
}
.lp-snapshot-frame {
  border: 1px solid var(--border); border-radius: 14px;
  overflow: hidden; background: var(--bg-card); box-shadow: var(--shadow);
}
.lp-snapshot-chrome {
  display: flex; align-items: center; gap: 7px;
  padding: 10px 14px; border-bottom: 1px solid var(--border);
}
.lp-snapshot-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--border); }
.lp-snapshot-url {
  margin-left: 10px;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.78rem; color: var(--text-dim);
}
.lp-snapshot-live {
  margin-left: auto;
  font-size: 0.7rem; font-weight: 700; letter-spacing: 0.04em;
  text-transform: uppercase; color: var(--text-dim);
}

.lp-snapshot-viewport { position: relative; }


.lp-snapshot-stage .table-wrap { overflow: visible; }


.lp-snapshot-stage .dash-activity-list { max-height: none; overflow-y: visible; }
.lp-snapshot-loading,
.lp-snapshot-failed { padding: 72px 24px; text-align: center; color: var(--text-dim); }
.lp-snapshot figcaption {
  margin-top: 12px; text-align: center;
  font-size: 0.86rem; color: var(--text-dim);
}

.lp-example-steps { margin-bottom: 40px; }
.lp-example-steps h2, .lp-example-siblings h2 {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 0.8rem; font-weight: 700; letter-spacing: 0.1em;
  text-transform: uppercase; color: var(--text-dim); margin-bottom: 18px;
}
.lp-example-steps ol { list-style: none; display: grid; gap: 18px; margin: 0; padding: 0; }
.lp-example-steps li {
  display: grid; grid-template-columns: auto minmax(0, 1fr);
  gap: 4px 16px; align-items: baseline;
}
.lp-step-n {
  grid-row: span 2;
  font-family: 'Space Grotesk', sans-serif;
  font-size: 1.1rem; font-weight: 700; color: var(--accent);
  width: 34px; height: 34px; border-radius: 50%;
  border: 2px solid var(--accent);
  display: inline-flex; align-items: center; justify-content: center;
}
.lp-example-steps h3 { font-family: 'Space Grotesk', sans-serif; font-size: 1.02rem; font-weight: 700; color: var(--charcoal); }
.lp-example-steps li p { color: var(--text-dim); line-height: 1.65; font-size: 0.92rem; }
.lp-example-where { margin-top: 22px; font-size: 0.86rem; color: var(--text-dim); }
.lp-example-where code {
  background: var(--bg-inset); border: 1px solid var(--border);
  border-radius: 5px; padding: 1px 6px; font-size: 0.85em;
}

.lp-example-siblings { margin-bottom: 40px; }
.lp-example-siblings ul { list-style: none; display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 12px; margin: 0; padding: 0; }

@media (max-width: 900px) {
  .lp-example { padding-left: 4px; padding-right: 4px; }
  .lp-snapshot { width: 100%; margin-left: 0; transform: none; }
  .lp-dial-layout { grid-template-columns: minmax(0, 1fr); }
}







.lp-figure-section.narrow-copy { max-width: 780px; }



.lp-arc { list-style: none; margin: 0; padding: 0; display: grid; gap: 18px; }
.lp-arc-stage {
  display: grid; grid-template-columns: auto 1fr; gap: 18px; align-items: start;
  border: 1px solid var(--border); border-radius: 14px;
  padding: 20px 22px; background: var(--bg-card);
}
.lp-arc-num {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 1.5rem; font-weight: 700; line-height: 1;
  color: var(--accent); min-width: 1.4em;
}
.lp-arc-title {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 1.08rem; font-weight: 700; color: var(--charcoal); margin: 0 0 6px;
}
.lp-arc-detail { margin: 0; color: var(--text-dim); line-height: 1.6; }



.lp-arg-card {
  margin: 0; border: 1px solid var(--border); border-radius: 14px;
  padding: 24px; background: var(--bg-card); box-shadow: var(--shadow-lg);
}
.lp-arg-caption {
  font-size: 0.82rem; color: var(--text-dim);
  margin-bottom: 18px; padding-bottom: 12px; border-bottom: 1px solid var(--border);
}
.lp-arg-thesis {
  margin: 0 0 20px; padding-left: 16px; border-left: 3px solid var(--accent);
  font-size: 1.05rem; line-height: 1.6; color: var(--charcoal); font-style: italic;
}
.lp-arg-head {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 10px 14px;
  margin-bottom: 18px;
}
.lp-arg-symbol {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 1.3rem; font-weight: 700; color: var(--charcoal);
}
.lp-arg-name { color: var(--text-dim); font-size: 0.92rem; }
.lp-arg-verdict {
  margin-left: auto; font-weight: 700; font-size: 0.92rem; color: var(--charcoal);
  border: 1px solid var(--border-strong); border-radius: 20px; padding: 4px 14px;
}
.lp-arg-analysis { margin: 18px 0 0; line-height: 1.7; color: var(--charcoal); }



.lp-criteria { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.lp-criterion {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 12px;
  padding: 10px 14px; border-radius: 10px;
  background: var(--bg-inset); border-left: 3px solid var(--border-strong);
  font-size: 0.9rem;
}

.lp-criterion.met { border-left-color: var(--green); }
.lp-criterion.missed { border-left-color: var(--red); }

.lp-criterion.partial { border-left-color: var(--yellow); }
.lp-criterion-mark { font-weight: 700; }

.lp-criterion-tri { display: inline-block; width: 0.95em; height: 0.83em; vertical-align: -0.06em; }
.lp-criterion.met .lp-criterion-mark { color: var(--green); }
.lp-criterion.missed .lp-criterion-mark { color: var(--red); }
.lp-criterion.partial .lp-criterion-mark { color: var(--weak-fit-text); }
.lp-criterion-label { font-weight: 600; color: var(--charcoal); min-width: 9rem; }
.lp-criterion-target, .lp-criterion-actual { color: var(--text-dim); }
.lp-criterion-word {
  margin-left: auto; font-weight: 700; font-size: 0.78rem;
  letter-spacing: 0.06em; text-transform: uppercase;
}
.lp-criterion.met .lp-criterion-word { color: var(--green); }
.lp-criterion.missed .lp-criterion-word { color: var(--red); }
.lp-criterion.partial .lp-criterion-word { color: var(--weak-fit-text); }



.lp-table-scroll { overflow-x: auto; }
.lp-scan-table { width: 100%; border-collapse: collapse; font-size: 0.92rem; }
.lp-scan-table th {
  text-align: left; padding: 10px 14px; font-size: 0.74rem; font-weight: 700;
  letter-spacing: 0.06em; text-transform: uppercase; color: var(--text-dim);
  border-bottom: 1px solid var(--border); white-space: nowrap;
}
.lp-scan-table td {
  padding: 11px 14px; border-bottom: 1px solid var(--border); color: var(--charcoal);
}
.lp-scan-table tr:last-child td { border-bottom: none; }
.lp-scan-symbol { font-weight: 700; }



.lp-contrast-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 16px; }
.lp-contrast-row {
  display: grid; grid-template-columns: 1fr auto 1fr; gap: 20px; align-items: center;
  border: 1px solid var(--border); border-radius: 14px;
  padding: 20px 22px; background: var(--bg-card);
}
.lp-contrast-tag {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 0.7rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase;
  margin: 0 0 6px;
}
.lp-contrast-before .lp-contrast-tag { color: var(--text-dim); }
.lp-contrast-after .lp-contrast-tag { color: var(--accent); }
.lp-contrast-text { margin: 0; line-height: 1.6; }
.lp-contrast-before .lp-contrast-text { color: var(--text-dim); }
.lp-contrast-after .lp-contrast-text { color: var(--charcoal); }
.lp-contrast-arrow { font-size: 1.4rem; color: var(--accent); }

.lp-reach {
  list-style: none; margin: 0; padding: 0;
  display: grid; gap: 18px; grid-template-columns: repeat(3, minmax(0, 1fr));
}
.lp-reach-stat {
  display: flex; flex-direction: column; gap: 4px;
  border: 1px solid var(--border); border-radius: 14px;
  padding: 22px; background: var(--bg-card);
}
.lp-reach-value {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 2rem; font-weight: 700; line-height: 1; color: var(--charcoal);
}
.lp-reach-label {
  font-size: 0.78rem; font-weight: 700; letter-spacing: 0.08em;
  text-transform: uppercase; color: var(--accent);
}
.lp-reach-reason { margin-top: 6px; color: var(--text-dim); font-size: 0.92rem; line-height: 1.55; }



.lp-founder-note {
  border-left: 3px solid var(--accent); padding-left: 22px;
  display: grid; gap: 16px;
}
.lp-founder-para { margin: 0; line-height: 1.75; font-size: 1.04rem; color: var(--charcoal); }
.lp-limits { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.lp-limit {
  padding: 14px 18px; border-radius: 10px;
  background: var(--bg-inset); border: 1px solid var(--border);
  line-height: 1.6; color: var(--charcoal);
}



.lp-prompt-form { max-width: 620px; margin: 0 auto 20px; text-align: left; }
.lp-prompt-label {
  display: block; margin-bottom: 8px;
  font-size: 0.78rem; font-weight: 700; letter-spacing: 0.08em;
  text-transform: uppercase; color: var(--text-dim);
}
.lp-prompt-input {
  width: 100%; resize: vertical; font: inherit; line-height: 1.6;
  padding: 14px 16px; border-radius: 12px;
  border: 2px solid var(--border-strong); background: var(--bg-card); color: var(--charcoal);
}

.lp-prompt-input:focus-visible {
  outline: 2px solid var(--accent); outline-offset: 2px; border-color: var(--accent);
}
.lp-prompt-examples { margin-top: 28px; }
.lp-prompt-examples-label { font-size: 0.85rem; color: var(--text-dim); margin-bottom: 10px; }
.lp-prompt-example-list {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-wrap: wrap; gap: 8px; justify-content: center;
}
.lp-prompt-example {
  font: inherit; font-size: 0.88rem; cursor: pointer; text-align: left;
  padding: 9px 15px; border-radius: 20px;
  border: 1px solid var(--border-strong); background: var(--bg-card); color: var(--text-dim);
  transition: border-color .18s, color .18s;
}
.lp-prompt-example:hover, .lp-prompt-example:focus-visible {
  border-color: var(--accent); color: var(--charcoal);
}
.lp-prompt-next { margin: 0; line-height: 1.75; font-size: 1.04rem; color: var(--text-dim); }




.lp-findings-flow { text-align: center; }
.lp-findings-flow .lp-figure-section { text-align: start; }

.lp-findings-thesis-card {
  
  max-width: min(640px, calc(100% - 80px));
  margin: 0 auto 18px; padding: 20px 24px; text-align: left;
  border-radius: 14px; border: 2px solid var(--border-strong); background: var(--bg-card);
}



@media (min-width: 901px) and (min-height: 621px) {

.lp-findings-flow.revealed .lp-findings-thesis-card {
  position: sticky; top: 84px; z-index: 20;
  margin-bottom: 28px; padding: 13px 22px;
  border-bottom-width: 1px;
  box-shadow: var(--shadow);
  
  max-width: none;
  width: min(1240px, calc(var(--lp-modal-w, 96vw) - 56px));
  margin-left: auto; margin-right: auto;
}
.lp-findings-flow.revealed .lp-findings-thesis-label { margin-bottom: 5px; font-size: 0.66rem; }
.lp-findings-flow.revealed .lp-findings-thesis { font-size: 0.97rem; line-height: 1.5; }
}
.lp-findings-thesis-label {
  margin-bottom: 10px;
  font-size: 0.72rem; font-weight: 700; letter-spacing: 0.09em;
  text-transform: uppercase; color: var(--text-dim);
}
.lp-findings-thesis {
  margin: 0; font-size: 1.12rem; line-height: 1.6; color: var(--charcoal);
}

.lp-findings-hint { margin: 0 0 16px; padding: 0 40px; font-size: 0.88rem; color: var(--text-dim); }
.lp-findings-failed { margin: 0; line-height: 1.7; color: var(--text-dim); }

.lp-findings-criteria { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }

.lp-findings-criterion {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 18px;
  align-items: baseline; padding: 13px 18px; border-radius: 10px;
  background: var(--bg-inset); border: 1px solid var(--border);
}
.lp-findings-criterion-label {
  grid-column: 1; grid-row: 1; font-weight: 600; color: var(--charcoal);
}
.lp-findings-criterion-field {
  grid-column: 1; grid-row: 2; font-size: 0.8rem; color: var(--text-dim);
}
.lp-findings-criterion-threshold {
  grid-column: 2; grid-row: 1; white-space: nowrap;
  font-variant-numeric: tabular-nums; font-weight: 600; color: var(--green);
}
.lp-findings-lede {
  margin: 0 0 18px; text-align: center; font-size: 0.95rem; color: var(--text-dim);
}
.lp-findings-scope {
  margin: 16px 0 0; font-size: 0.95rem; line-height: 1.7; color: var(--text-dim);
}

@media (max-width: 620px) {
  
  .lp-findings-criterion { grid-template-columns: 1fr; }
  .lp-findings-criterion-threshold { grid-column: 1; grid-row: 3; }
}


@media (max-width: 900px) {
  .lp-contrast-row { grid-template-columns: 1fr; gap: 12px; }
  .lp-contrast-arrow { transform: rotate(90deg); justify-self: start; }
  .lp-reach { grid-template-columns: 1fr; }
  .lp-arg-verdict { margin-left: 0; }
  .lp-criterion-word { margin-left: 0; }
}



.wheel2-hero {
  max-width: 1280px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: center; gap: 40px; padding-top: 48px;
}
.wheel2-intro { min-width: 0; }
.lp-wheel2 .landing-cta { padding: 0; margin: 0; gap: 8px; }
.wheel2-promise { color: var(--charcoal); font-weight: 600; line-height: 1.6; margin-bottom: 24px; }
.wheel2-map { min-width: 0; }
.wheel2-figure { position: relative; width: 100%; max-width: 520px; aspect-ratio: 1; margin: auto; }
.wheel2-ring { position: absolute; inset: 0; width: 100%; height: 100%; }
.wheel2-ring path { fill: var(--q-colour); opacity: 0.3; transition: opacity .2s; }
.wheel2-ring path.selected { opacity: 1; }
.wheel2-hub {
  position: absolute; left: 50%; top: 50%; width: 28%; aspect-ratio: 1;
  transform: translate(-50%, -50%); border: 1px solid var(--border); border-radius: 50%;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  background: var(--bg-card); color: var(--charcoal); gap: 4px;
}
.wheel2-hub span:first-child { font-family: 'Space Grotesk', sans-serif; font-size: 2rem; font-weight: 700; }
.wheel2-hub span:last-child { font-size: 0.8rem; }
.wheel2-quarter {
  position: absolute; width: 44%; min-height: 28%; padding: 12px 8px;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px;
  background: var(--bg-card); border: 1px solid var(--border); border-radius: 16px;
  color: var(--charcoal); text-align: center; box-shadow: var(--shadow);
  transition: border-color .2s, box-shadow .2s;
}
.wheel2-quarter.explore { left: 0; top: 6%; }
.wheel2-quarter.strategize { right: 0; top: 6%; }
.wheel2-quarter.record { right: 0; bottom: 6%; }
.wheel2-quarter.monitor { left: 0; bottom: 6%; }
.wheel2-quarter[aria-pressed="true"] { border: 2px solid var(--q-colour); }
.wheel2-verb { color: var(--q-colour); font-family: 'Space Grotesk', sans-serif; font-size: 1.25rem; font-weight: 700; }
.wheel2-benefit { font-size: 0.95rem; line-height: 1.4; }
.wheel2-selection { font-size: 0.75rem; font-weight: 600; color: var(--text-dim); }
.wheel2-map-caption { margin-top: 12px; text-align: center; color: var(--text-dim); font-size: 0.9rem; line-height: 1.6; }
.wheel2-story { max-width: 1280px; padding-top: 24px; }
.wheel2-story-intro { border-top: 1px solid var(--border); padding-top: 32px; margin-bottom: 24px; }
.wheel2-story-intro .lp-eyebrow { margin-bottom: 12px; }
.wheel2-story-intro h2 { font-family: 'Space Grotesk', sans-serif; font-size: clamp(1.5rem, 3vw, 2.2rem); line-height: 1.3; color: var(--charcoal); margin-bottom: 12px; }
.wheel2-story-intro > p:last-child { color: var(--text-dim); line-height: 1.6; }
.wheel2-back { display: inline-flex; margin-bottom: 20px; }
.wheel2-detail { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 40px; }
.wheel2-worked { min-width: 0; border-left: 4px solid var(--q-colour); padding: 8px 24px; }
.wheel2-stage-label { color: var(--q-colour); font-weight: 600; margin-bottom: 8px; }
.wheel2-detail h3 { font-size: 1.25rem; color: var(--charcoal); margin-bottom: 12px; }
.wheel2-explanation { line-height: 1.7; color: var(--text-dim); }
.wheel2-artifact { margin: 24px 0 0; padding: 20px; background: var(--bg-inset); border-radius: 12px; }
.wheel2-artifact > span { font-size: 0.8rem; font-weight: 600; color: var(--q-colour); }
.wheel2-artifact p { margin-top: 8px; color: var(--charcoal); line-height: 1.6; }
.wheel2-examples { min-width: 0; }
.wheel2-examples-intro { font-size: 0.9rem; line-height: 1.6; color: var(--text-dim); margin-bottom: 16px; }
.wheel2-examples .lp-spoke-link + .lp-spoke-link { margin-top: 8px; }
@media (max-width: 900px) {
  .wheel2-hero { grid-template-columns: minmax(0, 1fr); padding: 32px 20px 24px; gap: 24px; }
  .wheel2-hero .lp-sub { max-width: none; }
  .wheel2-story { padding: 24px 20px 48px; }
  .wheel2-detail { grid-template-columns: minmax(0, 1fr); gap: 24px; }
}
@media (max-width: 480px) {
  .wheel2-figure { aspect-ratio: 0.85; }
  .wheel2-quarter { gap: 4px; padding: 8px; }
  .wheel2-quarter.explore, .wheel2-quarter.strategize { top: 0; }
  .wheel2-quarter.record, .wheel2-quarter.monitor { bottom: 0; }
  .wheel2-verb { font-size: 1rem; }
  .wheel2-benefit { font-size: 0.85rem; }
  .wheel2-hub span:first-child { font-size: 1.5rem; }
  .wheel2-hub span:last-child { font-size: 0.7rem; }
  .wheel2-worked { padding: 8px 16px; }
}



.csp-source-th { text-align: left; }
.csp-source { font-family: monospace; word-break: break-all; }
.csp-browser { font-size: 0.78rem; margin-bottom: 0.5rem; word-break: break-all; }


.model-provider { margin-bottom: 1.1rem; }
.model-provider-label { display: block; font-weight: 600; font-size: 0.9rem; margin-bottom: 0.15rem; }
.model-provider-hint { font-size: 0.8rem; margin-bottom: 0.35rem; }
.model-provider-row { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; }
.model-provider-note { font-size: 0.8rem; }
.model-provider-warn { color: var(--orange); margin-top: 0.3rem; font-size: 0.8rem; }


.model-rates { margin-top: 1rem; }
.model-rates-title { margin: 0 0 0.35rem; font-size: 0.9rem; }
.model-rates .num { text-align: right; white-space: nowrap; }
.model-rates .level-row td { font-size: 0.8rem; }
.model-slot-rates { margin-left: 0.5rem; }

.cost-split { margin-top: 0.75rem; }
.cost-split .num { text-align: right; white-space: nowrap; }


.scan-list-banner { display: flex; flex-direction: column; gap: 6px; margin: 4px 0 10px; }
.scan-list-origin { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; font-size: 0.875rem; }
.scan-list-actions { display: inline-flex; flex-wrap: wrap; gap: 8px; margin-left: auto; }
.scan-list-state { display: flex; align-items: center; gap: 6px; font-size: 0.875rem; padding: 6px 10px; border-radius: 6px; background: var(--bg-hover); }
.scan-list-state.is-failed { color: var(--red); }
.rail-add-scan { display: flex; flex-direction: column; gap: 4px; margin: 0 0 6px 24px; }

.scan-list-running { display: flex; justify-content: center; padding: 48px 16px; }
.scan-setup-card { width: min(1100px, calc(100vw - 32px)); max-width: none; max-height: calc(100vh - 48px); overflow-y: auto; padding: 0; }
.scan-setup-card .scan-setup-wizard { padding: 16px; }


.demo-walkthrough {
  padding: 1.5rem;
  margin-bottom: 1.5rem;
}
.demo-walkthrough-player {
  display: block;
  width: 100%;
  max-height: 70vh;
  margin-bottom: 1rem;
  background: var(--bg);
}


.coupon-form-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 12px;
  margin-bottom: 8px;
}
.coupon-form-grid .form-input[aria-invalid="true"] { border-color: var(--red); }
.coupon-form-hint { font-size: 0.85rem; margin-bottom: 12px; }
.coupon-form .form-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.coupon-archived-toggle { display: inline-block; font-size: 0.85rem; cursor: pointer; margin-bottom: 12px; }
.coupon-table { width: 100%; font-size: 0.85rem; }
.coupon-actions { display: flex; flex-wrap: wrap; gap: 6px; }
.coupon-row-archived { opacity: 0.55; }