/* ── Base ──────────────────────────────────────── */
body { background: #f0f4f8; color: #1e293b; font-family: 'Inter', system-ui, sans-serif; }

::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #e2e8f0; }
::-webkit-scrollbar-thumb { background: #94a3b8; border-radius: 3px; }

/* ── Earnings tile cards ─────────────────────── */
.tile {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  box-shadow: 0 1px 4px rgba(0,0,0,.06);
  transition: transform .15s, box-shadow .15s, border-color .15s;
  position: relative;
  overflow: hidden;
}
.tile:hover { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(99,102,241,.12); border-color: #a5b4fc; }
.tile.in-watchlist { border-color: #f59e0b; border-width: 2px; }

/* ── Dormant / data-incoming state ───────────── */
.card-dormant { background: #f1f5f9 !important; border-color: #cbd5e1 !important; }
.data-incoming-stamp {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  border-radius: inherit;
  overflow: hidden;
  z-index: 2;
}
/* Inline variant used in the filing-viewer loading overlay (not a card overlay) */
.data-incoming-stamp.fv-inline {
  position: relative;
  inset: auto;
  overflow: visible;
  padding: 32px 48px;
}
.data-incoming-stamp span {
  font-size: 1.1rem;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: rgba(22, 163, 74, 0.72);
  border: 3px solid rgba(22, 163, 74, 0.72);
  padding: 4px 12px;
  border-radius: 5px;
  line-height: 1.25;
  white-space: nowrap;
  transform: rotate(-18deg);
  display: inline-block;
  background: rgba(240, 253, 244, 0.55);
  box-shadow: 0 0 0 1px rgba(22, 163, 74, 0.18);
}

/* ── Day headings ─────────────────────────────── */
.day-heading {
  background: linear-gradient(90deg, #6366f1 0%, #818cf8 100%);
  color: white;
  border-radius: 10px;
  padding: 6px 16px;
  font-weight: 700;
  font-size: .85rem;
  letter-spacing: .04em;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  box-shadow: 0 2px 8px rgba(99,102,241,.25);
}
.day-heading .date-sub { font-weight: 400; opacity: .85; font-size: .78rem; }

/* ── Page shell & layout ──────────────────────── */
.page-shell { display:flex; height:100vh; overflow:hidden; background:#f0f4f8; }

/* ── Left Navigation ─────────────────────────── */
.left-nav { width:228px; min-width:228px; background:#3437a1; display:flex; flex-direction:column; overflow-y:auto; z-index:20; }

.nav-logo { display:flex; align-items:center; gap:9px; padding:18px 16px 14px; border-bottom:1px solid rgba(255,255,255,.12); }
.nav-app-name { font-size:15px; font-weight:700; color:#f4f5f5; letter-spacing:.01em; }

.nav-section { padding:6px 0; }
.nav-section-label { font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.08em; color:#b1becf; padding:8px 16px 3px; }

.nav-item { display:flex; align-items:center; gap:8px; width:100%; padding:9px 16px; text-align:left; font-size:14px; font-weight:500; color:#cbd5e1; background:transparent; border:none; cursor:pointer; transition:color .15s, background .15s; }
.nav-item:hover { background:rgba(255,255,255,.08); color:#f1f5f9; }
.nav-item.active { background:rgba(99,102,241,.28); color:#c7d2fe; }

.nav-sub-item { display:flex; align-items:center; justify-content:space-between; width:100%; padding:5px 16px 5px 34px; text-align:left; font-size:13px; color:#94a3b8; background:transparent; border:none; cursor:pointer; transition:color .15s, background .15s; }
.nav-sub-item:hover { color:#e2e8f0; background:rgba(255,255,255,.06); }
.nav-sub-item.active { color:#c7d2fe; font-weight:600; }

.nav-new-list { display:flex; align-items:center; gap:6px; width:100%; padding:5px 16px 5px 34px; text-align:left; font-size:13px; color:#818cf8; background:transparent; border:none; cursor:pointer; transition:color .15s; }
.nav-new-list:hover { color:#a5b4fc; }

.nav-footer { margin-top:auto; border-top:1px solid rgba(255,255,255,.12); }
.nav-footer .user-flex { display:flex; align-items:center; gap:8px; padding:12px 16px 8px; }
.nav-footer #userEmail { font-size:12px; color:#94a3b8; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.nav-footer #userAvatar { flex-shrink:0; }
.nav-sign-out {
  display:flex; align-items:center; gap:7px;
  width:100%; padding:8px 16px 12px;
  background:none; border:none; cursor:pointer;
  font-size:13px; font-weight:500; color:#94a3b8;
  transition:color .15s, background .15s;
  text-align:left;
}
.nav-sign-out:hover { color:#f87171; background:rgba(248,113,113,.08); }
.nav-sign-out .sign-out-icon { font-size:14px; opacity:.8; }

/* ── Watchlist filter dropdown ────────────────── */
.wl-filter-wrap { position:relative; }
.wl-filter-btn { display:flex; align-items:center; gap:5px; white-space:nowrap; }
.wl-filter-btn .wl-filter-badge { background:#6366f1; color:#fff; border-radius:999px; font-size:.65rem; font-weight:700; padding:1px 5px; margin-left:2px; }
.wl-filter-panel {
  position:absolute; top:calc(100% + 4px); left:0; z-index:40;
  background:#fff; border:1px solid #e2e8f0; border-radius:10px;
  box-shadow:0 8px 24px rgba(0,0,0,.1); min-width:180px; padding:6px 0;
  display:none;
}
.wl-filter-panel.open { display:block; }
.wl-filter-option { display:flex; align-items:center; gap:8px; padding:6px 12px; font-size:.8rem; color:#334155; cursor:pointer; transition:background .12s; }
.wl-filter-option:hover { background:#f8fafc; }
.wl-filter-option input[type=checkbox] { accent-color:#6366f1; width:13px; height:13px; cursor:pointer; flex-shrink:0; }
.wl-filter-divider { height:1px; background:#f1f5f9; margin:4px 0; }

/* ── Content area ─────────────────────────────── */
.content-area { flex:1; display:flex; flex-direction:column; overflow:hidden; min-width:0; }

.page-div { display:flex; flex-direction:column; flex:1; overflow:hidden; }
.page-div.hidden { display:none; }

.page-toolbar { background:white; border-bottom:1px solid #e2e8f0; flex-shrink:0; }
.page-scroll { flex:1; overflow-y:auto; padding:20px 24px 40px; }

/* ── EPS result badges ─────────────────────────── */
.beat      { background: #dcfce7; color: #166534; }
.big-beat  { background: #15803d; color: #dcfce7; }
.miss      { background: #fee2e2; color: #991b1b; }
.big-miss  { background: #b91c1c; color: #fee2e2; }
.in-line   { background: #dbeafe; color: #1e40af; }
.pending   { background: #f1f5f9; color: #64748b; }

.pill { border-radius: 999px; padding: 2px 10px; font-size: .7rem; font-weight: 600; letter-spacing: .03em; }

/* ── Modals ─────────────────────────────────────── */
.modal-bg { background: rgba(15,23,42,.5); backdrop-filter: blur(4px); }
.upload-modal-bg { background: rgba(15,23,42,.5); backdrop-filter: blur(4px); }

/* ── Logo wrap ──────────────────────────────────── */
.logo-wrap { width: 38px; height: 38px; border-radius: 9px; background: #f1f5f9; border: 1px solid #e2e8f0; display:flex; align-items:center; justify-content:center; overflow:hidden; flex-shrink:0; }
.logo-wrap img { width:100%; height:100%; object-fit:contain; }
#tmLogo { width: 96px; height: 96px; border-radius: 14px; }
.notes-card .logo-wrap { width: 76px; height: 76px; border-radius: 12px; }

/* ── Spinner / animations ───────────────────────── */
.spinner { border: 3px solid #e2e8f0; border-top-color: #6366f1; border-radius: 50%; width: 32px; height: 32px; animation: spin .7s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } }

/* ── Form inputs ─────────────────────────────────── */
input[type=date] { color-scheme: light; }

.hdr-input { background: white; border: 1px solid #cbd5e1; border-radius: 8px; padding: 4px 10px; font-size: .875rem; color: #1e293b; }
.hdr-input:focus { outline: none; border-color: #6366f1; box-shadow: 0 0 0 3px rgba(99,102,241,.1); }
select.hdr-input { cursor: pointer; }

/* ── Today's Market search combo ───────────────────── */
.tm-search-row {
  display: flex;
  gap: 8px;
  align-items: center;
}

.tm-search-wrap {
  position: relative;
  flex: 1;
  max-width: 420px;
}

.tm-search-input {
  width: 100%;
  padding: 7px 12px;
  font-size: .875rem;
}

.tm-search-btn {
  padding: 7px 16px;
  border-radius: 8px;
  background: #6366f1;
  color: #fff;
  font-size: .8rem;
  font-weight: 600;
  border: none;
  cursor: pointer;
  transition: background .15s;
}

.tm-search-btn:hover {
  background: #4f46e5;
}

.tm-search-status {
  font-size: .75rem;
  color: #94a3b8;
}

.tm-search-dropdown {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  right: 0;
  z-index: 35;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  box-shadow: 0 12px 32px rgba(15,23,42,.12);
  max-height: 280px;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 6px;
  scrollbar-width: thin;
}

.tm-search-empty {
  min-height: 72px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 12px;
  color: #94a3b8;
  font-size: .8rem;
}

.tm-search-option {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid transparent;
  border-radius: 10px;
  background: transparent;
  text-align: left;
  cursor: pointer;
  transition: background .15s, border-color .15s;
}

.tm-search-option:hover,
.tm-search-option.active {
  background: #f8fafc;
  border-color: #c7d2fe;
}

.tm-search-option-copy {
  min-width: 0;
  flex: 1;
}

.tm-search-option-name {
  font-size: .86rem;
  font-weight: 700;
  color: #1e293b;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.tm-search-option-meta {
  font-size: .74rem;
  color: #64748b;
  margin-top: 2px;
}

.tm-search-option-action {
  flex-shrink: 0;
  font-size: .74rem;
  font-weight: 700;
  color: #6366f1;
}

/* ── Ticker detail modal ────────────────────────── */
.ticker-modal-table { width: 100%; border-collapse: collapse; font-size: .8rem; }
.ticker-modal-table th { text-align: left; padding: 6px 10px; background: #f8fafc; color: #94a3b8; font-weight: 600; text-transform: uppercase; font-size: .7rem; letter-spacing: .04em; border-bottom: 1px solid #e2e8f0; }
.ticker-modal-table td { padding: 7px 10px; border-bottom: 1px solid #f1f5f9; color: #334155; vertical-align: middle; }
.ticker-modal-table tr:last-child td { border-bottom: none; }
.ticker-modal-table tr:hover td { background: #f8fafc; }

/* ── Earnings view toggle switch ────────────────────────── */
.earnings-view-toggle { display: flex; gap: 4px; background: #f1f5f9; border-radius: 8px; padding: 3px; }
.earnings-toggle-btn { 
  display: flex; align-items: center; gap: 5px; 
  padding: 5px 12px; border: none; border-radius: 6px; 
  font-size: .75rem; font-weight: 600; 
  color: #64748b; background: transparent; 
  cursor: pointer; transition: all 0.2s ease;
}
.earnings-toggle-btn:hover { color: #475569; background: rgba(255, 255, 255, 0.5); }
.earnings-toggle-btn.active { 
  color: #6366f1; background: #fff; 
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}
.earnings-toggle-btn svg { flex-shrink: 0; }

/* Earnings tab mode layout */
.earnings-tab-header { flex: 0 0 auto; }
#tmEarningsChartsContainer {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  flex: 1 1 auto;
  min-height: 0;
}
.tm-earnings-charts-grid {
  display: flex;
  gap: 1rem;
  flex: 1 1 auto;
  min-height: 0;
}
.tm-earnings-chart-wrap {
  flex: 1 1 0;
  min-width: 0;
  height: 100%;
  min-height: 260px;
  background: #fff;
  border-radius: 12px;
  border: 1px solid #f1f5f9;
  padding: 8px 10px 6px;
}
.tm-earnings-chart-controls-panel {
  flex: 0 0 auto;
  border-radius: 10px;
  border: 1px solid #e2e8f0;
  background: #f8fafc;
  padding: 7px 10px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.tm-earnings-chart-controls-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
}
.tm-earnings-chart-range-wrap {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}
.tm-earnings-chart-controls-label {
  font-size: .68rem;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: #64748b;
  font-weight: 700;
  margin-right: 2px;
}
.tm-earnings-range-btn {
  border: 1px solid #cbd5e1;
  background: #fff;
  color: #475569;
  border-radius: 7px;
  padding: 4px 10px;
  font-size: .72rem;
  font-weight: 700;
  cursor: pointer;
  transition: all .15s ease;
}
.tm-earnings-range-btn:hover {
  border-color: #94a3b8;
  color: #334155;
  background: #f1f5f9;
}
.tm-earnings-range-btn.active {
  background: #4f46e5;
  border-color: #4f46e5;
  color: #fff;
}
.tm-earnings-style-toggle {
  margin-left: auto;
  min-height: 0;
  gap: 6px;
}
.tm-earnings-style-toggle .tm-chart-type-toggle-label {
  font-size: .68rem;
  letter-spacing: .04em;
  color: #64748b;
}
.tm-earnings-style-toggle .tm-chart-type-toggle-buttons {
  background: #fff;
}
.tm-earnings-style-toggle .tm-chart-type-toggle-btn {
  font-size: .66rem;
  padding: 3px 8px;
}
#tmEarningsTableContainer {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
}

@media (max-width: 900px) {
  #tmEarningsChartsContainer {
    flex: 0 0 auto;
  }
  .tm-earnings-charts-grid {
    flex-direction: column;
    height: auto;
  }
  .tm-earnings-chart-wrap {
    height: 220px;
    min-height: 220px;
  }
  .tm-earnings-chart-controls-panel {
    flex-basis: auto;
    padding: 6px 8px;
  }
  .tm-earnings-chart-controls-inner {
    justify-content: center;
  }
  .tm-earnings-chart-range-wrap {
    justify-content: center;
  }
  .tm-earnings-chart-controls-label {
    display: none;
  }
  .tm-earnings-style-toggle {
    margin-left: 0;
  }
  .tm-earnings-style-toggle .tm-chart-type-toggle-label {
    display: none;
  }
}

.notes-textarea { width: 100%; border: 1px solid #cbd5e1; border-radius: 10px; padding: 10px 12px; font-size: .875rem; color: #1e293b; resize: vertical; min-height: 90px; font-family: inherit; }
.notes-textarea:focus { outline: none; border-color: #6366f1; box-shadow: 0 0 0 3px rgba(99,102,241,.1); }

/* ── Threaded notes (modal) ────────────────────── */
#tmThread { max-height: 280px; overflow-y: auto; display: flex; flex-direction: column; gap: 8px; }
.note-bubble { background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 10px; padding: 9px 12px; position: relative; }
.note-bubble:hover .note-actions { opacity: 1; }
.note-ts { font-size: .68rem; color: #94a3b8; margin-bottom: 4px; }
.note-edited { font-size: .65rem; color: #cbd5e1; margin-left: 4px; }
.note-text { font-size: .85rem; color: #334155; word-break: break-word; line-height: 1.5; }
.note-text a { color: #6366f1; text-decoration: underline; }
.note-text a:hover { color: #4338ca; }
/* ── Rich formatting inside notes ─────────────────── */
.note-text p, .note-edit-area p, .note-detail-edit-area p { margin: 0 0 .5em; }
.note-text p:last-child, .note-edit-area p:last-child, .note-detail-edit-area p:last-child { margin-bottom: 0; }
.note-text ul, .note-text ol,
.note-edit-area ul, .note-edit-area ol,
.note-detail-edit-area ul, .note-detail-edit-area ol { margin: .35em 0 .35em 1.4em; padding: 0; }
.note-text li, .note-edit-area li, .note-detail-edit-area li { margin-bottom: .15em; }
.note-text ul, .note-edit-area ul, .note-detail-edit-area ul { list-style: disc; }
.note-text ol, .note-edit-area ol, .note-detail-edit-area ol { list-style: decimal; }
.note-text blockquote, .note-edit-area blockquote, .note-detail-edit-area blockquote {
  border-left: 3px solid #c7d2fe; margin: .5em 0; padding: .25em .75em;
  color: #475569; font-style: italic; }
.note-text h1,.note-text h2,.note-text h3,
.note-text h4,.note-text h5,.note-text h6,
.note-edit-area h1,.note-edit-area h2,.note-edit-area h3,
.note-edit-area h4,.note-edit-area h5,.note-edit-area h6,
.note-detail-edit-area h1,.note-detail-edit-area h2,.note-detail-edit-area h3,
.note-detail-edit-area h4,.note-detail-edit-area h5,.note-detail-edit-area h6 {
  font-weight: 700; margin: .4em 0 .25em; line-height: 1.2; color: #1e293b; }
.note-text h1,.note-edit-area h1,.note-detail-edit-area h1 { font-size: 1.1rem; }
.note-text h2,.note-edit-area h2,.note-detail-edit-area h2 { font-size: 1rem; }
.note-text h3,.note-text h4,.note-text h5,.note-text h6,
.note-edit-area h3,.note-edit-area h4,.note-edit-area h5,.note-edit-area h6,
.note-detail-edit-area h3,.note-detail-edit-area h4,.note-detail-edit-area h5,.note-detail-edit-area h6 { font-size: .9rem; }
.note-text table, .note-edit-area table, .note-detail-edit-area table {
  border-collapse: collapse; width: 100%; margin: .5em 0; font-size: .8rem; }
.note-text th, .note-text td,
.note-edit-area th, .note-edit-area td,
.note-detail-edit-area th, .note-detail-edit-area td {
  border: 1px solid #e2e8f0; padding: 4px 8px; text-align: left; }
.note-text th, .note-edit-area th, .note-detail-edit-area th { background: #f1f5f9; font-weight: 600; }
.note-actions { position: absolute; top: 7px; right: 8px; display: flex; gap: 4px; opacity: 0; transition: opacity .15s; }
.note-action-btn { background: #e2e8f0; border: none; border-radius: 5px; padding: 2px 6px; font-size: .7rem; color: #475569; cursor: pointer; transition: background .12s; }
.note-action-btn:hover { background: #c7d2fe; color: #3730a3; }
.note-action-btn.del:hover { background: #fecaca; color: #991b1b; }
/* Variant for buttons placed on the teal lozenge header */
.note-action-btn-on-teal { background: rgba(255,255,255,.18); color: #fff; border: 1px solid rgba(255,255,255,.35); }
.note-action-btn-on-teal:hover { background: rgba(255,255,255,.32); color: #fff; }
.note-action-btn-on-teal.note-action-save { background: rgba(255,255,255,.3); font-weight: 700; }
.note-action-btn-on-teal.note-action-save:hover { background: rgba(255,255,255,.48); }
.note-action-btn-on-teal.del:hover { background: rgba(239,68,68,.45); color: #fff; }
.note-edit-area { width: 100%; border: 1px solid #a5b4fc; border-radius: 8px; padding: 7px 10px; font-size: .85rem; color: #1e293b; resize: vertical; min-height: 60px; font-family: inherit; margin-top: 4px; }
.note-edit-area:focus { outline: none; box-shadow: 0 0 0 3px rgba(99,102,241,.12); }

/* ── Images inside note content ──────────────────── */
.note-text img,
.note-detail-edit-area img,
.note-edit-area img,
.nfold-text-section img { max-width: 100%; height: auto; border-radius: 6px; display: block; margin: 6px 0; border: 1px solid #e2e8f0; }

/* ── Note title field (edit / add) ─────────────── */
.note-title-input { display:block; width:100%; border:1.5px solid #c7d2fe; border-radius:8px; padding:8px 12px; font-size:.95rem; font-weight:700; color:#312e81; background:#eef2ff; outline:none; margin-bottom:10px; font-family:inherit; box-sizing:border-box; transition:border-color .15s, box-shadow .15s; }
.note-title-input:focus { border-color:#6366f1; box-shadow:0 0 0 3px rgba(99,102,241,.12); }
.note-title-input::placeholder { color:#a5b4fc; font-weight:500; }
.note-title-input.error { border-color:#ef4444 !important; background:#fff1f1 !important; box-shadow:0 0 0 3px rgba(239,68,68,.1) !important; }
/* Inside the teal modal body (editing) — keep the indigo panel, just brighten border */
.note-detail-body.editing .note-title-input { border-color:rgba(255,255,255,.5); color:#312e81; background:#eef2ff; }
.note-detail-body.editing .note-title-input::placeholder { color:#a5b4fc; }
.note-detail-body.editing .note-title-input:focus { border-color:#fff; box-shadow:0 0 0 3px rgba(255,255,255,.18); }
/* ── Note title panel (read) ────────────────────── */
.note-detail-title { font-size:1.05rem; font-weight:700; color:#312e81; background:#eef2ff; border:1.5px solid #c7d2fe; border-radius:8px; padding:8px 12px; margin-bottom:12px; }
.note-fold-title-text { font-size:.9rem; font-weight:700; color:#312e81; background:#eef2ff; border:1.5px solid #c7d2fe; border-radius:8px; padding:7px 11px; margin-bottom:8px; }
.note-bubble-title { font-size:.88rem; font-weight:700; color:#312e81; background:#eef2ff; border:1.5px solid #c7d2fe; border-radius:7px; padding:6px 10px; margin-bottom:6px; }
.notes-card-note-title { font-size:.82rem; font-weight:700; color:#312e81; background:#eef2ff; border:1.5px solid #c7d2fe; border-radius:7px; padding:6px 10px; margin-bottom:6px; }

/* ── OG link-preview cards ──────────────────────── */
.og-card { display:flex; flex-direction:row; gap:0; border:1px solid #e2e8f0; border-radius:9px; overflow:hidden; margin-top:7px; background:#fff; text-decoration:none; transition:box-shadow .14s, border-color .14s; }
.og-card:hover { border-color:#a5b4fc; box-shadow:0 3px 12px rgba(99,102,241,.1); }
.og-card-img { width:88px; min-width:88px; height:72px; object-fit:cover; background:#f1f5f9; flex-shrink:0; }
/* Prevent note-text img rules (height:auto, margin, border) from overriding OG card image sizing */
.note-text .og-card-img, .nfold-text-section .og-card-img { height:72px; max-width:88px; margin:0; border:none; border-radius:0; }
.og-card-body { padding:8px 11px; min-width:0; display:flex; flex-direction:column; justify-content:center; }
.og-card-site { font-size:.64rem; color:#94a3b8; text-transform:uppercase; letter-spacing:.05em; margin-bottom:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.og-card-title { font-size:.8rem; font-weight:600; color:#1e293b; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.og-card-desc { font-size:.72rem; color:#64748b; margin-top:2px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.og-card-loading { font-size:.72rem; color:#94a3b8; padding:6px 0; }

/* ── Notes page ──────────────────────────────────── */
.notes-card { background: #fff; border: 1px solid #e2e8f0; border-radius: 14px; padding: 1.75rem 2rem; cursor: pointer; transition: box-shadow .15s, border-color .15s; display: flex; flex-direction: column; min-height: 300px; }
.notes-card:hover { border-color: #a5b4fc; box-shadow: 0 4px 16px rgba(99,102,241,.1); }
.notes-preview { display: block; overflow: hidden; max-height: 11rem; font-size: .8rem; line-height: 1.45; color: #334155; background: #f1f5f9; border-radius: 8px; padding: 8px 12px; border: 1px solid #e2e8f0; flex: 1; }
.notes-preview a { color: #2563eb; text-decoration: underline; font-weight: 600; cursor: pointer; }
.notes-preview a:hover { color: #1d4ed8; text-decoration: underline; }

/* ── Notes filter pills ─────────────────────────── */
.notes-pill { padding:4px 13px; border-radius:999px; font-size:.75rem; font-weight:600; border:1px solid #e2e8f0; background:#fff; color:#64748b; cursor:pointer; transition:background .15s, border-color .15s, color .15s; white-space:nowrap; }
.notes-pill:hover { border-color:#a5b4fc; color:#6366f1; }
.notes-pill.active { background:#6366f1; border-color:#6366f1; color:#fff; }

/* ── Notes date filter bar ──────────────────────── */
.notes-date-filter-bar { display:flex; flex-wrap:wrap; align-items:center; gap:10px; padding:8px 14px; background:#f8faff; border:1px solid #e2e8f0; border-radius:12px; }
.notes-date-label { font-size:.75rem; font-weight:700; color:#64748b; white-space:nowrap; letter-spacing:.03em; text-transform:uppercase; }
.notes-date-chips { display:flex; flex-wrap:wrap; gap:6px; }
.notes-date-chip { padding:4px 13px; border-radius:999px; font-size:.75rem; font-weight:600; border:1px solid #e2e8f0; background:#fff; color:#64748b; cursor:pointer; transition:background .15s, border-color .15s, color .15s; white-space:nowrap; }
.notes-date-chip:hover { border-color:#a5b4fc; color:#6366f1; }
.notes-date-chip.active { background:#6366f1; border-color:#6366f1; color:#fff; }
.notes-custom-date-row { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.notes-date-input { padding:3px 9px; border:1px solid #cbd5e1; border-radius:8px; font-size:.78rem; color:#334155; background:#fff; outline:none; transition:border-color .15s; }
.notes-date-input:focus { border-color:#6366f1; box-shadow:0 0 0 2px rgba(99,102,241,.15); }

/* ── Notes section heading ──────────────────────── */
.notes-section-heading { background: linear-gradient(90deg, #6366f1 0%, #818cf8 100%); color: white; border-radius: 10px; padding: 6px 16px; font-weight: 700; font-size: .85rem; letter-spacing: .04em; display: inline-flex; align-items: center; gap: 10px; box-shadow: 0 2px 8px rgba(99,102,241,.25); cursor: pointer; user-select: none; }

/* ── Today's Market cards ───────────────────────── */
.mover-card { background:#fff; border-radius:14px; padding:14px 16px; cursor:pointer; transition:box-shadow .15s, border-color .15s; display:flex; flex-direction:column; gap:8px; box-shadow:0 1px 4px rgba(0,0,0,.06); border:1.5px solid #e2e8f0; }
.mover-card:hover { box-shadow:0 4px 16px rgba(99,102,241,.12); border-color:#a5b4fc; }
.mover-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:14px; }

/* ── Toast notifications ────────────────────────── */
#toastContainer { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 9999; display: flex; flex-direction: column; gap: .5rem; pointer-events: none; }
.toast { background: rgba(22, 163, 74, 0.88); color: #fff; padding: 2rem 3.5rem; border-radius: 20px; font-size: 2rem; font-weight: 700; box-shadow: 0 16px 64px rgba(0,0,0,.3); opacity: 0; transform: scale(.9); transition: opacity .2s, transform .2s; white-space: nowrap; text-align: center; pointer-events: auto; }
.toast.show { opacity: 1; transform: scale(1); }
.toast.hide { opacity: 0; transform: scale(.9); }

/* ── Help page ──────────────────────────────────── */
.nav-help-btn { display:flex; align-items:center; justify-content:center; width:28px; height:28px; border-radius:50%; background:rgba(255,255,255,.08); border:1.5px solid rgba(255,255,255,.15); color:rgba(255,255,255,.55); font-size:.85rem; font-weight:800; cursor:pointer; margin:8px auto 4px; transition:background .15s, color .15s, border-color .15s; }
.nav-help-btn:hover, .nav-help-btn.active { background:rgba(99,102,241,.55); border-color:#818cf8; color:#fff; }
.help-hero { background:linear-gradient(135deg,#6366f1 0%,#818cf8 100%); border-radius:16px; padding:28px 32px; color:#fff; margin-bottom:28px; }
.help-hero h2 { font-size:1.35rem; font-weight:800; margin-bottom:6px; }
.help-hero p  { font-size:.875rem; opacity:.88; line-height:1.65; }
.help-section { margin-bottom:22px; }
.help-section h3 { font-size:.82rem; font-weight:700; color:#6366f1; margin-bottom:5px; text-transform:uppercase; letter-spacing:.06em; }
.help-section p  { font-size:.875rem; color:#475569; line-height:1.7; }
.word-count-note { font-size:.72rem; color:#94a3b8; text-align:right; margin-top:3px; transition:color .15s; }
.word-count-note.near { color:#f59e0b; }
.word-count-note.over { color:#ef4444; font-weight:700; }

/* ── Ticker search result modal ─────────────────── */
.tsrm-price-box { border-radius:12px; padding:14px 18px; display:flex; flex-direction:column; gap:2px; }
.tsrm-price-box .price { font-size:1.35rem; font-weight:800; }
.tsrm-price-box .chg   { font-size:.875rem; font-weight:600; }
.tsrm-star { background:none; border:none; cursor:pointer; font-size:1.5rem; line-height:1; padding:4px; transition:transform .15s, color .15s; }
.tsrm-star:hover { transform:scale(1.2); }

/* ── User chip — clickable / settings-active state ─ */
#userChip { cursor:pointer; border-radius:8px; transition:background .15s; text-align:left; background:none; border:none; width:100%; }
#userChip:hover { background:rgba(255,255,255,.1); }
#userChip.settings-active { background:rgba(99,102,241,.28); }

/* ── Settings page layout ───────────────────────── */
.settings-layout { display:flex; height:100%; overflow:hidden; }

.settings-sidebar {
  width:188px; min-width:188px; background:#fff;
  border-right:1px solid #e2e8f0; display:flex; flex-direction:column;
  padding:20px 0; gap:2px; overflow-y:auto; flex-shrink:0;
}
.settings-sidebar-title {
  font-size:.72rem; font-weight:800; text-transform:uppercase; letter-spacing:.08em;
  color:#94a3b8; padding:0 16px 12px;
}
.settings-nav-item {
  display:flex; align-items:center; gap:8px;
  width:100%; padding:9px 16px; text-align:left;
  font-size:.875rem; font-weight:500; color:#475569;
  background:transparent; border:none; cursor:pointer;
  transition:color .15s, background .15s; border-radius:0;
}
.settings-nav-item:hover { background:#f8fafc; color:#1e293b; }
.settings-nav-item.active { background:#eef2ff; color:#4338ca; font-weight:600;
  border-right:3px solid #6366f1; }

.settings-content { flex:1; overflow-y:auto; padding:32px 40px; background:#f8fafc; }

.settings-tab-content { max-width:640px; }
#adminTab_data { max-width:1400px; }
#adminTab_data .admin-data-header { max-width:640px; }

.settings-section-title { font-size:1.1rem; font-weight:800; color:#1e293b; margin-bottom:4px; }
.settings-section-desc  { font-size:.875rem; color:#64748b; margin-bottom:24px; line-height:1.6; }

.settings-field-group { margin-bottom:20px; }
.settings-label { display:block; font-size:.8rem; font-weight:700; color:#475569;
  text-transform:uppercase; letter-spacing:.05em; margin-bottom:6px; }
.settings-input { width:100%; max-width:360px; }
.settings-hint  { font-size:.78rem; color:#94a3b8; line-height:1.5; margin-top:4px; }
.settings-hint code { background:#f1f5f9; border-radius:4px; padding:1px 4px; font-size:.75rem; color:#475569; }
.settings-hint-inline { font-weight:400; color:#94a3b8; font-size:.75rem; text-transform:none; letter-spacing:0; }
.settings-readonly-value { font-size:.875rem; color:#334155; padding:6px 10px;
  background:#f1f5f9; border:1px solid #e2e8f0; border-radius:8px; max-width:600px; word-break:break-all; min-height:2.5em; padding:12px 10px; }

.settings-save-btn {
  padding:7px 20px; background:#6366f1; color:#fff; border:none; border-radius:8px;
  font-size:.875rem; font-weight:600; cursor:pointer; transition:background .15s;
}
.settings-save-btn:hover { background:#4f46e5; }
.settings-cancel-btn {
  padding:7px 16px; background:#f1f5f9; color:#475569; border:1px solid #e2e8f0;
  border-radius:8px; font-size:.875rem; font-weight:500; cursor:pointer; transition:background .15s;
}
.settings-cancel-btn:hover { background:#e2e8f0; }
.settings-add-btn {
  padding:7px 18px; background:#eef2ff; color:#4338ca; border:1.5px solid #c7d2fe;
  border-radius:8px; font-size:.875rem; font-weight:600; cursor:pointer; transition:background .15s, border-color .15s;
}
.settings-add-btn:hover { background:#e0e7ff; border-color:#a5b4fc; }
.settings-link-btn { background:none; border:none; color:#6366f1; font-size:.8rem; font-weight:600;
  cursor:pointer; padding:0; }
.settings-link-btn:hover { color:#4338ca; text-decoration:underline; }
.settings-link-btn-danger { color:#dc2626; }
.settings-link-btn-danger:hover { color:#b91c1c; }

/* ── Saved prompt list rows ──────────────────────── */
.settings-pill-item {
  display:flex; align-items:flex-start; justify-content:space-between; gap:12px;
  padding:10px 14px; background:#fff; border:1px solid #e2e8f0;
  border-radius:10px; margin-bottom:8px; transition:border-color .15s;
}
.settings-pill-item:hover { border-color:#a5b4fc; }
.settings-pill-item-info { display:flex; flex-direction:column; gap:3px; min-width:0; flex:1; }
.settings-pill-item-name { font-size:.875rem; font-weight:700; color:#1e293b; }
.settings-pill-item-url  { font-size:.72rem; color:#94a3b8; white-space:pre-wrap; word-break:break-word; }
.settings-pill-item-actions { display:flex; gap:6px; flex-shrink:0; margin-top:2px; }

/* ── Custom Prompt Picker modal ──────────────────── */
.cp-picker-prompt-item {
  display:flex; align-items:flex-start; gap:9px;
  padding:8px 10px; border:1px solid #e2e8f0; border-radius:10px;
  cursor:pointer; transition:border-color .15s, background .15s;
  font-size:.875rem; color:#334155;
}
.cp-picker-prompt-item:hover { background:#f8fafc; border-color:#a5b4fc; }
.cp-picker-prompt-item input[type=radio] { flex-shrink:0; margin-top:3px; accent-color:#6366f1; cursor:pointer; }
.cp-picker-prompt-label { display:flex; flex-direction:column; gap:2px; }
.cp-picker-prompt-hint { font-size:.72rem; color:#94a3b8; }

/* ── Pill form card ───────────────────────────────── */
.settings-pill-form {
  margin-top:24px; background:#fff; border:1px solid #e2e8f0;
  border-radius:14px; padding:24px 28px;
}

/* ── Radio group ─────────────────────────────────── */
.settings-radio-group { display:flex; flex-direction:column; gap:10px; }
.settings-radio-label {
  display:flex; align-items:flex-start; gap:9px;
  font-size:.875rem; color:#334155; cursor:pointer; line-height:1.5;
}
.settings-radio-label input[type=radio] { flex-shrink:0; margin-top:3px; accent-color:#6366f1; cursor:pointer; }
.settings-radio-label code { background:#f1f5f9; border-radius:4px; padding:1px 4px; font-size:.75rem; color:#475569; }

/* ── Mapping table ───────────────────────────────── */
.settings-mapping-table { width:100%; border-collapse:collapse; font-size:.8rem; }
.settings-mapping-table th { text-align:left; padding:5px 8px; background:#f8fafc;
  color:#94a3b8; font-weight:700; text-transform:uppercase; font-size:.68rem;
  letter-spacing:.04em; border-bottom:1px solid #e2e8f0; }
.settings-mapping-table td { padding:4px 6px; border-bottom:1px solid #f1f5f9; }
.settings-mapping-table tr:last-child td { border-bottom:none; }

/* ── Existing pill list rows ─────────────────────── */
.pill-list-row {
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:10px 14px; background:#fff; border:1px solid #e2e8f0;
  border-radius:10px; margin-bottom:8px; transition:border-color .15s;
}
.pill-list-row:hover { border-color:#a5b4fc; }
.pill-list-info { display:flex; flex-direction:column; gap:2px; min-width:0; }
.pill-list-name { font-size:.875rem; font-weight:700; color:#1e293b; }
.pill-list-meta { font-size:.75rem; color:#94a3b8; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.pill-list-url  { font-family:monospace; font-size:.72rem; background:#f1f5f9;
  border-radius:4px; padding:0 4px; color:#475569; }
.pill-list-actions { display:flex; gap:6px; flex-shrink:0; }

/* ── Custom link pills in ticker modal ───────────── */
.custom-link-pill {
  background: #fdf4ff; color: #7e22ce;
  border: 1px solid #e9d5ff; border-radius: 999px;
  padding: 2px 10px; font-size: .7rem; font-weight: 600;
  letter-spacing: .03em; text-decoration: none; cursor: pointer;
  display: inline-block;
}
.custom-link-pill:hover { background: #f3e8ff; }

/* ── Pill form hint boxes ───────────────────────── */
.pill-hint-box {
  background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
  border: 1.5px solid #fcd34d;
  border-radius: 10px; padding: 12px 14px; margin-top: 8px;
  font-size: .8rem; color: #78350f; line-height: 1.5;
}
.pill-hint-box strong { font-weight: 700; color: #92400e; }
.pill-hint-box code {
  background: rgba(0,0,0,.08); border-radius: 5px; padding: 2px 5px;
  font-family: monospace; font-size: .75rem; color: #78350f;
}

/* ── Choose Pills tab ────────────────────────────── */
.pill-sources-group {
  background: #fff; border: 1px solid #e2e8f0; border-radius: 14px;
  overflow: hidden; margin-bottom: 18px;
}
.pill-sources-group-title {
  font-size: .72rem; font-weight: 800; text-transform: uppercase;
  letter-spacing: .07em; color: #94a3b8;
  padding: 8px 16px 6px; background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
  display: grid; grid-template-columns: 1fr 48px 48px; gap: 4px; align-items: center;
}
.pill-col-header {
  font-size: .62rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .06em; color: #94a3b8; text-align: center; line-height: 1.2;
}
.pill-source-row {
  display: grid; grid-template-columns: 1fr 48px 48px; gap: 4px;
  align-items: center; padding: 9px 16px;
  border-bottom: 1px solid #f1f5f9; transition: background .12s;
}
.pill-source-row:last-child { border-bottom: none; }
.pill-source-row:hover { background: #fafbff; }
.pill-source-label { font-size: .875rem; color: #334155; font-weight: 500; }

/* ── Toggle switch ───────────────────────────────── */
.toggle-switch { position: relative; display: inline-block; width: 40px; height: 23px; flex-shrink: 0; }
.toggle-switch input { opacity: 0; width: 0; height: 0; position: absolute; }
.toggle-slider {
  position: absolute; cursor: pointer; inset: 0;
  background: #cbd5e1; border-radius: 999px;
  transition: background .2s;
}
.toggle-slider::before {
  content: ''; position: absolute;
  width: 17px; height: 17px; left: 3px; bottom: 3px;
  background: #fff; border-radius: 50%;
  transition: transform .2s;
  box-shadow: 0 1px 3px rgba(0,0,0,.18);
}
.toggle-switch input:checked + .toggle-slider { background: #6366f1; }
.toggle-switch input:checked + .toggle-slider::before { transform: translateX(17px); }
.toggle-switch input:focus-visible + .toggle-slider { outline: 2px solid #6366f1; outline-offset: 2px; }
/* Small variant for group headers */
.toggle-switch-sm { width: 32px; height: 18px; }
.toggle-switch-sm .toggle-slider::before { width: 14px; height: 14px; left: 2px; bottom: 2px; }
.toggle-switch-sm input:checked + .toggle-slider::before { transform: translateX(14px); }

/* ── AI Pilled! settings tab ─────────────────────────────── */
.ai-provider-section {
  background: #fff; border: 1px solid #e2e8f0; border-radius: 14px;
  overflow: hidden; margin-bottom: 24px;
}
.ai-provider-title {
  font-size: .875rem; font-weight: 700; color: #1e293b;
  padding: 12px 18px; background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
  display: flex; align-items: center; gap: 8px;
}
.ai-provider-body { padding: 20px 18px 8px; }
.ai-url-row, .ai-prompt-row {
  display: flex; align-items: flex-start; gap: 8px; margin-top: 6px;
}
.ai-url-row .hdr-input  { flex: 1; }
.ai-prompt-row .hdr-input { flex: 1; }
.ai-prompt-textarea {
  width: 100%; resize: vertical; min-height: 82px;
  font-family: inherit; line-height: 1.55; font-size: .8rem; display: block;
}
.ai-reset-btn { flex-shrink: 0; white-space: nowrap; font-size: .73rem; padding: 5px 10px; margin-top: 1px; }

/* ── Note fold cards (All Ticker Notes page) ─────────── */
.nfold-card {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 1px 4px rgba(0,0,0,.05);
  display: flex;
  flex-direction: column;
  transition: border-color .15s, box-shadow .15s;
}
.nfold-card:hover { border-color: #a5b4fc; box-shadow: 0 3px 14px rgba(99,102,241,.1); }
.nfold-card.editing { border-color: #a5b4fc; box-shadow: 0 0 0 2px rgba(99,102,241,.08); }

/* Indigo fold header */
.note-fold-header {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  cursor: pointer;
  user-select: none;
  background: linear-gradient(135deg, #4338ca 0%, #6366f1 55%, #818cf8 100%);
  color: #fff;
  flex-shrink: 0;
  box-shadow: 0 2px 6px rgba(99,102,241,.2);
}
.note-fold-chevron {
  color: rgba(255,255,255,.75);
  font-size: .8rem;
  transition: transform .2s;
  flex-shrink: 0;
  display: inline-block;
}
.nfold-card.expanded .note-fold-chevron,
.nfold-card.editing  .note-fold-chevron { transform: rotate(90deg); color: #fff; }
.note-fold-date {
  font-size: .72rem;
  color: rgba(255,255,255,.82);
  white-space: nowrap;
  flex-shrink: 0;
  margin-right: auto;
}
.note-fold-actions { display: flex; gap: 4px; flex-shrink: 0; }

/* Card body */
.nfold-card-body { display: flex; flex-direction: column; overflow: hidden; position: relative; }

/* Text preview — height-capped + clipped when collapsed.
   overflow-y is intentionally hidden (NOT auto/scroll) so that mouse-wheel
   events are never consumed by the card — they always reach the page scroll
   container. Expand the card to read the full text. */
.nfold-text-section {
  padding: 10px 14px 28px;
  font-size: .82rem;
  color: #334155;
  line-height: 1.55;
  max-height: 260px;
  overflow-y: hidden;
  flex-shrink: 0;
  position: relative;
}
/* Fade-out gradient signals clipped content on collapsed cards */
.nfold-text-section::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 36px;
  background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(255,255,255,.92) 100%);
  pointer-events: none;
}
.nfold-card.expanded .nfold-text-section,
.nfold-card.editing  .nfold-text-section {
  max-height: none;
  overflow-y: visible;
  padding-bottom: 8px;
}
.nfold-card.expanded .nfold-text-section::after,
.nfold-card.editing  .nfold-text-section::after { display: none; }

/* OG card strip — single-row height, vertical scroll to see more.
   overscroll-behavior:contain prevents wheel events from chaining to page. */
.nfold-og-section {
  padding: 0 10px 10px;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 5px;
  max-height: 90px;
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-width: thin;
  overscroll-behavior: contain;
}
.nfold-og-section:empty { padding: 0; display: none; }
.nfold-og-section .og-card { margin-top: 0; }
.nfold-og-section .og-card-loading { font-size: .7rem; color: #94a3b8; padding: 4px 0; grid-column: 1 / -1; }

/* ── Note Detail Modal ───────────────────────────── */
#noteDetailModal.hidden { display: none !important; }
#noteDetailModal { display: flex; }

.note-detail-panel {
  background: #fff;
  border-radius: 16px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  width: min(780px, 96vw);
  height: min(78vh, 900px);
  box-shadow: 0 24px 64px rgba(0,0,0,.28);
}

.note-detail-topbar {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 10px 16px;
  background: linear-gradient(135deg, #4338ca 0%, #6366f1 55%, #818cf8 100%);
  flex-shrink: 0;
  box-shadow: 0 2px 6px rgba(99,102,241,.2);
}
.note-detail-topbar-date {
  font-size: .74rem;
  color: rgba(255,255,255,.85);
  flex: 1;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.note-detail-body {
  flex: 1;
  overflow-y: auto;
  padding: 20px 22px;
  background: #f8fafc;
  font-size: .875rem;
  color: #334155;
  line-height: 1.6;
  min-height: 0;
}
.note-detail-body.editing { background: #fff; }

/* contenteditable area inside the modal body */
.note-detail-edit-area {
  min-height: 100%;
  background: transparent;
  border: none;
  outline: none;
  font-size: .875rem;
  font-family: inherit;
  color: #1e293b;
  line-height: 1.6;
  caret-color: #6366f1;
}
.note-detail-edit-area:focus { outline: none; }

/* OG link strip at bottom of modal */
.note-detail-og-bar {
  flex-shrink: 0;
  border-top: 1px solid #e2e8f0;
  background: #fafbff;
  padding: 8px 12px;
  max-height: 168px;
  overflow-y: auto;
  overflow-x: hidden;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 6px;
  scrollbar-width: thin;
  overscroll-behavior: contain;
}
.note-detail-og-bar:empty { display: none; padding: 0; }
.note-detail-og-bar .og-card { margin-top: 0; }
.note-detail-og-bar .og-card-loading { font-size: .7rem; color: #94a3b8; padding: 4px 0; grid-column: 1 / -1; }

/* Compact, responsive quick-add modal sizing without hard pixel widths. */
.notes-quick-add-panel {
  width: min(42rem, 92vw);
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 18px;
  box-shadow: 0 24px 64px rgba(15, 23, 42, .18);
  display: flex;
  flex-direction: column;
  padding: 1.5rem;
  gap: 1rem;
}

.notes-quick-add-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}

.notes-quick-add-header-copy {
  min-width: 0;
}

.notes-quick-add-title {
  font-size: 1.1rem;
  line-height: 1.2;
  font-weight: 800;
  color: #1e293b;
  margin: 0;
}

.notes-quick-add-lede {
  margin: .45rem 0 0;
  color: #64748b;
  font-size: .95rem;
  line-height: 1.55;
}

.notes-quick-add-general-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0 .18rem;
  padding: .38rem .8rem;
  border-radius: 999px;
  border: 1px solid #c7d2fe;
  background: #eef2ff;
  color: #4338ca;
  font-size: .85rem;
  font-weight: 700;
  cursor: pointer;
  transition: background .15s, border-color .15s, color .15s;
  vertical-align: middle;
}

.notes-quick-add-general-btn:hover {
  background: #e0e7ff;
  border-color: #a5b4fc;
  color: #3730a3;
}

.notes-quick-add-close {
  width: 2.25rem;
  height: 2.25rem;
  border: none;
  border-radius: 10px;
  background: transparent;
  color: #64748b;
  font-size: 1.7rem;
  line-height: 1;
  cursor: pointer;
  flex-shrink: 0;
  transition: background .15s, color .15s;
}

.notes-quick-add-close:hover {
  background: #f1f5f9;
  color: #334155;
}

.notes-quick-add-body {
  display: flex;
  flex-direction: column;
  gap: .7rem;
}

.notes-quick-add-search {
  width: 100%;
  padding: .72rem .95rem;
  font-size: .95rem;
  border-radius: 10px;
}

.notes-quick-add-hint {
  font-size: .8rem;
  color: #64748b;
}

.notes-quick-add-results {
  height: 18rem;
  min-height: 18rem;
  overflow-y: auto;
  overflow-x: hidden;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  background: #f8fafc;
  padding: .55rem;
  scrollbar-width: thin;
}

.notes-quick-add-results-empty {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 1rem;
  color: #94a3b8;
  font-size: .9rem;
}

.notes-quick-add-result-card {
  width: 100%;
  display: flex;
  align-items: center;
  gap: .8rem;
  padding: .8rem .9rem;
  margin-bottom: .5rem;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  background: #fff;
  cursor: pointer;
  transition: border-color .15s, background .15s, box-shadow .15s;
}

.notes-quick-add-result-card:last-child {
  margin-bottom: 0;
}

.notes-quick-add-result-card:hover {
  background: #fafbff;
  border-color: #c7d2fe;
  box-shadow: 0 4px 14px rgba(99, 102, 241, .08);
}

.notes-quick-add-result-copy {
  min-width: 0;
  flex: 1;
}

.notes-quick-add-result-title {
  font-size: .9rem;
  font-weight: 700;
  color: #1e293b;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.notes-quick-add-result-meta {
  font-size: .76rem;
  color: #64748b;
  margin-top: .12rem;
}

.notes-quick-add-result-action {
  font-size: .76rem;
  font-weight: 700;
  color: #6366f1;
  flex-shrink: 0;
}

.notes-quick-add-footer {
  display: flex;
  justify-content: flex-end;
}

@media (max-width: 40rem) {
  .notes-quick-add-panel {
    width: 94vw;
    padding: 1.1rem;
    gap: .9rem;
  }

  .notes-quick-add-results {
    height: 15rem;
    min-height: 15rem;
  }
}

/* ── Page grid: 2 columns ≥960 px, 1 column below ──── */
#allNotesBars {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
  align-items: start;
  padding-bottom: 120px; /* large dead-zone below last card so page scroll stays reachable */
}
@media (max-width: 959px) {
  #allNotesBars { grid-template-columns: 1fr; }
}

/* ── General Notes card variant ─────────────────────── */
.notes-card-general {
  border-color: #c7d2fe;
  background: linear-gradient(135deg, #fafbff 0%, #fff 100%);
}
.notes-card-general:hover { border-color: #818cf8; }

/* ── Filing Annotation Viewer ────────────────────────── */

/* Sidebar scroll container */
/* Zoom toolbar above the filing document */
.fv-zoom-bar {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 4px 10px;
  background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
}
.fv-zoom-btn {
  width: 26px; height: 26px;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
  background: #fff;
  cursor: pointer;
  font-size: 1rem;
  font-weight: 700;
  color: #475569;
  display: flex; align-items: center; justify-content: center;
  transition: background .1s, border-color .1s;
}
.fv-zoom-btn:hover { background: #e0e7ff; border-color: #818cf8; color: #4338ca; }
.fv-zoom-label {
  min-width: 40px;
  text-align: center;
  font-size: .72rem;
  font-weight: 600;
  color: #64748b;
  font-variant-numeric: tabular-nums;
}
.fv-zoom-reset {
  font-size: .68rem;
  padding: 2px 7px;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
  background: #fff;
  cursor: pointer;
  color: #64748b;
  transition: background .1s;
}
.fv-zoom-reset:hover { background: #f1f5f9; color: #334155; }

.fv-sidebar { overflow: hidden; }

/* Selection hint strip */
.fv-select-hint {
  padding: 8px 12px;
  font-size: .72rem;
  color: #94a3b8;
  background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
  line-height: 1.4;
  flex-shrink: 0;
}

/* Annotation compose bar (yellow tint) */
.fv-annotate-bar {
  background: #fefce8;
}

/* Quoted selection preview */
#fvSelectionPreview {
  font-size: .72rem;
  font-style: italic;
  color: #475569;
  background: #fef9c3;
  border: 1px solid #fde047;
  border-radius: 7px;
  padding: 6px 8px;
  margin-bottom: 8px;
  max-height: 72px;
  overflow-y: auto;
  line-height: 1.4;
  word-break: break-word;
}

/* Annotation textarea */
.fv-annotation-input {
  width: 100%;
  font-size: .75rem;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  padding: 6px 8px;
  resize: vertical;
  outline: none;
  font-family: inherit;
  color: #1e293b;
  background: #fff;
  line-height: 1.5;
  box-sizing: border-box;
}
.fv-annotation-input:focus { border-color: #818cf8; box-shadow: 0 0 0 2px rgba(129,140,248,.18); }

/* Annotation search bar */
.fv-search-input {
  width: 100%;
  box-sizing: border-box;
  font-size: .72rem;
  padding: 4px 24px 4px 8px;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  background: #fff;
  color: #334155;
  outline: none;
  line-height: 1.5;
  font-family: inherit;
}
.fv-search-input:focus { border-color: #6366f1; }
.fv-search-clear {
  display: none;
  position: absolute;
  right: 4px;
  top: 50%;
  transform: translateY(-50%);
  width: 16px;
  height: 16px;
  border: none;
  background: none;
  cursor: pointer;
  padding: 0;
  align-items: center;
  justify-content: center;
  color: #94a3b8;
  font-size: .75rem;
  line-height: 1;
}
.fv-search-clear:hover { color: #475569; }

/* Find-in-document toolbar */
.fv-find-bar {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 4px 10px;
  background: #f1f5f9;
  border-bottom: 1px solid #e2e8f0;
  flex-shrink: 0;
}
.fv-find-label {
  font-size: .78rem;
  color: #94a3b8;
  flex-shrink: 0;
  line-height: 1;
}
.fv-find-input {
  flex: 1;
  min-width: 0;
  font-size: .72rem;
  padding: 3px 8px;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
  background: #fff;
  color: #334155;
  outline: none;
  font-family: inherit;
  height: 24px;
  box-sizing: border-box;
}
.fv-find-input:focus { border-color: #6366f1; }
.fv-find-count {
  font-size: .65rem;
  color: #64748b;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
  min-width: 50px;
  text-align: center;
  flex-shrink: 0;
}
.fv-find-nav-btn {
  width: 22px; height: 22px;
  border: 1px solid #cbd5e1;
  border-radius: 5px;
  background: #fff;
  cursor: pointer;
  font-size: .72rem;
  font-weight: 700;
  color: #475569;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  transition: background .1s;
  padding: 0;
  line-height: 1;
}
.fv-find-nav-btn:hover { background: #e0e7ff; border-color: #818cf8; color: #4338ca; }
.fv-find-nav-btn:disabled { opacity: .4; cursor: default; }
.fv-find-clear-btn {
  width: 18px; height: 18px;
  border: none;
  background: none;
  cursor: pointer;
  color: #94a3b8;
  font-size: .75rem;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  border-radius: 3px;
  padding: 0;
  line-height: 1;
}
.fv-find-clear-btn:hover { color: #475569; background: #e2e8f0; }

/* Find mark highlights (filing viewer — injected into iframe too) */
.__fv-find__        { background: rgba(250,204,21,.55) !important; border-radius: 2px; }
.__fv-find-active__ { background: #f59e0b !important; border-radius: 2px; box-shadow: 0 0 0 2px #d97706; }

/* Find mark highlights (upload viewer — main DOM) */
/* Flow docs (DOCX/TXT): <mark> elements in normal flow */
mark.__uv-find__ {
  background: rgba(250,204,21,.55) !important;
  position: static !important;
  display: inline !important;
  border-radius: 0;
  padding: 0;
  color: inherit;
}
mark.__uv-find__.uv-find-active {
  background: #f59e0b !important;
  box-shadow: 0 0 0 1px #d97706;
}

/* PDF mode: absolutely-positioned overlay divs (never touch text-layer DOM) */
.uv-pdf-find-mark {
  background: rgba(250,204,21,.45);
  border-radius: 1px;
}
.uv-pdf-find-mark.uv-find-active {
  background: rgba(245,158,11,.7);
  outline: 2px solid #d97706;
  outline-offset: 0;
}

/* Individual annotation card */
.fv-annotation {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  padding: 9px 10px;
  margin-bottom: 8px;
  box-shadow: 0 1px 3px rgba(0,0,0,.04);
}

.fv-ann-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 4px;
  margin-bottom: 6px;
}

.fv-ann-date {
  font-size: .65rem;
  color: #94a3b8;
  line-height: 1.3;
}

.fv-edited {
  font-size: .65rem;
  color: #94a3b8;
  margin-left: 3px;
}

/* Edit + delete button group */
.fv-ann-actions {
  display: flex;
  align-items: center;
  gap: 2px;
  flex-shrink: 0;
}
.fv-ann-edit-btn, .fv-ann-del {
  background: none;
  border: none;
  cursor: pointer;
  font-size: .7rem;
  color: #cbd5e1;
  padding: 1px 3px;
  line-height: 1;
  border-radius: 4px;
  transition: color .12s, background .12s;
}
.fv-ann-edit-btn:hover { color: #6366f1; background: #eef2ff; }
.fv-ann-del:hover      { color: #f87171; background: #fef2f2; }

/* Highlighted passage box */
.fv-ann-highlight {
  background: #fffbeb;
  border: 1px solid #fde68a;
  border-radius: 7px;
  padding: 6px 9px;
  margin-bottom: 6px;
}
/* Navigable highlight box — clicking scrolls to that passage */
.fv-ann-highlight--nav {
  cursor: pointer;
  transition: background .13s, border-color .13s;
}
.fv-ann-highlight--nav:hover {
  background: #fef3c7;
  border-color: #f59e0b;
}
.fv-ann-hl-label {
  display: block;
  font-size: .6rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: #b45309;
  margin-bottom: 3px;
}
/* Subtle "go to" hint shown beside the label when the box is navigable */
.fv-ann-hl-goto {
  font-size: .6rem;
  font-weight: 600;
  color: #92400e;
  opacity: 0.45;
  transition: opacity .13s;
  flex-shrink: 0;
}
.fv-ann-highlight--nav:hover .fv-ann-hl-goto {
  opacity: 1;
}
/* Remove old standalone Find button (now replaced by the clickable box) */
.fv-ann-find-btn { display: none; }
.fv-ann-hl-text {
  font-size: .72rem;
  font-style: italic;
  color: #78350f;
  line-height: 1.5;
  word-break: break-word;
  white-space: pre-wrap;
}

/* User comment box */
.fv-ann-comment {
  background: #eff6ff;
  border: 1px solid #bfdbfe;
  border-radius: 7px;
  padding: 6px 9px;
  font-size: .75rem;
  color: #1e3a5f;
  line-height: 1.55;
  word-break: break-word;
  white-space: pre-wrap;
  margin-bottom: 6px;
}

/* Edit mode action buttons */
.fv-ann-edit-actions {
  display: flex;
  gap: 6px;
  margin-top: 6px;
}
.fv-save-btn {
  font-size: .72rem;
  padding: 3px 12px;
  border-radius: 6px;
  border: none;
  background: #6366f1;
  color: #fff;
  cursor: pointer;
  font-weight: 600;
  transition: background .12s;
}
.fv-save-btn:hover { background: #4f46e5; }
.fv-cancel-btn {
  font-size: .72rem;
  padding: 3px 10px;
  border-radius: 6px;
  border: 1px solid #cbd5e1;
  background: #fff;
  color: #64748b;
  cursor: pointer;
  transition: background .12s;
}
.fv-cancel-btn:hover { background: #f1f5f9; }

.fv-ann-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 6px;
}

.fv-tag {
  font-size: .62rem;
  background: #ede9fe;
  color: #5b21b6;
  padding: 1px 6px;
  border-radius: 20px;
  font-weight: 600;
}

/* Empty / loading state */
.fv-ann-empty {
  font-size: .72rem;
  color: #94a3b8;
  text-align: center;
  padding: 16px 8px;
  white-space: pre-line;
  line-height: 1.6;
}

/* Floating highlight bubble */
#fvSelectionBubble,
#uvSelectionBubble {
  background: #fef08a;
  color: #713f12;
  border: 1.5px solid #ca8a04;
  border-radius: 20px;
  padding: 4px 11px;
  font-size: .72rem;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 2px 8px rgba(202,138,4,.30), 0 0 0 1px rgba(202,138,4,.15);
  white-space: nowrap;
  animation: fvBubbleFadeIn .12s ease;
  transition: background .12s, border-color .12s;
}
#fvSelectionBubble:hover,
#uvSelectionBubble:hover { background: #fde047; border-color: #a16207; }
#fvSelectionBubble.fv-bubble--warn {
  background: #fff7ed;
  color: #9a3412;
  border-color: #fb923c;
  box-shadow: 0 2px 8px rgba(251,146,60,.30), 0 0 0 1px rgba(251,146,60,.15);
}
#fvSelectionBubble.fv-bubble--warn:hover { background: #ffedd5; border-color: #ea580c; }
@keyframes fvBubbleFadeIn {
  from { opacity: 0; transform: translateY(4px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Loading / error in the doc pane */
.fv-load-err {
  font-size: .85rem;
  color: #f87171;
  text-align: center;
  padding: 32px;
}

/* ─────────────────────────────────────────────────────────
   MOBILE RESPONSIVE  (≤ 768 px)
   ───────────────────────────────────────────────────────── */

/* Mobile top bar — hidden on desktop, shown on mobile */
.mobile-top-bar {
  display: none;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  background: #3437a1;
  color: #fff;
  flex-shrink: 0;
  z-index: 25;
  min-height: 48px;
}
.mobile-top-bar .mobile-title {
  font-size: .95rem;
  font-weight: 700;
  flex: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mobile-top-bar .mobile-menu-btn {
  background: none;
  border: none;
  color: #fff;
  font-size: 1.45rem;
  cursor: pointer;
  padding: 2px 4px;
  line-height: 1;
  flex-shrink: 0;
  border-radius: 6px;
  transition: background .15s;
}
.mobile-top-bar .mobile-menu-btn:hover { background: rgba(255,255,255,.15); }
.mobile-top-bar .mobile-filter-btn {
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.25);
  color: #e0e7ff;
  font-size: .78rem;
  font-weight: 600;
  padding: 5px 12px;
  border-radius: 20px;
  cursor: pointer;
  flex-shrink: 0;
  transition: background .15s;
  white-space: nowrap;
}
.mobile-top-bar .mobile-filter-btn.filters-open {
  background: rgba(255,255,255,.3);
  color: #fff;
  border-color: rgba(255,255,255,.5);
}

/* Mobile nav overlay — semi-transparent backdrop */
.mobile-nav-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.45);
  z-index: 19;
}
.mobile-nav-overlay.open { display: block; }

@media (max-width: 768px) {
  /* Show the mobile top bar */
  .mobile-top-bar { display: flex; }

  /* Stack the page shell vertically so mobile top bar sits above content */
  .page-shell { flex-direction: column; }

  /* Left nav slides off-screen to the left; overlays content when open */
  .left-nav {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    width: 80vw;
    max-width: 260px;
    min-width: 0;
    transform: translateX(-100%);
    transition: transform .25s cubic-bezier(.4,0,.2,1);
    z-index: 20;
  }
  .left-nav.mobile-open {
    transform: translateX(0);
    box-shadow: 4px 0 24px rgba(0,0,0,.35);
  }

  /* Content area stretches to full width */
  .content-area { width: 100%; }

  /* Page scroll gets less horizontal padding on small screens */
  .page-scroll { padding: 14px 14px 40px; }

  /* Page toolbar hidden by default on mobile; shown when filters-open.
     !important overrides any inline display style on the element. */
  .page-toolbar { display: none !important; }
  .page-toolbar.mobile-filters-open { display: flex !important; flex-direction: column; }

  /* Compact tile border-radius */
  .tile { border-radius: 10px; }

  /* Today's Market: AI tools row wraps and drops border */
  #aiToolsPanel {
    flex-wrap: wrap;
    margin-left: 0 !important;
    padding-left: 0 !important;
    border-left: none !important;
    margin-top: 6px;
  }

  /* Earnings toolbar: reduce padding, allow wrapping */
  #earningsPage .page-toolbar .flex { flex-wrap: wrap; gap: 6px; padding: 8px 12px; }

  /* Today's market toolbar rows: tighter padding */
  #todaysMarketPage .page-toolbar > div { padding: 8px 12px; }

  /* Settings inner sidebar: collapse to top strip on mobile */
  .settings-layout { flex-direction: column; }
  .settings-sidebar {
    width: 100%;
    min-width: 0;
    flex-direction: row;
    flex-wrap: wrap;
    overflow-x: auto;
    border-right: none;
    border-bottom: 1px solid #e2e8f0;
    padding: 4px 0;
    gap: 0;
  }
  .settings-sidebar-title { display: none; }
  .settings-nav-item {
    white-space: nowrap;
    border-left: none;
    border-bottom: 2px solid transparent;
    padding: 8px 12px;
    font-size: .8rem;
  }
  .settings-nav-item.active {
    border-bottom-color: #6366f1;
    border-left: none;
    border-right: none;
  }
  .settings-content { padding: 16px 16px 40px; }
}

/* Ticker modal tabs (desktop & mobile combined) */
.tm-tabs-container {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  max-height: 100%;
  overflow: hidden;
}

.tm-tabs-buttons {
  display: flex;
  gap: 0;
  border-bottom: 1px solid #e2e8f0;
  background: #f1f5f9;
  flex-shrink: 0;
  height: auto;
  overflow-x: auto;
  overscroll-behavior-x: contain;
}

.tm-tab-btn {
  flex: 0 0 auto;
  padding: 12px 20px;
  background: #f1f5f9;
  border: none;
  border-bottom: 3px solid transparent;
  color: #64748b;
  font-weight: 600;
  font-size: 0.875rem;
  cursor: pointer;
  transition: all 0.2s ease;
  white-space: nowrap;
}

.tm-tab-btn:hover {
  background: #e2e8f0;
  color: #475569;
}

.tm-tab-btn.active {
  background: #ffffff;
  color: #4f46e5;
  border-bottom-color: #4f46e5;
}

/* Tab content area - takes remaining space */
.tm-tabs-content {
  flex: 1;
  overflow: hidden;
  min-height: 0;
}

/* Tab panels - individual scrolling */
.tm-tab-panel {
  display: none;
  flex-direction: column;
  height: 100%;
  overflow-y: auto;
}

.tm-tab-panel.active {
  display: flex;
}

/* Chart preset buttons */
.tm-chart-preset {
  padding: 6px 12px;
  font-size: 0.75rem;
  font-weight: 600;
  border: 1px solid #cbd5e1;
  background: #f8fafc;
  color: #475569;
  border-radius: 6px;
  cursor: pointer;
  transition: all 0.2s ease;
  white-space: nowrap;
}

.tm-chart-preset:hover {
  background: #f1f5f9;
  border-color: #94a3b8;
  color: #334155;
}

.tm-chart-preset.active {
  background: #4f46e5;
  color: #ffffff;
  border-color: #4f46e5;
}

/* Chart controls row */
.tm-chart-controls-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.tm-chart-presets {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  flex-wrap: wrap;
  flex: 1 1 auto;
  min-width: 0;
}

.tm-chart-controls-right {
  margin-left: auto;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  min-width: 82px;
}

.tm-chart-options-panel {
  display: grid;
  grid-template-rows: 1fr 1fr;
  gap: 0.2rem;
  width: 226px;
  min-height: 46px;
  padding: 3px 6px;
  border: 1px solid #e5d3ab;
  border-radius: 8px;
  background: linear-gradient(180deg, rgba(255, 249, 236, 0.96) 0%, rgba(255, 242, 216, 0.93) 100%);
  box-shadow: 0 2px 10px rgba(120, 88, 34, 0.14);
  backdrop-filter: blur(3px);
  position: absolute;
  top: 8px;
  left: 8px;
  z-index: 6;
  cursor: grab;
}

.tm-chart-options-panel.dragging {
  cursor: grabbing;
}

.tm-return-badge {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-width: 74px;
  max-width: 74px;
  min-height: 30px;
  padding: 6px 10px;
  border-radius: 6px;
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1;
  box-sizing: border-box;
  text-align: center;
}

/* Chart type / candle interval toggle controls */
.tm-chart-type-toggle {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  flex-wrap: nowrap;
  justify-content: space-between;
  min-height: 18px;
}

.tm-chart-type-toggle-label {
  font-size: 0.55rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: #64748b;
}

.tm-chart-type-toggle-buttons {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  padding: 1px;
  border: 1px solid #cbd5e1;
  border-radius: 7px;
  background: #f8fafc;
}

.tm-chart-type-toggle-btn {
  border: none;
  background: transparent;
  color: #475569;
  font-size: 0.6rem;
  font-weight: 700;
  padding: 2px 6px;
  border-radius: 4px;
  cursor: pointer;
  transition: all 0.15s ease;
}

.tm-chart-type-toggle-btn:hover {
  background: #e2e8f0;
  color: #334155;
}

.tm-chart-type-toggle-btn.active {
  background: #4f46e5;
  color: #ffffff;
}

.tm-chart-type-toggle.hidden,
.tm-chart-options-panel.hidden {
  display: none;
}

.tm-chart-type-toggle.is-hidden {
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
}

@media (max-width: 900px) {
  .tm-chart-controls-right {
    min-width: 74px;
  }

  .tm-chart-options-panel {
    width: 200px;
    min-height: 42px;
    top: 6px;
    left: 6px;
  }
}

/* Chart container - tall and responsive */
#tmTabCharts.active {
  display: flex !important;
}

#tmTabCharts > div {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  height: 100%;
}

#tmTabCharts .flex-1 {
  flex: 1;
  min-height: 300px;
}

/* ── Financials tab ─────────────────────────────────── */
#tmTabFinancials.active {
  display: flex !important;
}

.tm-fin-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  border-bottom: 1px solid #e2e8f0;
  background: #f8fafc;
  flex-shrink: 0;
  padding: 0 1rem;
  flex-wrap: wrap;
}

.tm-fin-subtabs {
  display: flex;
  gap: 0;
  min-width: 0;
}

.tm-fin-controls {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  flex-wrap: wrap;
  margin-left: auto;
  padding: 0.45rem 0;
}

.tm-fin-controls .tm-chart-type-toggle {
  gap: 0.35rem;
  min-height: 24px;
}

.tm-fin-controls .tm-chart-type-toggle-buttons {
  background: #ffffff;
}

.tm-fin-subtab-btn {
  padding: 8px 14px;
  background: transparent;
  border: none;
  border-bottom: 2px solid transparent;
  color: #64748b;
  font-weight: 600;
  font-size: 0.8rem;
  cursor: pointer;
  transition: all 0.15s ease;
  white-space: nowrap;
}

.tm-fin-subtab-btn:hover {
  color: #475569;
  background: #f1f5f9;
}

.tm-fin-subtab-btn.active {
  color: #4f46e5;
  border-bottom-color: #4f46e5;
  background: transparent;
}

.tm-fin-content {
  flex: 1;
  min-height: 0;
  overflow: hidden;
  position: relative;
}

.tm-fin-subpanel {
  display: none;
  flex-direction: column;
  height: 100%;
  padding: 1rem 1.25rem;
}

.tm-fin-subpanel.active {
  display: flex;
}

.tm-fin-chart-wrap {
  flex: 1;
  min-height: 320px;
  background: #fff;
  border-radius: 12px;
  border: 1px solid #f1f5f9;
  padding: 8px 10px 6px;
  position: relative;
}

.tm-fin-margins-type-panel {
  position: absolute;
  top: 8px;
  right: 8px;
  padding: 3px 6px;
  border: 1px solid #e5d3ab;
  border-radius: 8px;
  background: linear-gradient(180deg, rgba(255, 249, 236, 0.96) 0%, rgba(255, 242, 216, 0.93) 100%);
  box-shadow: 0 2px 10px rgba(120, 88, 34, 0.14);
  z-index: 6;
}

.tm-fin-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2rem 0;
  font-size: 0.875rem;
}

.tm-fin-loading.hidden { display: none; }

.tm-fin-empty {
  padding: 2rem 0;
  font-size: 0.875rem;
  color: #94a3b8;
  text-align: center;
}

.tm-fin-empty.hidden { display: none; }

/* Balance Sheet tab – table view */
.tm-fin-bs-table-wrap {
  overflow-y: auto;
  height: 100%;
  /* top padding keeps the sticky header from sitting under the Chart/Table toggle */
  padding: 38px 0 2px;
}

.tm-fin-bs-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.8rem;
}

.tm-fin-bs-table th {
  padding: 5px 10px;
  text-align: right;
  font-size: 0.7rem;
  font-weight: 700;
  color: #64748b;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  border-bottom: 2px solid #e2e8f0;
  white-space: nowrap;
  position: sticky;
  top: 0;
  background: #fff;
  z-index: 1;
}

.tm-fin-bs-table th:first-child {
  text-align: left;
}

.tm-fin-bs-sort-btn {
  background: none;
  border: none;
  padding: 0 0 0 4px;
  cursor: pointer;
  color: #94a3b8;
  font-size: 0.75rem;
  line-height: 1;
  vertical-align: middle;
  transition: color 0.12s;
}

.tm-fin-bs-sort-btn:hover { color: #4f46e5; }

.tm-fin-bs-table td {
  padding: 5px 10px;
  text-align: right;
  color: #334155;
  border-bottom: 1px solid #f1f5f9;
  white-space: nowrap;
}

.tm-fin-bs-table td:first-child {
  text-align: left;
  font-weight: 600;
  color: #1e293b;
}

.tm-fin-bs-table tr:last-child td { border-bottom: none; }
.tm-fin-bs-table tr:hover td { background: #f8fafc; }

.tm-fin-bs-positive { color: #15803d; }
.tm-fin-bs-negative { color: #dc2626; }
.tm-fin-bs-neutral  { color: #64748b; }

/* ── Statements Tab ─────────────────────────────────── */
.tm-stmt-content {
  flex: 1;
  min-height: 0;
  overflow: hidden;
  position: relative;
}

.tm-stmt-subpanel {
  display: none;
  flex-direction: column;
  height: 100%;
}

.tm-stmt-subpanel.active {
  display: flex;
}

.tm-stmt-table-wrap {
  flex: 1;
  overflow: auto;
  padding: 0;
}

/* Statements table — periods as columns, line items as rows */
.tm-stmt-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.78rem;
  white-space: nowrap;
}

.tm-stmt-table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: #f8fafc;
  padding: 7px 12px;
  font-size: 0.7rem;
  font-weight: 700;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  border-bottom: 2px solid #e2e8f0;
  text-align: right;
  white-space: nowrap;
}

.tm-stmt-table th.tm-stmt-row-label {
  text-align: left;
  min-width: 190px;
  max-width: 220px;
  left: 0;
  z-index: 3;
  background: #f8fafc;
  border-right: 1px solid #e2e8f0;
}

/* Sticky left column for row labels */
.tm-stmt-table td.tm-stmt-row-label {
  position: sticky;
  left: 0;
  background: #ffffff;
  z-index: 1;
  border-right: 1px solid #f1f5f9;
  padding: 6px 12px 6px 10px;
  color: #475569;
  font-weight: 500;
  white-space: nowrap;
  min-width: 190px;
  max-width: 220px;
}

.tm-stmt-period-header {
  cursor: default;
  min-width: 88px;
}

.tm-stmt-has-filing.tm-stmt-period-header {
  cursor: pointer;
  color: #4f46e5;
}

.tm-stmt-has-filing.tm-stmt-period-header:hover {
  background: #ede9fe;
}

.tm-stmt-filing-icon {
  font-size: 0.65rem;
  opacity: 0.7;
}

/* Data cells */
.tm-stmt-cell {
  padding: 6px 12px;
  text-align: right;
  color: #334155;
  cursor: pointer;
  border-bottom: 1px solid #f8fafc;
  transition: background 0.1s;
}

.tm-stmt-cell:hover {
  background: #ede9fe;
  color: #3730a3;
}

.tm-stmt-cell-null {
  color: #cbd5e1;
  cursor: default;
}
.tm-stmt-cell-null:hover { background: transparent; color: #cbd5e1; }

.tm-stmt-cell-neg { color: #b91c1c; }

/* Row types */
.tm-stmt-data-row td.tm-stmt-row-label { font-weight: 400; }

.tm-stmt-section-row td {
  padding: 10px 10px 4px;
  font-size: 0.68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #94a3b8;
  background: #f8fafc;
  border-top: 1px solid #e2e8f0;
  border-bottom: none;
}

.tm-stmt-subtotal-row td {
  font-weight: 700;
  color: #1e293b;
  border-top: 1px solid #e2e8f0;
  background: #f8fafc;
}
.tm-stmt-subtotal-row td.tm-stmt-row-label { background: #f8fafc; }
.tm-stmt-subtotal-row .tm-stmt-cell:hover { background: #ede9fe; }

.tm-stmt-total-row td {
  font-weight: 800;
  color: #0f172a;
  border-top: 2px solid #cbd5e1;
  border-bottom: 2px solid #cbd5e1;
  background: #f1f5f9;
}
.tm-stmt-total-row td.tm-stmt-row-label { background: #f1f5f9; }
.tm-stmt-total-row .tm-stmt-cell:hover { background: #ede9fe; }

.tm-stmt-table tr:hover td.tm-stmt-row-label { background: #f1f5f9; }

/* Drilldown indicator on subtotal/total row labels */
.tm-stmt-dd-chevron {
  color: #818cf8;
  font-size: 0.6rem;
  margin-left: 4px;
  opacity: 0.75;
  vertical-align: middle;
}

/* Drilldown cells get a distinct cursor */
.tm-stmt-cell-drill { cursor: zoom-in; }
.tm-stmt-cell-drill:hover { background: #e0e7ff !important; color: #3730a3 !important; }
.tm-stmt-subtotal-row .tm-stmt-cell-drill:hover,
.tm-stmt-total-row    .tm-stmt-cell-drill:hover { background: #c7d2fe !important; }

/* ── Drilldown popover ─────────────────────────────────────────────────────── */
.tm-stmt-dd-tip {
  position: fixed;
  z-index: 9999;
  background: #1e293b;
  border: 1px solid #334155;
  border-radius: 7px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.55);
  min-width: 250px;
  max-width: 330px;
  font-size: 0.78rem;
  color: #e2e8f0;
  overflow: hidden;
}
.tm-stmt-dd-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 6px 10px;
  border-bottom: 1px solid #334155;
  background: #0f172a;
}
.tm-stmt-dd-title {
  font-weight: 700;
  font-size: 0.68rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #94a3b8;
}
.tm-stmt-dd-close {
  background: none;
  border: none;
  color: #64748b;
  cursor: pointer;
  font-size: 0.85rem;
  padding: 0 2px;
  line-height: 1;
}
.tm-stmt-dd-close:hover { color: #e2e8f0; }
.tm-stmt-dd-body { padding: 4px 0; }
.tm-stmt-dd-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 5px 10px;
  gap: 14px;
  border-bottom: 1px solid #263044;
}
.tm-stmt-dd-row:last-child { border-bottom: none; }
.tm-stmt-dd-label {
  flex: 1;
  color: #94a3b8;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.tm-stmt-dd-val {
  font-weight: 600;
  color: #e2e8f0;
  white-space: nowrap;
  padding: 2px 7px;
  border-radius: 4px;
  cursor: pointer;
  transition: background 0.1s;
}
.tm-stmt-dd-val:hover { background: #4f46e5; color: #fff; }
.tm-stmt-dd-val.tm-stmt-cell-neg { color: #f87171; }
.tm-stmt-dd-val-null { color: #475569; white-space: nowrap; padding: 2px 7px; font-style: italic; }
/* Static (non-clickable) value in drilldown, e.g., the = Q4 result */
.tm-stmt-dd-val-static { cursor: default; }
.tm-stmt-dd-val-static:hover { background: transparent !important; color: #e2e8f0 !important; }
/* Operator row (−) between Annual and Q components */
.tm-stmt-dd-op {
  padding: 0 10px 0 14px;
  font-size: 0.82rem;
  font-weight: 800;
  color: #64748b;
  line-height: 1.35;
  user-select: none;
}
/* Separator line before the = Q4 result */
.tm-stmt-dd-sep {
  border-top: 1px solid #334155;
  margin: 3px 10px 0;
}
/* = Q4 result row */
.tm-stmt-dd-result .tm-stmt-dd-label { color: #e2e8f0; font-weight: 700; }
/* Computed cell (value derived from component sum when DB field is null) */
.tm-stmt-cell-derived { font-style: italic; color: #94a3b8; }
.tm-stmt-subtotal-row .tm-stmt-cell-derived,
.tm-stmt-total-row    .tm-stmt-cell-derived { font-style: italic; }

@media (max-width: 900px) {
  .tm-fin-toolbar {
    padding: 0.5rem 0.75rem;
    align-items: flex-start;
  }

  .tm-fin-subtabs {
    width: 100%;
    overflow-x: auto;
  }

  .tm-fin-controls {
    width: 100%;
    margin-left: 0;
    justify-content: flex-start;
    padding-top: 0;
  }

  .tm-fin-chart-wrap {
    min-height: 260px;
  }
}

/* ── Basics tab ─────────────────────────────────────── */
.tm-basics-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
  gap: 1rem;
  align-items: start;
}

.tm-basics-stack {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.tm-basics-stack:first-child {
  align-self: stretch;
}

.tm-basics-card {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: 12px 14px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.03);
  display: flex;
  flex-direction: column;
}

.tm-basics-stack:first-child .tm-basics-card {
  flex: 1;
}

.tm-basics-card-title {
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #64748b;
  margin-bottom: 0.45rem;
}

.tm-basics-name {
  font-size: 1.05rem;
  font-weight: 700;
  line-height: 1.35;
  color: #1e293b;
}

.tm-basics-sub {
  font-size: 0.78rem;
  color: #64748b;
  margin-top: 0.3rem;
}

.tm-basics-desc-wrap {
  position: relative;
  margin-top: 0.65rem;
  margin-bottom: 0.85rem;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 0.75rem;
}

.tm-basics-desc {
  font-size: 0.77rem;
  line-height: 1.55;
  color: #475569;
  max-height: calc(0.77rem * 1.55 * 8); /* 8 lines */
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 8;
  -webkit-box-orient: vertical;
}

.tm-basics-desc-expand {
  position: absolute;
  top: 0.5rem;
  right: 0.5rem;
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #ffffff;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
  color: #64748b;
  font-size: 0.85rem;
  cursor: pointer;
  transition: all 0.15s ease;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}

.tm-basics-desc-expand:hover {
  background: #f1f5f9;
  border-color: #94a3b8;
  color: #475569;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
}

.tm-basics-pillrow {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin-top: 0.65rem;
}

.tm-basics-pill {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 0.68rem;
  font-weight: 600;
  background: #eef2ff;
  color: #4338ca;
}

.tm-basics-pill.secondary {
  background: #f1f5f9;
  color: #475569;
}

.tm-basics-kv {
  display: grid;
  grid-template-columns: minmax(110px, 1fr) auto;
  row-gap: 0.46rem;
  column-gap: 0.8rem;
  align-items: baseline;
}

.tm-basics-k {
  font-size: 0.74rem;
  color: #64748b;
}

.tm-basics-v {
  font-size: 0.8rem;
  color: #0f172a;
  text-align: right;
  font-weight: 600;
}

.tm-basics-v.weak {
  color: #475569;
  font-weight: 500;
}

.tm-basics-link {
  color: #4338ca;
  text-decoration: none;
  border-bottom: 1px dashed rgba(67, 56, 202, 0.35);
}

.tm-basics-link:hover {
  color: #3730a3;
  border-bottom-color: rgba(55, 48, 163, 0.55);
}

.tm-basics-mini {
  margin-top: 0.65rem;
  font-size: 0.67rem;
  color: #94a3b8;
}

.tm-basics-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2rem 0;
  font-size: 0.875rem;
}

.tm-basics-loading.hidden { display: none; }

.tm-basics-empty {
  padding: 2rem 0;
  font-size: 0.875rem;
  color: #94a3b8;
  text-align: center;
}

.tm-basics-empty.hidden { display: none; }

@media (max-width: 900px) {
  .tm-basics-layout {
    grid-template-columns: 1fr;
  }
}
