:root {
  /* 3-niveau farve-hierarki (mørkeste = page bg → lyseste = elevated card).
     Reviewer noterede at panels og sektioner var visuelt for ens. */
  --bg: #05101c;                                /* page bg, mørkeste */
  --bg-soft: #0a1626;                            /* subtle sektion */
  --bg-panel: rgba(24, 38, 58, 0.85);            /* standard kort/panel */
  --bg-panel-strong: rgba(30, 46, 70, 0.96);     /* fremhævet/active kort */
  --bg-elevated: rgba(38, 58, 86, 0.92);         /* højeste lag — highlighted */

  --border: rgba(148, 163, 184, 0.18);
  --border-strong: rgba(96, 165, 250, 0.45);

  --text: #f8fafc;
  --text-muted: #a8b3c4;
  --text-soft: #cbd5e1;
  --muted: #a8b3c4;
  --panel: rgba(24, 38, 58, 0.85);

  --accent: #4f9cff;
  --accent-soft: rgba(79, 156, 255, 0.16);

  --green: #45e58c;
  --green-strong: #1ddc7a;                       /* stærkere variant til pl-strong */
  --red: #ff5d5d;
  --red-strong: #ff2e2e;
  --purple: #a855f7;
  --yellow: #facc15;

  --radius: 10px;
  --shadow: 0 12px 32px rgba(0, 0, 0, 0.32);
  --shadow-elevated: 0 16px 40px rgba(0, 0, 0, 0.48);
}

/* RESET */

* {
  box-sizing: border-box;
}

/* LOGIN — standalone side (uden for SPA-shell) */

.login-page {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}

.login-card {
  width: 100%;
  max-width: 360px;
  padding: 28px 26px 22px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.035), transparent),
    var(--bg-panel-strong);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}

.login-brand {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 24px;
  justify-content: center;
}

.login-form {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.login-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.login-label {
  font-size: 0.7rem;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.login-input {
  padding: 8px 12px;
  font-size: 0.9rem;
  color: var(--text);
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid var(--border);
  border-radius: 6px;
  outline: none;
  font-family: inherit;
}

.login-input:focus {
  border-color: var(--border-strong);
}

.login-submit {
  margin-top: 4px;
  padding: 9px 16px;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--text);
  background: var(--accent-soft);
  border: 1px solid var(--border-strong);
  border-radius: 6px;
  cursor: pointer;
  transition: background 120ms;
}

.login-submit:hover {
  background: rgba(79, 156, 255, 0.28);
}

.login-submit:disabled {
  opacity: 0.6;
  cursor: default;
}

.login-error {
  margin: 0;
  padding: 8px 10px;
  font-size: 0.8rem;
  color: var(--red);
  background: rgba(255, 93, 93, 0.08);
  border: 1px solid rgba(255, 93, 93, 0.3);
  border-radius: 5px;
}

/* TOAST — kortvarige beskeder (fx 403 admin-rolle påkrævet) */

.toast {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 9999;
  padding: 10px 16px;
  font-size: 0.85rem;
  border-radius: 6px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.4);
  animation: toast-slide-in 180ms ease-out;
}

.toast-403 {
  color: var(--yellow);
  background: rgba(58, 38, 8, 0.95);
  border: 1px solid rgba(250, 204, 21, 0.4);
}

@keyframes toast-slide-in {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Keyboard-help modal (?-tast) */

.kbd-help-modal {
  min-width: 360px;
  max-width: 520px;
}

.kbd-help-modal h3 {
  margin: 0 0 14px;
  font-size: 1rem;
  font-weight: 700;
}

.kbd-help-tbl {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.84rem;
  margin-bottom: 14px;
}

.kbd-help-tbl td {
  padding: 6px 8px;
  border-bottom: 1px solid var(--border);
  vertical-align: top;
}

.kbd-help-tbl tr:last-child td {
  border-bottom: none;
}

.kbd-page {
  font-weight: 700;
  color: var(--accent);
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  white-space: nowrap;
}

kbd {
  display: inline-block;
  padding: 1px 6px;
  margin: 0 1px;
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
  font-size: 0.76rem;
  color: var(--text);
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid var(--border);
  border-bottom-width: 2px;
  border-radius: 4px;
  white-space: nowrap;
}

/* MODALS — erstatter native alert/confirm/prompt */

.modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.55);
  backdrop-filter: blur(2px);
  animation: modal-fade-in 120ms ease-out;
}

.modal {
  min-width: 280px;
  max-width: 440px;
  padding: 18px 20px 14px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.04), transparent),
    var(--bg-panel-strong);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  animation: modal-pop 140ms ease-out;
}

.modal-msg {
  margin: 0 0 12px;
  font-size: 0.88rem;
  line-height: 1.45;
  color: var(--text);
  white-space: pre-line;
}

.modal-input {
  width: 100%;
  padding: 6px 10px;
  margin-bottom: 12px;
  font-size: 0.85rem;
  color: var(--text);
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid var(--border);
  border-radius: 5px;
  outline: none;
}

.modal-input:focus {
  border-color: var(--border-strong);
}

.modal-actions {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
}

.modal-btn {
  padding: 5px 14px;
  font-size: 0.8rem;
  border-radius: 5px;
  cursor: pointer;
}

.modal-btn-cancel {
  color: var(--text-muted);
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid var(--border);
}

.modal-btn-cancel:hover {
  color: var(--text);
  background: rgba(255, 255, 255, 0.06);
}

.modal-btn-confirm {
  color: var(--text);
  background: var(--accent-soft);
  border: 1px solid var(--border-strong);
}

.modal-btn-confirm:hover {
  background: rgba(79, 156, 255, 0.28);
}

.modal-btn-danger {
  color: var(--red);
  background: rgba(255, 93, 93, 0.1);
  border: 1px solid rgba(255, 93, 93, 0.45);
}

.modal-btn-danger:hover {
  background: rgba(255, 93, 93, 0.22);
  color: #ff8080;
}

@keyframes modal-fade-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}

@keyframes modal-pop {
  from { opacity: 0; transform: scale(0.94) translateY(4px); }
  to   { opacity: 1; transform: scale(1) translateY(0); }
}

/* PROFILE — Alerts & notifikationer sektion */
.alerts-settings {
  padding: 12px 14px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.alerts-row {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.alerts-toggle {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.85rem;
  cursor: pointer;
}
.alerts-toggle input[type="checkbox"] { accent-color: var(--accent); width: 16px; height: 16px; }
.alerts-input-row {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.85rem;
}
.alerts-input-lbl { color: var(--text-muted); min-width: 130px; }
.alerts-input {
  width: 80px;
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 4px 8px;
  color: var(--text);
  font-size: 0.85rem;
  font-variant-numeric: tabular-nums;
  text-align: right;
}
.alerts-input:focus { border-color: var(--border-strong); outline: none; }
.alerts-input:disabled { opacity: 0.4; cursor: not-allowed; }
.alerts-help { font-size: 0.74rem; margin: 0; line-height: 1.4; }
.alerts-status { font-size: 0.72rem; margin: 0; min-height: 1em; transition: color 0.15s; }

/* TRENDING SIDEBAR — Top-N tickers fra Yahoo trending (US).
   Tæt kompakt liste der spejler .interest-row-rytmen. */
.trending-section { margin-bottom: 0; }
.trending-panel { overflow: hidden; }
.trending-list {
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.trending-row {
  display: grid;
  grid-template-columns: 18px 1fr 14px 60px 56px;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  font-size: 0.76rem;
  cursor: pointer;
  border-top: 1px solid rgba(148,163,184,0.06);
  transition: background 0.1s;
}
.trending-row:first-child { border-top: none; }
.trending-row:hover { background: rgba(79, 156, 255, 0.06); }
.trending-row.is-watched { background: rgba(250, 204, 21, 0.04); }
.trending-row.is-watched:hover { background: rgba(250, 204, 21, 0.10); }
.trending-rank { font-size: 0.7rem; text-align: right; }
.trending-ticker { font-weight: 700; color: var(--accent); }
.trending-star {
  font-size: 0.85rem;
  color: var(--text-muted);
  transition: color 0.1s;
}
.trending-row.is-watched .trending-star { color: var(--yellow); }
.trending-price { font-variant-numeric: tabular-nums; }
.trending-pct { font-variant-numeric: tabular-nums; font-size: 0.74rem; }

/* Skeleton loading-tilstand */
.trending-skeleton {
  pointer-events: none;
  opacity: 0.6;
}
.trending-skeleton .trending-rank,
.trending-skeleton .trending-ticker,
.trending-skeleton .trending-price,
.trending-skeleton .trending-pct {
  background: linear-gradient(90deg, rgba(148,163,184,0.10), rgba(148,163,184,0.20), rgba(148,163,184,0.10));
  background-size: 200% 100%;
  animation: trending-skel 1.4s infinite linear;
  border-radius: 3px;
  height: 9px;
}
@keyframes trending-skel {
  from { background-position: 200% 0; }
  to   { background-position: -200% 0; }
}

/* ═══════════════════════════════════════════════════════════════════
   SYSTEM OVERVIEW subpage: dashboard for hele meandmaj-systemets
   tilstand. DB-indhold, PM2-processer, ressourcer, friskhed, storage,
   recent events. Auto-refresh 30s.
   ═══════════════════════════════════════════════════════════════════ */
.sys-page-header { margin-bottom: 8px; }
.sys-page-header h1 { font-size: 1.1rem; margin: 0; }
.sys-page-header p { font-size: 0.78rem; color: var(--text-muted); margin: 2px 0 0; }

.sys-status-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 6px 12px;
  margin-bottom: 8px;
  background: var(--bg-soft);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  font-size: 0.78rem;
}
.sys-status-left, .sys-status-right { display: flex; align-items: center; gap: 8px; }
.sys-live-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--text-muted);
  transition: background 0.2s;
}
.sys-live-dot.sys-live-ok { background: var(--green); box-shadow: 0 0 6px rgba(69, 229, 140, 0.6); }
.sys-live-dot.sys-live-stale { background: var(--red); }
.sys-status-label { color: var(--text-muted); }
.sys-status-val { font-weight: 600; font-variant-numeric: tabular-nums; }
.sys-toggle { display: flex; align-items: center; gap: 6px; cursor: pointer; }
.sys-toggle input { accent-color: var(--accent); }
.sys-refresh-btn {
  background: var(--bg);
  border: 1px solid var(--border);
  color: var(--text);
  width: 28px; height: 24px;
  border-radius: 4px;
  cursor: pointer;
  font-size: 0.95rem;
  line-height: 1;
}
.sys-refresh-btn:hover { border-color: var(--border-strong); }

/* Top headline-counts: 4 kompakte kort */
.sys-top-counts {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 6px;
  margin-bottom: 8px;
}.sys-top-card {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.035), transparent),
    var(--bg-panel);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 6px 10px;
}
.sys-top-card-head {
  display: flex;
  align-items: center;
  gap: 4px;
  margin-bottom: 2px;
}
.sys-top-card-icon { font-size: 0.82rem; opacity: 0.8; }
.sys-top-card-lbl {
  font-size: 0.62rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-muted);
  font-weight: 600;
}
.sys-top-card-val {
  margin: 0;
  font-size: 1.4rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  line-height: 1.1;
}
.sys-top-card-sub { margin: 2px 0 0; font-size: 0.66rem; }

/* Bento-grid: 12-col med varierede spans pr. panel */
.sys-grid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 6px;
  margin-bottom: 10px;
}
.sys-span-2  { grid-column: span 2; }
.sys-span-3  { grid-column: span 3; }
.sys-span-4  { grid-column: span 4; }
.sys-span-5  { grid-column: span 5; }
.sys-span-6  { grid-column: span 6; }
.sys-span-7  { grid-column: span 7; }
.sys-span-8  { grid-column: span 8; }
.sys-span-12 { grid-column: span 12; }
.sys-panel { padding: 0; overflow: hidden; min-width: 0; }
.sys-panel .panel-header {
  padding: 4px 8px !important;
  border-bottom: 1px solid var(--border);
  margin-bottom: 0;
  min-height: 0;
}
.sys-panel .panel-header h2 { font-size: 0.74rem; }
.sys-meta { font-size: 0.66rem; }

/* Count-block — én pr. panel */
.sys-count-block {
  padding: 4px 8px 6px;
  display: flex;
  flex-direction: column;
  gap: 0;
}
.sys-count-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 2px 0;
  font-size: 0.74rem;
  border-bottom: 1px dashed rgba(148,163,184,0.10);
}
.sys-count-row:last-child { border-bottom: none; }
.sys-count-lbl { color: var(--text-muted); }
.sys-count-val { font-weight: 600; font-variant-numeric: tabular-nums; }

/* PM2 processes */
.sys-procs-list {
  padding: 4px 8px 6px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.sys-proc-row {
  background: var(--bg-soft);
  border: 1px solid var(--border);
  border-radius: 3px;
  padding: 4px 8px;
}
.sys-proc-head {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 2px;
}
.sys-proc-status {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--text-muted);
}
.sys-proc-status-online { background: var(--green); }
.sys-proc-status-stopped { background: var(--red); }
.sys-proc-status-errored { background: var(--red); }
.sys-proc-name { font-weight: 700; flex: 1; font-size: 0.76rem; }
.sys-proc-uptime { font-size: 0.68rem; font-variant-numeric: tabular-nums; }
.sys-proc-meta {
  display: flex;
  gap: 8px;
  font-size: 0.7rem;
  font-variant-numeric: tabular-nums;
}
.sys-proc-meta-item .muted { font-size: 0.66rem; }

/* System resources */
.sys-resources {
  padding: 4px 8px 6px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.sys-res-group { display: flex; flex-direction: column; gap: 2px; }
.sys-res-head {
  margin: 0 0 2px;
  font-size: 0.66rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-muted);
}
.sys-res-row { display: flex; align-items: center; gap: 6px; }
.sys-res-lbl {
  min-width: 22px;
  font-size: 0.66rem;
  color: var(--text-muted);
  font-variant-numeric: tabular-nums;
}
.sys-res-bar-wrap {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 6px;
}
.sys-res-bar {
  flex: 1;
  height: 5px;
  background: rgba(148,163,184,0.12);
  border-radius: 2px;
  overflow: hidden;
}
.sys-res-bar-fill {
  height: 100%;
  border-radius: 2px;
  transition: width 0.4s;
}
.sys-bar-ok   { background: var(--green); }
.sys-bar-warn { background: var(--yellow); }
.sys-bar-bad  { background: var(--red); }
.sys-res-bar-val {
  font-size: 0.68rem;
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  min-width: 44px;
  text-align: right;
}
.sys-res-sub { margin: 0 0 0 28px; font-size: 0.66rem; }

/* Data freshness */
.sys-freshness-list {
  padding: 4px 8px 6px;
  display: flex;
  flex-direction: column;
  gap: 0;
}
.sys-fresh-row {
  display: grid;
  grid-template-columns: 10px 1fr auto;
  align-items: center;
  gap: 6px;
  padding: 2px 0;
  font-size: 0.72rem;
  border-bottom: 1px dashed rgba(148,163,184,0.10);
}
.sys-fresh-row:last-child { border-bottom: none; }
.sys-fresh-dot {
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
}
.sys-fresh-dot-fresh { background: var(--green); }
.sys-fresh-dot-warn  { background: var(--yellow); }
.sys-fresh-dot-bad   { background: var(--red); }
.sys-fresh-lbl { color: var(--text); }
.sys-fresh-age { color: var(--text-muted); font-variant-numeric: tabular-nums; font-size: 0.68rem; }
.sys-fresh-warn .sys-fresh-age { color: var(--yellow); }
.sys-fresh-bad .sys-fresh-age { color: var(--red); font-weight: 600; }

/* Storage breakdown */
.sys-storage {
  padding: 4px 8px 6px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.sys-stor-bar {
  display: flex;
  height: 10px;
  border-radius: 3px;
  overflow: hidden;
  gap: 1px;
  background: var(--bg-soft);
}
.sys-stor-seg {
  display: block;
  height: 100%;
  transition: opacity 0.2s;
}
.sys-stor-seg:hover { opacity: 0.85; }
.sys-stor-list { display: flex; flex-direction: column; gap: 0; }
.sys-stor-row {
  display: grid;
  grid-template-columns: 8px 1fr 40px 64px;
  align-items: center;
  gap: 6px;
  padding: 2px 0;
  font-size: 0.7rem;
  border-bottom: 1px dashed rgba(148,163,184,0.10);
}
.sys-stor-row:last-child { border-bottom: none; }
.sys-stor-dot {
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 1px;
}
.sys-stor-name { color: var(--text); }
.sys-stor-pct { text-align: right; }
.sys-stor-bytes { text-align: right; font-weight: 600; }

/* Recent events */
.sys-events-list {
  padding: 4px 8px 6px;
  display: flex;
  flex-direction: column;
  gap: 0;
}
.sys-event-row {
  display: grid;
  grid-template-columns: 18px 1fr auto;
  align-items: baseline;
  gap: 6px;
  padding: 2px 0;
  font-size: 0.72rem;
  border-bottom: 1px dashed rgba(148,163,184,0.10);
}
.sys-event-row:last-child { border-bottom: none; }
.sys-event-icon { font-size: 0.75rem; text-align: center; opacity: 0.85; }
.sys-event-text { line-height: 1.3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sys-event-age { color: var(--text-muted); font-variant-numeric: tabular-nums; font-size: 0.66rem; white-space: nowrap; }

/* ═══════════════════════════════════════════════════════════════════
   AI CATALYSTS subpage: daglig AI-genereret market overview.
   Top status-linje · summary · 4 main cards · tabel · rige cards · history.
   Direction-farver: green=bullish, red=bearish, yellow=mixed, blue=watch.
   ═══════════════════════════════════════════════════════════════════ */
.cat-page-header { margin-bottom: 8px; }
.cat-page-header h1 { font-size: 1.1rem; margin: 0; }
.cat-page-header p { font-size: 0.78rem; color: var(--text-muted); margin: 2px 0 0; max-width: 920px; }

.cat-status-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
  padding: 6px 12px;
  margin-bottom: 8px;
  background: var(--bg-soft);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  font-size: 0.78rem;
}
.cat-status-left, .cat-status-right { display: flex; align-items: center; gap: 6px; }
.cat-status-label { color: var(--text-muted); }
.cat-status-val { font-weight: 600; font-variant-numeric: tabular-nums; }
.cat-status-sep { color: var(--text-muted); opacity: 0.5; }
.cat-status-meta { font-variant-numeric: tabular-nums; font-size: 0.74rem; color: var(--text-muted); min-width: 50px; text-align: center; }
.cat-nav-btn {
  background: var(--bg);
  border: 1px solid var(--border);
  color: var(--text);
  width: 24px; height: 24px;
  border-radius: 4px;
  cursor: pointer;
  font-size: 0.9rem;
}
.cat-nav-btn:hover:not(:disabled) { border-color: var(--border-strong); }
.cat-nav-btn:disabled { opacity: 0.3; cursor: not-allowed; }

.cat-conf-low { color: var(--text-muted); }
.cat-conf-medium { color: var(--yellow); }
.cat-conf-high { color: var(--green); }

.cat-summary {
  padding: 12px 16px;
  background: var(--bg-panel);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  margin-bottom: 10px;
}
.cat-summary-text {
  margin: 0;
  font-size: 0.95rem;
  line-height: 1.5;
  color: var(--text);
}

/* Portfolio-vurdering — AI's specifikke take på dine åbne positioner */
.cat-portfolio {
  background:
    linear-gradient(180deg, rgba(168,85,247,0.04), transparent),
    var(--bg-panel);
  border: 1px solid var(--border);
  border-left: 4px solid var(--purple);
  border-radius: var(--radius);
  padding: 12px 16px;
  margin-bottom: 10px;
}
.cat-portfolio[hidden] { display: none; }
.cat-pf-head {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 6px;
}
.cat-pf-head h2 { margin: 0; font-size: 0.95rem; font-weight: 700; }
.cat-pf-head-icon { font-size: 1rem; }
.cat-pf-tag { font-size: 0.7rem; }
.cat-pf-overall {
  margin: 4px 0 8px;
  font-size: 0.88rem;
  line-height: 1.5;
}
.cat-pf-exposure {
  padding: 4px 8px;
  margin-bottom: 10px;
  background: var(--bg-soft);
  border-radius: 4px;
  font-size: 0.78rem;
  font-variant-numeric: tabular-nums;
}
.cat-pf-section-head {
  margin: 10px 0 6px;
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-muted);
  font-weight: 700;
}

/* Per-position advice cards */
.cat-pf-positions {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 8px;
}
.cat-pf-position {
  background: var(--bg);
  border: 1px solid var(--border);
  border-left: 3px solid var(--border);
  border-radius: 4px;
  padding: 8px 10px;
}
.cat-pf-stance-hold { border-left-color: var(--text-muted); }
.cat-pf-stance-trim { border-left-color: var(--yellow); }
.cat-pf-stance-add  { border-left-color: var(--green); }
.cat-pf-stance-exit { border-left-color: var(--red); }
.cat-pf-pos-head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 4px;
}
.cat-pf-pos-ticker {
  font-weight: 700;
  color: var(--accent);
  font-size: 0.88rem;
}
.cat-pf-stance {
  padding: 1px 7px;
  border-radius: 3px;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.04em;
}
.cat-pf-stance-pill-hold { background: rgba(148,163,184,0.18); color: var(--text-muted); }
.cat-pf-stance-pill-trim { background: rgba(250,204,21,0.18); color: var(--yellow); }
.cat-pf-stance-pill-add  { background: rgba(69,229,140,0.18); color: var(--green); }
.cat-pf-stance-pill-exit { background: rgba(255,93,93,0.18); color: var(--red); }
.cat-pf-conf {
  font-size: 0.68rem;
  margin-left: auto;
}
.cat-pf-rationale {
  margin: 4px 0;
  font-size: 0.78rem;
  line-height: 1.45;
}
.cat-pf-watch {
  margin: 4px 0;
  padding: 4px 8px;
  background: var(--bg-soft);
  border-radius: 3px;
  font-size: 0.74rem;
  line-height: 1.4;
}
.cat-pf-watch-lbl {
  color: var(--text-muted);
  font-weight: 600;
  font-size: 0.7rem;
  margin-right: 4px;
}
.cat-pf-risks {
  margin: 4px 0 0 18px;
  padding: 0;
  font-size: 0.72rem;
  color: var(--text-muted);
}
.cat-pf-risks li { padding: 1px 0; }

/* Nye muligheder cards */
.cat-pf-opps {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 8px;
}
.cat-pf-opp {
  background: var(--bg);
  border: 1px solid var(--border);
  border-left: 3px solid var(--accent);
  border-radius: 4px;
  padding: 8px 10px;
}
.cat-pf-opp-head {
  display: flex;
  align-items: baseline;
  gap: 6px;
  margin-bottom: 4px;
}
.cat-pf-opp-icon { font-size: 0.9rem; }
.cat-pf-opp-head strong { font-size: 0.84rem; flex: 1; }
.cat-pf-opp p {
  margin: 4px 0;
  font-size: 0.78rem;
  line-height: 1.4;
}
.cat-pf-opp-tickers { display: flex; flex-wrap: wrap; gap: 3px; margin-top: 4px; }

/* Røde flag */
.cat-pf-flags {
  margin: 4px 0 0;
  padding: 8px 12px;
  list-style: none;
  background: rgba(255, 93, 93, 0.06);
  border: 1px solid rgba(255, 93, 93, 0.30);
  border-radius: 4px;
}
.cat-pf-flags li {
  padding: 4px 0;
  font-size: 0.8rem;
  line-height: 1.4;
  border-bottom: 1px dashed rgba(255, 93, 93, 0.20);
}
.cat-pf-flags li:last-child { border-bottom: none; }
.cat-pf-flag-icon { color: var(--red); margin-right: 4px; }

.cat-main-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 8px;
  margin-bottom: 10px;
}
.cat-main-card {
  background: var(--bg-panel);
  border: 1px solid var(--border);
  border-left: 3px solid var(--border);
  border-radius: var(--radius);
  padding: 10px 12px;
}
.cat-main-card.cat-card-hot      { border-left-color: var(--yellow); }
.cat-main-card.cat-card-upside   { border-left-color: var(--green); }
.cat-main-card.cat-card-downside { border-left-color: var(--red); }
.cat-main-card.cat-card-warning  { border-left-color: var(--accent); }
.cat-main-card-head {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 6px;
}
.cat-main-card-icon { font-size: 1rem; }
.cat-main-card-head h2 { font-size: 0.82rem; font-weight: 700; margin: 0; }
.cat-main-card-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 0.78rem;
  line-height: 1.4;
}
.cat-main-card-list li {
  padding: 3px 0;
  border-bottom: 1px dashed var(--border);
}
.cat-main-card-list li:last-child { border-bottom: none; }
.cat-ticker-tag-sm {
  display: inline-block;
  background: rgba(79,156,255,0.13);
  color: var(--accent);
  padding: 0 4px;
  border-radius: 2px;
  font-size: 0.68rem;
  font-weight: 700;
  margin-right: 2px;
}

.cat-table-section { margin-bottom: 10px; }
.cat-table-wrap { overflow-x: auto; }
.cat-table { font-size: 0.78rem; }
.cat-row { cursor: pointer; transition: background 0.1s; }
.cat-row:hover { background: rgba(79, 156, 255, 0.06); }
.cat-row-title strong { color: var(--text); font-weight: 600; }
.cat-row-tf { font-size: 0.74rem; color: var(--text-muted); white-space: nowrap; }
.cat-row-why { font-size: 0.72rem; }
.cat-row-affected { font-size: 0.74rem; font-variant-numeric: tabular-nums; }
.cat-row-bullish { background: rgba(69, 229, 140, 0.03); }
.cat-row-bearish { background: rgba(255, 93, 93, 0.03); }
.cat-row-mixed   { background: rgba(250, 204, 21, 0.03); }
.cat-row-watch   { background: rgba(79, 156, 255, 0.03); }

.cat-cards {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 14px;
}
.cat-card {
  background: var(--bg-panel);
  border: 1px solid var(--border);
  border-left: 4px solid var(--border);
  border-radius: var(--radius);
  padding: 12px 16px;
  scroll-margin-top: 12px;
}
.cat-card.cat-dir-bullish { border-left-color: var(--green); }
.cat-card.cat-dir-bearish { border-left-color: var(--red); }
.cat-card.cat-dir-mixed   { border-left-color: var(--yellow); }
.cat-card.cat-dir-watch   { border-left-color: var(--accent); }
.cat-card-head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
}
.cat-rank {
  font-size: 0.74rem;
  font-weight: 700;
  color: var(--text-muted);
  background: var(--bg-soft);
  padding: 2px 6px;
  border-radius: 3px;
  font-variant-numeric: tabular-nums;
}
.cat-card-title {
  flex: 1;
  margin: 0;
  font-size: 1rem;
  font-weight: 700;
}
.cat-impact {
  display: inline-block;
  padding: 2px 6px;
  border-radius: 3px;
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.05em;
}
.cat-impact-low      { background: rgba(148,163,184,0.15); color: var(--text-muted); }
.cat-impact-medium   { background: rgba(79,156,255,0.13); color: var(--accent); }
.cat-impact-high     { background: rgba(250,204,21,0.18); color: var(--yellow); }
.cat-impact-extreme  { background: rgba(255,93,93,0.18); color: var(--red); }

.cat-card-meta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 8px;
  font-size: 0.76rem;
}
.cat-pill {
  padding: 1px 8px;
  border-radius: 2px;
  font-size: 0.72rem;
  font-weight: 600;
  background: var(--bg-soft);
}
.cat-type { color: var(--text-muted); }
.cat-direction.cat-dir-bullish { background: rgba(69,229,140,0.15); color: var(--green); }
.cat-direction.cat-dir-bearish { background: rgba(255,93,93,0.15); color: var(--red); }
.cat-direction.cat-dir-mixed   { background: rgba(250,204,21,0.18); color: var(--yellow); }
.cat-direction.cat-dir-watch   { background: rgba(79,156,255,0.15); color: var(--accent); }
.cat-trigger-window { color: var(--text-muted); font-size: 0.72rem; }
.cat-confidence {
  font-size: 0.7rem;
  color: var(--text-muted);
  margin-left: auto;
}

.cat-tag-row {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  align-items: center;
  margin-bottom: 6px;
  font-size: 0.74rem;
}
.cat-tag-label {
  color: var(--text-muted);
  font-weight: 600;
  margin-right: 2px;
}
.cat-ticker-tag {
  display: inline-block;
  padding: 1px 6px;
  background: rgba(79,156,255,0.13);
  color: var(--accent);
  border-radius: 2px;
  font-weight: 700;
  font-size: 0.72rem;
}
.cat-sector-tag {
  display: inline-block;
  padding: 1px 6px;
  background: rgba(168,85,247,0.13);
  color: #c084fc;
  border-radius: 2px;
  font-size: 0.7rem;
}

.cat-card-why {
  margin: 8px 0;
  padding: 8px 10px;
  background: var(--bg-soft);
  border-radius: 4px;
}
.cat-why-label {
  display: inline-block;
  font-size: 0.72rem;
  color: var(--text-muted);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: 2px;
}
.cat-card-why p {
  margin: 2px 0 0;
  font-size: 0.85rem;
  line-height: 1.5;
}
.cat-card-warning-row {
  padding: 6px 10px;
  margin: 6px 0;
  background: rgba(250,204,21,0.08);
  border-left: 3px solid var(--yellow);
  border-radius: 3px;
  font-size: 0.8rem;
  line-height: 1.4;
}
.cat-warning-icon { color: var(--yellow); margin-right: 4px; }
.cat-card-foot {
  font-size: 0.7rem;
  margin-top: 6px;
  padding-top: 6px;
  border-top: 1px dashed var(--border);
}

.cat-history-strip {
  background: var(--bg-soft);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 8px 12px;
  margin-bottom: 10px;
}
.cat-history-head {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 6px;
}
.cat-history-head h3 { font-size: 0.82rem; font-weight: 700; margin: 0; }
.cat-history-list {
  display: flex;
  gap: 6px;
  overflow-x: auto;
}
.cat-history-item {
  flex: 0 0 200px;
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 6px 8px;
  cursor: pointer;
  text-align: left;
  color: var(--text);
  transition: border-color 0.1s;
}
.cat-history-item:hover { border-color: var(--border-strong); }
.cat-history-item.is-current { border-color: var(--accent); background: var(--accent-soft); }
.cat-history-date {
  display: block;
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--accent);
  margin-bottom: 2px;
}
.cat-history-summary {
  display: block;
  font-size: 0.72rem;
  color: var(--text-muted);
  line-height: 1.3;
}

.cat-disclaimer {
  padding: 10px 14px;
  background: rgba(250, 204, 21, 0.06);
  border: 1px solid rgba(250, 204, 21, 0.30);
  border-radius: var(--radius);
  font-size: 0.78rem;
  line-height: 1.5;
  color: var(--text);
  margin-bottom: 14px;
}
.cat-disclaimer strong { color: var(--yellow); }

/* ═══════════════════════════════════════════════════════════════════
   MOVERS subpage: live overblik over hvor der sker noget.
   2-pane shell: main (tabel/pools) + right-side (top-5 + sektorer).
   ═══════════════════════════════════════════════════════════════════ */
.mv-page-header { margin-bottom: 8px; }
.mv-page-header h1 { font-size: 1.1rem; margin: 0; }
.mv-page-header p { font-size: 0.78rem; color: var(--text-muted); margin: 2px 0 0; }

.mv-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
  padding: 6px 10px;
  margin-bottom: 8px;
  background: var(--bg-soft);
  border: 1px solid var(--border);
  border-radius: var(--radius);
}
.mv-tabs { display: flex; gap: 4px; }
.mv-tab {
  padding: 4px 10px;
  background: transparent;
  border: 1px solid var(--border);
  color: var(--text-muted);
  border-radius: 4px;
  cursor: pointer;
  font-size: 0.78rem;
  font-weight: 600;
}
.mv-tab:hover { color: var(--text); }
.mv-tab.active { background: var(--accent-soft); border-color: var(--border-strong); color: var(--accent); }

.mv-controls { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.mv-control { display: flex; align-items: center; gap: 4px; font-size: 0.78rem; }
.mv-control select,
.mv-control input {
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 3px 6px;
  color: var(--text);
  font-size: 0.78rem;
}
.mv-slot-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 10px;
  background: var(--bg);
  border: 1px solid var(--border);
  color: var(--text);
  border-radius: 4px;
  cursor: pointer;
  font-size: 0.78rem;
  font-variant-numeric: tabular-nums;
}
.mv-slot-badge:hover { border-color: var(--border-strong); }

.mv-shell {
  display: grid;
  grid-template-columns: 1fr 260px;
  gap: 8px;
  align-items: start;
}

.mv-main { min-width: 0; }
.mv-side { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.mv-side-tile { padding: 0; overflow: hidden; }
.mv-side-tile .panel-header { padding: 6px 10px; }
.mv-side-tile .panel-header h2 { font-size: 0.78rem; }

.mv-table-wrap { overflow-x: auto; }
.mv-table { font-size: 0.78rem; }
.mv-table tbody tr { will-change: transform; }
.mv-row { transition: background 0.1s; }
.mv-row:hover { background: rgba(79, 156, 255, 0.04); cursor: pointer; }
.mv-rank { font-weight: 700; color: var(--text-muted); font-variant-numeric: tabular-nums; }
.mv-ticker { font-weight: 700; color: var(--accent); }
.mv-name {
  font-size: 0.7rem;
  line-height: 1.1;
  margin-top: 1px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 160px;
}
.mv-score { font-weight: 700; font-variant-numeric: tabular-nums; }

.mv-state {
  display: inline-block;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  line-height: 14px;
  text-align: center;
  font-size: 0.62rem;
  font-weight: 700;
}
.mv-state-open   { background: rgba(69,229,140,0.22); color: var(--green); }
.mv-state-closed { background: rgba(148,163,184,0.18); color: var(--text-muted); }
.mv-state-pre    { background: rgba(250,204,21,0.22); color: var(--yellow); }
.mv-state-post   { background: rgba(79,156,255,0.22); color: var(--accent); }

.mv-pool-chip {
  display: inline-block;
  margin: 1px 2px;
  padding: 1px 5px;
  background: rgba(168,85,247,0.18);
  color: #c084fc;
  border-radius: 2px;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.04em;
}

/* Right-panel mini-lists */
.mv-mini-list { padding: 4px 0; display: flex; flex-direction: column; gap: 1px; }
.mv-mini-row {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 8px;
  padding: 3px 10px;
  font-size: 0.78rem;
  cursor: pointer;
  border-top: 1px solid rgba(148,163,184,0.06);
}
.mv-mini-row:first-child { border-top: none; }
.mv-mini-row:hover { background: rgba(79, 156, 255, 0.06); }
.mv-mini-tk { font-weight: 700; color: var(--accent); }

.mv-sector-list { padding: 4px 0; }
.mv-sector-row {
  display: grid;
  grid-template-columns: 1fr 30px 60px 50px;
  align-items: center;
  gap: 6px;
  padding: 3px 10px;
  font-size: 0.74rem;
  border-top: 1px solid rgba(148,163,184,0.06);
}
.mv-sector-row:first-child { border-top: none; }
.mv-sector-name { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mv-sector-n { font-variant-numeric: tabular-nums; }

/* Pools tab */
.mv-pools-bar { display: flex; gap: 8px; margin-bottom: 8px; }
.mv-pool-search {
  flex: 1;
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 5px 10px;
  color: var(--text);
  font-size: 0.85rem;
}
.mv-btn-primary {
  background: var(--accent-soft);
  border: 1px solid var(--border-strong);
  color: var(--accent);
  padding: 5px 12px;
  border-radius: 4px;
  cursor: pointer;
  font-size: 0.85rem;
  font-weight: 600;
}
.mv-btn-primary:hover { background: rgba(79,156,255,0.2); }
.mv-pools-list { display: flex; flex-direction: column; gap: 8px; }
.mv-pool-card {
  background: var(--bg-panel);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 10px 14px;
}
.mv-pool-head { display: flex; align-items: center; gap: 12px; margin-bottom: 8px; }
.mv-pool-head h3 { margin: 0; font-size: 0.92rem; font-weight: 700; flex: 1; }
.mv-pool-toggle { display: flex; align-items: center; gap: 6px; font-size: 0.78rem; cursor: pointer; }
.mv-pool-toggle input { accent-color: var(--accent); }
.mv-pool-del {
  background: transparent;
  border: 1px solid var(--border);
  color: var(--text-muted);
  width: 22px; height: 22px;
  border-radius: 3px;
  cursor: pointer;
  font-size: 0.95rem;
  line-height: 1;
}
.mv-pool-del:hover { color: var(--red); border-color: var(--red); }
.mv-pool-tickers { display: flex; flex-wrap: wrap; gap: 3px; }
.mv-pool-tag {
  background: var(--bg-soft);
  border: 1px solid var(--border);
  border-radius: 3px;
  padding: 1px 6px;
  font-size: 0.7rem;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}

/* Pool-add modal (extends .modal styling) */
.pool-modal { width: 460px; max-width: 92vw; padding: 0; }
.pool-field { display: flex; flex-direction: column; gap: 4px; }
.pool-lbl {
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-muted);
  font-weight: 600;
}
.pool-name {
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 6px 10px;
  color: var(--text);
  font-size: 0.92rem;
}
.pool-tickers {
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 8px 10px;
  color: var(--text);
  font-size: 0.85rem;
  font-family: ui-monospace, "SF Mono", Consolas, monospace;
  resize: vertical;
}
.pool-help { font-size: 0.7rem; }
.pool-preview {
  padding: 8px 10px;
  background: var(--bg-soft);
  border: 1px solid var(--border);
  border-radius: 4px;
  font-size: 0.74rem;
  min-height: 32px;
  line-height: 1.5;
}
.pool-tag {
  display: inline-block;
  background: rgba(79,156,255,0.12);
  color: var(--accent);
  padding: 1px 5px;
  border-radius: 2px;
  font-size: 0.7rem;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  margin: 1px 0;
}

/* HWM / Stop-celle i Beholdninger-tabellen — klikbar, viser trailing-stop
   eller statisk SL/TP. Farve baseret på afstand mellem stop og nuværende pris. */
.hwm-cell {
  cursor: pointer;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  transition: background 0.1s;
}
.hwm-cell:hover {
  background: rgba(79, 156, 255, 0.06);
}
.hwm-cell.muted { cursor: default; }
.hwm-cell.muted:hover { background: transparent; }
.hwm-empty {
  font-size: 0.7rem;
  text-align: center;
}
.hwm-val { color: var(--text); }
.hwm-stop { color: var(--red); font-weight: 600; }
.hwm-tp { color: var(--green); font-weight: 600; }
.hwm-pct { font-size: 0.7rem; margin-left: 2px; }
.hwm-warn { background: rgba(255, 93, 93, 0.08); }
.hwm-warn:hover { background: rgba(255, 93, 93, 0.14); }
.hwm-safe { background: rgba(69, 229, 140, 0.04); }
.hwm-safe:hover { background: rgba(69, 229, 140, 0.10); }

/* Alert-pill i Trading position-panel — kompakt klikbar bar der åbner
   position_alert_modal. Erstatter de gamle inline SL/TP-inputs. */
.tw-alert-pill {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  margin-top: 10px;
  padding: 6px 10px;
  background: var(--bg-soft);
  border: 1px solid var(--border);
  border-radius: 6px;
  color: var(--text);
  font: inherit;
  font-size: 0.78rem;
  cursor: pointer;
  text-align: left;
  transition: border-color 0.12s, background 0.12s;
}
.tw-alert-pill:hover {
  background: var(--bg);
  border-color: var(--border-strong);
}
.tw-alert-pill-lbl {
  color: var(--text-muted);
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-weight: 600;
}
.tw-alert-pill-val {
  flex: 1;
  font-variant-numeric: tabular-nums;
}
.tw-alert-pill-val .tw-pill-sl    { color: var(--red); margin-right: 4px; }
.tw-alert-pill-val .tw-pill-tp    { color: var(--green); margin-right: 4px; }
.tw-alert-pill-val .tw-pill-trail { color: #f97316; margin-right: 4px; }
.tw-alert-pill-val .tw-pill-hwm   { color: #22d3ee; margin-right: 4px; }
.tw-alert-pill-val .tw-pill-lwm   { color: #facc15; margin-right: 4px; }
.tw-alert-pill-val .tw-pill-triggered {
  display: inline-block;
  margin-left: 6px;
  padding: 1px 6px;
  border-radius: 4px;
  background: rgba(250,204,21,0.16);
  color: #facc15;
  font-weight: 600;
}
.tw-alert-pill.is-triggered {
  border-color: #facc15;
  background: rgba(250,204,21,0.06);
}
.tw-alert-pill-edit {
  font-size: 0.8rem;
  opacity: 0.7;
}

.pa-triggered {
  color: #facc15;
  font-weight: 600;
}

/* POSITION-ALERT-MODAL: bygger på .modal-backdrop/.modal. Egen klasse
   .pa-modal udvider med bredere body + custom header/footer-layout. */
.pa-modal {
  width: 440px;
  max-width: 92vw;
  padding: 0;
}
.pa-modal-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 16px 10px;
  border-bottom: 1px solid var(--border);
}
.pa-modal-head h3 {
  margin: 0;
  font-size: 0.95rem;
  font-weight: 700;
}
.pa-close {
  background: transparent;
  border: none;
  color: var(--text-muted);
  font-size: 1.3rem;
  line-height: 1;
  cursor: pointer;
  padding: 0 4px;
}
.pa-close:hover { color: var(--text); }

.pa-modal-body {
  padding: 12px 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.pa-info {
  padding: 8px 10px;
  background: var(--bg-soft);
  border-radius: 6px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 0.78rem;
}
.pa-info-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
}

.pa-fieldset {
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 10px 12px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.pa-fieldset legend {
  padding: 0 6px;
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-muted);
}

.pa-radio {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.82rem;
  cursor: pointer;
  padding: 2px 0;
}
.pa-radio input[type="radio"] { accent-color: var(--accent); }
.pa-radio-meta { color: var(--text-muted); font-size: 0.74rem; margin-left: 4px; }
.pa-link {
  color: var(--accent);
  text-decoration: none;
  font-size: 0.72rem;
  margin-left: 4px;
}
.pa-link:hover { text-decoration: underline; }

.pa-pct {
  width: 60px;
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 2px 6px;
  color: var(--text);
  font-size: 0.82rem;
  font-variant-numeric: tabular-nums;
  text-align: right;
}
.pa-pct:focus { border-color: var(--border-strong); outline: none; }
.pa-pct:disabled { opacity: 0.4; cursor: not-allowed; }

.pa-effective {
  margin-top: 4px;
  padding: 6px 8px;
  background: rgba(79, 156, 255, 0.06);
  border-radius: 4px;
  font-size: 0.8rem;
  display: flex;
  align-items: baseline;
  gap: 8px;
  flex-wrap: wrap;
}
.pa-eff-val { font-variant-numeric: tabular-nums; }
.pa-distance { font-size: 0.74rem; }
.pa-distance.pa-warn { color: var(--red); }
.pa-distance.pa-safe { color: var(--green); }

.pa-input-row {
  display: grid;
  grid-template-columns: 32px 1fr;
  align-items: center;
  gap: 8px;
  font-size: 0.82rem;
}
.pa-input-lbl {
  color: var(--text-muted);
  font-size: 0.78rem;
  font-weight: 600;
}
.pa-input {
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 4px 8px;
  color: var(--text);
  font-size: 0.82rem;
  font-variant-numeric: tabular-nums;
}
.pa-input:focus { border-color: var(--border-strong); outline: none; }

.pa-modal-foot {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding: 10px 16px 14px;
  border-top: 1px solid var(--border);
}

/* SCROLLBARS — diskret dark-theme styling */

* {
  scrollbar-width: thin;                                  /* Firefox */
  scrollbar-color: rgba(148, 163, 184, 0.22) transparent; /* Firefox */
}

::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-track {
  background: transparent;
}

::-webkit-scrollbar-thumb {
  background: rgba(148, 163, 184, 0.22);
  border-radius: 4px;
  border: 2px solid transparent;
  background-clip: padding-box;
}

::-webkit-scrollbar-thumb:hover {
  background: rgba(148, 163, 184, 0.45);
  background-clip: padding-box;
  border: 2px solid transparent;
}

::-webkit-scrollbar-corner {
  background: transparent;
}

html,
body {
  margin: 0;
  min-height: 100%;
  font-size: 14px;
  font-family:
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    sans-serif;
  /* LC! #31: lås gradient til viewport — uden background-attachment:fixed
     strækkes gradient over hele body, så lange sider (mange pools) får
     uniform mørk top og virker som om et "overlay" lægges over siden. */
  background:
    radial-gradient(circle at top left, rgba(79, 156, 255, 0.12), transparent 35%),
    radial-gradient(circle at top right, rgba(168, 85, 247, 0.08), transparent 30%),
    linear-gradient(180deg, #050b13, var(--bg));
  background-attachment: fixed;
  background-size: 100vw 100vh;
  color: var(--text);
}

a {
  color: inherit;
  text-decoration: none;
}

button {
  font: inherit;
}

/* APP */

.app {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

/* TOPBAR */

.topbar {
  height: 48px;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 20px;
  padding: 0 18px;
  background: rgba(5, 11, 19, 0.82);
  border-bottom: 1px solid var(--border);
  backdrop-filter: blur(18px);
}

.brand {
  display: flex;
  align-items: center;
  gap: 10px;
  white-space: nowrap;
}

.brand-icon {
  width: 26px;
  height: 26px;
  display: grid;
  place-items: center;
  font-size: 0.85rem;
  color: var(--accent);
  border: 1.5px solid var(--accent);
  border-radius: 8px;
  box-shadow: 0 0 18px rgba(79, 156, 255, 0.3);
}

.brand-text {
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.01em;
}

.brand-and {
  color: var(--yellow);
}

.brand-maj {
  color: var(--red);
}

.brand-heart {
  display: inline-block;
  margin-left: 1px;
  color: var(--red);
  font-size: 0.85em;
  text-shadow: 0 0 8px rgba(255, 93, 93, 0.55);
  animation: heart-float 2.6s ease-in-out infinite;
}

@keyframes heart-float {
  0%, 100% { transform: translateY(0) scale(1); }
  50%      { transform: translateY(-3px) scale(1.08); }
}

.area-nav {
  display: flex;
  justify-content: center;
  height: 100%;
  gap: 4px;
}

.area-link {
  position: relative;
  display: flex;
  align-items: center;
  padding: 0 14px;
  color: var(--text-muted);
  font-size: 0.85rem;
  transition: color 160ms ease, background 160ms ease;
}

.area-link:hover {
  color: var(--text);
  background: rgba(255, 255, 255, 0.03);
}

.area-link.active {
  color: var(--accent);
}

.area-link.active::after {
  content: "";
  position: absolute;
  left: 8px;
  right: 8px;
  bottom: 0;
  height: 2px;
  border-radius: 999px 999px 0 0;
  background: var(--accent);
  box-shadow: 0 0 12px rgba(79, 156, 255, 0.8);
}

.user-box {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.85rem;
  color: var(--text-soft);
}

.user-avatar {
  width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--accent);
  border: 1px solid var(--text-muted);
  border-radius: 50%;
}

.user-logout {
  margin-left: 4px;
  width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  font-size: 0.9rem;
  color: var(--text-muted);
  background: transparent;
  border: 1px solid var(--border);
  border-radius: 5px;
  cursor: pointer;
  transition: color 120ms, border-color 120ms;
}

.user-logout:hover {
  color: var(--red);
  border-color: rgba(255, 93, 93, 0.5);
}

.user-logout:disabled {
  opacity: 0.4;
  cursor: default;
}

/* TABBAR */

.tabbar {
  height: 36px;
  display: flex;
  align-items: stretch;
  gap: 2px;
  padding: 0 16px;
  background: rgba(10, 20, 33, 0.76);
  border-bottom: 1px solid var(--border);
  overflow-x: auto;
  scrollbar-width: thin;
}

.tab {
  position: relative;
  display: flex;
  align-items: center;
  padding: 0 14px;
  color: var(--text-muted);
  font-size: 0.85rem;
  white-space: nowrap;
  transition: color 160ms ease, background 160ms ease;
}

.tab:hover {
  color: var(--text);
  background: rgba(255, 255, 255, 0.035);
}

.tab.active {
  color: var(--accent);
  background: var(--accent-soft);
  font-weight: 600;
}

.tab.active::after {
  content: "";
  position: absolute;
  left: 6px;
  right: 6px;
  bottom: 0;
  height: 3px;
  border-radius: 999px 999px 0 0;
  background: var(--accent);
}

/* Visuel separator mellem tab-grupper i top-nav */
.tab-sep {
  display: inline-block;
  width: 1px;
  height: 18px;
  margin: 0 6px;
  background: var(--border);
  align-self: center;
}

/* MAIN */

.main {
  flex: 1;
  width: 100%;
  max-width: none;
  padding: 18px 20px;
}

.page-header {
  margin-bottom: 14px;
}

.page-header h1 {
  margin: 0 0 2px;
  font-size: 1.3rem;
  font-weight: 700;
  letter-spacing: -0.02em;
}

.page-header p {
  margin: 0;
  color: var(--text-muted);
  font-size: 0.85rem;
}

/* KPI CARDS */

.kpi-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
  margin-bottom: 14px;
}

.kpi-card,
.panel {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.035), transparent),
    var(--bg-panel);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}

.kpi-card {
  min-height: 80px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
}

.kpi-label {
  margin: 0 0 3px;
  font-size: 0.74rem;
  color: var(--text-muted);
}

.kpi-card h2 {
  margin: 0 0 3px;
  font-size: 1.35rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.1;
}

.kpi-change {
  margin: 0;
  font-size: 0.74rem;
  font-weight: 600;
  line-height: 1.1;
}

.kpi-change span {
  margin-left: 6px;
  color: var(--text-muted);
  font-weight: 400;
}

/* Stærk vægt på afkast-tal — bruges på de vigtigste %-celler
   (urealiseret, day_change_pct). Reviewer flagde at AMD +179% bør
   "hoppe ud af skærmen". */
.pl-strong {
  font-size: 1.05em;
  font-weight: 800;
  letter-spacing: -0.01em;
}
.pl-strong.positive { color: var(--green-strong); }
.pl-strong.negative { color: var(--red-strong); }

.positive {
  color: var(--green);
}

.negative {
  color: var(--red);
}

.kpi-icon,
.activity-icon {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border: 1px solid var(--border);
  border-radius: 9px;
}

.kpi-icon {
  width: 29px;
  height: 29px;
  font-size: 1rem;
}

.blue {
  color: var(--accent);
  background: rgba(79, 156, 255, 0.13);
}

.green {
  color: var(--green);
  background: rgba(69, 229, 140, 0.13);
}

.purple {
  color: var(--purple);
  background: rgba(168, 85, 247, 0.13);
}

.yellow {
  color: var(--yellow);
  background: rgba(250, 204, 21, 0.13);
}

/* 5-col KPI-grid variant for Dashboard (4 portfolio-cards + VIX) */
.kpi-grid-5 {
  grid-template-columns: repeat(5, 1fr);
}

/* VIX-kort + chip — markedssentiment-signal */
.vix-card[data-level="calm"] .kpi-icon       { color: var(--green); background: rgba(69, 229, 140, 0.13); border-color: rgba(69, 229, 140, 0.4); }
.vix-card[data-level="calm"] #vix-value      { color: var(--green); }
.vix-card[data-level="normal"] .kpi-icon     { color: var(--text-muted); background: rgba(148, 163, 184, 0.1); }
.vix-card[data-level="elevated"] .kpi-icon   { color: var(--yellow); background: rgba(250, 204, 21, 0.13); border-color: rgba(250, 204, 21, 0.4); }
.vix-card[data-level="elevated"] #vix-value  { color: var(--yellow); }
.vix-card[data-level="panic"] .kpi-icon      { color: var(--red); background: rgba(255, 93, 93, 0.13); border-color: rgba(255, 93, 93, 0.4); }
.vix-card[data-level="panic"] #vix-value     { color: var(--red); }

.vix-chip {
  display: inline-block;
  margin: 4px 0 0;
  padding: 2px 8px;
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  font-variant-numeric: tabular-nums;
  border-radius: 4px;
  border: 1px solid var(--border);
  background: rgba(255, 255, 255, 0.03);
  color: var(--text-muted);
}

.vix-chip[data-level="calm"]     { color: var(--green); background: rgba(69, 229, 140, 0.1); border-color: rgba(69, 229, 140, 0.35); }
.vix-chip[data-level="elevated"] { color: var(--yellow); background: rgba(250, 204, 21, 0.1); border-color: rgba(250, 204, 21, 0.35); }
.vix-chip[data-level="panic"]    { color: var(--red); background: rgba(255, 93, 93, 0.12); border-color: rgba(255, 93, 93, 0.4); }

/* PANELS */

.content-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}

.panel {
  min-height: 0;
  padding: 14px 16px;
}

.panel h2 {
  margin: 0;
  font-size: 0.95rem;
  font-weight: 650;
}

.panel-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}

.select-button {
  padding: 5px 10px;
  font-size: 0.8rem;
  color: var(--text);
  background: rgba(255, 255, 255, 0.035);
  border: 1px solid var(--border);
  border-radius: 6px;
  cursor: pointer;
}

.select-button:hover {
  border-color: var(--border-strong);
}

/* FOOTER */

.footer {
  /* LC! #59 (EXT-coord): sticky til viewport-bunden så connection-dot +
     version altid synlig uanset scroll-position. */
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 50;
  min-height: 28px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 18px;
  font-size: 0.75rem;
  color: var(--text-muted);
  background: rgba(5, 11, 19, 0.92);
  border-top: 1px solid var(--border);
  backdrop-filter: blur(4px);
}
/* Plads til footer så sidste indhold ikke gemmes bag den. */
.main { padding-bottom: 40px; }

.status {
  display: flex;
  align-items: center;
  gap: 6px;
}

.status-dot {
  width: 8px;
  height: 8px;
  background: var(--text-muted);
  border-radius: 50%;
  box-shadow: 0 0 10px rgba(69, 229, 140, 0.8);
  transition: background 200ms ease;
}

.separator {
  margin: 0 8px;
}

/* GENERIC DATA TABLE (shared component — tools reuse for consistency) */

.data-table {
  width: 100%;
  border-collapse: collapse;
}

.data-table th,
.data-table td {
  padding: 4px 6px;
  text-align: left;
  border-bottom: 1px solid var(--border);
}

.data-table th {
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-muted);
  font-weight: 600;
  background: rgba(148, 163, 184, 0.16);
  position: sticky;
  top: 0;
  z-index: 2;
}

.data-table td {
  font-size: 0.85rem;
}

.data-table tr:last-child td {
  border-bottom: none;
}

.data-table .num {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

/* Profil-side */

.profile-info {
  display: flex;
  flex-direction: column;
  padding: 4px 0;
}

.profile-row {
  display: grid;
  grid-template-columns: 130px 1fr;
  align-items: baseline;
  gap: 8px;
  padding: 6px 4px;
  border-bottom: 1px solid var(--border);
  font-size: 0.85rem;
}

.profile-row:last-child { border-bottom: none; }

.profile-lbl {
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-size: 0.7rem;
}

.profile-val {
  font-variant-numeric: tabular-nums;
}

.profile-token-row {
  display: flex;
  gap: 4px;
}

.profile-token-input {
  flex: 1;
  padding: 6px 10px;
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
  font-size: 0.8rem;
  color: var(--text);
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid var(--border);
  border-radius: 5px;
  outline: none;
}

.profile-token-input:focus {
  border-color: var(--border-strong);
}

.profile-token-btn {
  width: 30px;
  height: 28px;
  padding: 0;
  font-size: 0.85rem;
  color: var(--text-muted);
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid var(--border);
  border-radius: 5px;
  cursor: pointer;
}

.profile-token-btn:hover {
  color: var(--text);
  background: rgba(255, 255, 255, 0.06);
  border-color: var(--border-strong);
}

.profile-curl {
  padding: 10px 12px;
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
  font-size: 0.75rem;
  color: var(--text-soft);
  background: rgba(0, 0, 0, 0.3);
  border: 1px solid var(--border);
  border-radius: 5px;
  white-space: pre-wrap;
  word-break: break-all;
  margin: 0;
}

/* Portfolio-reconciliation status (Dashboard + import-confirm-card) */

.reconcile-section {
  margin-bottom: 14px;
}

.reconcile-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 5px 12px;
  font-size: 0.78rem;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: rgba(255, 255, 255, 0.03);
}

.reconcile-pill-icon {
  font-size: 0.9rem;
}

.reconcile-pill.reconcile-match {
  color: var(--green);
  background: rgba(69, 229, 140, 0.08);
  border-color: rgba(69, 229, 140, 0.3);
}

.reconcile-pill.reconcile-investigate {
  color: var(--yellow);
  background: rgba(250, 204, 21, 0.08);
  border-color: rgba(250, 204, 21, 0.35);
}

.reconcile-banner {
  padding: 12px 16px;
  border-radius: var(--radius);
}

.reconcile-banner.reconcile-critical {
  background: linear-gradient(180deg, rgba(255, 93, 93, 0.1), rgba(255, 93, 93, 0.04));
  border: 1px solid rgba(255, 93, 93, 0.4);
}

.reconcile-banner-title {
  font-weight: 700;
  font-size: 0.95rem;
  margin-bottom: 4px;
  color: var(--red);
}

.reconcile-banner-sub {
  font-size: 0.82rem;
  line-height: 1.45;
}

/* Confirm-card result-boks */
.reconcile-result {
  padding: 10px 14px;
  margin-top: 12px;
  border-radius: 6px;
  border: 1px solid var(--border);
  max-width: 480px;
}

.reconcile-result.reconcile-match {
  color: var(--green);
  background: rgba(69, 229, 140, 0.08);
  border-color: rgba(69, 229, 140, 0.3);
}

.reconcile-result.reconcile-investigate {
  color: var(--yellow);
  background: rgba(250, 204, 21, 0.08);
  border-color: rgba(250, 204, 21, 0.35);
}

.reconcile-result.reconcile-critical {
  color: var(--red);
  background: rgba(255, 93, 93, 0.1);
  border-color: rgba(255, 93, 93, 0.4);
}

.reconcile-row {
  padding: 3px 0;
  font-size: 0.85rem;
}

.reconcile-icon {
  font-size: 1.1rem;
  margin-right: 6px;
}

.reconcile-label {
  font-size: 0.9rem;
  letter-spacing: 0.02em;
}

/* Cash-panel på Dashboard */

.cash-section {
  margin-bottom: 14px;
}

/* Kontant-beholdning panel: header + 4-col fast-bredde tabel + total-sektion.
   Bredde-budget i venstre kolonne (~300px content) gør at vi bruger small font,
   nowrap, og table-layout: fixed for at undgå clipping. */
.cash-panel { padding: 0; overflow: hidden; }

.cash-panel-head {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 12px;
  border-bottom: 1px solid var(--border);
}
.cash-head-icon { font-size: 0.95rem; }
.cash-panel-head h2 { font-size: 0.85rem; font-weight: 700; flex: 1; }
.cash-head-badge {
  font-size: 0.7rem;
  color: var(--text-muted);
  background: var(--bg-soft);
  border: 1px solid var(--border);
  padding: 1px 6px;
  border-radius: 10px;
  white-space: nowrap;
}

.cash-table {
  table-layout: fixed;
  width: 100%;
  font-size: 0.72rem;
  border-collapse: collapse;
}
.cash-table th,
.cash-table td {
  padding: 4px 6px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: middle;
}
.cash-table th {
  font-size: 0.62rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-muted);
  font-weight: 600;
  text-align: left;
  border-bottom: 1px solid var(--border);
}
.cash-table th.num { text-align: right; }
.cash-table tbody td { border-bottom: 1px solid rgba(148,163,184,0.10); }
.cash-table tbody tr:last-child td { border-bottom: none; }
.cash-cell-ccy { font-weight: 700; color: var(--accent); }
.cash-cell-amt,
.cash-cell-dkk,
.cash-cell-age {
  font-variant-numeric: tabular-nums;
  text-align: right;
}

.cash-dot {
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  margin-right: 4px;
  vertical-align: middle;
  background: var(--text-muted);
}
.cash-dot-ok { background: var(--green); }
.cash-dot-warn { background: var(--yellow); }
.cash-dot-bad { background: var(--red); }
.cash-dot-muted { background: var(--text-muted); }

.cash-totals {
  padding: 6px 10px 8px;
  background: rgba(255, 255, 255, 0.025);
  border-top: 1px solid var(--border);
}
.cash-total-row {
  display: grid;
  grid-template-columns: 14px 1fr auto;
  gap: 6px;
  align-items: baseline;
  padding: 3px 0;
  font-size: 0.74rem;
}
.cash-total-icon {
  color: var(--text-muted);
  font-size: 0.7rem;
  text-align: center;
}
.cash-total-lbl {
  color: var(--text-muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.cash-total-val {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  font-size: 1.2em;
}
.cash-total-big {
  margin-top: 2px;
  padding-top: 5px;
  border-top: 1px solid var(--border);
  font-size: 0.82rem;
}

/* Symbol-alerts summary strip øverst på dashboard */

.symbol-alerts-strip {
  margin-bottom: 12px;
}
.symbol-alerts-banner {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 8px 14px;
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  font-size: 0.82rem;
}
.symbol-alerts-banner.has-triggered {
  border-color: rgba(250,204,21,0.55);
  background: linear-gradient(180deg, rgba(250,204,21,0.08), rgba(250,204,21,0.03));
}
.sas-summary {
  color: var(--text);
  text-decoration: none;
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
}
.sas-summary:hover { color: var(--accent); }
.sas-count strong { font-size: 1rem; }
.sas-triggered-count { color: #facc15; font-weight: 600; }
.sas-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-left: auto;
}
.sas-triggered-chip {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 4px;
  background: rgba(250,204,21,0.14);
  color: #facc15;
  font-weight: 600;
  text-decoration: none;
  font-size: 0.74rem;
}
.sas-triggered-chip:hover {
  background: rgba(250,204,21,0.22);
}

/* Watchdog-alerts banner på Dashboard */

.alerts-section {
  margin-bottom: 14px;
}

.alerts-banner {
  padding: 10px 14px;
  background: linear-gradient(180deg, rgba(255, 93, 93, 0.08), rgba(255, 93, 93, 0.03));
  border: 1px solid rgba(255, 93, 93, 0.35);
  border-radius: var(--radius);
}

.alerts-header {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin-bottom: 4px;
}

.alerts-title {
  font-weight: 700;
  font-size: 0.85rem;
  color: var(--red);
}

.alerts-counts {
  font-size: 0.72rem;
  font-variant-numeric: tabular-nums;
}

.alerts-toggle {
  margin-left: auto;
  padding: 2px 9px;
  font-size: 0.72rem;
  color: var(--text-muted);
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid var(--border);
  border-radius: 4px;
  cursor: pointer;
}

.alerts-toggle:hover { color: var(--text); }

.alerts-list {
  list-style: none;
  margin: 6px 0 0;
  padding: 0;
}

.alert-row {
  display: grid;
  grid-template-columns: 50px 80px 160px 1fr 32px;
  gap: 10px;
  align-items: center;
  padding: 5px 0;
  font-size: 0.78rem;
  border-top: 1px solid rgba(255, 255, 255, 0.05);
}

.alert-row:first-child { border-top: none; }

.alert-sev {
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  padding: 1px 6px;
  border-radius: 3px;
  text-align: center;
  box-sizing: border-box;
}

.alert-high .alert-sev { color: var(--red); background: rgba(255, 93, 93, 0.18); }
.alert-med .alert-sev { color: var(--yellow); background: rgba(250, 204, 21, 0.18); }
.alert-low .alert-sev { color: var(--text-muted); background: rgba(148, 163, 184, 0.12); }

.alert-target {
  font-weight: 700;
  color: var(--accent);
}

.alert-label {
  color: var(--text);
}

.alert-detail {
  font-size: 0.74rem;
}

.alert-resolve {
  width: 28px;
  height: 24px;
  padding: 0;
  font-size: 0.85rem;
  color: var(--text-muted);
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid var(--border);
  border-radius: 4px;
  cursor: pointer;
}

.alert-resolve:hover {
  color: var(--green);
  border-color: rgba(69, 229, 140, 0.5);
}

.alert-resolve:disabled { opacity: 0.4; cursor: default; }

/* Dashboard layout: venstre kolonne stacker Fordeling + Earnings */

.dash-left {
  display: flex;
  flex-direction: column;
  gap: 14px;
  min-width: 0;
}

/* Dashboard toolbar — filter-toggles + CSV-knap */

.dash-toolbar {
  display: flex;
  align-items: center;
  gap: 10px;
}

.dash-toggle {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 8px 3px 5px;
  font-size: 0.75rem;
  color: var(--text-muted);
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid var(--border);
  border-radius: 4px;
  cursor: pointer;
  user-select: none;
}

.dash-toggle:has(input:checked) {
  color: var(--text);
  border-color: var(--border-strong);
  background: var(--accent-soft);
}

.dash-toggle input {
  accent-color: var(--accent);
  margin: 0;
}

/* Dashboard upcoming earnings card */

.dash-earnings {
  padding: 4px 8px 6px;
}

.dash-earnings-row {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: baseline;
  gap: 4px 10px;
  padding: 6px 4px;
  font-size: 0.8rem;
  border-bottom: 1px solid var(--border);
}

.dash-earnings-row:last-child { border-bottom: none; }

.dash-earnings-row.dash-earnings-urgent {
  background: rgba(250, 204, 21, 0.06);
  border-left: 2px solid var(--yellow);
  padding-left: 6px;
}

.dash-earnings-when {
  font-size: 0.75rem;
  color: var(--text-muted);
  font-variant-numeric: tabular-nums;
}

.dash-earnings-row.dash-earnings-urgent .dash-earnings-when {
  color: var(--yellow);
  font-weight: 600;
}

/* Positions-side donut */

.pos-donut {
  padding: 4px 4px 8px;
}

.pos-donut-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
}

.pos-donut-svg {
  width: 160px;
  height: 160px;
}

.pos-donut-total {
  fill: var(--text);
  font-size: 18px;
  font-weight: 700;
  font-family: inherit;
}

.pos-donut-total-lbl {
  fill: var(--text-muted);
  font-size: 9px;
  font-family: inherit;
}

.pos-donut-legend {
  width: 100%;
  display: flex;
  flex-direction: column;
  padding: 0 4px;
}

.pos-donut-leg {
  display: grid;
  grid-template-columns: 14px 1fr auto;
  align-items: baseline;
  gap: 2px 8px;
  font-size: 0.78rem;
  padding: 5px 0;
  border-bottom: 1px solid var(--border);
}

.pos-donut-leg:last-child { border-bottom: none; }

.pos-donut-dot {
  width: 10px;
  height: 10px;
  border-radius: 2px;
  align-self: center;
}

.pos-donut-name {
  font-weight: 600;
}

.pos-donut-pct {
  font-variant-numeric: tabular-nums;
  color: var(--text-muted);
}

.pos-donut-dkk {
  grid-column: 2 / -1;
  font-size: 0.7rem;
  color: var(--text-muted);
  font-variant-numeric: tabular-nums;
}

/* Sektor-aggregation-kort på Dashboard */

.sector-alloc {
  padding: 8px 12px 12px;
}

.sector-bar {
  display: flex;
  width: 100%;
  height: 14px;
  border-radius: 4px;
  overflow: hidden;
  margin-bottom: 12px;
  background: rgba(148, 163, 184, 0.08);
}

.sector-seg {
  display: block;
  height: 100%;
  min-width: 2px;
  transition: filter 120ms;
}

.sector-seg:hover {
  filter: brightness(1.2);
}

/* Sektor-seg bruger samme color-base som badges men solid baggrund */
.sector-seg.sector-tech  { background: var(--accent); }
.sector-seg.sector-hlth  { background: var(--green); }
.sector-seg.sector-fin   { background: var(--purple); }
.sector-seg.sector-cycl  { background: #ec4899; }
.sector-seg.sector-def   { background: #fb923c; }
.sector-seg.sector-comm  { background: #22d3ee; }
.sector-seg.sector-enrg  { background: var(--red); }
.sector-seg.sector-ind   { background: #cbd5e1; }
.sector-seg.sector-reit  { background: #d97706; }
.sector-seg.sector-util  { background: #0ea5e9; }
.sector-seg.sector-mat   { background: #a16207; }
.sector-seg.sector-unknown { background: var(--text-muted); }

.sector-legend {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.sector-leg {
  display: grid;
  grid-template-columns: 10px 42px 1fr auto;
  align-items: center;
  gap: 8px;
  font-size: 0.75rem;
  padding: 3px 0;
}

.sector-leg-dot {
  width: 10px;
  height: 10px;
  border-radius: 2px;
}

.sector-leg-badge {
  font-weight: 700;
  font-size: 0.62rem;
  letter-spacing: 0.04em;
  text-align: center;
  color: var(--text);
}

.sector-leg-count {
  font-size: 0.7rem;
}

.sector-leg-pct {
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  text-align: right;
}

.sector-leg-dkk {
  grid-column: 3 / -1;
  font-size: 0.68rem;
  text-align: right;
  margin-top: -2px;
}

/* Symbol-admin (Symboler side) */

.sym-admin {
  display: flex;
  align-items: center;
  gap: 6px;
}

.sym-admin-input {
  padding: 4px 8px;
  width: 160px;
  font-size: 0.78rem;
  color: var(--text);
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid var(--border);
  border-radius: 5px;
  outline: none;
  font-variant-numeric: tabular-nums;
}

.sym-admin-input:focus {
  border-color: var(--border-strong);
}

.sym-admin-btn {
  padding: 4px 10px;
  font-size: 0.78rem;
  color: var(--text);
  background: var(--accent-soft);
  border: 1px solid var(--border-strong);
  border-radius: 5px;
  cursor: pointer;
}

.sym-admin-btn:hover { background: rgba(79, 156, 255, 0.28); }
.sym-admin-btn:disabled { opacity: 0.5; cursor: default; }

.sym-admin .muted { font-size: 0.78rem; margin-left: 8px; }

.sym-suggestions {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  align-items: center;
  padding: 4px 0 8px;
}

.sym-suggestions:empty { display: none; }

.sym-sugg {
  padding: 2px 8px;
  font-size: 0.75rem;
  color: var(--accent);
  background: var(--accent-soft);
  border: 1px solid var(--border);
  border-radius: 4px;
  cursor: pointer;
}

.sym-sugg:hover { border-color: var(--border-strong); }

.sym-del {
  width: 24px;
  height: 22px;
  padding: 0;
  font-size: 0.95rem;
  line-height: 1;
  color: var(--text-muted);
  background: transparent;
  border: 1px solid var(--border);
  border-radius: 4px;
  cursor: pointer;
}

.sym-del:hover {
  color: var(--red);
  border-color: rgba(255, 93, 93, 0.5);
}

.sym-del:disabled { opacity: 0.4; cursor: default; }

/* Fundamentals-tabel: kompakt typografi for mange kolonner */

.fund-table th,
.fund-table td {
  padding: 4px 8px;
}

.fund-table .num {
  font-variant-numeric: tabular-nums;
}

/* Status- og Sektor-kolonnerne skrumpes til content-bredde — badges fylder
   ikke en hel "fair share" af bordbredden ellers. */
.kpi-grid-5 ~ .content-grid .data-table th:nth-child(1),
.kpi-grid-5 ~ .content-grid .data-table td:nth-child(1),
.kpi-grid-5 ~ .content-grid .data-table th:nth-child(2),
.kpi-grid-5 ~ .content-grid .data-table td:nth-child(2),
.kpi-grid-5 ~ .content-grid .data-table th:nth-child(3),
.kpi-grid-5 ~ .content-grid .data-table td:nth-child(3),
/* ── Sym-table: standardiseret kolonne-layout (LC! #17) ─────────────────
   Anvendes på alle symbol-tabeller (dashboard positions, pools, symbols
   management). Garanterer pixel-præcis kolonne-alignment via
   table-layout:fixed + nth-child widths. Tabeller kan have ekstra
   kolonner efter col 7 — de deler den resterende plads via width:auto.

   Standard rækkefølge:
     1 = ★ følg-stjerne         (28px)
     2 = stale-dot               (16px)
     3 = Status badge            (72px)
     4 = Sektor badge            (64px)
     5 = Risk score              (56px)
     6 = Symbol/ticker           (110px)
     7 = Kurs                    (88px)
     8+ = side-specifikt          (auto-fordeling)
*/
.sym-table { table-layout: fixed; width: 100%; }
.sym-table th, .sym-table td {
  padding: 4px 4px; font-size: 0.82rem;       /* LC! followup: padding ×0.8 (5→4) */
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
/* Widths svarer pixel-præcist til dashboard's målte rendering (round 1). */
.sym-table th:nth-child(1), .sym-table td:nth-child(1) { width: 32px; padding: 0 3px !important; text-align: center; }   /* ★ */
.sym-table th:nth-child(2), .sym-table td:nth-child(2) { width: 16px; padding: 0 3px !important; text-align: center; }   /* dot */
.sym-table th:nth-child(3), .sym-table td:nth-child(3) { width: 44px; padding: 4px 0 !important; text-align: center; }   /* Status */
.sym-table th:nth-child(4), .sym-table td:nth-child(4) { width: 48px; padding: 4px 0 !important; text-align: center; }   /* Sektor */
.sym-table th:nth-child(5), .sym-table td:nth-child(5) { width: 40px; text-align: center; }                              /* Risk */
.sym-table th:nth-child(6), .sym-table td:nth-child(6) { width: 69px; text-align: left; }                                /* Symbol — LC! followup: ×0.95 af 73 */
.sym-table th:nth-child(7), .sym-table td:nth-child(7) { width: 49px; text-align: right; }                               /* Kurs   — LC! followup: ×1.1 af 45 */
.sym-table th:nth-child(8), .sym-table td:nth-child(8) { width: 43px; text-align: right; }                               /* D%    — LC! followup: ×1.2 af 36 */
.sym-table th:nth-child(9), .sym-table td:nth-child(9) { width: 32px; text-align: right; }                               /* E     — earnings dage */
/* LC! #63 + followup: 2px border-right efter sidste faste kolonne (E, col 9)
   markerer slut på de "faste" sym-table-kolonner. Gælder også th (headere). */
.sym-table th:nth-child(9), .sym-table td:nth-child(9) { border-right: 2px solid var(--border); }
/* Col 10+ = auto-fordeling */

/* Earnings-celle: mørkegul tekst, bold (LC! #62). */
.pl-earn-cell { color: #ca8a04; font-weight: 700; }
/* Direction pips — 4 ikoner side om side i én celle. */
.pl-dir-cell { padding: 0 4px !important; }
.dir-pip {
  display: inline-block;
  width: 22px;
  text-align: center;
  font-weight: 900;
  font-size: 1.0rem;
  line-height: 1;
  text-shadow: 0 0 0.5px currentColor;
}
.dir-pip.val-up { color: #45e58c; }
.dir-pip.val-down { color: #ff5d5d; }
.dir-pip.dir-flat { color: #b87333; font-size: 1.23rem; }
.dir-pip.dir-placeholder { color: rgba(148, 163, 184, 0.35); font-weight: 400; }
.dir-pip.err { color: #ff5d5d; font-weight: 700; font-size: 0.85rem; }

/* Pool-header ikon-knapper: kun ikon, bold, action i tooltip. */
.pl-btn-icon {
  font-weight: 700 !important;
  font-size: 0.95rem;
  padding: 2px 7px;
  min-width: 24px;
}
/* Data-integrity policy (EXT-coord 2026-06-03): når server returnerer
   error på en beregnet værdi, viser GUI eksplicit ERR — ALDRIG "–" eller
   blank, fordi brugeren tager handler-beslutninger på disse værdier. */
.num.err, .ctr.err {
  color: #ff5d5d;
  font-weight: 700;
  font-style: normal !important;  /* override italic på derived-fields */
  font-size: 0.75rem;
}
/* E-header centreret — overrider sym-table nth-child(9)'s right-align */
.sym-table th:nth-child(9) { text-align: center; }

/* Legacy dashboard CSS — KEEP as fallback for tables uden .sym-table-class.
   Når alle 3 tabeller har .sym-table, kan dette fjernes.
   Standardiseret kolonne-rækkefølge per LC! #17:
   Col 1 = ★ følg-stjerne
   Col 2 = stale-dot (5×5 farvet kvadrat)
   Col 3+4+5 = Status, Sektor, Risk — centrerede badge-kolonner. */
.dash-shell .data-table th:nth-child(3),
.dash-shell .data-table td:nth-child(3),
.dash-shell .data-table th:nth-child(4),
.dash-shell .data-table td:nth-child(4),
.dash-shell .data-table th:nth-child(5),
.dash-shell .data-table td:nth-child(5) {
  width: 1%;
  white-space: nowrap;
  text-align: center;
}

/* Status (col 3) og Sektor (col 4): TH og TD skal have identisk L+R padding. */
.dash-shell .data-table-tight th:nth-child(3),
.dash-shell .data-table-tight td:nth-child(3),
.dash-shell .data-table-tight th:nth-child(4),
.dash-shell .data-table-tight td:nth-child(4) {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* ★ Star (col 1) + stale-dot (col 2): begge smalle, centrerede. */
.dash-shell .data-table-tight th:nth-child(1),
.dash-shell .data-table-tight td:nth-child(1) {
  width: 1%;
  padding: 0 4px !important;
  text-align: center;
}
.dash-shell .data-table-tight th:nth-child(2),
.dash-shell .data-table-tight td:nth-child(2) {
  width: 1%;
  padding: 0 4px !important;
  text-align: center;
}
.stale-dot {
  display: inline-block;
  width: 5px;
  height: 5px;
  border-radius: 1px;
  vertical-align: middle;
}
.stale-dot.stale-fresh  { background: var(--green); }
.stale-dot.stale-mid    { background: var(--text-muted); }
.stale-dot.stale-high   { background: var(--red); }
.stale-dot.stale-closed { background: var(--accent); }
/* LC! #16 — WS=grøn / REST=blå / stale=rød / closed=skjult */
.stale-dot.stale-ws    { background: var(--green); }
.stale-dot.stale-rest  { background: var(--accent); }
.stale-dot.stale-stale { background: var(--red); }

/* Scheduler-side (admin tool) */

.sch-run-btn {
  padding: 4px 10px;
  font-size: 0.75rem;
  color: var(--accent);
  background: var(--accent-soft);
  border: 1px solid var(--border-strong);
  border-radius: 5px;
  cursor: pointer;
  white-space: nowrap;
}

.sch-run-btn:hover:not(:disabled) {
  background: rgba(79, 156, 255, 0.28);
}

.sch-run-btn:disabled {
  opacity: 0.5;
  cursor: default;
}

.sch-error-details {
  display: inline-block;
}

.sch-error-details summary {
  cursor: pointer;
  list-style: none;
}

.sch-error-details summary::-webkit-details-marker { display: none; }

.sch-error-trace {
  margin: 6px 0 0;
  padding: 8px 10px;
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
  font-size: 0.7rem;
  color: var(--red);
  background: rgba(0, 0, 0, 0.3);
  border: 1px solid rgba(255, 93, 93, 0.3);
  border-radius: 4px;
  max-height: 180px;
  overflow: auto;
  white-space: pre-wrap;
  word-break: break-all;
}

.sch-running {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

/* CSV-download button (panel-header) */

.csv-btn {
  padding: 3px 10px;
  font-size: 0.72rem;
  color: var(--text-muted);
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid var(--border);
  border-radius: 4px;
  cursor: pointer;
}

.csv-btn:hover {
  color: var(--text);
  background: rgba(255, 255, 255, 0.06);
  border-color: var(--border-strong);
}

/* Watch drag-and-drop */

.wb-cell.wb-dragging {
  opacity: 0.4;
}

.wb-cell.wb-drag-over {
  border-color: var(--accent);
  border-style: dashed;
  background:
    linear-gradient(180deg, var(--accent-soft), transparent),
    var(--bg-panel);
}

/* Trading keyboard hint */

.tw-kbd-hint {
  margin-left: 10px;
  font-size: 0.7rem;
  letter-spacing: 0.02em;
  white-space: nowrap;
}

/* P/L curve chart */

.pl-chart {
  padding: 4px 8px 0;
}

.pl-chart-svg {
  width: 100%;
  height: auto;
  display: block;
  font-family: inherit;
}

/* Sortable column headers — applied by makeSortable() */

.data-table th.sortable,
.tw-mini-tbl th.sortable {
  cursor: pointer;
  user-select: none;
  position: relative;
  transition: color 120ms ease;
}

.data-table th.sortable:hover,
.tw-mini-tbl th.sortable:hover {
  color: var(--text);
}

.data-table th.sort-asc::after,
.data-table th.sort-desc::after,
.tw-mini-tbl th.sort-asc::after,
.tw-mini-tbl th.sort-desc::after {
  font-size: 0.65em;
  margin-left: 4px;
  color: var(--accent);
  opacity: 0.85;
}

.data-table th.sort-asc::after,
.tw-mini-tbl th.sort-asc::after {
  content: "▲";
}

.data-table th.sort-desc::after,
.tw-mini-tbl th.sort-desc::after {
  content: "▼";
}

.data-table th.sort-secondary::after,
.tw-mini-tbl th.sort-secondary::after {
  opacity: 0.5;
}

.sym {
  font-weight: 700;
  color: var(--accent);
}

.sym-link {
  cursor: pointer;
  border-bottom: 1px dashed transparent;
  transition: border-color 120ms;
}

.sym-link:hover {
  border-bottom-color: currentColor;
}

.muted {
  color: var(--text-muted);
}

.val-up {
  color: var(--green);
}

.val-down {
  color: var(--red);
}

.num-sub {
  display: block;
  margin-top: 1px;
  font-size: 0.7rem;
  font-variant-numeric: tabular-nums;
  font-weight: 400;
}

.badge-new-high {
  display: inline-block;
  padding: 1px 6px;
  font-size: 0.7rem;
  color: var(--green);
  background: rgba(69, 229, 140, 0.13);
  border: 1px solid rgba(69, 229, 140, 0.4);
  border-radius: 3px;
  font-weight: 600;
}

.badge-status {
  display: inline-block;
  min-width: 0;
  padding: 2px 2px;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  text-align: center;
  border-radius: 3px;
  box-sizing: border-box;
}

.badge-status.open {
  color: var(--green);
  background: rgba(69, 229, 140, 0.13);
  border: 1px solid rgba(69, 229, 140, 0.42);
}

.badge-status.closed {
  color: var(--text-muted);
  background: rgba(148, 163, 184, 0.08);
  border: 1px solid var(--border);
}

/* Sector-badges — 3-5 char forkortelse ved siden af ticker */

.sector-badge {
  display: inline-block;
  min-width: 0;
  padding: 2px 0;
  margin-left: 4px;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-align: center;
  border-radius: 3px;
  vertical-align: middle;
  cursor: help;
  box-sizing: border-box;
}

.sector-tech  { color: var(--accent); background: rgba(79, 156, 255, 0.12); border: 1px solid rgba(79, 156, 255, 0.35); }
.sector-hlth  { color: var(--green);  background: rgba(69, 229, 140, 0.12); border: 1px solid rgba(69, 229, 140, 0.35); }
.sector-fin   { color: var(--purple); background: rgba(168, 85, 247, 0.12); border: 1px solid rgba(168, 85, 247, 0.35); }
.sector-cycl  { color: #ec4899;       background: rgba(236, 72, 153, 0.12); border: 1px solid rgba(236, 72, 153, 0.4); }
.sector-def   { color: #fb923c;       background: rgba(251, 146, 60, 0.12); border: 1px solid rgba(251, 146, 60, 0.35); }
.sector-comm  { color: #22d3ee;       background: rgba(34, 211, 238, 0.12); border: 1px solid rgba(34, 211, 238, 0.35); }
.sector-enrg  { color: var(--red);    background: rgba(255, 93, 93, 0.12);  border: 1px solid rgba(255, 93, 93, 0.35); }
.sector-ind   { color: #cbd5e1;       background: rgba(148, 163, 184, 0.12); border: 1px solid rgba(148, 163, 184, 0.35); }
.sector-reit  { color: #d97706;       background: rgba(217, 119, 6, 0.12);  border: 1px solid rgba(217, 119, 6, 0.35); }
.sector-util  { color: #0ea5e9;       background: rgba(14, 165, 233, 0.12); border: 1px solid rgba(14, 165, 233, 0.35); }
.sector-mat   { color: #a16207;       background: rgba(161, 98, 7, 0.12);   border: 1px solid rgba(161, 98, 7, 0.35); }
.sector-unknown { color: var(--text-muted); background: rgba(148, 163, 184, 0.06); border: 1px dashed var(--border); }

/* Stale-price-badge: signal til at last_tick er gamle/markedet er lukket */

.badge-stale {
  display: inline-block;
  padding: 1px 6px;
  margin-left: 4px;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  border-radius: 3px;
  vertical-align: middle;
  white-space: nowrap;
  cursor: help;
}

.badge-stale.stale-closed {
  color: var(--accent);
  background: rgba(79, 156, 255, 0.1);
  border: 1px solid rgba(79, 156, 255, 0.35);
}

.badge-stale.stale-mid {
  color: var(--text-muted);
  background: rgba(148, 163, 184, 0.1);
  border: 1px solid var(--border);
}

.badge-stale.stale-high {
  color: var(--red);
  background: rgba(255, 93, 93, 0.1);
  border: 1px solid rgba(255, 93, 93, 0.45);
}

/* Sektor-relativ cluster under Dag % — viser pos vs sektor-ETF + SPY */

.rel-cluster {
  display: block;
  margin-top: 2px;
  font-size: 0.65rem;
  line-height: 1.2;
}

.rel-tag {
  display: inline-block;
  padding: 0 4px;
  font-variant-numeric: tabular-nums;
  font-weight: 500;
  white-space: nowrap;
}

.badge-earnings {
  display: inline-block;
  padding: 1px 5px;
  font-size: 0.65rem;
  color: var(--yellow);
  background: rgba(250, 204, 21, 0.1);
  border: 1px solid rgba(250, 204, 21, 0.35);
  border-radius: 3px;
  font-weight: 500;
  white-space: nowrap;
  vertical-align: middle;
}

.badge-owned {
  display: inline-block;
  color: var(--green);
  font-size: 0.7rem;
  vertical-align: middle;
}

.er-filters {
  display: flex;
  gap: 4px;
}

.er-filter-btn {
  padding: 3px 9px;
  font-size: 0.75rem;
  color: var(--text-muted);
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid var(--border);
  border-radius: 5px;
  cursor: pointer;
}

.er-filter-btn:hover {
  color: var(--text);
  background: rgba(255, 255, 255, 0.06);
}

.er-filter-btn.active {
  color: var(--text);
  background: var(--accent-soft);
  border-color: var(--border-strong);
}

.tw-earnings .tw-earnings-future td {
  background: rgba(250, 204, 21, 0.04);
}
@keyframes rowflash {
  from { background: var(--accent-soft); }
  to { background: transparent; }
}

tr.flash,
.flash {
  animation: rowflash 0.6s ease-out;
}

/* TRADING WORKSPACE — desktop chart + position + trades */

.tw {
  display: grid;
  grid-template-columns: 440px 1fr 300px;
  gap: 12px;
  height: calc(100vh - 140px);
  min-height: 480px;
}

.tw-col {
  display: flex;
  flex-direction: column;
  min-height: 0;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.035), transparent),
    var(--bg-panel);
  border: 1px solid var(--border);
  border-radius: var(--radius);
}

.tw-col-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 12px 6px;
}

.tw-col-head h3 {
  margin: 0;
  font-size: 0.75rem;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.tw-sidebar,
.tw-side,
.tw-info-col {
  overflow-y: auto;
}

/* Info-kolonne (Trading-side venstre) — perioder, temaer, fundamentals */
.tw-info-col {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 8px;
}
.tw-info-card { padding: 0; min-width: 0; }
.tw-info-card .panel-header {
  padding: 4px 10px !important;
  margin-bottom: 0;
  border-bottom: 1px solid var(--border);
  display: flex; justify-content: space-between; align-items: center;
}
.tw-info-card .panel-header h2 { font-size: 0.74rem; }
.tw-info-meta { font-size: 0.66rem; color: var(--muted); font-variant-numeric: tabular-nums; }
.tw-info-body { padding: 6px 10px 10px; font-size: 0.74rem; }
.tw-info-body table { width: 100%; font-size: 0.72rem; font-variant-numeric: tabular-nums; }
.tw-info-body th { padding: 2px 4px; font-size: 0.62rem; color: var(--muted); text-align: left; border-bottom: 1px solid var(--border); }
.tw-info-body td { padding: 2px 4px; border-bottom: 1px dashed rgba(148,163,184,0.10); }
.tw-info-body td.num { text-align: right; }
.tw-info-body td.good { color: #4ade80; }
.tw-info-body td.bad { color: #f87171; }

/* Stamdata-panel sektioner (P1) */
.tw-stamdata-section { margin-bottom: 10px; }
.tw-stamdata-section:last-child { margin-bottom: 0; }
.tw-stamdata-section-head {
  font-size: 0.62rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin: 6px 0 3px;
  padding-bottom: 2px;
  border-bottom: 1px solid var(--border);
}

/* Periode-graf i info-panel */
.tw-per-spark { display: block; width: 100%; height: 80px; margin-bottom: 6px; }
.tw-per-table th:first-child, .tw-per-table td:first-child { text-align: left; }

/* Themes-panel */
.tw-themes-sector {
  display: inline-block;
  padding: 1px 5px;
  background: rgba(148, 163, 184, 0.12);
  color: var(--muted);
  border-radius: 3px;
  font-size: 0.6rem;
  font-weight: 700;
  margin-right: 4px;
}
.tw-themes-subs-label { font-size: 0.66rem; margin: 8px 0 4px; text-transform: uppercase; letter-spacing: 0.04em; }
.tw-themes-subs { display: flex; flex-wrap: wrap; gap: 3px; }
.tw-themes-sub {
  display: inline-block;
  padding: 2px 7px;
  background: rgba(168, 85, 247, 0.14);
  color: #c4b5fd;
  border: 1px solid rgba(168, 85, 247, 0.32);
  border-radius: 3px;
  font-size: 0.62rem;
  font-weight: 600;
  cursor: help;
}

/* Fundamentals-panel */
.tw-fund-table td:first-child { width: 50%; }

/* Symbol-picker dropdown (erstatter venstre sym-list) */
.tw-sym-picker { position: relative; }
.tw-sym-trigger {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  font-family: inherit;
  color: var(--text);
}
.tw-sym-trigger h2 { margin: 0; font-size: 1.05rem; }
.tw-sym-trigger:hover h2 { color: #4ade80; }
.tw-sym-chev { color: var(--muted); font-size: 0.8rem; }

.tw-sym-dropdown {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 50;
  width: 400px;
  max-height: 60vh;
  margin-top: 4px;
  background: var(--panel);
  border: 1px solid var(--border-strong);
  border-radius: 6px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.4);
  display: flex; flex-direction: column;
  overflow: hidden;
}
/* display:flex overstyrer browser-default [hidden]{display:none} — fix */
.tw-sym-dropdown[hidden] { display: none; }
.tw-sym-dropdown-search {
  margin: 8px;
  padding: 6px 8px;
  font-size: 0.82rem;
  color: var(--text);
  background: var(--bg-panel);
  border: 1px solid var(--border);
  border-radius: 4px;
  outline: none;
  font-family: inherit;
}
.tw-sym-dropdown-search:focus { border-color: #4ade80; }
.tw-sym-dropdown-list {
  flex: 1; overflow-y: auto;
  padding: 0 4px 6px;
}
.tw-sym-drop-item {
  display: grid;
  grid-template-columns: 90px 1fr auto auto;
  gap: 8px;
  align-items: baseline;
  width: 100%;
  padding: 4px 8px;
  border: none;
  background: transparent;
  color: var(--text);
  font-family: inherit;
  font-size: 0.78rem;
  text-align: left;
  cursor: pointer;
  border-radius: 3px;
}
.tw-sym-drop-item:hover, .tw-sym-drop-item.is-highlight {
  background: rgba(74, 222, 128, 0.12);
}
.tw-sym-drop-item.is-current { color: #4ade80; font-weight: 600; }
.tw-sym-drop-tick { font-weight: 600; }
.tw-sym-drop-name { font-size: 0.7rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tw-sym-drop-last { font-variant-numeric: tabular-nums; }
.tw-sym-drop-qty { font-size: 0.66rem; font-variant-numeric: tabular-nums; }

.tw-sym-search-wrap {
  padding: 0 8px 6px;
}

.tw-sym-search {
  width: 100%;
  padding: 4px 8px;
  font-size: 0.78rem;
  color: var(--text);
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid var(--border);
  border-radius: 5px;
  outline: none;
}

.tw-sym-search:focus {
  border-color: var(--border-strong);
}

.tw-syms {
  padding: 0 6px 8px;
}

.tw-sym-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 4px 8px;
  padding: 5px 8px;
  margin-bottom: 2px;
  border-radius: 6px;
  cursor: pointer;
  font-size: 0.85rem;
}

.tw-sym-row:hover {
  background: rgba(255, 255, 255, 0.04);
}

.tw-sym-row.active {
  background: var(--accent-soft);
}

.tw-sym-ticker {
  font-weight: 600;
}

.tw-sym-last {
  font-variant-numeric: tabular-nums;
}

.tw-sym-meta {
  grid-column: 1 / -1;
  font-size: 0.7rem;
  color: var(--text-muted);
}

.tw-chart-wrap {
  overflow: hidden;
}

.tw-chart-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 14px;
  border-bottom: 1px solid var(--border);
}

.tw-chart-head h2 {
  margin: 0;
  font-size: 1.1rem;
  font-weight: 700;
  letter-spacing: -0.01em;
}

.tw-chart-head p {
  margin: 2px 0 0;
  font-size: 0.78rem;
}

.tw-chart-price-block {
  text-align: right;
}

.tw-chart-price {
  margin: 0;
  font-size: 1.3rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.tw-tf {
  display: flex;
  gap: 4px;
  align-items: center;
  padding: 6px 14px;
  border-bottom: 1px solid var(--border);
}

.tw-tf-btn {
  padding: 3px 9px;
  font-size: 0.75rem;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid var(--border);
  color: var(--text-muted);
  border-radius: 5px;
  cursor: pointer;
  transition: color 120ms ease, background 120ms ease;
}

.tw-tf-btn:hover {
  color: var(--text);
  background: rgba(255, 255, 255, 0.06);
}

.tw-tf-btn.active {
  color: var(--text);
  background: var(--accent-soft);
  border-color: var(--border-strong);
}

/* LC! #42: chart-type toggle (candles ⇄ line) */
.tw-ct-divider {
  width: 1px; height: 18px;
  background: var(--border); margin: 0 4px;
}
.tw-ct-btn {
  padding: 3px 8px; font-size: 0.85rem;
  background: rgba(255,255,255,0.03);
  border: 1px solid var(--border);
  color: var(--text-muted); border-radius: 5px;
  cursor: pointer;
}
.tw-ct-btn:hover { color: var(--text); background: rgba(255,255,255,0.06); }
.tw-ct-btn.active { color: var(--text); background: var(--accent-soft); border-color: var(--border-strong); }

.tw-ind {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 5px 14px;
  border-bottom: 1px solid var(--border);
  flex-wrap: wrap;
}

.tw-ind-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 2px 8px;
  font-size: 0.72rem;
  color: var(--text-muted);
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid var(--border);
  border-radius: 4px;
  cursor: pointer;
  transition: color 120ms, background 120ms;
}

.tw-ind-btn:hover {
  color: var(--text);
  background: rgba(255, 255, 255, 0.06);
}

.tw-ind-btn.active {
  color: var(--text);
  background: rgba(255, 255, 255, 0.07);
  border-color: var(--border-strong);
}

.tw-ind-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 2px;
  opacity: 0.5;
}

.tw-ind-btn.active .tw-ind-dot {
  opacity: 1;
}

.tw-chart-area {
  flex: 1;
  min-height: 0;
  position: relative;
}

/* Chart-empty overlay — vises når et symbol mangler candles eller er ukendt */
.tw-chart-empty {
  position: absolute;
  inset: 0;
  z-index: 5;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 20px;
  text-align: center;
  background: rgba(7, 17, 29, 0.85);
  backdrop-filter: blur(2px);
}

.tw-chart-empty-title {
  margin: 0;
  font-size: 1.05rem;
  color: var(--text);
}

.tw-chart-empty .muted {
  margin: 0;
  font-size: 0.85rem;
  max-width: 360px;
  line-height: 1.4;
}

.tw-lines {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 14px 8px;
  border-top: 1px solid var(--border);
  flex-wrap: wrap;
}

.tw-line-input {
  padding: 3px 8px;
  width: 90px;
  font-size: 0.78rem;
  color: var(--text);
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid var(--border);
  border-radius: 5px;
  outline: none;
  font-variant-numeric: tabular-nums;
}

.tw-line-input:focus {
  border-color: var(--border-strong);
}

.tw-line-add {
  padding: 3px 10px;
  font-size: 0.78rem;
  color: var(--text);
  background: var(--accent-soft);
  border: 1px solid var(--border-strong);
  border-radius: 5px;
  cursor: pointer;
}

.tw-line-add:hover {
  background: rgba(79, 156, 255, 0.28);
}

.tw-line-list {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-left: 4px;
}

.tw-line-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 4px 2px 8px;
  font-size: 0.75rem;
  color: var(--yellow);
  background: rgba(250, 204, 21, 0.1);
  border: 1px solid rgba(250, 204, 21, 0.35);
  border-radius: 4px;
  font-variant-numeric: tabular-nums;
}

.tw-line-rm {
  padding: 0 4px;
  color: var(--text-muted);
  background: transparent;
  border: none;
  cursor: pointer;
  font-size: 0.9rem;
  line-height: 1;
}

.tw-line-rm:hover {
  color: var(--red);
}

.tw-pos,
.tw-trades {
  padding: 0 12px 12px;
}

.tw-mini {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.82rem;
}

.tw-mini td {
  padding: 4px 0;
  border-bottom: 1px solid var(--border);
}

.tw-mini tr:last-child td {
  border-bottom: none;
}

.tw-mini .lbl {
  color: var(--text-muted);
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.tw-mini .num {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.tw-mini-tbl {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.78rem;
}

.tw-mini-tbl th {
  padding: 4px 6px;
  text-align: left;
  font-size: 0.68rem;
  text-transform: uppercase;
  color: var(--text-muted);
  letter-spacing: 0.04em;
  border-bottom: 1px solid var(--border);
  background: rgba(148, 163, 184, 0.16);
}

.tw-mini-tbl td {
  padding: 4px 6px;
  border-bottom: 1px solid var(--border);
}

.tw-mini-tbl .num {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

/* WATCHBOARD — multi-symbol grid med linje-grafer */

.wb {
  display: flex;
  flex-direction: column;
  gap: 10px;
  height: calc(100vh - 140px);
  min-height: 520px;
}

.wb-filter {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 5px 10px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.025), transparent),
    var(--bg-panel);
  border: 1px solid var(--border);
  border-radius: var(--radius);
}

.wb-filter-btn {
  padding: 3px 9px;
  font-size: 0.75rem;
  color: var(--text-muted);
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid var(--border);
  border-radius: 5px;
  cursor: pointer;
  transition: color 120ms, background 120ms;
}

.wb-filter-btn:hover {
  color: var(--text);
  background: rgba(255, 255, 255, 0.06);
}

.wb-filter-btn.active {
  color: var(--text);
  background: var(--accent-soft);
  border-color: var(--border-strong);
}

.wb-controls,
.wb-presets {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.035), transparent),
    var(--bg-panel);
  border: 1px solid var(--border);
  border-radius: var(--radius);
}

.wb-preset-select {
  appearance: none;
  padding: 3px 22px 3px 10px;
  font-size: 0.8rem;
  color: var(--text);
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid var(--border);
  border-radius: 5px;
  cursor: pointer;
  background-image: linear-gradient(45deg, transparent 50%, var(--text-muted) 50%),
                    linear-gradient(135deg, var(--text-muted) 50%, transparent 50%);
  background-position: calc(100% - 11px) center, calc(100% - 7px) center;
  background-size: 4px 4px, 4px 4px;
  background-repeat: no-repeat;
}

.wb-preset-select:focus {
  outline: none;
  border-color: var(--border-strong);
}

/* LC! #46/48: option + optgroup i åbne dropdowns — native popup rendres
   ellers med browser-default light styling. Gælder både preset-vælger og
   per-cell timeframe-vælger på Watch-siden. */
.wb-preset-select option,
.wb-cell-tf option {
  background: var(--bg-panel);
  color: var(--text);
  padding: 4px 8px;
}
.wb-preset-select optgroup,
.wb-cell-tf optgroup {
  background: var(--bg);
  color: var(--text-muted);
  font-weight: 600;
  font-style: normal;
}

.wb-preset-btn {
  padding: 3px 9px;
  font-size: 0.75rem;
  color: var(--text-muted);
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid var(--border);
  border-radius: 5px;
  cursor: pointer;
}

.wb-preset-btn:hover {
  color: var(--text);
  background: rgba(255, 255, 255, 0.06);
}

.wb-cell-tf {
  appearance: none;
  padding: 1px 16px 1px 6px;
  font-size: 0.7rem;
  color: var(--text-muted);
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid var(--border);
  border-radius: 4px;
  cursor: pointer;
  background-image: linear-gradient(45deg, transparent 50%, var(--text-muted) 50%),
                    linear-gradient(135deg, var(--text-muted) 50%, transparent 50%);
  background-position: calc(100% - 8px) center, calc(100% - 5px) center;
  background-size: 3px 3px, 3px 3px;
  background-repeat: no-repeat;
}

.wb-cell-tf:focus {
  outline: none;
  border-color: var(--border-strong);
  color: var(--text);
}

.wb-size, .wb-tf {
  display: flex;
  gap: 3px;
}

.wb-sep {
  width: 1px;
  height: 18px;
  background: var(--border);
  margin: 0 4px;
}

.wb-size-btn, .wb-tf-btn {
  padding: 3px 9px;
  font-size: 0.75rem;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid var(--border);
  color: var(--text-muted);
  border-radius: 5px;
  cursor: pointer;
  transition: color 120ms, background 120ms;
}

.wb-size-btn:hover, .wb-tf-btn:hover {
  color: var(--text);
  background: rgba(255, 255, 255, 0.06);
}

.wb-size-btn.active, .wb-tf-btn.active {
  color: var(--text);
  background: var(--accent-soft);
  border-color: var(--border-strong);
}

.wb-grid {
  display: grid;
  gap: 8px;
  flex: 1;
  min-height: 0;
}

.wb-grid.cols-3 { grid-template-columns: repeat(3, 1fr); }
.wb-grid.cols-4 { grid-template-columns: repeat(4, 1fr); }
.wb-grid.cols-5 { grid-template-columns: repeat(5, 1fr); }

.wb-cell {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 0;
  min-width: 0;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.035), transparent),
    var(--bg-panel);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  cursor: pointer;
  transition: border-color 120ms;
}

.wb-cell:hover {
  border-color: var(--border-strong);
}

.wb-cell.empty {
  border-style: dashed;
  display: grid;
  place-items: center;
}

.wb-empty-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  color: var(--text-muted);
}

.wb-empty-inner .plus {
  font-size: 1.8rem;
  line-height: 1;
}

.wb-cell-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 7px 10px 2px;
}

.wb-cell-ticker {
  font-weight: 700;
  font-size: 0.9rem;
}

.wb-cell-price {
  font-weight: 700;
  font-size: 0.95rem;
  font-variant-numeric: tabular-nums;
}

.wb-cell-meta {
  display: flex;
  justify-content: space-between;
  padding: 0 10px 5px;
  font-size: 0.7rem;
}

.wb-cell-chg {
  font-variant-numeric: tabular-nums;
  font-weight: 600;
}

.wb-cell-chart {
  flex: 1;
  min-height: 0;
  min-width: 0;
  position: relative;
}

/* LC! #50/51: dato/tid-label ved crosshair-hover. Lightweight-charts canvas
   overlapper labelen → høj z-index. Placeret OPPE i grafen (ikke bunden)
   for at undgå at blive klippet af parent's overflow eller scale-margin. */
.wb-cell-time-label {
  position: absolute;
  top: 4px; left: 50%; transform: translateX(-50%);
  z-index: 10;
  font-size: 0.7rem; font-variant-numeric: tabular-nums;
  color: var(--text);
  background: rgba(15, 23, 42, 0.92);
  padding: 1px 6px; border-radius: 3px;
  border: 1px solid var(--border);
  pointer-events: none;
  opacity: 0;
  transition: opacity 80ms ease;
  white-space: nowrap;
}

.wb-cell-foot {
  display: flex;
  justify-content: space-between;
  padding: 3px 10px 6px;
  font-size: 0.65rem;
}

.wb-nodata {
  display: grid;
  place-items: center;
  height: 100%;
  color: var(--text-muted);
  font-size: 0.75rem;
}

/* Picker overlay */

.wb-picker {
  position: absolute;
  inset: 0;
  z-index: 10;
  background: var(--bg-panel-strong);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius);
  display: flex;
  flex-direction: column;
  padding: 6px;
  gap: 4px;
  cursor: default;
}

.wb-picker-search {
  padding: 4px 8px;
  font-size: 0.8rem;
  color: var(--text);
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid var(--border);
  border-radius: 5px;
  outline: none;
}

.wb-picker-search:focus {
  border-color: var(--border-strong);
}

.wb-picker-list {
  flex: 1;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 1px;
}

.wb-picker-opt {
  padding: 3px 8px;
  font-size: 0.8rem;
  border-radius: 4px;
  cursor: pointer;
  font-variant-numeric: tabular-nums;
}

.wb-picker-opt:hover {
  background: var(--accent-soft);
}

.wb-picker-opt.current {
  color: var(--accent);
}

.wb-picker-opt.used {
  color: var(--text-muted);
}

.wb-picker-opt.clear {
  color: var(--yellow);
  border-top: 1px solid var(--border);
  margin-top: 4px;
  padding-top: 6px;
  text-align: center;
}

/* USAGE — to-kolonne: EODHD (quota-baseret) venstre, Anthropic (pay-as-you-go)
   højre. Hver kolonne har samme indre stak; container styrer breddedeling. */
.us-two-col {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  max-width: 1200px;
  margin: 0 auto;
}
.us-col-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 4px;
}
.us-col-head h2 {
  margin: 0;
  font-size: 0.95rem;
  font-weight: 700;
}
.us-sub-pill {
  font-size: 0.7rem;
  color: var(--text-muted);
  background: var(--bg-soft);
  border: 1px solid var(--border);
  padding: 2px 8px;
  border-radius: 10px;
  font-weight: 600;
}

/* Anthropic-specifik: per-purpose breakdown + sparkline */
.us-purpose {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.035), transparent),
    var(--bg-panel);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 10px 14px;
}
.us-purpose-head {
  margin: 0 0 8px;
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-muted);
  font-weight: 600;
}
.us-purpose-list {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.us-purpose-row {
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 8px;
  align-items: baseline;
  padding: 4px 0;
  border-bottom: 1px dashed var(--border);
  font-size: 0.82rem;
}
.us-purpose-row:last-child { border-bottom: none; }
.us-purpose-name { font-weight: 600; }
.us-purpose-calls { font-size: 0.74rem; }
.us-purpose-cost { font-weight: 700; font-variant-numeric: tabular-nums; }

.us-spark {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.035), transparent),
    var(--bg-panel);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 10px 14px;
}
.us-spark-svg {
  display: block;
  width: 100%;
  height: 50px;
  margin: 4px 0;
}
.us-spark-meta {
  margin: 0;
  font-size: 0.72rem;
  text-align: right;
  font-variant-numeric: tabular-nums;
}

/* USAGE — EODHD API quota */

.us {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.us-col {
  max-width: none;
  margin: 0;
}

.us-headline {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.035), transparent),
    var(--bg-panel);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 24px 24px 16px;
  text-align: center;
}

.us-big {
  margin: 0;
  font-size: 2.6rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
}

.us-of {
  margin: 2px 0 14px;
  color: var(--text-muted);
  font-size: 0.85rem;
}

.us-of span {
  font-variant-numeric: tabular-nums;
  color: var(--text-soft);
}

.us-bar {
  height: 10px;
  background: rgba(255, 255, 255, 0.06);
  border-radius: 5px;
  overflow: hidden;
  margin-bottom: 6px;
}

.us-bar-fill {
  height: 100%;
  width: 0%;
  transition: width 400ms ease, background 200ms ease;
}

.us-bar-fill.lvl-ok { background: var(--green); }
.us-bar-fill.lvl-mid { background: var(--yellow); }
.us-bar-fill.lvl-high { background: var(--red); }

.us-pct {
  margin: 0;
  font-size: 0.78rem;
  color: var(--text-muted);
  font-variant-numeric: tabular-nums;
}

.us-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}

.us-stat {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.035), transparent),
    var(--bg-panel);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 12px 14px;
  text-align: center;
}

.us-stat-lbl {
  margin: 0 0 4px;
  font-size: 0.7rem;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.us-stat-val {
  margin: 0;
  font-size: 1.1rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.us-meta {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.035), transparent),
    var(--bg-panel);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 6px 14px;
  font-size: 0.82rem;
}

.us-meta-row {
  display: flex;
  justify-content: space-between;
  padding: 6px 0;
  border-bottom: 1px solid var(--border);
}

.us-meta-row:last-child { border-bottom: none; }

.us-meta-lbl { color: var(--text-muted); }

.us-meta-val { font-variant-numeric: tabular-nums; }

.us-status {
  text-align: right;
  font-size: 0.7rem;
  margin: 0;
}


/* QUICK FILTER — søge-input over store tabeller (Beholdninger, Symboler). */
.dash-filter {
  padding: 4px 10px;
  background: var(--bg-soft);
  border: 1px solid var(--border);
  color: var(--text);
  border-radius: 4px;
  font-size: 0.8rem;
  min-width: 200px;
}
.dash-filter:focus {
  outline: none;
  border-color: var(--border-strong);
}
.dash-filter::placeholder { color: var(--text-muted); }

/* DASHBOARD DENSITY — fast kompakt-skin. Bibeholdes som klasse-baseret variabel-
   setup så panels altid får samme padding/gap uanset hvor de bruges. */
.dash-density-compact {
  --dash-card-pad: 10px 14px;
  --dash-card-pad-y: 10px;
  --dash-card-pad-x: 14px;
  --dash-header-pad: 6px 10px;
  --dash-section-gap: 8px;
  --dash-tile-gap: 8px;
  --dash-kpi-font: 1.2rem;
  --dash-section-mb: 8px;
}
.dash-density-compact .kpi-card { padding: var(--dash-card-pad); }
.dash-density-compact .kpi-card h2 { font-size: var(--dash-kpi-font); }
.dash-density-compact .panel-header { padding: var(--dash-header-pad); }
.dash-density-compact .kpi-grid {
  gap: var(--dash-section-gap);
  margin-bottom: var(--dash-section-mb);
}
.dash-density-compact .content-grid { gap: var(--dash-section-gap); }
.dash-density-compact > section { margin-bottom: var(--dash-section-mb); }
.dash-density-compact > section[hidden] { margin-bottom: 0; }

/* Dashboard page-header — ALTID kompakt med h1 + p inline (én række) */
.dash-page-header {
  display: flex;
  align-items: baseline;
  gap: 12px;
  margin-bottom: 6px;
  padding: 0;
}
.dash-page-header h1 {
  font-size: 1.1rem;
  margin: 0;
  font-weight: 700;
}
.dash-page-header p {
  font-size: 0.74rem;
  margin: 0;
  color: var(--text-muted);
  flex: 1;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* Mindre top/bund-padding på Dashboard når kompakt. Width er nu altid 100%
   via .main-default, så ingen width-override nødvendig her. */
.main.dash-density-compact {
  padding: 6px 10px;
}

/* DASH-SHELL: left-shell (KPI + content) | right-panel (sundhedstilstand).
   Inden i left-shell ligger KPI-strip + earnings-banner + two-cols.
   I two-cols er der en kontekst-stak (kontant/donut/sektor/movers/earnings-liste)
   ved siden af Beholdninger-tabellen. Right-panel er én lodret stak ved 247px. */
.dash-shell {
  display: grid;
  grid-template-columns: 1fr 320px;
  gap: 8px;
  margin-bottom: var(--dash-section-mb, 8px);
  align-items: start;
}
.dash-density-compact .dash-shell { gap: 6px; }

.dash-left-shell {
  display: flex;
  flex-direction: column;
  gap: var(--dash-tile-gap, 8px);
  min-width: 0;
}

/* Dashboard top-row: KPI + earnings-warning til venstre (~80%), heatmap til
   højre (~20%) som høj sidekolonne. Heatmap'en stretches til at fylde
   højden af KPI-strippen + earnings-banneret. */
.dash-top-row {
  display: flex;
  gap: 8px;
  align-items: stretch;
}
.dash-top-left {
  flex: 0 0 72%;
  display: flex;
  flex-direction: column;
  gap: var(--dash-tile-gap, 8px);
  min-width: 0;
}
.dash-top-right {
  flex: 1;
  display: flex;
  min-width: 0;
}
.dash-top-right > .heatmap-section {
  flex: 1;
  min-height: 0;
}

.dash-kpi-row {
  margin-bottom: 0 !important;
  grid-template-columns: repeat(4, 1fr) 1.1fr;
}
.dash-earnings-banner { margin: 0 !important; }
.dash-earnings-banner[hidden] { display: none; }

.dash-two-cols {
  display: grid;
  grid-template-columns: 247px 1fr;
  gap: var(--dash-tile-gap, 8px);
  align-items: start;
}
.dash-density-compact .dash-two-cols { gap: 6px; }

.dash-inner-left, .dash-right-panel {
  display: flex;
  flex-direction: column;
  gap: var(--dash-tile-gap, 8px);
  min-width: 0;
}
.dash-inner-mid { min-width: 0; }
.dash-inner-mid .panel { overflow-x: auto; }
.dash-tile { margin-bottom: 0 !important; }
.dash-tile[hidden] { display: none; }

/* Position-kontekst (P2) — per-ticker enrichment liste */
.position-context-list {
  display: flex;
  flex-direction: column;
  padding: 4px 0;
}
.pc-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 10px;
  font-size: 0.72rem;
  border-bottom: 1px dashed rgba(148,163,184,0.10);
}
.pc-row:last-child { border-bottom: none; }
.pc-ticker {
  font-weight: 600;
  flex: 0 0 56px;
  cursor: pointer;
}
.pc-bits {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  flex: 1 1 auto;
}
.pc-earn, .pc-period, .pc-theme, .pc-fires {
  display: inline-block;
  padding: 1px 5px;
  border-radius: 3px;
  background: rgba(148,163,184,0.08);
  font-size: 0.66rem;
}
.pc-fires { background: rgba(248,113,113,0.12); color: #f87171; }

/* Analyst-momentum (P9.2) — dashboard widget */
.analyst-momentum-list {
  display: flex;
  flex-direction: column;
  padding: 4px 0;
}
.am-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 10px;
  font-size: 0.72rem;
  border-bottom: 1px dashed rgba(148,163,184,0.10);
}
.am-row:last-child { border-bottom: none; }
.am-ticker { font-weight: 600; flex: 0 0 70px; cursor: pointer; }
.am-bits { flex: 1 1 auto; }
.am-total { font-size: 0.66rem; }
.am-up { display: inline-block; padding: 1px 5px; border-radius: 3px;
  background: rgba(74,222,128,0.12); color: #4ade80; font-weight: 600; }
.am-down { display: inline-block; padding: 1px 5px; border-radius: 3px;
  background: rgba(248,113,113,0.12); color: #f87171; font-weight: 600; }
.am-init { display: inline-block; padding: 1px 5px; border-radius: 3px;
  background: rgba(96,165,250,0.12); color: var(--accent); font-weight: 600; }

/* Stamdata revisions-row (per-symbol) */
.tw-rev-row {
  display: flex; align-items: baseline; gap: 6px;
  font-size: 0.66rem; padding: 2px 0;
  border-bottom: 1px dashed rgba(148,163,184,0.08);
}
.tw-rev-row:last-child { border-bottom: none; }
.tw-rev-date { color: var(--muted); flex: 0 0 60px; }
.tw-rev-firm { flex: 1 1 auto; min-width: 0; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap; }
.tw-rev-action { flex: 0 0 auto; padding: 0 4px; border-radius: 2px; font-weight: 600; }
.tw-rev-up { background: rgba(74,222,128,0.16); color: #4ade80; }
.tw-rev-down { background: rgba(248,113,113,0.16); color: #f87171; }
.tw-rev-init { background: rgba(96,165,250,0.16); color: var(--accent); }
.tw-rev-maintain { background: rgba(148,163,184,0.10); color: var(--muted); }
.tw-rev-target { color: var(--muted); font-size: 0.62rem; }

/* Insider-activity (P9.1) — dashboard widget */
.insider-activity-list {
  display: flex;
  flex-direction: column;
  padding: 4px 0;
}
.ia-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 10px;
  font-size: 0.72rem;
  border-bottom: 1px dashed rgba(148,163,184,0.10);
}
.ia-row:last-child { border-bottom: none; }
.ia-ticker { font-weight: 600; flex: 0 0 70px; cursor: pointer; }
.ia-bits { display: flex; gap: 6px; flex: 0 0 auto; }
.ia-n { display: inline-block; padding: 1px 5px; border-radius: 3px;
  background: rgba(148,163,184,0.10); font-size: 0.66rem; }
.ia-value { display: inline-block; padding: 1px 5px; border-radius: 3px;
  background: rgba(96,165,250,0.12); color: var(--accent); font-size: 0.66rem; font-weight: 600; }
.ia-roles { flex: 1 1 auto; font-size: 0.62rem; text-align: right;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Stamdata insider-row (per-symbol) */
.tw-ins-row {
  display: flex; align-items: baseline; gap: 6px;
  font-size: 0.66rem; padding: 2px 0;
  border-bottom: 1px dashed rgba(148,163,184,0.08);
}
.tw-ins-row:last-child { border-bottom: none; }
.tw-ins-date { color: var(--muted); flex: 0 0 60px; }
.tw-ins-role { flex: 0 0 60px; font-weight: 600; }
.tw-ins-shares { flex: 1 1 auto; text-align: right; font-variant-numeric: tabular-nums; }
.tw-ins-val { flex: 0 0 auto; font-variant-numeric: tabular-nums; }

/* AI-cost-strip (P5) — kompakt 1-liner under KPI-rækken */
.dash-ai-strip {
  background: rgba(148,163,184,0.04);
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 6px 12px;
  font-size: 0.74rem;
}
.dash-ai-strip[hidden] { display: none; }
.dash-ai-strip-inner {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.dash-ai-icon { font-size: 0.9rem; }
.dash-ai-label { color: var(--muted); }
.dash-ai-today, .dash-ai-month { color: var(--text); }
.dash-ai-sep { color: var(--muted); margin: 0 2px; }
.dash-ai-purpose {
  display: inline-block;
  padding: 1px 6px;
  border-radius: 3px;
  background: rgba(148,163,184,0.08);
  color: var(--text);
  font-size: 0.68rem;
}
.dash-ai-link { margin-left: auto; text-decoration: none; }
.dash-ai-link:hover { color: var(--text); }

/* Beholdninger-tabel: single-row-per-position med 22 kolonner. Container
   scroller horisontalt hvis bredden er for stor; rækker har lav fast højde
   og strammere padding for at vise alle 22 kolonner i én ren linje. */
.dash-positions-scroll {
  overflow-x: auto;
  margin: 0 -10px;
  padding: 0 10px;
}
.data-table-tight {
  font-size: 0.78rem;
  white-space: nowrap;
  width: max-content;
  min-width: 100%;
}
.data-table-tight th,
.data-table-tight td {
  padding: 4px 5px !important;
  line-height: 1.25;
  vertical-align: middle;
}
.data-table-tight thead th {
  position: sticky;
  top: 0;
  background: var(--bg);
  z-index: 1;
  font-size: 0.7rem;
  white-space: nowrap;
}
.data-table-tight tbody tr { height: 36px; }
.data-table-tight tbody tr + tr td { border-top: 1px solid rgba(148,163,184,0.08); }
.data-table-tight .badge-status {
  padding: 2px 2px;
  font-size: 0.7rem;
  line-height: 1.3;
  white-space: nowrap;
}
.data-table-tight .sector-badge {
  padding: 2px 0;
  min-width: 0;
  margin-left: 2px;
  font-size: 0.7rem;
  line-height: 1.3;
  white-space: nowrap;
}
.data-table-tight .badge-stale,
.data-table-tight .badge-earnings,
.data-table-tight .badge-new-high,
.data-table-tight .rel-tag {
  padding: 1px 3px;
  font-size: 0.7rem;
  line-height: 1.3;
  white-space: nowrap;
}
.row-action {
  background: transparent;
  border: 1px solid var(--border);
  color: var(--accent);
  padding: 1px 6px;
  border-radius: 4px;
  cursor: pointer;
  font-size: 0.78rem;
  line-height: 1.3;
}
.row-action:hover { background: var(--accent-soft); border-color: var(--border-strong); }

/* Nøgletal-panel i right-panel — kompakt label/value-rytme */
.key-stats-list { padding: 6px 12px 10px; display: flex; flex-direction: column; gap: 4px; }
.key-stat-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  padding: 3px 0;
  border-bottom: 1px dashed var(--border);
  font-size: 0.78rem;
}
.key-stat-row:last-child { border-bottom: none; }
.key-stat-lbl { font-size: 0.74rem; }
.key-stat-val { font-weight: 600; }

/* Reducer sektions-paddings på de specifikke tiles så de pakker tæt */
.dash-tile .panel-header { padding: var(--dash-header-pad, 8px 12px); }
.dash-tile .panel-header h2 { font-size: 0.85rem; }

/* Power-tier sektioner skjules altid — kun KPI/shell/grid er synligt. */
.dash-mode-default [data-tier="power"] {
  display: none !important;
}

/* Embedded notes på /u/<u>/dashboard-positions */
.up-pos-notes-row td {
  padding: 0 !important;
  background: rgba(79,156,255,0.03);
  border-top: none !important;
}
.up-pos-notes {
  padding: 8px 14px 10px 36px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.up-pos-note-count {
  font-size: 0.74rem;
  margin-left: 4px;
}

/* TRADER-KLUB: Privacy, Friends, /u/<username>-side */

/* PRIVACY-grid på Profil */
.privacy-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(420px, 1fr));
  gap: 18px;
  padding: 10px;
}
.privacy-group {
  background: rgba(255,255,255,0.02);
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 10px 12px;
}
.privacy-group-head {
  margin: 0 0 8px;
  font-size: 0.78rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-muted);
}
.privacy-row {
  display: grid;
  grid-template-columns: 1fr 180px;
  align-items: center;
  gap: 10px;
  padding: 5px 0;
  border-top: 1px solid rgba(255,255,255,0.04);
}
.privacy-row:first-of-type { border-top: none; }
.privacy-lbl {
  font-size: 0.82rem;
  color: var(--text);
}
.privacy-select {
  padding: 4px 8px;
  background: var(--bg-soft);
  border: 1px solid var(--border);
  color: var(--text);
  border-radius: 4px;
  font-size: 0.8rem;
  cursor: pointer;
  transition: border-color 0.15s, background 0.15s;
}
.privacy-select:focus { outline: none; border-color: var(--border-strong); }
.privacy-select.just-saved {
  border-color: var(--green);
  background: rgba(69,229,140,0.10);
}

/* FRIENDS-tabs + liste */
.friends-tabs {
  display: flex;
  gap: 4px;
}
.friends-tab {
  padding: 4px 12px;
  background: transparent;
  border: 1px solid var(--border);
  color: var(--text-muted);
  border-radius: 4px;
  cursor: pointer;
  font-size: 0.78rem;
}
.friends-tab:hover { color: var(--text); }
.friends-tab.active {
  background: var(--accent-soft);
  border-color: var(--border-strong);
  color: var(--accent);
}
.friends-tab .muted { margin-left: 4px; font-variant-numeric: tabular-nums; }
.friends-list { padding: 4px 0; }
.friend-row {
  display: grid;
  grid-template-columns: 36px 1fr auto;
  gap: 12px;
  align-items: center;
  padding: 8px 14px;
  border-bottom: 1px solid rgba(255,255,255,0.04);
}
.friend-row:last-child { border-bottom: none; }
.friend-avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--accent-soft);
  color: var(--accent);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  text-decoration: none;
  font-size: 0.95rem;
}
.friend-avatar:hover { background: var(--accent); color: white; }
.friend-link {
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: var(--text);
}
.friend-name { font-weight: 600; font-size: 0.88rem; }
.friend-since { font-size: 0.72rem; }
.friend-unfollow {
  background: transparent;
  border: 1px solid var(--border);
  color: var(--text-muted);
  border-radius: 4px;
  width: 26px;
  height: 26px;
  cursor: pointer;
  font-size: 0.9rem;
}
.friend-unfollow:hover { color: var(--red); border-color: var(--red); }

/* /u/<username>-side */
.up-header {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 14px;
}
.up-back {
  text-decoration: none;
  font-size: 0.82rem;
  margin-right: 8px;
}
.up-back:hover { color: var(--accent); }
.up-sub {
  margin: 0;
  font-size: 0.85rem;
  font-weight: 400;
}
.up-avatar {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 1.15rem;
}
.up-actions { margin-left: auto; }
.up-self-link {
  font-size: 0.82rem;
  color: var(--accent);
  text-decoration: none;
}
.up-self-link:hover { text-decoration: underline; }
.up-follow-btn {
  padding: 6px 16px;
  background: var(--accent);
  color: white;
  border: none;
  border-radius: 6px;
  font-size: 0.85rem;
  font-weight: 600;
  cursor: pointer;
}
.up-follow-btn:hover { background: #6db0ff; }
.up-follow-btn.following {
  background: var(--accent-soft);
  color: var(--accent);
  border: 1px solid var(--border-strong);
}
.up-follow-btn:disabled { opacity: 0.6; cursor: wait; }

.up-stat-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
  margin-bottom: 14px;
}
.up-card { padding-bottom: 12px; }
.up-health-body {
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.up-health-score {
  font-size: 1.6rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}

.up-perf, .up-cash, .up-recon {
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.up-perf-val, .up-cash-val, .up-recon-val {
  font-size: 1.6rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.up-sector-list {
  display: flex;
  flex-direction: column;
  padding: 6px 0;
}
.up-sector-row {
  display: grid;
  grid-template-columns: 50px 1fr 2fr 50px;
  align-items: center;
  gap: 10px;
  padding: 5px 14px;
  font-size: 0.82rem;
}
.up-sector-bar {
  height: 6px;
  background: rgba(148,163,184,0.10);
  border-radius: 3px;
  overflow: hidden;
}
.up-sector-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--accent-soft), var(--accent));
}
.up-trades {
  display: flex;
  flex-direction: column;
  padding: 4px 0;
}
.up-trade-row {
  padding: 6px 14px;
  border-bottom: 1px solid rgba(255,255,255,0.04);
  display: grid;
  grid-template-columns: 80px 50px 80px 1fr;
  gap: 10px;
  align-items: baseline;
  font-size: 0.82rem;
}
.up-trade-row:last-child { border-bottom: none; }
.up-trade-journal {
  grid-column: 1 / -1;
  margin-top: 2px;
  padding-left: 80px;
  font-style: italic;
  font-size: 0.78rem;
}

/* COMPARE-MODE på Trading — 2 symboler side-om-side */
.tw-compare-bar {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 12px;
  border-top: 1px solid var(--border);
  background: var(--bg-soft);
  position: relative;
}
.tw-compare-toggle {
  padding: 4px 10px;
  background: transparent;
  border: 1px solid var(--border);
  color: var(--text-muted);
  border-radius: 4px;
  cursor: pointer;
  font-size: 0.78rem;
}
.tw-compare-toggle:hover { color: var(--accent); border-color: var(--accent); }
.tw-compare-search-wrap {
  position: relative;
  display: flex;
  gap: 6px;
}
.tw-compare-search {
  padding: 4px 8px;
  background: var(--bg-soft);
  border: 1px solid var(--border-strong);
  color: var(--text);
  border-radius: 4px;
  font-size: 0.82rem;
  width: 160px;
}
.tw-compare-search:focus { outline: none; }
.tw-compare-suggestions {
  position: absolute;
  top: 100%;
  left: 0;
  margin-top: 4px;
  background: var(--bg-elevated);
  border: 1px solid var(--border-strong);
  border-radius: 6px;
  padding: 4px 0;
  min-width: 220px;
  z-index: 30;
  box-shadow: var(--shadow-elevated);
}
.tw-compare-suggestion {
  display: block;
  width: 100%;
  text-align: left;
  padding: 5px 12px;
  background: transparent;
  border: none;
  font-size: 0.82rem;
  color: var(--text);
  cursor: pointer;
}
.tw-compare-suggestion:hover { background: var(--accent-soft); color: var(--accent); }
.tw-compare-close {
  background: transparent;
  border: 1px solid var(--border);
  color: var(--text-muted);
  border-radius: 4px;
  width: 24px;
  height: 22px;
  cursor: pointer;
  font-size: 0.85rem;
  margin-left: auto;
}
.tw-compare-close:hover { color: var(--red); border-color: var(--red); }
.tw-compare-chart {
  height: 180px;
  background: var(--bg-soft);
  border-top: 1px solid var(--border);
}

/* ACTIVITY LOG — kronologisk merge på Dashboard (power-tier) */
.activity-log-section { margin-bottom: 14px; }
.activity-log {
  padding: 4px 0 8px;
  max-height: 420px;
  overflow-y: auto;
}
.al-day { padding: 6px 0; }
.al-day-head {
  padding: 6px 14px;
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-muted);
  background: rgba(255,255,255,0.02);
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  position: sticky;
  top: 0;
  z-index: 1;
}
.al-row {
  display: grid;
  grid-template-columns: 24px 50px 1fr;
  align-items: baseline;
  gap: 10px;
  padding: 4px 14px;
  font-size: 0.82rem;
}
.al-row.sym-link { cursor: pointer; }
.al-row.sym-link:hover { background: rgba(79,156,255,0.05); }
.al-icon { font-weight: 700; text-align: center; }
.al-time { font-size: 0.74rem; font-variant-numeric: tabular-nums; }

/* NOTIFICATIONS — topbar-bell + dropdown-panel (defensiv) */
.notif-bell {
  position: relative;
  background: transparent;
  border: 1px solid var(--border);
  color: var(--text);
  border-radius: 6px;
  cursor: pointer;
  font-size: 1rem;
  padding: 4px 8px;
  margin-right: 8px;
}
.notif-bell:hover { background: var(--accent-soft); border-color: var(--border-strong); }
.notif-badge {
  position: absolute;
  top: -4px;
  right: -4px;
  background: var(--red);
  color: white;
  border-radius: 9px;
  padding: 1px 5px;
  font-size: 0.62rem;
  font-weight: 700;
  min-width: 16px;
  text-align: center;
  font-variant-numeric: tabular-nums;
}

.notif-panel {
  position: fixed;
  z-index: 200;
  width: 360px;
  max-height: 70vh;
  background: var(--bg-elevated);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius);
  box-shadow: var(--shadow-elevated);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.notif-panel-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 14px;
  background: var(--bg-panel-strong);
  border-bottom: 1px solid var(--border);
}
.notif-panel-head h3 {
  margin: 0;
  font-size: 0.92rem;
  font-weight: 700;
}
.notif-seen-all {
  background: transparent;
  border: 1px solid var(--border);
  color: var(--text-muted);
  border-radius: 4px;
  padding: 3px 9px;
  font-size: 0.72rem;
  cursor: pointer;
}
.notif-seen-all:hover { color: var(--accent); border-color: var(--accent); }
.notif-panel-list { overflow-y: auto; flex: 1; }
.notif-row {
  display: grid;
  grid-template-columns: 32px 1fr 10px;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  border-bottom: 1px solid rgba(255,255,255,0.04);
  cursor: pointer;
}
.notif-row:hover { background: rgba(79,156,255,0.05); }
.notif-row.unread { background: rgba(79,156,255,0.06); }
.notif-row.unread:hover { background: rgba(79,156,255,0.12); }
.notif-row:last-child { border-bottom: none; }
.notif-avatar {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 0.84rem;
}
.notif-body { min-width: 0; }
.notif-text {
  margin: 0;
  font-size: 0.82rem;
  line-height: 1.35;
}
.notif-ticker {
  color: var(--accent);
  font-weight: 700;
}
.notif-agent-icon {
  display: inline-block;
  margin-right: 2px;
  color: #f87171;
}
.notif-enrich {
  font-size: 0.7rem;
}
.notif-age {
  margin: 2px 0 0;
  font-size: 0.7rem;
}
.notif-dot {
  width: 8px;
  height: 8px;
  background: var(--accent);
  border-radius: 50%;
}

/* ACTIVITY-FEED — Dashboard-panel + dedikeret /stocks/feed-subpage */
.feed-toolbar {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
  padding: 8px 12px;
  background: var(--bg-soft);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  flex-wrap: wrap;
}
.feed-filters { display: flex; gap: 4px; }
.feed-filter {
  padding: 4px 10px;
  background: transparent;
  border: 1px solid var(--border);
  color: var(--text-muted);
  border-radius: 4px;
  cursor: pointer;
  font-size: 0.76rem;
}
.feed-filter:hover { color: var(--text); }
.feed-filter.active {
  background: var(--accent-soft);
  border-color: var(--border-strong);
  color: var(--accent);
}
.feed-list, .feed-list-compact {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.feed-list-compact { padding: 6px 0; }
.feed-event {
  display: grid;
  grid-template-columns: 40px 1fr;
  gap: 12px;
  padding: 10px 14px;
  background: var(--bg-panel);
  border: 1px solid var(--border);
  border-radius: 8px;
}
.feed-list-compact .feed-event {
  background: transparent;
  border: none;
  border-radius: 0;
  border-bottom: 1px solid rgba(255,255,255,0.04);
  padding: 8px 14px;
}
.feed-list-compact .feed-event:last-child { border-bottom: none; }
.feed-avatar {
  width: 40px;
  height: 40px;
  background: var(--accent-soft);
  color: var(--accent);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  text-decoration: none;
  font-size: 1rem;
}
.feed-avatar:hover { background: var(--accent); color: white; }
.feed-event-body { min-width: 0; }
.feed-event-head {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 4px;
  flex-wrap: wrap;
}
.feed-author {
  font-weight: 700;
  color: var(--text);
  text-decoration: none;
}
.feed-author:hover { color: var(--accent); }
.feed-username, .feed-age { font-size: 0.74rem; }
.feed-event-detail { font-size: 0.86rem; }
.feed-event-icon { display: inline-block; margin-right: 4px; opacity: 0.8; }
.feed-ticker {
  font-weight: 700;
  color: var(--accent);
  cursor: pointer;
}
.feed-load-more {
  padding: 8px 18px;
  background: var(--bg-soft);
  border: 1px solid var(--border);
  color: var(--text);
  border-radius: 6px;
  cursor: pointer;
  font-size: 0.82rem;
  display: block;
  margin: 14px auto;
}
.feed-load-more:hover { background: var(--accent-soft); color: var(--accent); }

/* REACTIONS-bar */
.rx-bar {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 6px;
  flex-wrap: wrap;
}
.rx-chip, .rx-pick {
  background: transparent;
  border: 1px solid var(--border);
  border-radius: 999px;
  cursor: pointer;
  padding: 2px 8px;
  font-size: 0.74rem;
  color: var(--text-muted);
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.rx-chip:hover, .rx-pick:hover {
  border-color: var(--accent);
  color: var(--text);
}
.rx-chip.rx-mine {
  background: var(--accent-soft);
  border-color: var(--accent);
  color: var(--accent);
}
.rx-emoji { font-size: 0.9rem; }
.rx-count { font-variant-numeric: tabular-nums; }
.rx-divider {
  width: 1px;
  height: 14px;
  background: var(--border);
  margin: 0 2px;
}
.rx-picker {
  display: inline-flex;
  gap: 2px;
}
.rx-pick {
  padding: 2px 5px;
  font-size: 0.85rem;
  opacity: 0.6;
}
.rx-pick:hover { opacity: 1; }

/* POSITION-NOTES — Trading-side "Tanker" + modal-editor */
.tw-note-add {
  background: var(--accent-soft);
  border: 1px solid var(--border-strong);
  color: var(--accent);
  border-radius: 4px;
  width: 24px;
  height: 22px;
  cursor: pointer;
  font-size: 0.9rem;
  margin-left: auto;
  font-weight: 700;
  line-height: 1;
}
.tw-note-add:hover { background: var(--accent); color: white; }
.tw-notes {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.note-card {
  background: rgba(255,255,255,0.03);
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 8px 10px;
}
.note-head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 4px;
}
.note-tier {
  font-size: 0.62rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  padding: 1px 6px;
  border-radius: 3px;
  border: 1px solid;
  background: rgba(255,255,255,0.02);
}
.note-age {
  font-size: 0.7rem;
  margin-left: auto;
}
.note-edit, .note-delete {
  background: transparent;
  border: none;
  color: var(--text-muted);
  cursor: pointer;
  font-size: 0.85rem;
  padding: 1px 4px;
}
.note-edit:hover { color: var(--accent); }
.note-delete:hover { color: var(--red); }
.note-text {
  margin: 0;
  font-size: 0.84rem;
  line-height: 1.4;
}

.note-modal {
  width: min(440px, 92vw);
  background: var(--bg-elevated);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius);
  box-shadow: var(--shadow-elevated);
  overflow: hidden;
}
.note-modal-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 18px;
  background: var(--bg-panel-strong);
  border-bottom: 1px solid var(--border);
}
.note-modal-head h3 {
  margin: 0;
  font-size: 1rem;
  font-weight: 700;
}
.note-modal-close {
  background: transparent;
  border: none;
  color: var(--text-muted);
  cursor: pointer;
  font-size: 1.2rem;
}
.note-modal-body {
  padding: 14px 18px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.note-modal-lbl {
  font-size: 0.72rem;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.note-modal-text {
  width: 100%;
  min-height: 100px;
  padding: 8px 10px;
  background: var(--bg-soft);
  border: 1px solid var(--border);
  color: var(--text);
  border-radius: 4px;
  font-family: inherit;
  font-size: 0.86rem;
  resize: vertical;
}
.note-modal-tier {
  padding: 6px 10px;
  background: var(--bg-soft);
  border: 1px solid var(--border);
  color: var(--text);
  border-radius: 4px;
  font-size: 0.84rem;
  cursor: pointer;
}
.note-modal-foot {
  padding: 10px 18px;
  background: var(--bg-soft);
  border-top: 1px solid var(--border);
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}
.note-modal-cancel, .note-modal-save {
  padding: 6px 14px;
  border-radius: 4px;
  cursor: pointer;
  font-size: 0.82rem;
  border: 1px solid var(--border);
  background: rgba(255,255,255,0.03);
  color: var(--text);
}
.note-modal-save {
  background: var(--accent);
  border-color: var(--accent);
  color: white;
  font-weight: 600;
}
.note-modal-save:hover { background: #6db0ff; }

/* COST-BASIS BUILD-UP — Trading sidebar tabel over handler */
.tw-buildup {
  font-size: 0.8rem;
}
.tw-buildup-tbl {
  width: 100%;
  border-collapse: collapse;
  font-variant-numeric: tabular-nums;
}
.tw-buildup-tbl th {
  font-size: 0.66rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-muted);
  font-weight: 600;
  text-align: left;
  padding: 3px 4px;
  border-bottom: 1px solid var(--border);
  background: rgba(255,255,255,0.02);
}
.tw-buildup-tbl th.num { text-align: right; }
.tw-buildup-tbl td {
  font-size: 0.76rem;
  padding: 3px 4px;
  border-bottom: 1px solid rgba(255,255,255,0.04);
}
.tw-buildup-tbl tr:last-child td { border-bottom: none; }
.tw-buildup-tbl td.num { text-align: right; }

/* EARNINGS TRACK-RECORD — badges + Trading-rude + popup-sektion */
.er-track-badge {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 1px 6px;
  border: 1px solid;
  border-radius: 8px;
  font-size: 0.7rem;
  font-weight: 600;
  background: rgba(255,255,255,0.04);
  cursor: help;
}
.track-pill {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 9px;
  border: 1px solid;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 700;
}
.track-block {
  margin-top: 10px;
  padding: 8px 10px;
  background: rgba(255,255,255,0.03);
  border: 1px solid var(--border);
  border-radius: 6px;
}
.track-block-head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 4px;
}
.track-block-head .lbl {
  font-size: 0.74rem;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.track-block-detail {
  font-size: 0.74rem;
  padding-top: 2px;
}
.sq-track-wrap {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--border);
}
.sq-track-lbl {
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: 4px;
}
.sq-track {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  font-size: 0.8rem;
}

/* RISK-BREAKDOWN — per-dimension panel på Trading sidebar */
.risk-block {
  margin-top: 10px;
  padding: 8px 10px;
  background: rgba(255,255,255,0.03);
  border: 1px solid var(--border);
  border-radius: 6px;
}
.risk-block-head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 6px;
}
.risk-block-head .lbl {
  font-size: 0.74rem;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.risk-block-n { font-size: 0.7rem; margin-left: auto; }
.risk-dim { padding: 4px 0; }
.risk-dim-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 2px;
}
.risk-dim-lbl {
  font-size: 0.78rem;
  font-weight: 500;
}
.risk-dim-score {
  font-size: 0.78rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.risk-dim-bar {
  height: 4px;
  background: rgba(148,163,184,0.10);
  border-radius: 2px;
  overflow: hidden;
}
.risk-dim-fill {
  height: 100%;
  border-radius: 2px;
}
.risk-dim-note {
  font-size: 0.7rem;
  margin-top: 2px;
  font-style: italic;
}

/* RISK-SCORE — badge i positions-tabel */
.risk-badge {
  display: inline-block;
  padding: 1px 7px;
  border-radius: 9px;
  font-size: 0.72rem;
  font-weight: 700;
  min-width: 28px;
  text-align: center;
  font-variant-numeric: tabular-nums;
  cursor: help;
  box-sizing: border-box;
}

/* EARNINGS-WARNING BANNER — på Dashboard mellem KPI'er og alerts */
.earnings-warning-section { margin-bottom: 14px; }
.ew-banner {
  padding: 10px 14px;
  background: linear-gradient(180deg, rgba(250,204,21,0.08), rgba(250,204,21,0.02));
  border: 1px solid rgba(250,204,21,0.35);
  border-radius: var(--radius);
}
.ew-header {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin-bottom: 4px;
}
.ew-title {
  font-weight: 700;
  font-size: 0.86rem;
  color: var(--yellow);
}
.ew-sub { font-size: 0.74rem; }
.ew-list {
  list-style: none;
  margin: 4px 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
}
.ew-row {
  display: grid;
  grid-template-columns: 28px 70px 90px 50px 1fr auto 28px;
  gap: 8px;
  align-items: center;
  padding: 5px 0;
  font-size: 0.82rem;
  border-top: 1px solid rgba(255,255,255,0.04);
}
.ew-row:first-child { border-top: none; }
.ew-emoji { font-size: 0.9rem; text-align: center; }
.ew-ticker {
  font-weight: 700;
  color: var(--accent);
  cursor: pointer;
}
.ew-when { font-variant-numeric: tabular-nums; }
.ew-pct, .ew-est { font-size: 0.74rem; }
.ew-row.ew-sev-high .ew-when { color: var(--red); font-weight: 600; }
.ew-row.ew-sev-med .ew-when { color: var(--yellow); }
.ew-row.ew-sev-low .ew-when { color: var(--accent); }
.ew-dismiss {
  background: transparent;
  border: 1px solid var(--border);
  color: var(--text-muted);
  border-radius: 4px;
  width: 24px;
  height: 22px;
  cursor: pointer;
  font-size: 0.85rem;
}
.ew-dismiss:hover { color: var(--text); border-color: var(--border-strong); }
.ew-dismiss:disabled { opacity: 0.4; cursor: wait; }

/* USER-COMPARE /stocks/compare — N-bruger side-om-side */
.cmp-toolbar {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  margin-bottom: 14px;
  background: var(--bg-soft);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  flex-wrap: wrap;
}
.cmp-chips {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.cmp-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 8px 3px 4px;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 700;
}
.cmp-chip-name { padding-left: 4px; }
.cmp-chip-rm {
  background: transparent;
  border: none;
  color: inherit;
  cursor: pointer;
  font-size: 0.9rem;
  opacity: 0.7;
}
.cmp-chip-rm:hover { opacity: 1; }
.cmp-add {
  padding: 4px 10px;
  background: var(--bg-soft);
  border: 1px solid var(--border);
  color: var(--text);
  border-radius: 4px;
  font-size: 0.82rem;
  min-width: 180px;
}
.cmp-add:focus { outline: none; border-color: var(--border-strong); }
.cmp-go {
  padding: 4px 14px;
  background: var(--accent);
  border: 1px solid var(--accent);
  color: white;
  border-radius: 4px;
  font-size: 0.82rem;
  font-weight: 600;
  cursor: pointer;
}
.cmp-go:hover { background: #6db0ff; }
.cmp-meta .cmp-suggest { color: var(--accent); text-decoration: none; }
.cmp-meta .cmp-suggest:hover { text-decoration: underline; }

.cmp-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 14px;
  margin-bottom: 14px;
}
.cmp-col {
  background: var(--bg-panel);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
}
.cmp-col-head {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  background: var(--bg-panel-strong);
  border-bottom: 1px solid var(--border);
}
.cmp-avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  text-decoration: none;
  font-size: 1rem;
}
.cmp-col-name { min-width: 0; flex: 1; }
.cmp-display {
  display: block;
  font-weight: 700;
  color: var(--text);
  text-decoration: none;
  font-size: 0.92rem;
}
.cmp-display:hover { color: var(--accent); }
.cmp-username { font-size: 0.7rem; }
.cmp-health {
  padding: 10px 14px;
  text-align: center;
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 6px;
}
.cmp-health-num {
  font-size: 2rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.cmp-health-sub { font-size: 0.75rem; }
.cmp-kpis {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1px;
  background: var(--border);
}
.cmp-kpi {
  padding: 8px 12px;
  background: var(--bg-panel);
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.cmp-kpi .muted { font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.04em; }
.cmp-kpi strong {
  font-size: 0.92rem;
  font-variant-numeric: tabular-nums;
  font-weight: 700;
}
.cmp-section { padding: 8px 14px; border-top: 1px solid var(--border); }
.cmp-section-lbl {
  font-size: 0.68rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: 6px;
}
.cmp-sector {
  display: grid;
  grid-template-columns: 50px 1fr 40px;
  align-items: center;
  gap: 8px;
  padding: 3px 0;
  font-size: 0.76rem;
}
.cmp-sector-bar {
  height: 5px;
  background: rgba(148,163,184,0.10);
  border-radius: 3px;
  overflow: hidden;
}
.cmp-sector-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--accent-soft), var(--accent));
}
.cmp-pos {
  display: grid;
  grid-template-columns: 60px 50px 40px 50px;
  align-items: center;
  gap: 6px;
  padding: 4px 0;
  font-size: 0.78rem;
  cursor: pointer;
  border-bottom: 1px solid rgba(255,255,255,0.04);
}
.cmp-pos:last-child { border-bottom: none; }
.cmp-pos:hover { background: rgba(79,156,255,0.05); }
.cmp-pos-ticker { font-weight: 700; color: var(--accent); }
.cmp-pos-sector { font-size: 0.7rem; }

/* COMPACT TILE OVERRIDES — alle Dashboard-tiles bør have minimal indre luft */
.dash-tile .movers-grid {
  grid-template-columns: 1fr; /* Et kort per tile-bredde — winners/losers stables vertikalt */
  gap: 6px;
  padding: 6px;
}

/* Health-score i smal right-panel — stack gauge ABOVE dimensioner */
/* Portfolio Health i right-panel: donut øverst centreret, 4 dimensioner
   (bar + tekst) stacker i kassens fulde bredde nedenunder. */
.dash-right-panel .health-content {
  grid-template-columns: 1fr;
  align-items: stretch;
  gap: 10px;
  padding: 0;
}
.dash-right-panel .health-gauge {
  display: flex;
  justify-content: center;
  padding: 4px 0 2px;
}
.health-panel .health-gauge svg { max-width: 85px; width: 100%; }
.dash-right-panel .health-dims { width: 100%; gap: 3px; }
.dash-right-panel .health-dim { padding: 2px 6px; }

/* Portfolio-trend i right-panel — tighter padding + lavere chart */
.dash-right-panel .portfolio-trend { padding: 6px 10px; }
.dash-right-panel .portfolio-trend-svg { height: 45px; }
.dash-right-panel .portfolio-trend-head { font-size: 0.74rem; gap: 6px; }
.dash-right-panel .portfolio-trend-period { font-size: 0.66rem; }

/* Feed-panel i right-panel — tighter event-rows */
.dash-right-panel .feed-event { padding: 6px 10px; gap: 8px; grid-template-columns: 28px 1fr; }
.dash-right-panel .feed-avatar { width: 28px; height: 28px; font-size: 0.78rem; }
.dash-right-panel .feed-event-head { gap: 5px; flex-wrap: wrap; }
.dash-right-panel .feed-event-detail { font-size: 0.78rem; }

/* Følger-rows i smal right-panel — drop nogen kolonner */
.dash-right-panel .interest-row {
  grid-template-columns: 22px 1fr 55px 50px;
  gap: 4px;
  padding: 4px 10px;
  font-size: 0.76rem;
}
.dash-right-panel .interest-row .interest-name { display: none; }

/* Dashboard-tile-skin: kompakt rytme på alle dashboard-panels */
.dash-density-compact .movers-row {
  padding: 3px 10px;
  font-size: 0.78rem;
  grid-template-columns: 60px 38px 1fr 50px;
  gap: 6px;
}
.dash-density-compact .movers-card-head { padding: 4px 10px; }
.dash-density-compact .interest-row {
  padding: 3px 10px;
  font-size: 0.78rem;
  grid-template-columns: 22px 60px 1fr 70px 70px;
  gap: 6px;
}
.dash-density-compact .cash-panel { padding: 0; }
.dash-density-compact .health-content { padding: 0; gap: 10px; }
.dash-density-compact .health-dim { padding: 2px 6px; }
.dash-density-compact .health-dim-advice { font-size: 0.66rem; }
.dash-density-compact .health-footer { padding: 5px 10px; font-size: 0.76rem; }
.dash-density-compact .portfolio-trend { padding: 6px 10px; }
.dash-density-compact .portfolio-trend-svg { height: 50px; }
.dash-density-compact .hm-grid { padding: 5px; gap: 3px; }
.dash-density-compact .hm-cell { height: 65px; padding: 4px 6px; }
.dash-density-compact .tl-row { padding: 3px 10px; font-size: 0.78rem; gap: 8px; }
.dash-density-compact .feed-list-compact .feed-event { padding: 5px 10px; }
.dash-density-compact .activity-log { max-height: 320px; }
.dash-density-compact .al-row { padding: 2px 10px; font-size: 0.78rem; }
.dash-density-compact .dash-toolbar { gap: 6px; }

/* DAGENS VINDERE/TABERE — two mini-cards på Dashboard */
.movers-section { margin-bottom: 14px; }
.movers-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 14px;
}
.movers-card { overflow: hidden; }
.movers-card-head {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  background: rgba(255,255,255,0.03);
  border-bottom: 1px solid var(--border);
}
.movers-icon {
  font-size: 0.95rem;
  font-weight: 700;
}
.movers-card-head h3 {
  margin: 0;
  font-size: 0.84rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-muted);
}
.movers-list {
  display: flex;
  flex-direction: column;
  padding: 4px 0;
}
.movers-row {
  display: grid;
  grid-template-columns: 70px 50px 1fr 60px;
  align-items: center;
  gap: 8px;
  padding: 6px 14px;
  cursor: pointer;
  border-bottom: 1px solid rgba(255,255,255,0.04);
  font-size: 0.84rem;
}
.movers-row:last-child { border-bottom: none; }
.movers-row:hover { background: rgba(79,156,255,0.05); }
.movers-ticker {
  font-weight: 700;
  color: var(--accent);
}
.movers-dkk { font-variant-numeric: tabular-nums; }
.movers-pct { font-size: 0.74rem; }

/* PORTFOLIO HEALTH SCORE — donut-gauge + per-dimension breakdown */
.health-score-section { margin-bottom: 14px; }
.panel.health-panel { padding: 6px 8px; overflow: hidden; }

/* Portfolio Health — venstre (title + donut) / højre (4 bars) split.
   Erstatter den gamle full-width panel-header for at spare højde. */
.health-split {
  display: flex;
  gap: 10px;
  align-items: center;
}
.health-left {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
}
/* .health-title er KUN brugt i Portfolio Health-panelet (renderHealthScore).
   Andre panel-captions bruger .panel-header h2 og er upåvirkede. */
.health-panel .health-title {
  margin: 0;
  font-size: 0.18rem;
  font-weight: 700;
  white-space: nowrap;
}
.health-split .health-dims { flex: 1; min-width: 0; }
.health-content {
  display: grid;
  grid-template-columns: 180px 1fr;
  gap: 14px;
  padding: 14px;
  align-items: center;
}
.health-gauge svg {
  width: 100%;
  height: auto;
  max-width: 180px;
}
.health-score-num {
  font-size: 32px;
  font-weight: 800;
  letter-spacing: -0.02em;
  font-family: inherit;
}
.health-score-sub {
  font-size: 11px;
  fill: var(--text-muted);
  font-family: inherit;
}
/* Parent definerer 4 kolonner — alle 4 rækker arver via subgrid så
   label/metric/bar/score-kolonnerne aligner vertikalt på tværs. */
.health-dims {
  display: grid;
  grid-template-columns: auto auto 1fr auto;
  gap: 3px 8px;
  align-items: center;
}
.health-dim {
  display: grid;
  grid-template-columns: subgrid;
  grid-column: 1 / -1;
  align-items: center;
  padding: 2px 6px;
  background: transparent;
  border: none;
  border-radius: 3px;
}
.health-dim-lbl {
  font-size: 0.78rem;
  font-weight: 600;
  white-space: nowrap;
}
.health-dim-metric {
  font-size: 0.7rem;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.health-dim-score {
  font-size: 0.84rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.health-dim-bar {
  height: 4px;
  background: rgba(148,163,184,0.10);
  border-radius: 2px;
  overflow: hidden;
  margin-bottom: 0;
  min-width: 0;
}
.health-dim-fill {
  height: 100%;
  border-radius: 3px;
  transition: width 0.4s;
}
.health-footer {
  padding: 8px 14px;
  background: var(--bg-soft);
  border-top: 1px solid var(--border);
  font-size: 0.8rem;
}

/* TRADING-STIL — stats-card på Handler */
.ts-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
  padding: 14px;
}
.ts-stat {
  padding: 8px 10px;
  background: rgba(255,255,255,0.02);
  border: 1px solid var(--border);
  border-radius: 6px;
}
.ts-stat-lbl {
  font-size: 0.7rem;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: 4px;
}
.ts-stat-val {
  font-size: 1.4rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
}
.ts-stat-sub {
  font-size: 0.72rem;
  margin-top: 3px;
}
.ts-per-ticker {
  border-top: 1px solid var(--border);
  padding: 8px 14px;
}
.ts-per-ticker summary {
  cursor: pointer;
  font-size: 0.82rem;
  color: var(--text-muted);
  padding: 4px 0;
}
.ts-per-ticker summary:hover { color: var(--text); }
.ts-per-ticker[open] summary { color: var(--text); margin-bottom: 8px; }
.ts-ticker-table { font-size: 0.82rem; }

/* MANUAL TRADE-ENTRY — modal-form på Handler + Trading-genvej */
.manual-trade-btn {
  padding: 4px 12px;
  background: var(--accent-soft);
  border: 1px solid var(--border-strong);
  color: var(--accent);
  border-radius: 4px;
  cursor: pointer;
  font-size: 0.8rem;
  margin-right: 8px;
}
.manual-trade-btn:hover { background: var(--accent); color: white; }
.tw-manual-trade {
  background: var(--accent-soft);
  border: 1px solid var(--border-strong);
  color: var(--accent);
  border-radius: 4px;
  width: 24px;
  height: 22px;
  margin-left: auto;
  cursor: pointer;
  font-weight: 700;
  font-size: 0.9rem;
  line-height: 1;
}
.tw-manual-trade:hover { background: var(--accent); color: white; }

.tw-ws-toggle-block {
  margin-top: 10px;
  padding: 8px;
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  border-radius: 6px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.tw-ws-toggle-btn {
  display: flex;
  align-items: center;
  gap: 8px;
  background: transparent;
  border: 1px solid var(--border-strong);
  color: var(--text);
  padding: 6px 10px;
  border-radius: 4px;
  font-size: 0.85rem;
  cursor: pointer;
  text-align: left;
}
.tw-ws-toggle-btn:not(:disabled):hover { background: var(--accent-soft); border-color: var(--accent); }
.tw-ws-toggle-btn:disabled { cursor: default; opacity: 0.85; }
.tw-ws-toggle-btn[data-state="auto"]   { border-color: #4ade80; color: #4ade80; }
.tw-ws-toggle-btn[data-state="manual"] { border-color: var(--accent); color: var(--accent); }
.tw-ws-toggle-btn[data-state="off"]    { color: var(--text-muted); }
.tw-ws-toggle-icon { font-size: 0.95rem; line-height: 1; }
.text-mini { font-size: 0.72rem; }

.manual-trade-modal {
  width: min(560px, 94vw);
  background: var(--bg-elevated);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius);
  box-shadow: var(--shadow-elevated);
  overflow: hidden;
  max-height: 92vh;
  display: flex;
  flex-direction: column;
}
.mt-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 18px;
  background: var(--bg-panel-strong);
  border-bottom: 1px solid var(--border);
}
.mt-head h3 { margin: 0; font-size: 1rem; font-weight: 700; }
.mt-close {
  background: transparent;
  border: none;
  color: var(--text-muted);
  cursor: pointer;
  font-size: 1.2rem;
}
.mt-body {
  padding: 14px 18px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  overflow-y: auto;
}
.mt-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.mt-row:has(.mt-narrow) {
  grid-template-columns: 1fr 1fr 70px;
}
.mt-lbl {
  display: flex;
  flex-direction: column;
  gap: 3px;
  font-size: 0.72rem;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.mt-lbl.mt-full { grid-column: 1 / -1; }
.mt-input {
  padding: 6px 10px;
  background: var(--bg-soft);
  border: 1px solid var(--border);
  color: var(--text);
  border-radius: 4px;
  font-size: 0.86rem;
  font-family: inherit;
  font-variant-numeric: tabular-nums;
}
.mt-input:focus {
  outline: none;
  border-color: var(--border-strong);
}
.mt-input.mt-narrow { text-align: center; text-transform: uppercase; }
.mt-suggestions {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 2px;
  background: var(--bg-panel-strong);
  border: 1px solid var(--border-strong);
  border-radius: 4px;
  padding: 2px 0;
}
.mt-suggestions[hidden] { display: none; }
.mt-sugg {
  text-align: left;
  background: transparent;
  border: none;
  padding: 4px 10px;
  color: var(--text);
  cursor: pointer;
  font-size: 0.82rem;
}
.mt-sugg:hover { background: var(--accent-soft); color: var(--accent); }
.mt-warning {
  margin: 0;
  color: var(--yellow);
  font-size: 0.78rem;
}
.mt-warning[hidden] { display: none; }
.mt-meta-hint {
  margin: 4px 0 0;
  padding: 4px 8px;
  background: var(--bg-soft);
  border-left: 2px solid var(--accent);
  border-radius: 0 3px 3px 0;
  font-size: 0.72rem;
}
.mt-meta-hint.mt-meta-warn {
  border-left-color: var(--yellow);
  color: var(--yellow);
  background: rgba(250,204,21,0.06);
}
.mt-meta-hint[hidden] { display: none; }
.mt-foot {
  padding: 10px 18px;
  background: var(--bg-soft);
  border-top: 1px solid var(--border);
  display: flex;
  align-items: center;
  gap: 8px;
}
.mt-cancel, .mt-submit {
  padding: 6px 14px;
  border-radius: 4px;
  cursor: pointer;
  font-size: 0.82rem;
  border: 1px solid var(--border);
  background: rgba(255,255,255,0.03);
  color: var(--text);
}
.mt-submit {
  background: var(--accent);
  border-color: var(--accent);
  color: white;
  font-weight: 600;
}
.mt-submit:hover:not(:disabled) { background: #6db0ff; }
.mt-submit:disabled { opacity: 0.5; cursor: wait; }
.mt-status {
  margin-left: auto;
  font-size: 0.78rem;
  font-variant-numeric: tabular-nums;
}

/* TRADE JOURNAL — inline-edit per trade-row på Handler. */
.trade-journal-btn {
  background: transparent;
  border: 1px solid transparent;
  color: var(--text-muted);
  cursor: pointer;
  font-size: 0.85rem;
  padding: 2px 6px;
  border-radius: 4px;
}
.trade-journal-btn:hover { color: var(--text); border-color: var(--border); }
.trade-journal-btn.has-content { color: var(--accent); }
.trade-journal-edit td { padding: 0 !important; background: rgba(79,156,255,0.04); }
.tj-block {
  padding: 10px 14px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.tj-lbl {
  font-size: 0.72rem;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.tj-text {
  width: 100%;
  min-height: 70px;
  padding: 8px 10px;
  background: var(--bg-soft);
  border: 1px solid var(--border);
  color: var(--text);
  font-size: 0.85rem;
  font-family: inherit;
  border-radius: 4px;
  resize: vertical;
}
.tj-text:focus {
  outline: none;
  border-color: var(--border-strong);
}
.tj-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}
.tj-actions button {
  padding: 4px 12px;
  background: rgba(255,255,255,0.03);
  border: 1px solid var(--border);
  color: var(--text);
  border-radius: 3px;
  font-size: 0.78rem;
  cursor: pointer;
}
.tj-save {
  background: var(--accent-soft) !important;
  border-color: var(--border-strong) !important;
  color: var(--accent) !important;
}
.tj-save:hover { background: var(--accent) !important; color: white !important; }
.tj-clear { color: var(--red) !important; }
.tj-status { font-size: 0.74rem; }

/* TRADE-SIMULATOR — B/S-tast åbner what-if-modal på Trading. */
.sim-modal {
  width: min(440px, 92vw);
  background: var(--bg-elevated);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius);
  box-shadow: var(--shadow-elevated);
  overflow: hidden;
}
.sim-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 18px;
  background: var(--bg-panel-strong);
  border-bottom: 1px solid var(--border);
}
.sim-head h3 {
  margin: 0;
  font-size: 1rem;
  font-weight: 700;
}
.sim-close {
  background: transparent;
  border: none;
  color: var(--text-muted);
  cursor: pointer;
  font-size: 1.2rem;
  line-height: 1;
}
.sim-close:hover { color: var(--text); }
.sim-body { padding: 14px 18px; }
.sim-inputs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-bottom: 12px;
}
.sim-inputs label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 0.72rem;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.sim-input {
  padding: 6px 8px;
  background: var(--bg-soft);
  border: 1px solid var(--border);
  color: var(--text);
  font-size: 0.95rem;
  font-variant-numeric: tabular-nums;
  border-radius: 4px;
}
.sim-input:focus {
  outline: none;
  border-color: var(--border-strong);
}
.sim-sizing {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  margin-bottom: 12px;
  background: rgba(255,255,255,0.02);
  border: 1px dashed var(--border);
  border-radius: 4px;
}
.sim-sizing-lbl {
  font-size: 0.72rem;
  flex: 1;
}
.sim-sizing-input {
  width: 70px;
  padding: 4px 8px;
  font-size: 0.86rem;
}
.sim-sizing-btn {
  padding: 4px 10px;
  background: var(--accent-soft);
  border: 1px solid var(--border-strong);
  color: var(--accent);
  border-radius: 3px;
  cursor: pointer;
  font-size: 0.74rem;
  font-weight: 600;
}
.sim-sizing-btn:hover { background: var(--accent); color: white; }

.sim-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.84rem;
}
.sim-table td {
  padding: 5px 0;
  border-bottom: 1px solid rgba(255,255,255,0.04);
}
.sim-table td:last-child { border-bottom: none; }
.sim-table .lbl {
  color: var(--text-muted);
  font-size: 0.76rem;
  width: 110px;
}
.sim-table .num {
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  text-align: right;
}
.sim-table .diff {
  font-size: 0.72rem;
  text-align: right;
  padding-left: 8px;
}

.sim-flags {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-bottom: 10px;
}
.sim-flag {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 5px 8px;
  border-radius: 4px;
  font-size: 0.78rem;
  border-left: 3px solid;
}
.sim-flag-icon { font-weight: 700; font-size: 0.85rem; }
.sim-flag-warn {
  background: rgba(250,204,21,0.08);
  color: var(--yellow);
  border-left-color: var(--yellow);
}
.sim-flag-info {
  background: rgba(79,156,255,0.08);
  color: var(--accent);
  border-left-color: var(--accent);
}
.sim-flag-error {
  background: rgba(255,93,93,0.10);
  color: var(--red);
  border-left-color: var(--red);
}
.sim-flag-ok {
  background: rgba(69,229,140,0.06);
  color: var(--green);
  border-left-color: var(--green);
}
.sim-foot {
  padding: 8px 18px;
  background: var(--bg-soft);
  border-top: 1px solid var(--border);
}

/* STOP-LOSS / TAKE-PROFIT — input-block + alert-toast. */
.sltp-block {
  margin-top: 10px;
  padding: 8px 10px;
  background: rgba(255,255,255,0.03);
  border: 1px solid var(--border);
  border-radius: 6px;
}
.sltp-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 5px;
}
.sltp-head .lbl {
  font-size: 0.74rem;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.sltp-permit {
  background: transparent;
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 1px 6px;
  font-size: 0.68rem;
  cursor: pointer;
  color: var(--text-muted);
}
.sltp-permit:hover { color: var(--yellow); border-color: var(--yellow); }
.sltp-inputs {
  display: grid;
  grid-template-columns: 1fr 1fr auto;
  gap: 6px;
  align-items: center;
}
.sltp-inputs label {
  font-size: 0.7rem;
  color: var(--text-muted);
  display: flex;
  align-items: center;
  gap: 4px;
}
.sltp-input {
  width: 100%;
  padding: 3px 6px;
  background: var(--bg-soft);
  border: 1px solid var(--border);
  color: var(--text);
  font-size: 0.78rem;
  font-variant-numeric: tabular-nums;
  border-radius: 3px;
}
.sltp-input:focus {
  outline: none;
  border-color: var(--border-strong);
}
.sltp-save {
  padding: 3px 10px;
  background: var(--accent-soft);
  border: 1px solid var(--border-strong);
  color: var(--accent);
  border-radius: 3px;
  cursor: pointer;
  font-size: 0.74rem;
  font-weight: 600;
}
.sltp-save:hover { background: var(--accent); color: white; }
.sltp-hint { margin-top: 4px; }

.sltp-toast {
  position: fixed;
  top: 20px;
  right: 20px;
  z-index: 200;
  padding: 12px 16px;
  background: var(--bg-elevated);
  border: 1px solid var(--border-strong);
  border-radius: 8px;
  box-shadow: var(--shadow-elevated);
  max-width: 320px;
  font-size: 0.85rem;
  animation: toast-slide-in 0.25s ease-out;
}
.sltp-toast.sltp-sl {
  border-left: 4px solid var(--red);
}
.sltp-toast.sltp-tp {
  border-left: 4px solid var(--green);
}
.sltp-toast strong {
  font-size: 0.92rem;
}
.sltp-toast a {
  display: inline-block;
  margin-top: 6px;
  color: var(--accent);
  text-decoration: none;
  font-weight: 600;
}
.sltp-toast a:hover { text-decoration: underline; }

/* INTEREST / WATCHLIST — stjerne-toggle + Følger-panel på Dashboard. */
.interest-star {
  background: transparent;
  border: none;
  color: var(--text-muted);
  cursor: pointer;
  font-size: 0.95rem;
  padding: 0 4px;
  margin-left: 4px;
  line-height: 1;
  vertical-align: middle;
}
.interest-star:hover { color: var(--yellow); }
.interest-star.is-on { color: var(--yellow); }

.interest-section { margin-bottom: 14px; }
.interest-list {
  display: flex;
  flex-direction: column;
  padding: 4px 0;
}
.interest-row {
  display: grid;
  grid-template-columns: 28px 80px 1fr 90px 80px;
  align-items: center;
  gap: 10px;
  padding: 6px 14px;
  cursor: pointer;
  border-bottom: 1px solid rgba(255,255,255,0.04);
  font-size: 0.84rem;
}
.interest-row:hover { background: rgba(79,156,255,0.06); }
.interest-row:last-child { border-bottom: none; }
.interest-ticker { font-weight: 700; color: var(--accent); }
.interest-name { font-size: 0.74rem; }

/* SYMBOL QUICK-POPUP — shift+klik på enhver ticker viser bundled info. */
.sq-modal {
  width: min(420px, 92vw);
  background: var(--bg-elevated);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius);
  box-shadow: var(--shadow-elevated);
  overflow: hidden;
}
.sq-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 14px 18px;
  background: var(--bg-panel-strong);
  border-bottom: 1px solid var(--border);
}
.sq-head h3 {
  margin: 0;
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--accent);
  letter-spacing: -0.01em;
}
.sq-close {
  background: transparent;
  border: none;
  color: var(--text-muted);
  cursor: pointer;
  font-size: 1.2rem;
  line-height: 1;
}
.sq-close:hover { color: var(--text); }
.sq-body { padding: 14px 18px; min-height: 100px; }
.sq-company {
  margin: 0 0 10px;
  font-size: 0.88rem;
  color: var(--text-soft);
}
.sq-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 4px;
}
.sq-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 5px 0;
  font-size: 0.84rem;
  border-bottom: 1px solid rgba(255,255,255,0.04);
}
.sq-row:last-child { border-bottom: none; }
/* Cross-listings ISIN-block (ISIN-match dual-listings) */
.sq-xl-block { margin-top: 10px; padding-top: 8px; border-top: 1px solid rgba(255,255,255,0.06); }
.sq-xl-lbl { font-size: 0.74rem; margin-bottom: 4px; }
.sq-xl-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.sq-xl-chip {
  display: inline-block; padding: 2px 8px;
  background: var(--accent-soft); color: var(--accent);
  border-radius: 4px; font-size: 0.74rem;
  text-decoration: none; font-weight: 500;
}
.sq-xl-chip:hover { background: var(--accent); color: var(--bg); }
.sq-lbl { color: var(--text-muted); font-size: 0.78rem; }
.sq-val {
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  text-align: right;
}
.sq-foot {
  padding: 10px 18px;
  background: var(--bg-soft);
  border-top: 1px solid var(--border);
  display: flex;
  justify-content: flex-end;
}
.sq-jump {
  padding: 5px 12px;
  background: var(--accent-soft);
  border: 1px solid var(--border-strong);
  color: var(--accent);
  border-radius: 4px;
  font-size: 0.82rem;
  font-weight: 600;
  cursor: pointer;
}
.sq-jump:hover { background: var(--accent); color: white; }

/* VIX-SPARKLINE — lille 7-dages trend i VIX-KPI'en. */
.vix-spark {
  display: block;
  width: 80px;
  height: 22px;
  margin-top: 4px;
}

/* EARNINGS RADAR — 3 buckets med urgency-farve (rød/gul/blå). */
.er-radar-section { margin-bottom: 14px; }
.er-radar-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 12px;
}
.er-radar-bucket {
  background: var(--bg-panel);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
}
.er-radar-head {
  display: flex;
  align-items: baseline;
  gap: 8px;
  padding: 8px 12px;
  background: rgba(255,255,255,0.03);
  border-bottom: 1px solid var(--border);
}
.er-radar-label {
  font-weight: 600;
  font-size: 0.84rem;
}
.er-radar-count {
  font-size: 0.72rem;
  color: var(--text-muted);
  font-variant-numeric: tabular-nums;
}
.er-radar-own {
  margin-left: auto;
  font-size: 0.7rem;
  color: var(--green);
  background: rgba(69,229,140,0.12);
  padding: 1px 8px;
  border-radius: 8px;
}
.er-radar-list {
  list-style: none;
  margin: 0;
  padding: 4px 0;
}
.er-radar-item {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 4px 12px;
  font-size: 0.8rem;
}
.er-radar-item.er-radar-own-item {
  background: rgba(69,229,140,0.06);
}
.er-radar-ticker {
  font-weight: 700;
  color: var(--accent);
  cursor: pointer;
}
.er-radar-own-item .er-radar-ticker { color: var(--green); }
.er-radar-when { font-size: 0.72rem; }

/* HEATMAP — Finviz-style treemap på Dashboard.
   Size = market_value_dkk, color = day_change_pct. */
.heatmap-section { margin-bottom: 14px; }

/* Heatmap som høj sidekolonne i top-row: bento-grid med auto-flow:dense
   der stretches til at fylde højden af KPI-strippen + earnings-banneret. */
.heatmap-aside { margin-bottom: 0; min-width: 0; }
.heatmap-aside .heatmap-panel { height: 100%; display: flex; flex-direction: column; padding: 0; }
.heatmap-aside .panel-header { padding: 4px 8px !important; min-height: 0; }
.heatmap-aside .panel-header h2 { font-size: 0.7rem !important; }
.heatmap-aside .panel-header .muted { font-size: 0.6rem; }
.heatmap-aside .hm-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  grid-auto-rows: 1fr;
  grid-auto-flow: dense;
  gap: 2px;
  padding: 2px 5px 4px;
  flex: 1;
  overflow: hidden;
}
.heatmap-aside .hm-cell {
  min-width: 0;
  height: auto;
  padding: 3px 5px;
  border-radius: 3px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  overflow: hidden;
}
.heatmap-aside .hm-ticker { font-size: 0.62rem; font-weight: 700; line-height: 1.1; }
.heatmap-aside .hm-pct { font-size: 0.58rem; line-height: 1.1; }
.hm-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  padding: 8px;
}
.hm-cell {
  flex-grow: 1;
  min-width: 80px;
  height: 78px;
  border-radius: 4px;
  padding: 6px 8px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  cursor: pointer;
  border: 1px solid rgba(255,255,255,0.04);
  transition: transform 0.08s, border-color 0.08s;
  font-variant-numeric: tabular-nums;
}
.hm-cell:hover {
  transform: translateY(-1px);
  border-color: var(--border-strong);
}
.hm-ticker {
  font-size: 0.82rem;
  font-weight: 800;
  color: var(--text);
}
.hm-pct {
  font-size: 0.75rem;
  font-weight: 700;
  color: var(--text);
}
.hm-share {
  font-size: 0.62rem;
  align-self: flex-end;
}

/* POSITION TIMELINE — hvor længe har jeg holdt + return. */
.timeline-section { margin-bottom: 14px; }
.tl-list {
  display: flex;
  flex-direction: column;
  padding: 4px 0;
}
.tl-row {
  display: grid;
  grid-template-columns: 70px 1fr 60px 80px;
  align-items: center;
  gap: 12px;
  padding: 5px 14px;
  cursor: pointer;
  border-bottom: 1px solid rgba(255,255,255,0.04);
  font-size: 0.84rem;
}
.tl-row:hover { background: rgba(79,156,255,0.06); }
.tl-row:last-child { border-bottom: none; }
.tl-ticker { font-weight: 700; color: var(--accent); }
.tl-bar {
  height: 6px;
  background: rgba(148,163,184,0.10);
  border-radius: 3px;
  overflow: hidden;
}
.tl-bar-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--accent-soft), var(--accent));
  border-radius: 3px;
}
.tl-days { font-size: 0.78rem; color: var(--text-muted); }
.tl-ret { text-align: right; }

/* EARNINGS CALENDAR — månedsgrid-view som alternativ til tabel. */
.er-view-sep {
  display: inline-block;
  width: 1px;
  height: 16px;
  background: var(--border);
  margin: 0 4px;
}
.er-view-btn {
  padding: 3px 8px;
  background: rgba(255,255,255,0.03);
  border: 1px solid var(--border);
  border-radius: 4px;
  color: var(--text-muted);
  cursor: pointer;
  font-size: 0.85rem;
}
.er-view-btn:hover { color: var(--text); }
.er-view-btn.active {
  background: var(--accent-soft);
  border-color: var(--border-strong);
  color: var(--accent);
}

.er-calendar {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 14px;
  padding: 12px;
}
.er-cal-month {
  background: rgba(255,255,255,0.02);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
}
.er-cal-month-head {
  padding: 6px 10px;
  background: rgba(255,255,255,0.03);
  border-bottom: 1px solid var(--border);
  font-size: 0.82rem;
  font-weight: 600;
  text-transform: capitalize;
}
.er-cal-weekdays {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  font-size: 0.62rem;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  padding: 4px 0;
  border-bottom: 1px solid var(--border);
}
.er-cal-weekdays span { text-align: center; }
.er-cal-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
}
.er-cal-cell {
  min-height: 48px;
  padding: 3px 4px;
  border-right: 1px solid rgba(255,255,255,0.04);
  border-bottom: 1px solid rgba(255,255,255,0.04);
  font-size: 0.66rem;
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.er-cal-cell.er-cal-empty { background: rgba(0,0,0,0.15); }
.er-cal-cell.er-cal-today { background: rgba(79,156,255,0.12); }
.er-cal-cell.er-cal-past { opacity: 0.5; }
.er-cal-cell.er-cal-has { background: rgba(250,204,21,0.06); }
.er-cal-cell.er-cal-today.er-cal-has { background: rgba(79,156,255,0.20); }
.er-cal-daynum {
  font-weight: 600;
  font-size: 0.68rem;
  color: var(--text-muted);
}
.er-cal-cell.er-cal-today .er-cal-daynum { color: var(--accent); }
.er-cal-ticker {
  font-size: 0.64rem;
  font-weight: 700;
  color: var(--accent);
  cursor: pointer;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.er-cal-ticker.er-cal-owned {
  color: var(--green);
}
.er-cal-more {
  font-size: 0.6rem;
  color: var(--text-muted);
}

/* PORTFOLIO TREND — SVG-sparkline på Dashboard af broker_total over tid. */
.portfolio-trend-section { margin-bottom: 14px; }
.portfolio-trend {
  padding: 10px 14px;
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid var(--border);
  border-radius: var(--radius);
}
.portfolio-trend-head {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin-bottom: 4px;
  font-size: 0.82rem;
  flex-wrap: wrap;
}
.portfolio-trend-title { font-weight: 600; }
.portfolio-trend-delta {
  font-variant-numeric: tabular-nums;
  font-weight: 700;
}
.portfolio-trend-delta.pos { color: var(--green); }
.portfolio-trend-delta.neg { color: var(--red); }
.portfolio-trend-period { font-size: 0.72rem; margin-left: auto; }
.portfolio-trend-svg {
  display: block;
  width: 100%;
  height: 60px;
  margin: 4px 0 6px;
}
.portfolio-trend-legend {
  display: flex;
  align-items: center;
  gap: 14px;
  font-size: 0.7rem;
}
.portfolio-trend-swatch {
  display: inline-block;
  width: 18px;
  height: 2px;
  margin-right: 6px;
  vertical-align: middle;
}
.portfolio-trend-swatch.broker { background: var(--green); }
.portfolio-trend-swatch.system { background: rgba(79,156,255,0.5); border-top: 1px dashed rgba(79,156,255,0.7); }

/* TRADE-HOVER-TOOLTIP — floating tip på Trading-chart over candles
   hvor jeg har handlet. */
.tw-trade-tip {
  position: absolute;
  z-index: 50;
  pointer-events: none;
  padding: 6px 10px;
  background: rgba(20, 24, 35, 0.95);
  border: 1px solid var(--border-strong);
  border-radius: 6px;
  font-size: 0.78rem;
  color: var(--text);
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.45);
  min-width: 180px;
  font-variant-numeric: tabular-nums;
}
.tw-trade-tip-row { padding: 2px 0; }
.tw-trade-tip-row .muted { margin-left: 8px; }
.tw-trade-tip-sub { font-size: 0.7rem; padding-top: 2px; }

/* ISSUES — Dashboard-pill + dedikeret /stocks/issues subpage */

.issues-pill-section { margin-bottom: 10px; }

.iss-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 12px;
  background: linear-gradient(180deg, rgba(79, 156, 255, 0.10), rgba(79, 156, 255, 0.04));
  border: 1px solid rgba(79, 156, 255, 0.35);
  border-radius: 999px;
  font-size: 0.82rem;
  text-decoration: none;
  color: var(--text);
  transition: background 0.12s, border-color 0.12s;
}
.iss-pill:hover { background: rgba(79, 156, 255, 0.18); border-color: var(--accent); }
.iss-pill-icon { font-size: 0.9rem; }
.iss-pill-fix { color: var(--red); font-weight: 700; }
.iss-pill-ano { color: var(--yellow); }
.iss-pill-sep { color: var(--text-muted); }
.iss-pill-arrow { color: var(--text-muted); margin-left: 2px; }

.issues-toolbar {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 8px 0 16px;
  flex-wrap: wrap;
}

.iss-section {
  margin-bottom: 18px;
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
}

.iss-section-header {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  background: rgba(255, 255, 255, 0.03);
  border-bottom: 1px solid var(--border);
}
.iss-section-header h2 {
  font-size: 0.95rem;
  margin: 0;
  font-weight: 600;
}
.iss-section-icon { font-size: 1rem; }
.iss-count { font-variant-numeric: tabular-nums; font-size: 0.78rem; }

.iss-list { padding: 0; }

.iss-row {
  padding: 10px 14px;
  border-top: 1px solid rgba(255, 255, 255, 0.04);
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.iss-row:first-child { border-top: none; }
.iss-row-resolved { opacity: 0.5; }
.iss-row-snoozed { opacity: 0.7; }

.iss-row-head {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  font-size: 0.82rem;
}

.iss-sev-badge {
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  padding: 1px 7px;
  border-radius: 3px;
  min-width: 44px;
  text-align: center;
}
.iss-sev-high .iss-sev-badge { color: var(--red); background: rgba(255, 93, 93, 0.18); }
.iss-sev-med  .iss-sev-badge { color: var(--yellow); background: rgba(250, 204, 21, 0.18); }
.iss-sev-low  .iss-sev-badge { color: var(--text-muted); background: rgba(148, 163, 184, 0.12); }

.iss-ticker {
  font-weight: 700;
  color: var(--accent);
  cursor: pointer;
}
.iss-label { color: var(--text); }
.iss-age   { font-size: 0.72rem; }

.iss-tag {
  font-size: 0.66rem;
  padding: 1px 6px;
  border-radius: 3px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.iss-tag-snoozed { background: rgba(148, 163, 184, 0.18); color: var(--text-muted); }
.iss-tag-resolved { background: rgba(69, 229, 140, 0.16); color: var(--green); }

.iss-detail {
  font-size: 0.76rem;
  padding-left: 54px;
}

.iss-actions {
  display: flex;
  gap: 6px;
  padding-left: 54px;
  flex-wrap: wrap;
}

.iss-btn {
  font-size: 0.72rem;
  padding: 3px 10px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid var(--border);
  border-radius: 4px;
  color: var(--text);
  cursor: pointer;
}
.iss-btn:hover { background: rgba(255, 255, 255, 0.08); border-color: var(--border-strong); }
.iss-btn-resolve { color: var(--green); }
.iss-btn-resolve:hover { background: rgba(69, 229, 140, 0.12); border-color: rgba(69, 229, 140, 0.5); }

.iss-snooze-wrap { position: relative; display: inline-block; }
.iss-snooze-menu {
  position: absolute;
  top: 100%;
  left: 0;
  margin-top: 4px;
  z-index: 10;
  background: var(--card-bg, #1a1f2e);
  border: 1px solid var(--border-strong);
  border-radius: 6px;
  padding: 4px 0;
  min-width: 140px;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.5);
}
.iss-snooze-menu button {
  display: block;
  width: 100%;
  text-align: left;
  padding: 5px 12px;
  background: transparent;
  border: none;
  font-size: 0.78rem;
  color: var(--text);
  cursor: pointer;
}
.iss-snooze-menu button:hover { background: rgba(79, 156, 255, 0.18); }
.iss-snooze-menu .iss-snooze-clear { color: var(--yellow); border-top: 1px solid var(--border); margin-top: 2px; padding-top: 6px; }

/* RESPONSIVE */

/* ─── Perioder-subpage ──────────────────────────────────────────────── */
.per-page-header h1 { font-size: 1.1rem; }
.per-page-header p { font-size: 0.78rem; margin: 2px 0 0; color: var(--muted); }

.per-status-bar {
  display: flex; justify-content: space-between; align-items: center;
  padding: 6px 10px; margin: 6px 0 8px;
  background: var(--panel); border: 1px solid var(--border); border-radius: 6px;
  font-size: 0.72rem;
}
.per-status-left, .per-status-right { display: flex; align-items: center; gap: 8px; }
.per-live-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: #4ade80; box-shadow: 0 0 6px rgba(74, 222, 128, 0.45);
}
.per-live-dot.is-stale { background: #f87171; box-shadow: 0 0 6px rgba(248, 113, 113, 0.45); }
.per-status-label { color: var(--muted); }
.per-status-val { font-variant-numeric: tabular-nums; }
.per-params { color: var(--muted); font-variant-numeric: tabular-nums; }
.per-stats { color: var(--muted); font-variant-numeric: tabular-nums; padding-left: 8px; border-left: 1px dashed var(--border); }

/* Shell: main + side */
.per-shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  gap: 8px;
}

/* Bento-grid 12-col i main */
.per-grid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 8px;
}
.per-span-4  { grid-column: span 4; }
.per-span-6  { grid-column: span 6; }
.per-span-12 { grid-column: span 12; }
.per-panel { padding: 0; overflow: hidden; min-width: 0; }
.per-panel .panel-header {
  padding: 4px 8px !important;
  border-bottom: 1px solid var(--border);
  margin-bottom: 0;
  min-height: 0;
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
}
.per-panel .panel-header h2 {
  font-size: 0.78rem;
  display: flex; align-items: center; gap: 6px;
}
.per-meta { font-size: 0.66rem; }

.per-dot {
  display: inline-block; width: 8px; height: 8px; border-radius: 50%;
}
.per-dot-raise  { background: #4ade80; }
.per-dot-fall   { background: #f87171; }
.per-dot-flat   { background: var(--yellow); }
.per-dot-jitter { background: var(--purple); }

.per-table-wrap {
  max-height: 320px;
  overflow-y: auto;
  padding: 0;
}
.per-table { width: 100%; font-size: 0.72rem; }
.per-table th {
  position: sticky; top: 0; z-index: 1;
  background: var(--panel);
  padding: 3px 6px;
  font-size: 0.66rem;
  font-weight: 600;
  color: var(--muted);
  border-bottom: 1px solid var(--border);
}
.per-table td {
  padding: 2px 6px;
  border-bottom: 1px dashed rgba(148, 163, 184, 0.10);
  font-variant-numeric: tabular-nums;
}
.per-table tr:last-child td { border-bottom: none; }
.per-table .good { color: #4ade80; }
.per-table .bad  { color: #f87171; }
.per-table .interest-star {
  background: none; border: none; padding: 0;
  cursor: pointer; color: var(--muted); font-size: 0.85rem;
}
.per-table .interest-star.is-on { color: var(--yellow); }

/* Right-side sparklines */
.per-side {
  display: grid;
  grid-template-rows: repeat(4, auto);
  gap: 8px;
  align-content: start;
}
.per-side-tile { padding: 0; overflow: hidden; }
.per-side-tile .panel-header {
  padding: 4px 8px !important;
  display: flex; align-items: center; justify-content: space-between; gap: 6px;
  border-bottom: 1px solid var(--border);
  margin-bottom: 0; min-height: 0;
}
.per-side-tile .panel-header h2 {
  font-size: 0.74rem; font-weight: 600;
}
.per-spark-meta { font-size: 0.62rem; color: var(--muted); font-variant-numeric: tabular-nums; }
.per-spark {
  display: block;
  width: 100%;
  height: 64px;
  padding: 0;
}
.per-legend {
  display: flex; align-items: center; gap: 6px;
  padding: 2px 8px 4px;
  font-size: 0.62rem;
}
.per-legend-chip {
  padding: 1px 6px;
  border-radius: 3px;
  font-weight: 600;
  letter-spacing: 0.04em;
  font-size: 0.6rem;
}

/* ─── Dead/Zombie-symbol badges + overlays ──────────────────────────── */
.dead-badge {
  display: inline-block;
  padding: 1px 5px;
  border-radius: 3px;
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  background: rgba(168, 85, 247, 0.18);
  color: var(--purple);
  border: 1px solid rgba(168, 85, 247, 0.35);
  vertical-align: middle;
  cursor: help;
}
.dead-badge.is-permanent {
  background: rgba(248, 113, 113, 0.18);
  color: #f87171;
  border-color: rgba(248, 113, 113, 0.45);
}

.sym-row-dead { opacity: 0.65; }
.sym-row-dead .price { color: var(--muted); }
.sym-row-dead .src { font-style: italic; }

.sym-dead-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-left: 12px;
  font-size: 0.78rem;
  cursor: pointer;
}
.sym-dead-toggle input { cursor: pointer; }

.sym-revive {
  background: rgba(74, 222, 128, 0.15);
  color: #4ade80;
  border: 1px solid rgba(74, 222, 128, 0.4);
  border-radius: 3px;
  font-size: 0.85rem;
  cursor: pointer;
  padding: 0 6px;
}
.sym-revive:hover { background: rgba(74, 222, 128, 0.28); }

/* Trading-side overlay-card for et zombie-symbol */
.dead-overlay {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  padding: 12px 14px;
  background: rgba(168, 85, 247, 0.08);
  border: 1px solid rgba(168, 85, 247, 0.35);
  border-radius: 6px;
}
.dead-overlay-icon {
  font-size: 1.4rem;
  color: var(--purple);
}
.dead-overlay-title {
  margin: 0;
  font-size: 0.92rem;
  color: var(--purple);
}
.dead-overlay-reason {
  margin: 0;
  font-size: 0.78rem;
  font-weight: 600;
}
.dead-overlay-meta {
  margin: 0;
  font-size: 0.7rem;
  line-height: 1.4;
}
.dead-overlay-help {
  margin: 4px 0 0;
  font-size: 0.7rem;
  line-height: 1.4;
}
.dead-overlay-revive {
  margin-top: 8px;
  padding: 6px 14px;
  background: rgba(74, 222, 128, 0.18);
  color: #4ade80;
  border: 1px solid rgba(74, 222, 128, 0.5);
  border-radius: 4px;
  font-weight: 600;
  cursor: pointer;
}
.dead-overlay-revive:hover { background: rgba(74, 222, 128, 0.3); }
.dead-overlay-revive:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
.dead-overlay-status {
  font-size: 0.7rem;
  margin-top: 4px;
}

/* ─── Themes-subpage ────────────────────────────────────────────────── */
.th-page-header h1 { font-size: 1.1rem; }
.th-page-header p { font-size: 0.78rem; margin: 2px 0 0; color: var(--muted); }

.th-stats-bar {
  display: grid;
  grid-template-columns: repeat(4, 1fr) auto;
  gap: 8px;
  padding: 8px 12px;
  margin: 6px 0 8px;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 6px;
  font-size: 0.78rem;
}
.th-stat { display: flex; flex-direction: column; min-width: 0; }
.th-stat-lbl { color: var(--muted); font-size: 0.66rem; }
.th-stat-val { font-variant-numeric: tabular-nums; font-weight: 600; }
.th-stat-right { display: flex; align-items: center; justify-content: flex-end; }

.th-momentum-toggle { display: inline-flex; align-items: center; gap: 6px; font-size: 0.72rem; }
.th-mom-btn {
  padding: 2px 8px;
  border: 1px solid var(--border);
  background: transparent;
  color: var(--text);
  font-family: inherit;
  border-radius: 3px;
  cursor: pointer;
  font-size: 0.72rem;
}
.th-mom-btn.is-active {
  background: rgba(74, 222, 128, 0.15);
  border-color: rgba(74, 222, 128, 0.5);
  color: #4ade80;
}

.th-filter-strip {
  display: flex; gap: 6px; align-items: center;
  margin-bottom: 8px;
}
.th-filter-btn {
  padding: 4px 10px;
  border: 1px solid var(--border);
  background: transparent;
  color: var(--text);
  font-family: inherit;
  border-radius: 3px;
  cursor: pointer;
  font-size: 0.72rem;
}
.th-filter-btn.is-active {
  background: rgba(74, 222, 128, 0.12);
  border-color: rgba(74, 222, 128, 0.4);
  color: #4ade80;
}
.th-search {
  margin-left: auto;
  padding: 4px 8px;
  border: 1px solid var(--border);
  background: var(--panel);
  border-radius: 3px;
  font-size: 0.72rem;
  min-width: 180px;
}

.th-shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  gap: 8px;
}

.th-main { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.th-main .panel, .th-main table { overflow-x: auto; max-width: 100%; }
.th-heatmap-panel, .th-list-panel { padding: 0; min-width: 0; overflow: hidden; }
.th-heatmap-panel .panel-header,
.th-list-panel .panel-header {
  padding: 4px 8px !important;
  border-bottom: 1px solid var(--border);
  margin-bottom: 0;
  min-height: 0;
  display: flex; align-items: center; justify-content: space-between;
}
.th-heatmap-panel .panel-header h2,
.th-list-panel .panel-header h2 { font-size: 0.78rem; }
.th-meta { font-size: 0.66rem; }

/* Heatmap — bento sektor-grupper */
.th-heatmap { padding: 8px; display: flex; flex-direction: column; gap: 10px; }
.th-sector-group {}
.th-sector-label {
  font-size: 0.7rem;
  font-weight: 600;
  color: var(--muted);
  margin: 0 0 4px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.th-sector-tiles {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
  gap: 6px;
}

.th-tile {
  display: flex; flex-direction: column;
  align-items: flex-start;
  padding: 8px 10px;
  border: 1px solid var(--border);
  border-radius: 5px;
  cursor: pointer;
  min-height: 78px;
  text-align: left;
  position: relative;
  transition: transform 80ms ease, box-shadow 80ms ease;
  color: var(--text);
  font-family: inherit;
}
.th-tile:hover { transform: translateY(-1px); box-shadow: 0 2px 8px rgba(0,0,0,0.18); }
.th-tile.is-selected { outline: 2px solid #4ade80; outline-offset: -1px; }
.th-tile-lg { min-height: 110px; grid-column: span 2; }
.th-tile-md { min-height: 92px; }
.th-tile-sm { min-height: 70px; }
.th-tile-abbrev {
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: var(--muted);
  font-variant-numeric: tabular-nums;
  padding: 1px 4px;
  background: rgba(0, 0, 0, 0.20);
  border-radius: 2px;
  margin-bottom: 2px;
}
.th-tile-score {
  font-size: 1.3rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}
.th-tile-lg .th-tile-score { font-size: 1.7rem; }
.th-tile-name {
  font-size: 0.82rem;
  font-weight: 700;
  margin-bottom: 2px;
  line-height: 1.18;
  word-break: break-word;
}
.th-tile-mom {
  font-size: 0.66rem;
  color: var(--muted);
  margin-top: auto;
  padding-top: 2px;
  font-variant-numeric: tabular-nums;
}
.th-tile-badge {
  position: absolute;
  top: 4px; right: 6px;
  font-size: 0.6rem;
  background: rgba(0,0,0,0.25);
  padding: 1px 5px;
  border-radius: 2px;
  color: var(--muted);
  font-weight: 600;
}

/* Ranked liste */
.th-list-wrap { max-height: 380px; overflow-y: auto; }
.th-list { width: 100%; font-size: 0.72rem; }
.th-list th {
  position: sticky; top: 0;
  background: var(--panel);
  padding: 3px 6px;
  font-size: 0.66rem;
  font-weight: 600;
  color: var(--muted);
  border-bottom: 1px solid var(--border);
  z-index: 1;
}
.th-list td {
  padding: 3px 6px;
  border-bottom: 1px dashed rgba(148,163,184,0.10);
  font-variant-numeric: tabular-nums;
  cursor: pointer;
}
.th-list tr:hover td { background: rgba(74, 222, 128, 0.05); }
.th-list tr.is-selected td { background: rgba(74, 222, 128, 0.10); }
.th-list .good { color: #4ade80; }
.th-list .bad { color: #f87171; }

.th-sector-chip {
  display: inline-block;
  padding: 1px 6px;
  background: rgba(148, 163, 184, 0.12);
  color: var(--muted);
  border-radius: 3px;
  font-size: 0.65rem;
  font-weight: 600;
}

.th-abbrev-chip {
  display: inline-block;
  padding: 1px 6px;
  background: rgba(74, 222, 128, 0.12);
  color: #4ade80;
  border-radius: 3px;
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  font-variant-numeric: tabular-nums;
}
.th-abbrev-chip-lg {
  font-size: 0.9rem;
  padding: 3px 10px;
}
.th-detail-title-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 4px;
}

/* Momentum-pile */
.th-arrow {
  display: inline-block;
  font-size: 0.78rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.th-arrow-up-strong, .th-arrow-up { color: #4ade80; }
.th-arrow-down-strong, .th-arrow-down { color: #f87171; }
.th-arrow-flat { color: var(--muted); }

/* Sparkline (mini) */
.th-sparkline { display: inline-block; vertical-align: middle; width: 80px; height: 24px; }

/* Detail-panel højre side */
.th-detail-panel {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 6px;
  overflow-y: auto;
  max-height: calc(100vh - 200px);
  min-height: 300px;
}
.th-detail-header { padding: 12px 14px 8px; position: relative; }
.th-detail-close {
  position: absolute; top: 6px; right: 8px;
  background: none; border: none;
  font-size: 1.2rem; color: var(--muted);
  cursor: pointer; padding: 2px 8px;
}
.th-detail-close:hover { color: #f87171; }
.th-detail-title { margin: 0; font-size: 1rem; }
.th-detail-sub { margin: 2px 0 8px; font-size: 0.72rem; }
.th-detail-score-row {
  display: flex; align-items: center; gap: 14px;
  margin-top: 4px;
}
.th-detail-score {
  font-size: 2.4rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}
.th-detail-mom-block {
  font-size: 0.74rem;
  display: flex; flex-direction: column; gap: 2px;
}
.th-detail-section {
  padding: 10px 14px;
  border-top: 1px solid var(--border);
}
.th-detail-section h3 {
  margin: 0 0 6px;
  font-size: 0.74rem;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.th-history-graph {
  display: block;
  width: 100%;
  height: 100px;
}
.th-history-meta {
  font-size: 0.62rem;
  margin-top: 2px;
  text-align: right;
}
.th-members-table { width: 100%; font-size: 0.7rem; }
.th-members-table th {
  padding: 3px 6px;
  font-size: 0.62rem;
  color: var(--muted);
  border-bottom: 1px solid var(--border);
}
.th-members-table td {
  padding: 3px 6px;
  border-bottom: 1px dashed rgba(148,163,184,0.10);
  font-variant-numeric: tabular-nums;
}
.th-members-table .good { color: #4ade80; }
.th-members-table .bad { color: #f87171; }

/* Breadcrumb + sector-grid (top-level drilldown) */
.th-breadcrumb-row {
  padding: 6px 10px;
  margin-bottom: 6px;
  font-size: 0.78rem;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 4px;
}
.th-breadcrumb-row a { color: #4ade80; text-decoration: none; }
.th-breadcrumb-row a:hover { text-decoration: underline; }

.th-sector-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 8px;
  padding: 8px;
}
.th-sector-tile {
  display: flex; flex-direction: column;
  align-items: flex-start;
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-radius: 6px;
  cursor: pointer;
  min-height: 140px;
  text-align: left;
  position: relative;
  transition: transform 80ms ease, box-shadow 80ms ease;
  color: var(--text);
  font-family: inherit;
}
.th-sector-tile:hover { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0,0,0,0.22); }
.th-sector-tile-score {
  font-size: 2.2rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  line-height: 1;
  margin: 4px 0 2px;
}
.th-sector-tile-name {
  font-size: 0.92rem;
  font-weight: 700;
  line-height: 1.15;
  margin-bottom: 4px;
}
.th-sector-tile-mom {
  font-size: 0.78rem;
  color: var(--muted);
  font-variant-numeric: tabular-nums;
}
.th-sector-tile-foot {
  margin-top: auto;
  padding-top: 6px;
  font-size: 0.66rem;
  color: var(--muted);
}

.th-theme-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
  gap: 6px;
  padding: 8px;
}

/* Subtheme-chips i detail-panel */
.th-subtheme-list {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}
.th-subtheme-chip {
  display: inline-block;
  padding: 3px 8px;
  background: rgba(168, 85, 247, 0.14);
  color: #c4b5fd;
  border: 1px solid rgba(168, 85, 247, 0.32);
  border-radius: 3px;
  font-size: 0.66rem;
  font-weight: 600;
  cursor: help;
}

.th-tile-empty { opacity: 0.55; }
.th-tile-empty .th-sector-tile-score { color: var(--muted); }

/* Importér-knap + paste-modal */
.th-import-btn {
  padding: 4px 10px;
  background: rgba(74, 222, 128, 0.12);
  color: #4ade80;
  border: 1px solid rgba(74, 222, 128, 0.4);
  border-radius: 3px;
  font-size: 0.72rem;
  cursor: pointer;
  font-family: inherit;
  margin-right: 12px;
}
.th-import-btn:hover { background: rgba(74, 222, 128, 0.22); }

.th-import-modal {
  min-width: 540px;
  max-width: 700px;
}
.th-import-title { margin: 0 0 8px; font-size: 1rem; }
.th-import-help {
  font-size: 0.72rem;
  line-height: 1.5;
  background: rgba(148, 163, 184, 0.08);
  padding: 8px 10px;
  border-radius: 4px;
  border: 1px solid var(--border);
  font-family: ui-monospace, monospace;
  margin-bottom: 10px;
}
.th-import-input {
  width: 100%;
  min-height: 180px;
  font-family: ui-monospace, monospace;
  font-size: 0.78rem;
  background: var(--panel);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 8px 10px;
  resize: vertical;
  box-sizing: border-box;
}
.th-import-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 8px;
  font-size: 0.72rem;
}
.th-import-replace {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--text-soft);
  cursor: pointer;
}
.th-import-stats {
  font-variant-numeric: tabular-nums;
  color: var(--muted);
}
.th-import-result {
  margin-top: 10px;
  padding: 10px;
  background: rgba(74, 222, 128, 0.06);
  border: 1px solid var(--border);
  border-radius: 4px;
  font-size: 0.78rem;
  line-height: 1.5;
}

/* ─── Agent-editor (node-based pipeline) ───────────────────────────── */
.ag-page-header h1 { font-size: 1.1rem; }
.ag-page-header p { font-size: 0.78rem; margin: 2px 0 0; color: var(--muted); }

.ag-topbar {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 12px;
  margin-bottom: 8px;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 6px;
}
.ag-name-input {
  flex: 0 0 250px;
  padding: 5px 10px;
  font-size: 0.85rem;
  font-weight: 600;
  background: var(--bg-panel);
  border: 1px solid var(--border);
  border-radius: 4px;
  color: var(--text);
  font-family: inherit;
  outline: none;
}
.ag-name-input:focus { border-color: #4ade80; }
.ag-meta { font-size: 0.72rem; font-variant-numeric: tabular-nums; }
.ag-toolbar { margin-left: auto; display: flex; gap: 6px; }
.ag-btn {
  padding: 5px 12px;
  background: transparent;
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 4px;
  font-family: inherit;
  font-size: 0.78rem;
  cursor: pointer;
}
.ag-btn:hover { background: rgba(255,255,255,0.04); }
.ag-btn-primary {
  background: rgba(74, 222, 128, 0.18);
  color: #4ade80;
  border-color: rgba(74, 222, 128, 0.5);
  font-weight: 600;
}
.ag-btn-primary:hover { background: rgba(74, 222, 128, 0.30); }
.ag-btn-danger {
  background: rgba(248, 113, 113, 0.10);
  color: #f87171;
  border-color: rgba(248, 113, 113, 0.30);
}
.ag-btn-danger:hover { background: rgba(248, 113, 113, 0.22); }
.ag-btn-small { padding: 3px 8px; font-size: 0.72rem; }

.ag-shell {
  display: grid;
  grid-template-columns: 220px 1fr 280px;
  gap: 8px;
  height: calc(100vh - 220px);
  min-height: 480px;
}

.ag-palette, .ag-detail {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 6px;
  overflow-y: auto;
  padding: 8px;
}
.ag-palette-title {
  margin: 0 0 8px;
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--muted);
}
.ag-palette-cat { margin-bottom: 10px; }
.ag-palette-cat-head {
  font-size: 0.74rem;
  font-weight: 700;
  margin-bottom: 4px;
}
.ag-palette-cat-icon { display: inline-block; width: 14px; }
.ag-palette-cat-items { display: flex; flex-direction: column; gap: 4px; }
.ag-palette-item {
  display: flex; align-items: center; gap: 6px;
  padding: 6px 8px;
  background: rgba(255,255,255,0.03);
  border: 1px solid;
  border-radius: 4px;
  font-family: inherit;
  font-size: 0.78rem;
  color: var(--text);
  cursor: grab;
  text-align: left;
}
.ag-palette-item:hover { background: rgba(255,255,255,0.06); }
.ag-palette-item:active { cursor: grabbing; }
.ag-palette-item-sym {
  font-weight: 700;
  font-size: 1rem;
  width: 16px;
  text-align: center;
}
.ag-help {
  margin-top: 12px;
  padding: 8px;
  background: rgba(148,163,184,0.06);
  border-radius: 4px;
  font-size: 0.66rem;
  line-height: 1.5;
}

/* Sample-knapper i palette-sidebar */
.ag-samples {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid var(--border);
}
.ag-samples-title {
  font-size: 0.74rem;
  font-weight: 600;
  margin: 0 0 6px 0;
  color: var(--text);
}
.ag-samples-body {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.ag-sample-btn {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 8px;
  background: var(--bg-panel);
  border: 1px solid var(--border);
  border-left: 2px solid #4ade80;
  border-radius: 4px;
  color: var(--text);
  font-family: inherit;
  cursor: pointer;
  text-align: left;
  transition: background 80ms ease;
}
.ag-sample-btn:hover { background: rgba(74,222,128,0.08); }
.ag-sample-icon { font-size: 1rem; flex: 0 0 auto; }
.ag-sample-meta { display: flex; flex-direction: column; gap: 1px; min-width: 0; flex: 1 1 auto; }
.ag-sample-name { font-size: 0.74rem; font-weight: 500; }
.ag-sample-desc { font-size: 0.62rem; line-height: 1.2; }
.ag-samples-hint {
  font-size: 0.62rem;
  margin: 6px 0 0 0;
  line-height: 1.3;
}

/* Sidebar-tips-widget (P6 follow-up) */
.ag-tips {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid var(--border);
}
.ag-tips-title {
  font-size: 0.74rem;
  font-weight: 600;
  margin: 0 0 6px 0;
  color: var(--text);
}
.ag-tips-body {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.ag-tip {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  padding: 6px 8px;
  background: rgba(74,222,128,0.06);
  border-left: 2px solid #4ade80;
  border-radius: 3px;
  font-size: 0.68rem;
  line-height: 1.35;
}
.ag-tip-icon { flex: 0 0 auto; font-size: 0.86rem; }
.ag-tip-text { flex: 1 1 auto; color: var(--text); }

/* Trade-screendump modal (trade → original broker-PNG) */
.tw-screendump-modal {
  max-width: min(1100px, 92vw);
  max-height: 88vh;
  padding: 18px 22px;
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.tw-screendump-close {
  position: absolute;
  top: 8px; right: 12px;
  background: transparent;
  border: none;
  font-size: 1.4rem;
  color: var(--muted);
  cursor: pointer;
}
.tw-screendump-close:hover { color: var(--text); }
.tw-screendump-title { margin: 0; font-size: 0.95rem; font-weight: 600; }
.tw-screendump-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 260px;
  gap: 16px;
  overflow: hidden;
}.tw-screendump-img-wrap {
  display: flex; align-items: center; justify-content: center;
  background: rgba(0,0,0,0.3);
  border-radius: 4px;
  max-height: 70vh;
  overflow: auto;
}
.tw-screendump-img { max-width: 100%; max-height: 70vh; object-fit: contain; }
.tw-screendump-meta-table { width: 100%; font-size: 0.74rem; }
.tw-screendump-meta-table td { padding: 3px 6px; border-bottom: 1px dashed rgba(148,163,184,0.10); }
.tw-screendump-meta-table td:first-child { font-size: 0.66rem; text-transform: uppercase; letter-spacing: 0.04em; }
.tw-screendump-meta-table td.num { text-align: right; font-variant-numeric: tabular-nums; }

/* Cancelled / NULL-status trade-row visual marker (vises kun når toggle on) */
.tw-trade-non-completed {
  opacity: 0.55;
  font-style: italic;
}
/* Pools-side */
.pl-toolbar { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }

/* 2-col shell: tabel venstre + sim-trades-panel højre (LC! #94) */
.pl-shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 12px;
  align-items: start;
}
.pl-shell > #pl-list { min-width: 0; overflow-x: auto; }

.pl-sim-side {
  position: sticky;
  top: 12px;
  max-height: calc(100vh - 24px);
  display: flex;
  flex-direction: column;
  background: var(--bg-panel);
  border: 1px solid var(--border);
  border-radius: 6px;
  overflow: hidden;
}
.pl-sim-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 12px;
  border-bottom: 1px solid var(--border);
  background: var(--bg-panel-strong);
}
.pl-sim-header h3 {
  margin: 0;
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--text);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.pl-sim-header-actions {
  display: flex;
  align-items: center;
  gap: 6px;
}
.pl-sim-reset {
  background: transparent;
  border: 1px solid rgba(255, 93, 93, 0.4);
  color: var(--red);
  font-size: 0.7rem;
  padding: 2px 8px;
  border-radius: 3px;
  cursor: pointer;
  font-weight: 600;
}
.pl-sim-reset:hover {
  background: rgba(255, 93, 93, 0.12);
  border-color: var(--red);
}
.pl-sim-stop {
  background: rgba(255, 93, 93, 0.12);
  border: 1px solid rgba(255, 93, 93, 0.6);
  color: var(--red);
  font-size: 0.7rem;
  padding: 2px 8px;
  border-radius: 3px;
  cursor: pointer;
  font-weight: 700;
}
.pl-sim-stop:hover:not(:disabled) {
  background: rgba(255, 93, 93, 0.25);
  border-color: var(--red);
}
.pl-sim-stop:disabled {
  opacity: 0.45;
  cursor: not-allowed;
  background: transparent;
}
.pl-sim-stopped-banner {
  display: block;
  padding: 6px 10px;
  margin: 0 0 4px 0;
  background: rgba(255, 93, 93, 0.15);
  border: 1px solid rgba(255, 93, 93, 0.45);
  border-radius: 4px;
  font-size: 0.74rem;
  font-weight: 600;
  color: var(--red);
  text-align: center;
}
.pl-sim-stopped-banner strong { color: var(--red); }
.pl-sim-totals-row {
  display: flex;
  align-items: baseline;
  gap: 6px;
  flex-wrap: wrap;
}
.pl-sim-side.is-stopped .pl-strat-card { opacity: 0.7; filter: grayscale(0.3); }
.pl-strat-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 3px 10px 5px 10px;
  font-size: 0.66rem;
  font-variant-numeric: tabular-nums;
  background: rgba(96, 165, 250, 0.04);
  border-bottom: 1px solid var(--border);
}
.pl-strat-summary-pnl { font-weight: 700; color: var(--text); }
.pl-strat-summary-pnl.val-up { color: var(--green); }
.pl-strat-summary-pnl.val-down { color: var(--red); }
.pl-strat-card.is-stopped .pl-strat-summary { background: rgba(255, 93, 93, 0.06); }
.pl-strat-card.is-collapsed .pl-strat-summary { display: none; }
.pl-sim-trade[data-exit-rule="user_stop_manual"] .pl-sim-badge.closed::before {
  content: "🛑 ";
}
.pl-sim-trade[data-exit-rule="user_stop_manual"] {
  background: rgba(255, 93, 93, 0.04);
}
.pl-sim-totals {
  display: flex;
  align-items: baseline;
  gap: 6px;
  flex-wrap: wrap;
  padding: 6px 12px;
  background: rgba(96, 165, 250, 0.04);
  border-bottom: 1px solid var(--border);
  font-size: 0.72rem;
  font-variant-numeric: tabular-nums;
  color: var(--text-muted);
}
.pl-sim-totals strong { color: var(--text); font-weight: 700; }

/* Strategy-card: én pr. strategi (1, 2, 3) i sim-body */
.pl-strat-card {
  border-bottom: 1px solid var(--border);
}
.pl-strat-card:last-child { border-bottom: none; }
.pl-strat-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 6px;
  padding: 6px 10px;
  background: rgba(148, 163, 184, 0.05);
  border-bottom: 1px solid var(--border);
  cursor: pointer;
}
.pl-strat-head:hover { background: rgba(148, 163, 184, 0.10); }
.pl-strat-title {
  display: flex;
  flex-direction: column;
  gap: 1px;
  min-width: 0;
  flex: 1;
}
.pl-strat-name {
  font-size: 0.74rem;
  font-weight: 700;
  color: var(--text);
}
.pl-strat-sub {
  font-size: 0.62rem;
  color: var(--muted);
  font-variant-numeric: tabular-nums;
}
.pl-strat-sub.low-funds { color: var(--yellow); }
.pl-strat-actions {
  display: flex;
  align-items: center;
  gap: 4px;
}
.pl-strat-chev {
  font-size: 0.7rem;
  color: var(--muted);
  width: 12px;
  text-align: center;
}
.pl-strat-reset {
  background: transparent;
  border: 1px solid rgba(255, 93, 93, 0.3);
  color: var(--red);
  font-size: 0.62rem;
  padding: 1px 6px;
  border-radius: 3px;
  cursor: pointer;
}
.pl-strat-reset:hover {
  background: rgba(255, 93, 93, 0.12);
  border-color: var(--red);
}
.pl-strat-body {
  padding: 6px 10px;
}
.pl-strat-card.is-collapsed .pl-strat-body { display: none; }
.pl-strat-card.is-collapsed .pl-strat-chev::before { content: "▸"; }
.pl-strat-card:not(.is-collapsed) .pl-strat-chev::before { content: "▾"; }
.pl-sim-body {
  flex: 1;
  overflow-y: auto;
  padding: 6px 10px;
  font-size: 0.74rem;
}
.pl-sim-pool {
  margin-bottom: 12px;
}
.pl-sim-pool-title {
  font-weight: 700;
  font-size: 0.74rem;
  color: var(--text);
  padding: 4px 0;
  border-bottom: 1px solid var(--border);
  margin-bottom: 4px;
  display: flex;
  justify-content: space-between;
}
.pl-sim-pool-title .muted { font-weight: 400; }
.pl-sim-trade {
  display: grid;
  grid-template-columns: 48px 1fr auto;
  gap: 4px 6px;
  padding: 4px 0;
  border-bottom: 1px dotted rgba(148, 163, 184, 0.12);
  font-variant-numeric: tabular-nums;
}
.pl-sim-trade:last-child { border-bottom: none; }
.pl-sim-trade .pl-sim-tkr {
  font-weight: 700;
  color: var(--accent);
  cursor: pointer;
}
.pl-sim-trade .pl-sim-tkr:hover { text-decoration: underline; }
.pl-sim-trade .pl-sim-prices {
  font-size: 0.7rem;
  color: var(--text-muted);
}
.pl-sim-trade .pl-sim-pnl {
  font-weight: 700;
  text-align: right;
  font-size: 0.78rem;
}
.pl-sim-trade .pl-sim-pnl.val-up { color: var(--green); }
.pl-sim-trade .pl-sim-pnl.val-down { color: var(--red); }
.pl-sim-trade .pl-sim-meta {
  grid-column: 1 / -1;
  font-size: 0.66rem;
  color: var(--muted);
  display: flex;
  justify-content: space-between;
}
.pl-sim-trade .pl-sim-badge {
  font-size: 0.62rem;
  padding: 1px 5px;
  border-radius: 3px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.pl-sim-trade .pl-sim-badge.open {
  background: rgba(69, 229, 140, 0.18);
  color: var(--green);
}
.pl-sim-trade .pl-sim-badge.closed {
  background: rgba(148, 163, 184, 0.15);
  color: var(--text-muted);
}
.pl-sim-empty {
  color: var(--muted);
  font-style: italic;
  padding: 8px 0;
  font-size: 0.72rem;
}

/* Type-toggle (Custom / Tema / Alle) */
.pl-type-toggle {
  display: inline-flex;
  border: 1px solid var(--border);
  border-radius: 6px;
  overflow: hidden;
}
.pl-type-btn {
  background: var(--bg-panel);
  border: none;
  color: var(--muted);
  font-size: 0.78rem;
  padding: 6px 14px;
  cursor: pointer;
  border-right: 1px solid var(--border);
}
.pl-type-btn:last-child { border-right: none; }
.pl-type-btn:hover { background: rgba(148,163,184,0.08); color: var(--text); }
.pl-type-btn.active {
  background: var(--accent-soft);
  color: var(--accent);
  font-weight: 600;
}

.pl-pool {
  margin-bottom: 12px;
  padding: 0;
  overflow: hidden;
  border-left: 3px solid transparent;  /* type-farve overrides nedenfor */
  position: relative;
}
/* Pool-type farver — venstre border + lille tag øverst */
.pl-pool-portfolio { border-left-color: #4ade80; }     /* grøn */
.pl-pool-watch     { border-left-color: #facc15; }     /* gul */
.pl-pool-custom    { border-left-color: var(--accent); }  /* blå */
.pl-pool-theme     { border-left-color: rgba(148,163,184,0.45); }  /* grå */
.pl-pool-type-tag {
  display: inline-block;
  padding: 1px 6px;
  font-size: 0.58rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  border-radius: 3px;
  color: var(--muted);
  background: rgba(148,163,184,0.06);
  vertical-align: middle;
}
.pl-pool-portfolio .pl-pool-type-tag { color: #4ade80; background: rgba(74,222,128,0.08); }
.pl-pool-watch .pl-pool-type-tag     { color: #facc15; background: rgba(250,204,21,0.08); }
.pl-pool-custom .pl-pool-type-tag    { color: var(--accent); background: var(--accent-soft); }
.pl-pool-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 14px;
  background: rgba(148,163,184,0.06);
  border-bottom: 1px solid var(--border);
}
.pl-pool.is-collapsed .pl-pool-head { border-bottom: none; }
.pl-collapse-toggle {
  display: flex; align-items: center; gap: 8px;
  background: transparent; border: none; cursor: pointer;
  padding: 0; color: var(--text);
  flex: 1 1 auto; text-align: left;
}
.pl-collapse-toggle:hover .pl-pool-name { color: var(--accent); }
.pl-chevron { color: var(--muted); font-size: 1.05rem; width: 14px; display: inline-block; line-height: 1; }
.pl-pool-name { margin: 0; font-size: 0.95rem; font-weight: 600; }
.pl-pool-meta {
  display: flex; align-items: center; gap: 8px;
  font-size: 0.74rem;
}
.pl-agent-badge {
  display: inline-block; padding: 2px 7px; border-radius: 3px;
  background: rgba(96,165,250,0.12); color: var(--accent);
  font-size: 0.7rem; font-weight: 500;
}
.pl-pool-table { width: 100%; table-layout: auto; }
.pl-pool-table th, .pl-pool-table td { padding: 5px 10px; font-size: 0.78rem; white-space: nowrap; }
/* Spacer-kolonne træker alle øvrige kolonner mod venstre */
.pl-pool-table th.pl-spacer, .pl-pool-table td.pl-row-spacer { width: 100%; padding: 0; }
.pl-pool-table .badge-status.triggered {
  background: rgba(250,204,21,0.18);
  color: #facc15;
  border: 1px solid rgba(250,204,21,0.4);
}

/* ── Én-tabel pools-layout (LC! #15) ─────────────────────────────────── */
/* pl-pools-table: pool-specifik styling. Kolonne-widths for col 1-7 fra
   .sym-table. Col 8 = Dag % (LC! #55). Col 9-10 pool-specifikke (HW/LW +
   ext/ent). Col 11 = Note, col 12 = delete. */
.pl-pools-table th:nth-child(8),  .pl-pools-table td:nth-child(8)  { width: 43px; text-align: right; }  /* D% */
.pl-pools-table th:nth-child(9),  .pl-pools-table td:nth-child(9)  { width: 32px; text-align: right; }  /* E */
.pl-pools-table th:nth-child(10), .pl-pools-table td:nth-child(10) { width: 49px; text-align: right; }  /* L */
.pl-pools-table th:nth-child(11), .pl-pools-table td:nth-child(11) { width: 49px; text-align: right; }  /* H */
.pl-pools-table th:nth-child(12), .pl-pools-table td:nth-child(12) { width: 49px; text-align: right; }  /* PM K */
.pl-pools-table th:nth-child(13), .pl-pools-table td:nth-child(13) { width: 43px; text-align: right; }  /* PM % */
.pl-pools-table th:nth-child(14), .pl-pools-table td:nth-child(14) { width: 49px; text-align: right; }  /* RTH K */
.pl-pools-table th:nth-child(15), .pl-pools-table td:nth-child(15) { width: 43px; text-align: right; }  /* RTH % */
.pl-pools-table th:nth-child(16), .pl-pools-table td:nth-child(16) { width: 49px; text-align: right; }  /* AH K */
.pl-pools-table th:nth-child(17), .pl-pools-table td:nth-child(17) { width: 43px; text-align: right; }  /* AH % */
.pl-pools-table th:nth-child(18), .pl-pools-table td:nth-child(18) { width: 108px; text-align: center; } /* Dir (4 pips) */
.pl-pools-table th:nth-child(19), .pl-pools-table td:nth-child(19) { width: auto; }                     /* note */
/* LC! #65 + #66: Kurs, D%, L, H er gårsdags-data → kursiv. */
.pl-pools-table th:nth-child(7),  .pl-pools-table td:nth-child(7),
.pl-pools-table th:nth-child(8),  .pl-pools-table td:nth-child(8),
.pl-pools-table th:nth-child(10), .pl-pools-table td:nth-child(10),
.pl-pools-table th:nth-child(11), .pl-pools-table td:nth-child(11) {
  font-style: italic;
}
/* LC! #66: border-right efter H (col 11) — samme markering som efter E. */
.pl-pools-table th:nth-child(11), .pl-pools-table td:nth-child(11) {
  border-right: 2px solid var(--border);
}
.pl-summary-row > .pl-summary-cell-mid { border-right: 2px solid var(--border); }
/* LC! #67 + #68 + #82 + #85: border-right efter hver session + sidste Dir. */
.pl-pools-table th:nth-child(13), .pl-pools-table td:nth-child(13),
.pl-pools-table th:nth-child(15), .pl-pools-table td:nth-child(15),
.pl-pools-table th:nth-child(17), .pl-pools-table td:nth-child(17),
.pl-pools-table th:nth-child(18), .pl-pools-table td:nth-child(18) {
  border-right: 2px solid var(--border);
}
.pl-summary-row > .pl-summary-cell-sessions,
.pl-summary-row > .pl-summary-cell-dir { border-right: 2px solid var(--border); }
.pl-pools-table .badge-status.triggered {
  background: rgba(250,204,21,0.18); color: #facc15;
  border: 1px solid rgba(250,204,21,0.4);
}

/* Pool-header row. !important fordi .sym-table td:nth-child(1) ellers
   centrerer kolonnen via global rule.
   LC! #30: emboss-effekt — top-border lys (highlight), bottom-border mørk
   (skygge) så rækken ser ud til at stå frem fra fladen.
   LC! #79: border-left fjernet — pool-type signalleres af type-tag før navnet.
   Hele cellen er klikbar (cursor pointer) som collapse-toggle. */
.pl-pool-row > .pl-pool-row-cell {
  padding: 0 !important;
  background: rgba(148,163,184,0.06);
  border-top: 2px solid rgba(255,255,255,0.12);
  border-bottom: 2px solid rgba(0,0,0,0.55);
  text-align: left !important;
  cursor: pointer;
}
/* LC! #18: pool-header tekst + chevron lidt større for læsbarhed */
.pl-pool-row .pl-pool-name { font-size: 0.92rem; }
.pl-pool-row .pl-chevron { font-size: 1.15rem; }

/* LC! #44/47: pool-subtitle ved siden af pool-navn (read-only render) */
.pl-pool-subtitle {
  color: var(--muted); font-weight: 400; font-size: 0.85em;
  margin-left: 8px; max-width: 360px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* LC! #47: shared pool-editor modal (create + rename) */
.pl-editor-modal { width: 420px; max-width: 92vw; }
.pl-editor-body { display: flex; flex-direction: column; gap: 12px; padding: 16px; }
.pl-editor-field { display: flex; flex-direction: column; gap: 4px; }
.pl-editor-label {
  font-size: 0.72rem; text-transform: uppercase;
  letter-spacing: 0.04em; color: var(--muted);
}
.pl-editor-name, .pl-editor-sub {
  background: var(--bg); color: var(--text);
  border: 1px solid var(--border); border-radius: 4px;
  padding: 8px 10px; font-size: 0.92rem;
}
.pl-editor-name:focus, .pl-editor-sub:focus {
  outline: none; border-color: var(--accent);
}
/* Per-pool col-headers række — replikerer thead under hver pool-header.
   Per LC! #27: LYSERE end pool-header, samme tone som total-rækken. */
.pl-col-headers-row > th {
  background: rgba(148,163,184,0.20);   /* endnu lysere — LC! followup #27b */
  border-bottom: 1px solid var(--border);
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
  font-weight: 500;
  padding: 4px 5px;
}
/* LC! #79: per-type border-left fjernet — type-tag før navn signalerer typen. */
.pl-pool-row-toggle {
  display: inline-flex; align-items: center; gap: 8px;
  background: transparent; border: none; cursor: pointer;
  padding: 8px 12px; color: var(--text);
}
.pl-pool-row-toggle:hover .pl-pool-name { color: var(--accent); }
.pl-pool-row-meta {
  float: right; display: inline-flex; align-items: center; gap: 8px;
  padding: 6px 12px;
}
.pl-pool-type-pool-portfolio { color: #4ade80; background: rgba(74,222,128,0.08); }
.pl-pool-type-pool-watch     { color: #facc15; background: rgba(250,204,21,0.08); }
.pl-pool-type-pool-custom    { color: var(--accent); background: var(--accent-soft); }

/* Summary-row — TD'en skal forblive table-cell ellers brækker colspan
   + table-layout: fixed; flex flytter vi til indre wrapper.
   Per LC! #27: samme baggrund som col-headers (begge lysere end pool-header). */
.pl-summary-row > .pl-summary-cell {
  padding: 4px 12px !important;
  background: rgba(148,163,184,0.20);
  /* LC! #32: 2px mørk bund som matcher pool-header's emboss-bund —
     hele pool-blokken får dermed sammenhængende emboss-frame. */
  border-bottom: 2px solid rgba(0,0,0,0.55);
  font-size: 0.74rem; color: var(--text-muted);
  text-align: left !important;
}
/* LC! #63 + followup: 2px border-right på summary-cell-left matcher
   den vertikale linje efter sidste faste kolonne (E, col 9). */
.pl-summary-row > .pl-summary-cell-left { border-right: 2px solid var(--border); }
.pl-summary-inner {
  display: flex; gap: 14px; align-items: center;
}
.pl-summary-row > .pl-summary-cell strong { color: var(--text); }
.pl-summary-triggered { color: #facc15; }

/* Spacer-row mellem pool-tabeller (LC! #23, dobbelt-højde #30).
   LC! #61: solid bg (matcher side-baggrunden) så klokken-elementet bag
   tabellerne ser segmenteret ud — én "clockticker" pr. pool. */
.pl-pool-spacer-row > td {
  height: 36px;
  background: var(--bg);
  border: none;
  padding: 0;
}

/* LC! #34/#39: color-picker popover ved 🎨-knappen */
.pl-color-popover {
  position: fixed;
  z-index: 9000;
  background: var(--bg-panel);
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 10px;
  box-shadow: 0 6px 16px rgba(0,0,0,0.5);
  display: flex; flex-direction: column; gap: 8px;
  min-width: 200px;
}
/* LC! #41: embedded gradient color-picker — S/V-felt + hue-slider + hex */
.pl-cp-sv {
  width: 240px; height: 140px;
  position: relative; cursor: crosshair;
  border-radius: 4px;
  border: 1px solid var(--border);
}
.pl-cp-sv-cursor {
  position: absolute; width: 12px; height: 12px;
  border: 2px solid #fff; border-radius: 50%;
  box-shadow: 0 0 0 1px rgba(0,0,0,0.4);
  pointer-events: none;
  transform: translate(-50%, -50%);
}
.pl-cp-hue {
  width: 240px; height: 14px;
  -webkit-appearance: none; appearance: none;
  background: linear-gradient(to right,
    #ff0000 0%, #ffff00 17%, #00ff00 33%, #00ffff 50%,
    #0000ff 67%, #ff00ff 83%, #ff0000 100%);
  border-radius: 7px; cursor: pointer; outline: none;
  margin: 0;
}
.pl-cp-hue::-webkit-slider-thumb {
  -webkit-appearance: none; appearance: none;
  width: 14px; height: 14px; border-radius: 50%;
  background: #fff; border: 2px solid #333; cursor: pointer;
}
.pl-cp-hue::-moz-range-thumb {
  width: 14px; height: 14px; border-radius: 50%;
  background: #fff; border: 2px solid #333; cursor: pointer;
}
.pl-cp-row {
  display: flex; gap: 8px; align-items: center;
}
.pl-cp-preview {
  width: 32px; height: 32px;
  border: 1px solid var(--border); border-radius: 4px;
}
.pl-cp-hex {
  flex: 1; padding: 6px 8px;
  background: var(--bg); color: var(--text);
  border: 1px solid var(--border); border-radius: 4px;
  font-family: monospace; font-size: 0.85rem;
}
.pl-color-actions { display: flex; gap: 6px; justify-content: flex-end; }
.pl-color-clear {
  background: transparent; border: 1px solid var(--border);
  color: var(--muted); cursor: pointer;
  font-size: 0.78rem; padding: 4px 10px; border-radius: 4px;
  margin-right: auto;
}
.pl-color-clear:hover { color: #ef4444; border-color: #ef4444; }

/* LC! #34: per-pool baggrundsfarve for custom pools.
   Sym-rows får en svag farve. Col-headers + summary får samme farve
   STAKKET under deres grå semi-transparent overlay (via background-image
   gradient), så grå "skinner ind" og pool-farven kan ses gennem den. */
.pl-sym-row.pl-has-pool-color > td {
  background-color: rgba(var(--pool-color), 0.10);
}
.pl-col-headers-row.pl-has-pool-color > th {
  background:
    linear-gradient(rgba(148,163,184,0.20), rgba(148,163,184,0.20)),
    rgba(var(--pool-color), 0.10);
}
.pl-summary-row.pl-has-pool-color > .pl-summary-cell {
  background:
    linear-gradient(rgba(148,163,184,0.20), rgba(148,163,184,0.20)),
    rgba(var(--pool-color), 0.10);
}
/* LC! #40: pool-header får samme transparente overlay som col-headers
   og summary — pool-color skinner igennem, ikke solid. */
.pl-pool-row.pl-has-pool-color > .pl-pool-row-cell {
  background:
    linear-gradient(rgba(148,163,184,0.06), rgba(148,163,184,0.06)),
    rgba(var(--pool-color), 0.10);
}

/* LC! #58: time-of-day baggrundselement på Pools-siden. Ligger bag
   pool-tabellerne — venstre-anker, bredde 0% ved NY-midnat, 100% efter
   24 NY-timer. Højre kant (3px accent) markerer "nu". Stikker 8px op
   over toppen af pool-listen som visuel påvirkning, uden at krydse
   page-header/tabs. */
#pl-list { position: relative; }
.pl-day-progress {
  position: absolute;
  left: 0;
  top: -8px;
  bottom: 0;
  width: 0;
  /* Background sættes inline af JS (gradient med fade-in/out 5% før PM
     og efter AH per LC! #69). */
  border-right: 2px solid rgba(79, 156, 255, 0.45);
  pointer-events: none;
  z-index: 0;
}
/* Sørg for at pool-tabel ligger ovenpå progress-baggrunden (BG-elementet
   må IKKE rammes af denne regel — ellers ophæves dens absolute position). */
#pl-list > .pl-pools-table,
#pl-list > p.empty-state-card { position: relative; z-index: 1; }

/* System-wide WS-health toast (EXT-coord LC! #91). Sticky til viewport-bunden
   over alt indhold men under modals. Vises kun ved stale/down. */
.sys-toast {
  position: fixed;
  bottom: 28px;  /* over .footer (LC! #59) som ligger på 0 */
  left: 0; right: 0;
  z-index: 9000;  /* over normalt indhold + footer, under modals (9000+) */
  padding: 10px 16px;
  text-align: center;
  font-weight: 600;
  font-size: 0.92rem;
  box-shadow: 0 -4px 12px rgba(0,0,0,0.45);
  display: flex; align-items: center; justify-content: center; gap: 16px;
}
.sys-toast.hidden { display: none; }
.sys-toast.stale {
  background: linear-gradient(90deg, #c79a18 0%, #d4a017 100%);
  color: #1a1a1a;
}
.sys-toast.down {
  background: linear-gradient(90deg, #c0292a 0%, #d12c2c 100%);
  color: #fff;
}
.sys-toast-msg { flex: 1 1 auto; }
.sys-toast-dismiss {
  background: rgba(0,0,0,0.18); color: inherit;
  border: none; border-radius: 4px;
  padding: 2px 10px; font-size: 0.9rem; font-weight: 700;
  cursor: pointer;
}
.sys-toast-dismiss:hover { background: rgba(0,0,0,0.32); }

/* System-snapshot panel på Dashboard (LC! #56) */
.sys-snapshot-body { display: flex; flex-direction: column; gap: 6px; padding: 4px 0; }
.sys-snapshot-row {
  display: flex; align-items: baseline; gap: 8px;
  font-size: 0.82rem;
}
.sys-snapshot-lbl {
  flex: 0 0 auto; min-width: 110px;
  font-size: 0.72rem;
  text-transform: uppercase; letter-spacing: 0.03em;
}
.sys-snapshot-val { flex: 1 1 auto; }
.sys-snapshot-val strong { color: var(--text); }
.sys-snapshot-hint { font-size: 0.7rem; }
.sys-snapshot-refresh { padding: 2px 8px; font-size: 0.85rem; }

/* Handelspar (trade_pairs) subpage (LC! #53) */
.tp-summary {
  display: flex; gap: 10px; align-items: center; flex-wrap: wrap;
  font-size: 0.85rem;
}
.tp-summary strong { color: var(--text); font-size: 0.95rem; }
.tp-filter-row {
  display: flex; gap: 14px; align-items: flex-end;
  padding: 8px 12px; border-bottom: 1px solid var(--border);
}
.tp-filter { display: flex; flex-direction: column; gap: 3px; font-size: 0.75rem; }
.tp-filter input, .tp-filter select {
  background: var(--bg); color: var(--text);
  border: 1px solid var(--border); border-radius: 4px;
  padding: 4px 8px; font-size: 0.82rem; min-width: 110px;
}
.tp-filter select option { background: var(--bg-panel); color: var(--text); }
.tp-filter-count { margin-left: auto; font-size: 0.78rem; }
.tp-table-wrap { overflow-x: auto; }
.tp-table thead th, .tp-open-table thead th { cursor: pointer; user-select: none; }
.tp-table thead th:hover { background: rgba(255,255,255,0.04); }

/* Enrich-toast — flydende status under symbol-enrichment (LC! #22). */
.enrich-toast {
  position: fixed;
  bottom: 24px;
  right: 24px;
  z-index: 9999;
  padding: 10px 16px;
  background: rgba(15, 23, 42, 0.92);
  border: 1px solid var(--border);
  border-radius: 6px;
  color: var(--text);
  font-size: 0.85rem;
  font-weight: 500;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4);
  opacity: 0;
  transform: translateY(8px);
  transition: opacity 0.18s, transform 0.18s;
  pointer-events: none;
}
.enrich-toast.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* Note-kolonne i pool-tabel — LC! #28: ren TD (intet indre element),
   ingen border eller padding-difference. Hele cellen er click-target. */
.pl-note-head { width: 100%; }
.pl-note-cell {
  white-space: normal !important;       /* override sym-table's nowrap */
  overflow: visible !important;
  text-overflow: clip !important;
  vertical-align: middle;
  cursor: pointer;
  font-size: 0.78rem;
  word-break: break-word;
}
.pl-note-cell:hover { background: var(--accent-soft); }

/* Remove-from-pool knap i sidste kolonne (LC! #28) */
.pl-remove-cell { text-align: center; padding: 0 !important; }
.pl-remove-sym {
  background: transparent; border: none;
  color: var(--muted); cursor: pointer;
  font-size: 1.1rem; line-height: 1;
  padding: 4px 6px; border-radius: 3px;
}
.pl-remove-sym:hover { color: #ef4444; background: rgba(239,68,68,0.1); }

/* Note-modal */
.pl-note-modal { width: 480px; max-width: 92vw; padding: 0; }
.pl-note-textarea {
  width: 100%;
  background: var(--bg-elevated);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 8px 10px;
  font: inherit; font-size: 0.86rem;
  resize: vertical;
  min-height: 80px;
}
.pl-note-textarea:focus { outline: 1px solid var(--accent); }

/* Import-modal */
.pl-import-modal { width: 580px; max-width: 92vw; padding: 0; }
.pl-import-textarea {
  width: 100%; min-height: 140px;
  background: var(--bg-elevated); color: var(--text);
  border: 1px solid var(--border); border-radius: 4px;
  padding: 8px 10px;
  font: 12px/1.4 ui-monospace, monospace;
  resize: vertical;
}
.pl-import-preview-table { width: 100%; margin-top: 6px; }
.pl-import-preview-table th, .pl-import-preview-table td { padding: 3px 8px; font-size: 0.74rem; }
.pl-import-status-ny .pl-import-status { color: var(--green); }
.pl-import-status-duplikat .pl-import-status { color: var(--muted); }
.pl-import-status-invalid .pl-import-status { color: var(--red); }

/* Earn-Align page */
.ea-controls {
  display: flex; flex-wrap: wrap; gap: 12px;
  padding: 12px; margin-bottom: 12px;
  background: var(--bg-panel); border: 1px solid var(--border); border-radius: 6px;
  align-items: end;
}
.ea-controls label { display: flex; flex-direction: column; gap: 3px; font-size: 0.72rem; color: var(--muted); }
.ea-controls input, .ea-controls select {
  background: var(--bg); border: 1px solid var(--border); border-radius: 4px;
  color: var(--text); padding: 5px 8px; font-size: 0.8rem; min-width: 110px;
}
.ea-charts { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }.ea-chart-panel { padding: 12px; }
.ea-chart-panel .panel-header { margin-bottom: 8px; }
.ea-chart { width: 100%; height: 420px; }

.tw-trade-status-tag {
  display: inline-block;
  margin-left: 6px;
  padding: 1px 5px;
  background: rgba(250,204,21,0.12);
  color: var(--yellow);
  border-radius: 3px;
  font-size: 0.62rem;
  font-style: normal;
  font-weight: 500;
}
.trades-show-cancelled-lbl {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 0.72rem;
  cursor: pointer;
  margin-left: 8px;
}
.trades-show-cancelled-lbl input[type="checkbox"] {
  width: 13px; height: 13px; accent-color: var(--accent); cursor: pointer;
}

/* Lille screendump-icon på trade-rækker */
.tw-trade-screendump-link {
  display: inline-block;
  margin-left: 4px;
  cursor: pointer;
  color: var(--accent);
  font-size: 0.85rem;
  opacity: 0.7;
  transition: opacity 120ms;
}
.tw-trade-screendump-link:hover { opacity: 1; }

/* Inline-style cleanup utility classes (sweep) */
.empty-state-msg { font-size: 0.78rem; padding: 8px 10px; }
.empty-state-card { font-size: 0.85rem; padding: 12px; }
.empty-state-hero { font-size: 0.85rem; padding: 18px; text-align: center; line-height: 1.5; }
.text-sm { font-size: 0.8rem; }
.text-xs { font-size: 0.72rem; }
.text-mini { font-size: 0.7rem; }

/* Canvas */
.ag-canvas-wrap {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 6px;
  overflow: hidden;
  position: relative;
}
.ag-canvas {
  width: 100%;
  height: 100%;
  position: relative;
  overflow: auto;
  background-image:
    linear-gradient(rgba(148,163,184,0.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(148,163,184,0.08) 1px, transparent 1px);
  background-size: 12px 12px;
}
.ag-edges {
  position: absolute;
  top: 0; left: 0;
  pointer-events: none;
  z-index: 1;
}
.ag-edge-labels-overlay {
  position: absolute;
  top: 0; left: 0;
  pointer-events: none;
  z-index: 5;  /* over noder (z-index 2) så klik på labels virker */
}
.ag-edge-labels-overlay .ag-edge-label { pointer-events: all; }
.ag-edges .ag-edge {
  stroke: rgba(148, 163, 184, 0.55);
  stroke-width: 2;
  fill: none;
  pointer-events: stroke;
  cursor: pointer;
}
.ag-edges .ag-edge:hover { stroke: #f87171; stroke-width: 3; }
.ag-edges .ag-edge-pending {
  stroke: #4ade80;
  stroke-dasharray: 4 4;
  pointer-events: none;
}
/* Edge-labels — viser data-count midt på connector */
.ag-edge-label {
  cursor: pointer;
  pointer-events: all;
}
.ag-edge-label rect {
  fill: #1e293b;
  stroke: rgba(148, 163, 184, 0.45);
  stroke-width: 1;
  transition: stroke 80ms;
}
.ag-edge-label:hover rect {
  stroke: #4ade80;
  stroke-width: 2;
}
.ag-edge-label text {
  font-size: 10px;
  font-family: ui-monospace, monospace;
  font-weight: 700;
  fill: var(--muted);
  pointer-events: none;
  user-select: none;
}
.ag-edge-label.ag-edge-label-active rect {
  fill: #064e3b;
  stroke: #4ade80;
}
.ag-edge-label.ag-edge-label-active text { fill: #4ade80; }
.ag-edge-label.ag-edge-label-zero rect {
  fill: #2d1a18;
  stroke: rgba(248, 113, 113, 0.55);
}
.ag-edge-label.ag-edge-label-zero text { fill: #f87171; }

/* DSL-primitives helper i detail-panel */
.ag-dsl-help {
  margin-top: 12px;
  padding: 8px 10px;
  background: rgba(148, 163, 184, 0.06);
  border-radius: 4px;
  border-left: 3px solid var(--yellow);
}
.ag-dsl-help-label {
  font-size: 0.62rem;
  margin-bottom: 6px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.ag-dsl-help-list { display: flex; flex-direction: column; gap: 6px; }
.ag-dsl-group { display: flex; flex-wrap: wrap; gap: 4px; align-items: baseline; }
.ag-dsl-group-name { font-size: 0.62rem; min-width: 70px; }
.ag-dsl-primitive {
  display: inline-block;
  padding: 1px 6px;
  background: rgba(250, 204, 21, 0.10);
  color: var(--yellow);
  border: 1px solid rgba(250, 204, 21, 0.30);
  border-radius: 3px;
  font-size: 0.66rem;
  font-family: ui-monospace, monospace;
  cursor: help;
}

/* Earnings status-badges (Sprint A) */
.er-badge {
  display: inline-block;
  margin-left: 6px;
  padding: 1px 6px;
  border-radius: 3px;
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  font-variant-numeric: tabular-nums;
}
.er-badge-reported {
  background: rgba(74, 222, 128, 0.18);
  color: #4ade80;
  border: 1px solid rgba(74, 222, 128, 0.45);
}
.er-badge-partial {
  background: rgba(250, 204, 21, 0.18);
  color: var(--yellow);
  border: 1px solid rgba(250, 204, 21, 0.45);
}
.er-badge-pending {
  background: rgba(148, 163, 184, 0.08);
  color: var(--muted);
  border: 1px solid rgba(148, 163, 184, 0.30);
  font-weight: 600;
}

/* Sample-popover ved klik på edge-label */
.ag-sample-popover {
  position: fixed;
  z-index: 1000;
  max-width: 360px;
  max-height: 70vh;
  overflow-y: auto;
  background: var(--panel);
  border: 1px solid #4ade80;
  border-radius: 6px;
  box-shadow: 0 6px 20px rgba(0,0,0,0.45);
  font-size: 0.78rem;
}
.ag-sample-pop-head {
  display: flex; align-items: center; gap: 8px;
  padding: 6px 10px;
  border-bottom: 1px solid var(--border);
  background: rgba(74, 222, 128, 0.08);
}
.ag-sample-pop-head .muted { font-size: 0.7rem; }
.ag-sample-pop-close {
  margin-left: auto;
  background: none; border: none;
  color: var(--muted);
  font-size: 1.1rem;
  cursor: pointer;
  padding: 0 4px;
}
.ag-sample-pop-table {
  width: 100%;
  border-collapse: collapse;
}
.ag-sample-pop-table td {
  padding: 4px 8px;
  border-bottom: 1px dashed rgba(148,163,184,0.10);
  font-variant-numeric: tabular-nums;
}
.ag-sample-pop-table td:last-child { font-size: 0.7rem; line-height: 1.5; }
.ag-sample-pop-table code {
  background: rgba(0,0,0,0.20);
  padding: 1px 5px;
  border-radius: 2px;
  font-size: 0.68rem;
  margin-right: 3px;
  display: inline-block;
}
.ag-nodes {
  position: relative;
  z-index: 2;
  width: 100%;
  height: 100%;
}
.ag-empty {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.8rem;
  pointer-events: none;
}
.ag-node {
  position: absolute;
  background: var(--bg-panel);
  border: 2px solid;
  border-radius: 6px;
  font-size: 0.72rem;
  cursor: move;
  user-select: none;
  box-shadow: 0 2px 6px rgba(0,0,0,0.18);
}
.ag-node.is-selected { box-shadow: 0 0 0 2px #4ade80, 0 4px 12px rgba(0,0,0,0.32); }
.ag-node-head {
  display: flex; align-items: center; gap: 6px;
  padding: 5px 8px;
}
.ag-node-sym {
  font-weight: 800;
  font-size: 0.9rem;
  width: 14px;
  text-align: center;
}
.ag-node-name { font-weight: 600; }
.ag-node-del {
  margin-left: auto;
  background: none;
  border: none;
  color: var(--muted);
  font-size: 1rem;
  cursor: pointer;
  padding: 0 4px;
}
.ag-node-del:hover { color: #f87171; }
.ag-node-body { padding: 4px 8px 8px; }
.ag-node-param {
  display: flex; justify-content: space-between;
  font-size: 0.66rem;
  padding: 1px 0;
}
.ag-node-param-lbl { color: var(--muted); }
.ag-node-param-val {
  font-variant-numeric: tabular-nums;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 100px;
}

/* Ports */
.ag-port {
  position: absolute;
  width: 12px; height: 12px;
  border-radius: 50%;
  background: #1e293b;
  border: 2px solid #4ade80;
  cursor: crosshair;
  z-index: 3;
}
.ag-port:hover { background: #4ade80; transform: scale(1.2); }
.ag-port-in { left: -7px; top: 50%; transform: translateY(-50%); }
.ag-port-out { right: -7px; top: 50%; transform: translateY(-50%); }

/* Detail-panel */
.ag-detail-head {
  display: flex; align-items: center; gap: 6px;
  padding: 4px 0 6px;
  font-size: 0.82rem;
}
.ag-detail-id { font-size: 0.66rem; margin-left: auto; }
.ag-detail-desc {
  font-size: 0.7rem;
  line-height: 1.4;
  margin: 6px 0 10px;
}
.ag-detail-params { display: flex; flex-direction: column; gap: 8px; }
.ag-detail-row { display: flex; flex-direction: column; gap: 3px; }
.ag-detail-row-check { flex-direction: row; align-items: center; gap: 8px; }
.ag-detail-row-check .ag-detail-lbl { font-size: 0.74rem; color: var(--text); }
.ag-detail-row-check input[type="checkbox"] {
  width: 14px; height: 14px; accent-color: #4ade80; cursor: pointer; flex: 0 0 auto;
}
.ag-detail-lbl {
  font-size: 0.66rem;
  color: var(--muted);
}
.ag-detail-input {
  padding: 4px 8px;
  background: var(--bg-panel);
  border: 1px solid var(--border);
  border-radius: 4px;
  color: var(--text);
  font-family: inherit;
  font-size: 0.74rem;
  outline: none;
}
.ag-detail-input:focus { border-color: #4ade80; }
textarea.ag-detail-input {
  font-family: ui-monospace, monospace;
  font-size: 0.72rem;
  resize: vertical;
}
.ag-detail-actions { margin-top: 12px; }

/* Result-panel (bund) */
.ag-result-panel {
  position: sticky;
  bottom: 8px;
  margin-top: 8px;
  background: var(--panel);
  border: 1px solid #4ade80;
  border-radius: 6px;
  overflow: hidden;
  box-shadow: 0 -4px 20px rgba(74, 222, 128, 0.25);
  z-index: 10;
}
.ag-result-head {
  display: flex; align-items: center; gap: 8px;
  padding: 6px 12px;
  border-bottom: 1px solid var(--border);
  font-size: 0.78rem;
}
.ag-result-head .ag-btn-small { margin-left: auto; }
.ag-result-body { padding: 10px 12px; }
.ag-result-pre {
  background: rgba(0,0,0,0.25);
  padding: 8px 10px;
  border-radius: 4px;
  font-size: 0.7rem;
  font-family: ui-monospace, monospace;
  overflow-x: auto;
  margin: 4px 0 0;
  white-space: pre-wrap;
}
.ag-result-section { margin-bottom: 10px; }
.ag-result-section .muted { font-size: 0.66rem; margin-bottom: 4px; }
.ag-result-chip {
  display: inline-block;
  padding: 2px 8px;
  margin: 0 3px 3px 0;
  border-radius: 3px;
  font-size: 0.72rem;
  font-variant-numeric: tabular-nums;
  font-weight: 600;
}
.ag-result-chip-fire {
  background: rgba(74, 222, 128, 0.18);
  color: #4ade80;
  border: 1px solid rgba(74, 222, 128, 0.4);
}
.ag-result-chip-supp {
  background: rgba(148, 163, 184, 0.10);
  color: var(--muted);
  border: 1px solid var(--border);
}

.ag-agent-select {
  padding: 5px 10px;
  font-size: 0.82rem;
  background: var(--bg-panel);
  border: 1px solid var(--border);
  border-radius: 4px;
  color: var(--text);
  font-family: inherit;
  min-width: 180px;
  cursor: pointer;
}
.ag-agent-select:focus { border-color: #4ade80; outline: none; }

/* Schedule-bar */
.ag-schedule-bar {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 12px;
  margin-bottom: 8px;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 6px;
  font-size: 0.78rem;
}
.ag-schedule-lbl { color: var(--muted); font-weight: 600; }
.ag-schedule-preset,
.ag-schedule-custom {
  padding: 4px 8px;
  font-size: 0.78rem;
  background: var(--bg-panel);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 4px;
  font-family: inherit;
  cursor: pointer;
}
.ag-schedule-custom {
  font-family: ui-monospace, monospace;
  width: 140px;
  cursor: text;
}
.ag-schedule-preset:focus,
.ag-schedule-custom:focus { border-color: #4ade80; outline: none; }
.ag-schedule-meta {
  margin-left: auto;
  font-size: 0.7rem;
  font-variant-numeric: tabular-nums;
}
.ag-schedule-meta code {
  background: rgba(0,0,0,0.20);
  padding: 1px 5px;
  border-radius: 3px;
  font-size: 0.7rem;
  color: var(--text);
}
.ag-schedule-warn {
  padding: 3px 8px;
  background: rgba(250, 204, 21, 0.18);
  color: var(--yellow);
  border: 1px solid rgba(250, 204, 21, 0.5);
  border-radius: 3px;
  font-size: 0.7rem;
  font-weight: 600;
  cursor: help;
}

/* ntfy-settings på Profile-side */
.ntfy-settings {
  padding: 12px 16px;
}
.ntfy-row {
  display: grid;
  grid-template-columns: 120px 1fr;
  gap: 12px;
  align-items: center;
  padding: 8px 0;
  border-bottom: 1px dashed rgba(148,163,184,0.10);
}
.ntfy-row:last-child { border-bottom: none; }
.ntfy-toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 0.82rem;
  cursor: pointer;
}
.ntfy-topic-row {
  display: flex;
  gap: 6px;
  align-items: center;
}
.ntfy-topic-input {
  flex: 1;
  padding: 6px 10px;
  background: var(--bg-panel);
  border: 1px solid var(--border);
  border-radius: 4px;
  color: var(--text);
  font-family: ui-monospace, monospace;
  font-size: 0.8rem;
  outline: none;
}
.ntfy-topic-input:focus { border-color: #4ade80; }
.ntfy-help { font-size: 0.78rem; line-height: 1.5; }
.ntfy-help a { color: #4ade80; }
.ntfy-save-btn, .ntfy-test-btn {
  padding: 5px 12px;
  font-size: 0.78rem;
  background: rgba(74, 222, 128, 0.12);
  color: #4ade80;
  border: 1px solid rgba(74, 222, 128, 0.4);
  border-radius: 4px;
  font-family: inherit;
  cursor: pointer;
}
.ntfy-save-btn { background: rgba(74, 222, 128, 0.2); }
.ntfy-save-btn:hover, .ntfy-test-btn:hover { background: rgba(74, 222, 128, 0.32); }
.ntfy-actions { gap: 0; }
.ntfy-actions > div { display: flex; gap: 8px; align-items: center; }
#pr-ntfy-status { font-size: 0.72rem; }

/* Perf-overlay (Shift+P) — floating bottom-right, viser ringbuffer-stats */
.perf-overlay {
  position: fixed;
  right: 12px;
  bottom: 12px;
  z-index: 9999;
  width: min(880px, calc(100vw - 24px));
  max-height: 70vh;
  overflow: auto;
  background: rgba(20, 26, 35, 0.96);
  border: 1px solid var(--border);
  border-radius: 8px;
  box-shadow: 0 6px 24px rgba(0,0,0,0.5);
  font: 12px/1.4 ui-monospace, monospace;
  color: var(--text);
}
.perf-overlay-head {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 10px;
  border-bottom: 1px solid var(--border);
}
.perf-overlay-head strong { color: var(--accent); }
.perf-overlay-head .muted { font-size: 10px; }
.perf-overlay-head button {
  margin-left: auto;
  background: transparent;
  color: var(--muted);
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 2px 8px;
  font: inherit;
  cursor: pointer;
}
.perf-overlay-head button:hover { color: var(--text); border-color: var(--accent); }
.perf-overlay-head .perf-overlay-close { padding: 0 8px; margin-left: 4px; }
.perf-overlay-body { padding: 6px 10px; }
.perf-overlay-body table { width: 100%; border-collapse: collapse; }
.perf-overlay-body th, .perf-overlay-body td {
  padding: 2px 6px;
  text-align: left;
  border-bottom: 1px solid rgba(255,255,255,0.05);
}
.perf-overlay-body td.num, .perf-overlay-body th.num { text-align: right; font-variant-numeric: tabular-nums; }
.perf-overlay-body p.muted { padding: 8px 0; }
.perf-overlay-textarea {
  width: 100%;
  min-height: 50vh;
  background: rgba(15, 20, 28, 0.9);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 8px 10px;
  font: 12px/1.35 ui-monospace, "SF Mono", monospace;
  resize: vertical;
  white-space: pre;
  overflow: auto;
}
.perf-overlay-textarea:focus { outline: 1px solid var(--accent); }