@import url("https://fonts.googleapis.com/css2?family=Sora:wght@500;600;700;800&family=Inter:wght@400;500;600;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@600;700&family=Syne:wght@700;800&display=swap");

:root {
  --bg: #f5f7ff;
  --bg-soft: #ffffff;
  --text: #121a34;
  --muted: #5d6887;
  --primary: #4a67ff;
  --primary-2: #6c4dff;
  --primary-soft: #eef1ff;
  --border: #d9e1f6;
  --border-soft: #e9eefb;
  --danger: #c83a67;
  --success: #118352;
  --shadow-sm: 0 10px 28px rgba(25, 40, 96, 0.08);
  --shadow-lg: 0 24px 65px rgba(36, 55, 120, 0.13);
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

body {
  margin: 0;
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, "SF Mono", "Consolas", "Monaco", monospace;
  font-weight: 700;
  color: var(--text);
  background:
    radial-gradient(1000px 540px at -12% -22%, rgba(74, 103, 255, 0.2), transparent 60%),
    radial-gradient(800px 520px at 110% -18%, rgba(108, 77, 255, 0.18), transparent 58%),
    linear-gradient(180deg, #f9fbff 0%, #eef2ff 60%, #edf2ff 100%);
  min-height: 100vh;
}

/* Wrap: content scrolls; top padding reserves space for fixed header (brand + PnL + ticker) */
.wrap {
  width: min(1180px, 94vw);
  margin: 0 auto;
  padding: 1.35rem 0 2.5rem;
}

/* First content section under fixed header: consistent spacing */
.wrap > .main-content {
  margin-top: 0;
}



/* Consistent gap between first and subsequent content sections */
.wrap > .main-content + .card {
  margin-top: 1rem;
}

.sticky-header {
  position: fixed;
  top: 0.25rem;
  bottom: auto;
  left: 50%;
  transform: translateX(-50%);
  width: min(1180px, 94vw);
  max-width: 100%;
  z-index: 100;
  margin-top: 0;
  margin-bottom: 0;
  background: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  border: none;
  border-radius: 0;
  box-shadow: none;
  transition: top 0.25s ease;
}
.header-panel #controlMsg,
.header-panel .header-msg,
.header-panel .pnl-section,
.header-panel .ticker-banner {
  transition: opacity 0.2s ease, max-height 0.25s ease;
}
/* When collapsed: hide only PnL hero and control msg; keep menu + ticker scroll visible */
.sticky-header.is-collapsed .header-panel #controlMsg,
.sticky-header.is-collapsed .header-panel .header-msg,
.sticky-header.is-collapsed .header-panel .pnl-section {
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  margin: 0;
  padding: 0;
  border: none;
  pointer-events: none;
}
/* Expand/collapse pill: header bar toggle (same pill radius as everywhere) */
.pill.dashboard-bar-toggle,
.dashboard-bar-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  height: 2.25rem;
  padding: 0 0.6rem;
  min-width: 2.25rem;
  flex-shrink: 0;
  border-radius: 0.35rem;
  border: 1px solid rgba(100, 130, 255, 0.28);
  background: linear-gradient(135deg, rgba(24, 38, 85, 0.48), rgba(18, 28, 65, 0.35));
  color: #bcc8f0;
  cursor: pointer;
  font-size: 0.75rem;
  font-weight: 600;
  transition: border-color 0.2s, background 0.2s;
}
.dashboard-bar-toggle:hover {
  border-color: rgba(100, 130, 255, 0.45);
  background: linear-gradient(135deg, rgba(35, 52, 105, 0.55), rgba(28, 42, 85, 0.4));
}
.dashboard-bar-toggle svg {
  width: 1.1rem;
  height: 1.1rem;
  pointer-events: none;
}
.dashboard-bar-toggle .bar-toggle-icon--expand {
  display: none;
}
.dashboard-bar-toggle .bar-toggle-icon--collapse {
  display: block;
}
.sticky-header.is-collapsed .dashboard-bar-toggle .bar-toggle-icon--expand {
  display: block;
}
.sticky-header.is-collapsed .dashboard-bar-toggle .bar-toggle-icon--collapse {
  display: none;
}

/* No dark gradient below header — was causing a dark box behind content when header is at top */
.sticky-header::before,
.sticky-header::after {
  display: none;
}

/* Header panel: full-width topbar (brand left, pills right) then PnL and ticker, evenly spaced */
.header-panel {
  position: relative;
  border-radius: 1rem;
  padding: 0.6rem 0.75rem 0.75rem 0.75rem;
  background: linear-gradient(135deg, rgba(24, 38, 85, 0.55), rgba(18, 28, 65, 0.4));
  backdrop-filter: blur(14px) saturate(160%);
  -webkit-backdrop-filter: blur(14px) saturate(160%);
  border: 1px solid rgba(100, 130, 255, 0.25);
  box-shadow:
    0 8px 32px rgba(0, 0, 0, 0.25),
    inset 0 1px 0 rgba(140, 165, 255, 0.12),
    inset 0 -1px 0 rgba(0, 0, 0, 0.15);
  overflow: hidden;
}

.header-panel .topbar {
  border: none;
  box-shadow: none;
  background: transparent;
  padding: 0.1rem 0 0 0;
  margin-bottom: 0;
  margin-left: 0.5rem;
  margin-right: 0.5rem;
  width: calc(100% - 1rem);
  box-sizing: border-box;
}

/* Watermark behind topbar + ticker + PnL card; sized to fit */
.header-panel .brand-watermark {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  z-index: 0;
}

.header-panel .brand-watermark .brand-logo-watermark {
  width: auto;
  height: min(560px, 92%);
  max-width: 92%;
  object-fit: contain;
  opacity: 0.12;
  border-radius: 0.5rem;
}

.header-panel .topbar,
.header-panel .ticker-banner,
.header-panel .pnl-section,
.header-panel .header-msg,
.header-panel .header-bot-controls,
.header-panel #controlMsg {
  position: relative;
  z-index: 1;
}

.header-panel #controlMsg {
  font-size: 0.76rem;
  margin: 0 0 0.04rem 0;
  width: 100%;
}

.header-panel .pnl-section {
  margin-top: 0;
  margin-bottom: 0.12rem;
  width: 100%;
}

.header-panel .ticker-banner {
  width: 100%;
  margin-top: 0;
}

.header-panel .header-bot-controls {
  margin-top: 0.2rem;
  padding-top: 0.2rem;
}

/* No dark fade at bottom of header — was causing a dark box behind content below */
.header-panel::after {
  display: none;
}

.header-panel .ticker-banner.card,
.sticky-header .ticker-banner {
  border: none !important;
  background: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  box-shadow: none !important;
  margin-top: 0;
  margin-bottom: 0.12rem;
  margin-left: 0.5rem;
  margin-right: 0.5rem;
  width: calc(100% - 1rem);
  box-sizing: border-box;
  padding: 0.28rem 0.6rem;
  overflow: visible;
}

.sticky-header .topbar {
  border: none;
  box-shadow: none;
}

.topbar {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.75rem;
  padding: 0.65rem 0.9rem;
  margin-bottom: 0.6rem;
  border: none;
  border-radius: 0;
  background: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  box-shadow: none;
  max-width: 100%;
  width: 100%;
}

.topbar-right {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  flex-shrink: 0;
}

.topbar .nav {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.65rem;
  margin: 0;
}

.topbar .brand {
  flex-shrink: 0;
}

.top-header-markets {
  flex: 1;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.5rem 0.75rem;
  min-width: 0;
  order: 0;
}

.topbar .bot-controls-row {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  flex-shrink: 0;
}

.brand {
  font-family: Sora, Inter, ui-sans-serif, system-ui, sans-serif;
  font-size: 1.22rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}

.brand a {
  color: inherit;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}

.brand-text {
  white-space: nowrap;
}

.brand-logo {
  width: 62px;
  height: 62px;
  object-fit: contain;
  flex-shrink: 0;
  border-radius: 0.35rem;
}

/* Watermark when only topbar (no header-panel): e.g. audit-report, system */
.topbar .brand-watermark {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
  z-index: 0;
}

.topbar .brand-watermark .brand-logo-watermark {
  width: 180px;
  height: 180px;
  object-fit: contain;
  opacity: 0.2;
  border-radius: 0.4rem;
}

.topbar .brand,
.topbar .topbar-right {
  position: relative;
  z-index: 1;
}

.header-panel .topbar .topbar-right {
  margin-right: 1rem;
}

.brand-dot {
  color: var(--primary);
}

/* VAULT rebrand options: name + domain separation (no parens) */
.brand-name { font-weight: 800; letter-spacing: 0.02em; }
/* F only: VAULT font variants (add class to .brand-name in the pill layout) */
.brand-text--with-pill .brand-name {
  font-family: "Sora", sans-serif;
  font-weight: 800;
  background: linear-gradient(145deg, #152252 0%, #1e3170 25%, #2d47a8 50%, #5b7ae8 75%, #b8caff 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.18), -1px -1px 0.5px rgba(255, 255, 255, 0.22), 0 0 8px rgba(255, 255, 255, 0.06);
}
.brand-text--with-pill .brand-name.brand-name--space { font-family: "Space Grotesk", sans-serif; font-weight: 700; }
.brand-text--with-pill .brand-name.brand-name--syne { font-family: "Syne", sans-serif; font-weight: 800; }
.brand-sep { color: var(--muted); font-weight: 500; margin: 0 0.35em; user-select: none; }
.brand-domain { font-size: 0.9em; font-weight: 600; color: var(--muted); }
.brand-block { display: flex; flex-direction: column; align-items: flex-start; gap: 0.05rem; line-height: 1.2; }
.brand-block .brand-domain { font-size: 0.75em; font-weight: 500; }

/* VAULT + domain pill (like Net PnL value + % pill): bottom-aligned */
.brand-text.brand-text--with-pill {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.2rem;
}
.brand-domain-pill {
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, "SF Mono", "Consolas", "Monaco", monospace;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.22rem 0.5rem;
  border-radius: 0.35rem;
  border: 1px solid var(--border-soft);
  font-size: 0.82rem;
  font-weight: 700;
  line-height: 1;
  transform: translateY(0.18em);
  letter-spacing: 0.01em;
  background: #f7f9ff;
  color: var(--muted);
  box-sizing: border-box;
}
.brand-domain-pill-dot {
  color: var(--primary);
}
html[data-theme="dark"] .brand-domain-pill .brand-domain-pill-dot {
  color: #8ba3ff;
}
html[data-theme="dark"] .brand-domain-pill {
  background: linear-gradient(135deg, rgba(35, 48, 100, 0.5), rgba(28, 40, 88, 0.4));
  border-color: rgba(130, 155, 255, 0.3);
  color: #a8bcee;
}

.api-brand {
  display: inline-flex;
  align-items: baseline;
  gap: 0.5rem;
  border: 1px solid var(--border-soft);
  border-radius: 0.35rem;
  padding: 0.35rem 0.65rem;
  background: #fbfcff;
  order: 3;
  margin-left: auto;
}

.api-brand-name {
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, "SF Mono", "Consolas", "Monaco", monospace;
  font-weight: 700;
  letter-spacing: -0.01em;
  color: #27355f;
}

.api-brand-value {
  font-size: 0.72rem;
  color: #596b97;
}

.market-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  white-space: nowrap;
  font-size: 0.8rem;
  font-weight: 700;
  color: var(--text);
}

.market-pill .market-symbol {
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, "SF Mono", "Consolas", "Monaco", monospace;
  letter-spacing: 0.02em;
}

.market-pill .market-price,
.market-pill .market-change {
  font-size: 0.75rem;
  font-weight: 700;
  color: var(--muted);
}

.market-pill .market-change.market-up {
  color: var(--success);
}

.market-pill .market-change.market-down {
  color: var(--danger);
}

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

.nav-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 1rem;
}

.nav {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  margin-bottom: 0;
}

.bot-controls-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.bot-control-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.25rem;
  height: 2.25rem;
  padding: 0;
  border: none;
  border-radius: 0.5rem;
  cursor: pointer;
  transition: transform 0.12s ease, box-shadow 0.2s ease, border-color 0.2s ease, background 0.2s ease, color 0.2s ease;
}

.bot-control-btn:hover {
  transform: scale(1.06);
}

.bot-control-btn:active {
  transform: scale(0.98);
}

.bot-control-btn svg {
  width: 1.1rem;
  height: 1.1rem;
}

/* Control buttons: same glass style as nav (menu) buttons */
.bot-control-btn--stop-sells {
  color: #c8d4f0;
  background: linear-gradient(135deg, rgba(24, 38, 85, 0.48), rgba(18, 28, 65, 0.35));
  border: 1px solid rgba(100, 130, 255, 0.2);
}
.bot-control-btn--stop-sells.active {
  color: #f0e090;
  border-color: rgba(201, 162, 39, 0.5);
  background: linear-gradient(135deg, rgba(80, 60, 20, 0.4), rgba(60, 45, 15, 0.35));
}
.bot-control-btn--stop-sells .stop-sells-icon {
  width: 1.1rem;
  height: 1.1rem;
  display: block;
}
.bot-control-btn--start,
.bot-control-btn--stop,
.bot-control-btn--kill,
.bot-control-btn--reset {
  color: #c8d4f0;
  background: linear-gradient(135deg, rgba(24, 38, 85, 0.48), rgba(18, 28, 65, 0.35));
  border: 1px solid rgba(100, 130, 255, 0.28);
  box-shadow:
    inset 0 1px 0 rgba(140, 165, 255, 0.12),
    inset 0 -1px 0 rgba(0, 0, 0, 0.12);
  backdrop-filter: blur(14px) saturate(160%);
  -webkit-backdrop-filter: blur(14px) saturate(160%);
}

.bot-control-btn--start:hover,
.bot-control-btn--stop:hover,
.bot-control-btn--kill:hover,
.bot-control-btn--reset:hover {
  border-color: rgba(100, 130, 255, 0.45);
  color: #f0f4ff;
  background: linear-gradient(135deg, rgba(32, 48, 95, 0.55), rgba(24, 35, 72, 0.42));
  box-shadow:
    inset 0 1px 0 rgba(140, 165, 255, 0.14),
    inset 0 -1px 0 rgba(0, 0, 0, 0.1),
    0 4px 16px rgba(0, 0, 0, 0.2);
}

/* Brief "updated" state after a control action succeeds */
.bot-control-btn--acked {
  border-color: rgba(93, 114, 255, 0.55);
  color: #e8eeff;
  background: linear-gradient(135deg, rgba(45, 65, 130, 0.5), rgba(35, 52, 105, 0.4));
  box-shadow:
    inset 0 1px 0 rgba(140, 165, 255, 0.2),
    0 0 12px rgba(93, 114, 255, 0.35);
}

/* Status pill hidden; feedback is the button flash instead */
#botStatusPill {
  display: none;
}

.bot-controls-row .pill {
  font-size: 0.72rem;
  padding: 0.28rem 0.6rem;
  text-transform: uppercase;
}

.nav a {
  text-decoration: none;
  border: 1px solid rgba(100, 130, 255, 0.28);
  border-radius: 0.35rem;
  padding: 0.4rem 0.7rem;
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  color: #c8d4f0;
  background: linear-gradient(135deg, rgba(24, 38, 85, 0.48), rgba(18, 28, 65, 0.35));
  backdrop-filter: blur(14px) saturate(160%);
  -webkit-backdrop-filter: blur(14px) saturate(160%);
  box-shadow:
    inset 0 1px 0 rgba(140, 165, 255, 0.12),
    inset 0 -1px 0 rgba(0, 0, 0, 0.12);
  min-height: 2.25rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

/* Topbar nav: icon-only, same size and spacing as control buttons */
.topbar .nav a {
  width: 2.25rem;
  height: 2.25rem;
  min-height: 2.25rem;
  padding: 0;
}
.topbar .nav a svg {
  width: 1.1rem;
  height: 1.1rem;
}

.nav a:hover {
  border-color: rgba(100, 130, 255, 0.45);
  color: #f0f4ff;
  background: linear-gradient(135deg, rgba(32, 48, 95, 0.55), rgba(24, 35, 72, 0.42));
  backdrop-filter: blur(14px) saturate(160%);
  -webkit-backdrop-filter: blur(14px) saturate(160%);
  box-shadow:
    inset 0 1px 0 rgba(140, 165, 255, 0.14),
    inset 0 -1px 0 rgba(0, 0, 0, 0.1),
    0 4px 16px rgba(0, 0, 0, 0.2);
  transform: translateY(-1px);
}

.nav a.active {
  background: linear-gradient(135deg, rgba(45, 65, 130, 0.5), rgba(35, 52, 105, 0.4));
  backdrop-filter: blur(14px) saturate(160%);
  -webkit-backdrop-filter: blur(14px) saturate(160%);
  border: 1px solid rgba(93, 114, 255, 0.55);
  color: #e8eeff;
  box-shadow:
    inset 0 1px 0 rgba(140, 165, 255, 0.2),
    inset 0 -1px 0 rgba(0, 0, 0, 0.1),
    0 0 0 1px rgba(93, 114, 255, 0.15);
}

/* Card: default/dark (light card only when data-theme="light", which is disabled) */
.card {
  border: 1px solid var(--border-soft);
  border-radius: 1rem;
  padding: 1rem 1.05rem;
  background:
    linear-gradient(150deg, rgba(18, 28, 62, 0.94), rgba(12, 18, 42, 0.86)),
    radial-gradient(120% 140% at 100% 0%, rgba(93, 114, 255, 0.12), transparent 55%),
    radial-gradient(80% 100% at 0% 100%, rgba(0, 212, 255, 0.06), transparent 50%);
  color: #e7eeff;
  box-shadow: var(--shadow-sm), inset 0 1px 0 rgba(255, 255, 255, 0.03);
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.card .card {
  background: #fbfcff;
  border-color: var(--border-soft);
  box-shadow: none;
  border-radius: 0.8rem;
}

.grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 0.9rem;
}

.page-system .system-single-card .system-cells-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1rem;
  margin-top: 0;
}
/* Recessed cell look (matches .kpi-cell / position cards) */
.page-system .system-single-card .system-cell {
  position: relative;
  padding: 1rem;
  border: 1px solid rgba(80, 100, 180, 0.35);
  border-radius: 0.7rem;
  background: linear-gradient(160deg, rgba(12, 20, 48, 0.85), rgba(8, 14, 38, 0.75));
  box-shadow:
    inset 0 1px 2px rgba(0, 0, 0, 0.35),
    inset 0 -1px 0 rgba(255, 255, 255, 0.03);
  color: #c8d4f0;
}
.page-system .system-single-card .system-cell::before {
  content: "";
  position: absolute;
  inset: 2px;
  border-radius: 0.35rem;
  background: rgba(0, 0, 0, 0.25);
  box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.4);
  pointer-events: none;
}
/* Settings, System, Scripts, Docs: all pills same radius on every page */
.page-settings .pill,
.page-system .pill,
.page-scripts .pill,
.page-docs .pill {
  border-radius: 0.35rem;
}
/* Settings page: main tabs (Risk, Filters, Soak, Launchpads, Execution) and sub-tabs (General & quoting, Entry, Exit) */
.page-settings .settings-tab,
.page-settings .settings-subtab {
  border-radius: 0.35rem;
}
.page-system .system-single-card .system-cell h2,
.page-system .system-single-card .system-cell .muted,
.page-system .system-single-card .system-cell > div {
  position: relative;
  z-index: 1;
}
.page-system .system-single-card .system-cell h2 {
  margin-top: 0;
  margin-bottom: 0.5rem;
  font-size: 1rem;
  color: #8aa0d8;
}
.page-system .system-single-card .system-cell .muted {
  margin-bottom: 0.5rem;
  font-size: 0.8rem;
  color: #7a8fc8;
}
/* Status pill row at top of each system cell (single pill with status + info inline) */
.page-system .system-cell-status-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.5rem;
  flex-wrap: wrap;
}
.page-system .system-cell-status-row .pill,
.page-system .system-summary-item .pill.pill-status {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1.2;
  min-width: 2.5rem;
  text-align: center;
}
/* Pills inside system-kv-value: align with surrounding text */
.page-system .system-kv-row .system-kv-value .pill {
  display: inline-flex;
  align-items: center;
  vertical-align: middle;
  line-height: 1.2;
}
/* Uniform key-value rows across all system cells */
.page-system .system-kv-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.page-system .system-kv-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 0.35rem 0;
  border-bottom: 1px solid rgba(130, 160, 255, 0.1);
  gap: 0.75rem;
}
.page-system .system-kv-row:last-child { border-bottom: none; }
.page-system .system-kv-row .system-kv-label {
  font-size: 0.85rem;
  color: #8aa0d8;
  flex-shrink: 0;
}
.page-system .system-kv-row .system-kv-value {
  font-size: 0.82rem;
  text-align: right;
  word-break: break-word;
}
/* Summary strip at top of system page */
.page-system .system-summary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem 1.25rem;
  padding: 0.75rem 0;
  margin-bottom: 1rem;
  border-bottom: 1px solid rgba(130, 160, 255, 0.15);
}
.page-system .system-summary-item {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.85rem;
  min-height: 1.75rem;
}
.page-system .system-summary-item .pill {
  margin-right: 0;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1.2;
}
@media (max-width: 640px) {
  .page-system .system-single-card .system-cells-grid {
    grid-template-columns: 1fr;
  }
}

h1,
h2 {
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, "SF Mono", "Consolas", "Monaco", monospace;
  letter-spacing: -0.02em;
  color: #1d2750;
}

h1 {
  margin: 0 0 0.45rem;
  font-size: 1.52rem;
}

h2 {
  margin: 0 0 0.55rem;
  font-size: 1.04rem;
}

p {
  margin: 0.38rem 0;
}

.row {
  display: flex;
  gap: 0.6rem;
  flex-wrap: wrap;
  align-items: center;
}

label {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.82rem;
  font-weight: 700;
  color: #374465;
}

button {
  border: 1px solid var(--border);
  background: rgba(255, 255, 255, 0.9);
  color: #26314f;
  border-radius: 0.66rem;
  padding: 0.5rem 0.78rem;
  cursor: pointer;
  font-weight: 700;
  font-size: 0.79rem;
  letter-spacing: 0.01em;
  transition: all 0.18s ease;
}

button:hover {
  border-color: rgba(74, 103, 255, 0.65);
  transform: translateY(-1px);
  box-shadow: 0 8px 18px rgba(42, 58, 132, 0.14);
}

button:active {
  transform: translateY(0);
}

button.primary {
  background: linear-gradient(135deg, var(--primary), var(--primary-2));
  color: #fff;
  border-color: transparent;
  box-shadow: 0 10px 24px rgba(74, 103, 255, 0.3);
}

input[type="number"],
input[type="text"],
select {
  border: 1px solid var(--border);
  border-radius: 0.58rem;
  padding: 0.42rem 0.52rem;
  min-height: 34px;
  color: #1f2a4a;
  background: #ffffff;
  outline: none;
  transition: border-color 0.18s ease, box-shadow 0.18s ease;
}

input[type="number"] {
  width: 120px;
}

input[type="text"] {
  width: 280px;
}

input[type="number"]:focus,
input[type="text"]:focus,
select:focus {
  border-color: rgba(74, 103, 255, 0.62);
  box-shadow: 0 0 0 3px rgba(74, 103, 255, 0.12);
}

input[type="checkbox"] {
  accent-color: var(--primary);
}

table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  overflow: hidden;
  border: 1px solid var(--border-soft);
  border-radius: 0.78rem;
  background: #ffffff;
}

th,
td {
  text-align: left;
  border-bottom: 1px solid var(--border-soft);
  padding: 0.62rem 0.52rem;
  font-size: 0.83rem;
}

th {
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, "SF Mono", "Consolas", "Monaco", monospace;
  font-size: 0.76rem;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: #4b5a86;
  background: #f8faff;
  border-bottom: 1px solid var(--border);
}

tbody tr:nth-child(even) td {
  background: #fbfcff;
}

tbody tr:hover td {
  background: #f4f7ff;
}

tbody tr:last-child td {
  border-bottom: none;
}

/* Base pill: square with slightly rounded corners; same look on all pages and ticker */
.pill {
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, "SF Mono", "Consolas", "Monaco", monospace;
  display: inline-block;
  border: 1px solid rgba(130, 155, 255, 0.3);
  border-radius: 0.35rem;
  padding: 0.26rem 0.58rem;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  background: linear-gradient(135deg, rgba(35, 48, 100, 0.5), rgba(28, 40, 88, 0.4));
  color: #d0dcff;
  white-space: nowrap;
}

.pill a.pill,
a.pill {
  text-decoration: none;
  cursor: pointer;
  transition: filter 0.12s ease, transform 0.12s ease;
}

a.pill:hover {
  filter: brightness(0.96);
}

button.pill {
  cursor: pointer;
  font-family: inherit;
  transition: filter 0.12s ease;
}

button.pill:hover {
  filter: brightness(0.96);
}

/* Light-theme pills only (disabled for now) */
html[data-theme="light"] .pill {
  border: 1px solid var(--border);
  background: #f6f8ff;
  color: #364365;
}

html[data-theme="light"] .pill-status.status-on {
  color: var(--success);
  border-color: #7dd4a8;
  background: #d4f5e4;
}

html[data-theme="light"] .pill-status.status-off {
  color: #b83d5c;
  border-color: #f0b8c9;
  background: #fde8ee;
}

html[data-theme="light"] .pill-chart {
  color: #0d6b5c;
  border-color: #5ec4b0;
  background: #c8f0e8;
}

html[data-theme="light"] .token-trades-toggle {
  color: #0d7a4c;
  border-color: rgba(0, 180, 100, 0.45);
  background: linear-gradient(135deg, rgba(200, 245, 220, 0.9), rgba(180, 235, 205, 0.85));
  box-shadow: 0 0 8px rgba(0, 200, 120, 0.1);
}

html[data-theme="light"] .token-trades-toggle:hover {
  background: linear-gradient(135deg, rgba(210, 248, 228, 0.95), rgba(190, 240, 215, 0.9));
  box-shadow: 0 0 10px rgba(0, 200, 120, 0.15);
}

html[data-theme="light"] .pill-moonbag {
  color: #9a6700;
  border-color: #f0d78c;
  background: #fef9e7;
}

html[data-theme="light"] .pill-paid,
html[data-theme="light"] .pill-ad,
html[data-theme="light"] .pill-boost,
html[data-theme="light"] .pill-cto,
html[data-theme="light"] .pill-copy,
html[data-theme="light"] .pill-history,
html[data-theme="light"] .pill-blocked,
html[data-theme="light"] .pill-supply {
  border: 1px solid var(--border);
  background: #f6f8ff;
  color: #364365;
}
html[data-theme="light"] .pill-supply-at-cap {
  border-color: rgba(200, 120, 40, 0.5);
  background: linear-gradient(135deg, rgba(255, 230, 180, 0.6), rgba(255, 210, 150, 0.5));
  color: #a06020;
}
html[data-theme="light"] .pill-latest {
  border: 1px solid rgba(180, 50, 50, 0.6);
  background: linear-gradient(135deg, rgba(255, 200, 200, 0.5), rgba(255, 180, 180, 0.35));
  color: #b83030;
}
html[data-theme="light"] .pill-latest .pill-latest-icon {
  color: #b83030;
}

.mono {
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, "SF Mono", "Consolas", "Monaco", monospace;
}

.token-cell {
  display: flex;
  align-items: center;
  gap: 0.42rem;
  flex-wrap: wrap;
}

.token-copy-btn {
  padding: 0.17rem 0.46rem;
  border-radius: 0.45rem;
  font-size: 0.7rem;
  font-weight: 700;
}

.token-label {
  white-space: nowrap;
  font-weight: 700;
}

.positions-section-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  flex-wrap: wrap;
  margin-bottom: 1rem;
}

.positions-section-header h2 {
  margin: 0;
}

.positions-header-left {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}

/* Overview: Pump / DEX tabs above the cards — same pill radius as everywhere */
.overview-tabs {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.overview-tab {
  padding: 0.35rem 0.65rem;
  font-size: 0.85rem;
  cursor: pointer;
  border: 1px solid var(--border);
  border-radius: 0.35rem;
  background: var(--bg-soft, rgba(255, 255, 255, 0.06));
  color: var(--muted);
}
.overview-tab:hover { opacity: 0.9; }
.overview-tab.active {
  color: var(--primary, #6c8aff);
  border-color: rgba(74, 103, 255, 0.5);
  background: linear-gradient(135deg, rgba(74, 103, 255, 0.12), rgba(74, 103, 255, 0.06));
}
.page-overview .overview-tabs .pill.overview-tab {
  border-radius: 0.35rem;
}
.positions-section-header .positions-pagination {
  margin-bottom: 0;
  margin-left: auto;
}

.profile-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.65rem;
}

.profile-toggle .pill-profile {
  font-size: 0.8rem;
  padding: 0.35rem 0.5rem;
  border-radius: 0.35rem;
  color: var(--muted);
  border: 1px solid var(--border-soft);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.profile-toggle .pill-profile.pill-profile--icon {
  padding: 0.4rem;
}
.profile-toggle .pill-profile.pill-profile--icon svg {
  display: block;
}

.topbar-right .profile-toggle .pill-profile.pill-profile--icon {
  width: 2.25rem;
  height: 2.25rem;
  padding: 0;
  min-width: 2.25rem;
  min-height: 2.25rem;
}
.topbar-right .profile-toggle .pill-profile.pill-profile--icon svg {
  width: 1.1rem;
  height: 1.1rem;
}

.profile-toggle .pill-profile.active {
  color: #b8c8ff;
  border: 1px solid rgba(93, 114, 255, 0.65);
  background: linear-gradient(135deg, rgba(93, 114, 255, 0.4), rgba(70, 90, 200, 0.3));
  box-shadow: 0 0 0 1px rgba(93, 114, 255, 0.2);
}

.positions-filter-pill.active {
  color: var(--text);
  border-color: var(--accent);
  background: rgba(93, 114, 255, 0.15);
}

.profile-toggle .pill-profile:hover {
  filter: brightness(0.96);
}

.stop-sells-toggle {
  margin-left: 0.75rem;
  display: inline-flex;
  align-items: center;
}

.stop-sells-toggle .pill-stop-sells {
  font-size: 0.8rem;
  padding: 0.35rem 0.5rem;
  border-radius: 0.35rem;
  color: var(--muted);
  border: 1px solid var(--border);
  background: var(--card-bg);
  display: inline-flex;
  align-items: center;
  cursor: pointer;
}

.stop-sells-toggle .pill-stop-sells:hover {
  filter: brightness(0.96);
}

.stop-sells-toggle .pill-stop-sells.active {
  color: var(--text);
  border-color: var(--warning, #c9a227);
  background: rgba(201, 162, 39, 0.12);
}

.toast-host {
  position: fixed;
  bottom: 1.25rem;
  right: 1.25rem;
  z-index: 1000;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  pointer-events: none;
}
.toast-host .toast {
  pointer-events: auto;
  padding: 0.6rem 1rem;
  border-radius: 0.5rem;
  font-size: 0.875rem;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.2);
  cursor: pointer;
  max-width: 22rem;
}
.toast-host .toast-success {
  background: rgba(17, 131, 82, 0.95);
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.2);
}
.toast-host .toast-error {
  background: rgba(200, 58, 103, 0.95);
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.2);
}

.positions-watch-count {
  font-size: 0.78rem;
  margin-bottom: 0.4rem;
  min-height: 1.2em;
}

.positions-watch-count.muted {
  color: var(--muted);
}

.positions-cards {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.62rem;
}

.positions-empty {
  border: 1px dashed var(--border);
  border-radius: 0.72rem;
  background: #fbfcff;
  color: var(--muted);
  padding: 0.75rem 0.8rem;
  font-size: 0.84rem;
}

.positions-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  margin-bottom: 0.75rem;
  flex-wrap: wrap;
}

.positions-pagination .pill {
  padding: 0.4rem 0.75rem;
  font-size: 0.85rem;
  cursor: pointer;
  border: 1px solid var(--border);
  border-radius: 0.35rem;
  background: var(--surface);
  color: var(--text);
}

.positions-pagination .pill:hover:not(:disabled) {
  background: var(--surface-hover, rgba(255, 255, 255, 0.08));
}

.positions-pagination .pill:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.positions-pagination-label {
  font-size: 0.85rem;
  color: var(--muted);
}

/* Positions table toolbar: filter left, count right (mirrors pagination) */
.positions-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  flex-wrap: wrap;
  margin-bottom: 0.75rem;
}

.positions-toolbar-left {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.positions-mint-filter-input {
  min-width: 12rem;
  max-width: 20rem;
  padding: 0.4rem 0.75rem;
  font-size: 0.85rem;
  border: 1px solid var(--border);
  border-radius: 0.35rem;
  background: var(--surface);
  color: var(--text);
}

.positions-mint-filter-input::placeholder {
  color: var(--muted);
}

.positions-filter-reset-pill {
  padding: 0.4rem 0.75rem;
  font-size: 0.85rem;
  cursor: pointer;
  border: 1px solid var(--border);
  border-radius: 0.35rem;
  background: var(--surface);
  color: var(--muted);
}

.positions-filter-reset-pill--icon {
  padding: 0.4rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.positions-filter-reset-pill:hover {
  background: var(--surface-hover, rgba(255, 255, 255, 0.08));
  color: var(--text);
}

.positions-rug-filter-divider {
  color: var(--muted);
  font-size: 0.85rem;
  margin: 0 0.15rem;
  user-select: none;
}

.positions-rug-filter-pill {
  padding: 0.4rem 0.75rem;
  font-size: 0.85rem;
  cursor: pointer;
  border: 1px solid var(--border);
  border-radius: 0.35rem;
  background: var(--surface);
  color: var(--muted);
}

.positions-rug-filter-toggle {
  padding: 0.4rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.positions-rug-filter-pill:hover {
  background: var(--surface-hover, rgba(255, 255, 255, 0.08));
  color: var(--text);
}

.positions-rug-filter-pill.active {
  color: var(--text);
  border-color: var(--accent);
  background: rgba(93, 114, 255, 0.15);
}

.positions-launchpad-filter {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}
.positions-launchpad-pill {
  padding: 0.4rem 0.65rem;
  font-size: 0.85rem;
  cursor: pointer;
  border: 1px solid var(--border);
  border-radius: 0.35rem;
  background: var(--surface);
  color: var(--muted);
}
.positions-launchpad-pill:hover {
  background: var(--surface-hover, rgba(255, 255, 255, 0.08));
  color: var(--text);
}
.positions-launchpad-pill.active {
  color: var(--text);
  border-color: var(--accent);
  background: rgba(93, 114, 255, 0.15);
}

/* Positions page: reset, rug, all, pump, dex — same pill radius as everywhere */
.page-positions .positions-toolbar-left .pill.positions-filter-reset-pill,
.page-positions .positions-toolbar-left .pill.positions-rug-filter-pill,
.page-positions .positions-toolbar-left .pill.positions-launchpad-pill {
  border-radius: 0.35rem;
}

/* Position card: shiny glass (same as PnL card) */
.position-card {
  position: relative;
  border: 1px solid rgba(148, 170, 255, 0.2);
  border-radius: 1rem;
  padding: 0.72rem 0.78rem;
  background: linear-gradient(135deg, rgba(28, 40, 80, 0.5), rgba(18, 28, 55, 0.35));
  backdrop-filter: blur(14px) saturate(160%);
  -webkit-backdrop-filter: blur(14px) saturate(160%);
  box-shadow:
    0 8px 32px rgba(0, 0, 0, 0.25),
    inset 0 1px 0 rgba(255, 255, 255, 0.08),
    inset 0 -1px 0 rgba(0, 0, 0, 0.15);
  display: flex;
  flex-direction: column;
  gap: 0.42rem;
  transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
  overflow: visible;
}

.position-card:hover {
  transform: translateY(-2px);
  border-color: rgba(148, 170, 255, 0.35);
  box-shadow:
    0 18px 40px rgba(0, 0, 0, 0.3),
    inset 0 1px 0 rgba(255, 255, 255, 0.1),
    inset 0 -1px 0 rgba(0, 0, 0, 0.12),
    var(--glow-primary);
}

.position-line {
  display: flex;
  align-items: center;
  gap: 0.46rem;
  flex-wrap: wrap;
}

.position-line-top {
  justify-content: space-between;
}

.position-token-meta {
  display: inline-flex;
  align-items: center;
  gap: 0.42rem;
  flex-wrap: wrap;
}

.token-ticker {
  font-weight: 700;
}

.position-token-age-bold {
  font-weight: 700;
}

.position-badges {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  flex-wrap: wrap;
}

.position-line-mid .mono {
  color: #4a5c8e;
}

.position-line-stats .pill {
  font-weight: 700;
}

.position-line-pnl {
  border-top: 1px dashed var(--border-soft);
  padding-top: 0.4rem;
  justify-content: center;
  flex-wrap: nowrap;
  white-space: nowrap;
  min-width: 0;
  overflow-x: auto;
}

.position-line-pnl .position-metric-label {
  font-size: 0.82rem;
}

.position-line-pnl .position-metric-value {
  font-size: 1.05rem;
  white-space: nowrap;
}

/* Sell pills in a recessed cell at bottom of card; no border line above */
.card-actions-sell-cell {
  margin-top: 0;
  border: none;
  padding: 0;
  overflow: visible;
}

.card-actions-sell-cell .position-sell-cell {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.25rem;
  min-height: 2.5rem;
  padding-top: 0.9rem;
  padding-bottom: 0.9rem;
  padding-left: 0.85rem;
  padding-right: 0.85rem;
  overflow: visible;
}

.page-overview .card-actions-sell-cell .position-sell-cell {
  min-height: 3.25rem;
  padding-top: 1.1rem;
  padding-bottom: 1.1rem;
}

.position-sell-cell-pills-group {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.6rem;
  flex-wrap: nowrap;
  position: relative;
  z-index: 1;
  min-width: 0;
  overflow-x: auto;
  overflow-y: visible;
  padding: 0.35em 0;
}

.position-sell-cell-pills-group .pill-moonbag-condensed {
  font-size: 0.8rem;
}

.card-actions-sell-cell .position-sell-cell .position-sell-pills {
  position: relative;
  z-index: 1;
  flex-shrink: 0;
}

.card-actions-sell-cell .position-sell-cell .token-trades-host {
  margin: 0;
  padding: 0;
  border: none;
  flex-shrink: 0;
  position: relative;
  z-index: 1;
}

.position-sell-cell-pills-group > .pill-moonbag-condensed {
  flex-shrink: 0;
}

.position-sell-pills {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  flex-wrap: nowrap;
}

.manual-sell-pill {
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, "SF Mono", "Consolas", "Monaco", monospace;
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  padding: 0.3rem 0.5rem;
  font-size: 0.7rem;
}

.manual-sell-pill .manual-sell-icon {
  flex-shrink: 0;
}

.manual-sell-pill.manual-sell-dump .manual-sell-icon-dump {
  color: inherit;
}

.manual-sell-actions {
  border-top: 1px dashed var(--border-soft);
  padding-top: 0.4rem;
}

.card-actions {
  border-top: 1px dashed var(--border-soft);
  padding-top: 0.4rem;
}

.card-actions-sell-cell.card-actions {
  border-top: none;
  padding-top: 0;
}

.manual-sell-buttons {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  flex-wrap: wrap;
}

.manual-sell-btn {
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, "SF Mono", "Consolas", "Monaco", monospace;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  padding: 0.26rem 0.58rem;
  border-radius: 0.35rem;
  border: 1px solid transparent;
  color: #f8fbff;
  background: linear-gradient(135deg, #3f7cff 0%, #2958d9 100%);
  box-shadow: 0 2px 8px rgba(45, 88, 202, 0.24);
  transition: transform 120ms ease, filter 140ms ease, box-shadow 140ms ease;
}

.manual-sell-btn:hover {
  filter: brightness(1.05);
  transform: translateY(-1px);
  box-shadow: 0 8px 14px rgba(45, 88, 202, 0.32);
}

.manual-sell-btn:active {
  transform: translateY(0);
  filter: brightness(0.98);
}

.manual-sell-btn[disabled] {
  opacity: 0.55;
  cursor: wait;
  box-shadow: none;
  transform: none;
}

.manual-sell-dump {
  background: linear-gradient(135deg, #ee496d 0%, #cc2f58 100%);
  box-shadow: 0 4px 10px rgba(211, 58, 97, 0.28);
}

.manual-sell-dump:hover {
  box-shadow: 0 8px 14px rgba(211, 58, 97, 0.34);
}

.manual-sell-status {
  margin-top: 0.24rem;
  font-size: 0.72rem;
  font-weight: 700;
}

.card-actions-status {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  flex-wrap: wrap;
}

.never-buy-actions {
  border-top: 1px dashed var(--border-soft);
  padding-top: 0.4rem;
}

.never-buy-btn {
  background: linear-gradient(135deg, #6c7387 0%, #4d556d 100%);
  box-shadow: 0 4px 10px rgba(70, 80, 108, 0.24);
}

.never-buy-btn:hover {
  box-shadow: 0 8px 14px rgba(70, 80, 108, 0.32);
}

.remove-card-btn {
  background: linear-gradient(135deg, #7d8aa8 0%, #5d6988 100%);
  box-shadow: 0 4px 10px rgba(87, 102, 134, 0.24);
}

.remove-card-btn:hover {
  box-shadow: 0 8px 14px rgba(87, 102, 134, 0.32);
}

.manual-sell-buttons .token-copy-btn {
  border-radius: 0.35rem;
}

.pill-never-buy {
  color: #5a6275;
  border-color: #c8cfde;
  background: #eef1f8;
}

.manual-sell-status-pending {
  color: #4e5f87;
}

.manual-sell-status-ok {
  color: #1d8a53;
}

.manual-sell-status-error {
  color: #b9385f;
}

.position-metric-label {
  font-size: 0.72rem;
  color: #65739d;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  font-weight: 700;
}

.position-metric-value {
  font-size: 0.9rem;
  font-weight: 800;
  margin-right: 0.5rem;
}

.token-trades-host {
  margin-top: 0.08rem;
  border-top: 1px solid var(--border-soft);
  padding-top: 0.45rem;
}

/* No divider line above Show trades pill when inside position card */
.position-card .token-trades-host,
.position-below-grid .token-trades-host,
.position-actions-strip .token-trades-host,
.position-card-in-modal .position-actions-strip--bottom .token-trades-host {
  margin-top: 0;
  border-top: none;
  padding-top: 0;
}

.token-trades-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.token-trades-panel {
  margin-top: 0.32rem;
  border: 1px solid var(--border-soft);
  border-radius: 0.62rem;
  background: #fafcff;
  padding: 0.45rem 0.52rem;
}

.token-trades-body {
  max-height: 200px;
  overflow: auto;
  line-height: 1.45;
}

.token-trades-body > div + div {
  margin-top: 0.22rem;
}

/* Trades modal (popup) */
.trades-modal {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  box-sizing: border-box;
}

.trades-modal[hidden] {
  display: none;
}

.trades-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.5);
  cursor: pointer;
}

.trades-modal-box {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 48rem;
  max-height: 85vh;
  display: flex;
  flex-direction: column;
  border: 1px solid rgba(80, 100, 180, 0.35);
  border-radius: 0.9rem;
  background: linear-gradient(160deg, rgba(12, 20, 48, 0.95), rgba(8, 14, 38, 0.9));
  box-shadow:
    0 20px 40px rgba(0, 0, 0, 0.4),
    inset 0 1px 2px rgba(0, 0, 0, 0.35),
    inset 0 -1px 0 rgba(255, 255, 255, 0.03);
  overflow: hidden;
}

.trades-modal-box::before {
  content: "";
  position: absolute;
  inset: 3px;
  border-radius: 0.65rem;
  background: rgba(0, 0, 0, 0.2);
  box-shadow: inset 0 2px 8px rgba(0, 0, 0, 0.35);
  pointer-events: none;
}

.trades-modal-header,
.trades-modal-body,
.trades-modal-pager {
  position: relative;
  z-index: 1;
}

.trades-modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 0.65rem 0.85rem;
  border-bottom: 1px solid rgba(149, 169, 255, 0.2);
  flex-shrink: 0;
}

.trades-modal-title {
  font-weight: 700;
  font-size: 0.9rem;
}

.trades-modal-close {
  padding: 0.2rem 0.4rem;
  border: none;
  border-radius: 0.35rem;
  background: transparent;
  font-size: 1.4rem;
  line-height: 1;
  cursor: pointer;
  opacity: 0.7;
}

.trades-modal-close:hover {
  opacity: 1;
  background: rgba(0, 0, 0, 0.06);
}

.trades-modal-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  padding: 0.65rem 0.85rem;
  font-size: 0.8rem;
  line-height: 1.45;
}

.trades-modal-pager {
  flex-shrink: 0;
  padding: 0.5rem 0.85rem;
  border-top: 1px solid rgba(149, 169, 255, 0.2);
}

/* PnL section: inside header panel, below topbar */
.header-panel .pnl-section.grid {
  padding: 0;
  grid-template-columns: 1fr;
}
.header-panel .pnl-section .pnl-card {
  min-width: 0;
}

/* PnL card inside header panel: no own glass (panel provides it) */
.header-panel .pnl-card {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  padding-top: 1.35rem;
  padding-bottom: 0.4rem;
}

.header-panel .pnl-card::after {
  display: none;
}

/* PnL card when NOT in header panel (e.g. other pages): keep glass */
.pnl-card {
  position: relative;
  background: linear-gradient(135deg, rgba(24, 38, 85, 0.55), rgba(18, 28, 65, 0.4)) !important;
  backdrop-filter: blur(14px) saturate(160%);
  -webkit-backdrop-filter: blur(14px) saturate(160%);
  border: 1px solid rgba(100, 130, 255, 0.25) !important;
  box-shadow:
    0 8px 32px rgba(0, 0, 0, 0.25),
    inset 0 1px 0 rgba(140, 165, 255, 0.12),
    inset 0 -1px 0 rgba(0, 0, 0, 0.15);
}

.pnl-card::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 4.5rem;
  background: linear-gradient(to bottom, transparent, rgba(10, 18, 40, 0.97));
  pointer-events: none;
  border-radius: 0 0 1rem 1rem;
}

/* Positions section: first content in .wrap */
.wrap > .positions-section {
  margin-top: 0;
}

/* All dashboard pages: push main content down so it clears the fixed header (no overlap) */
.page-overview .wrap,
.page-positions .wrap,
.page-dashboard .wrap,
.page-settings .wrap,
.page-scripts .wrap,
.page-system .wrap,
.page-docs .wrap {
  padding-bottom: 2.5rem;
}
.page-overview .wrap > .positions-section,
.page-positions .wrap > .main-content,
.page-dashboard .wrap > .main-content,
.page-settings .wrap > .main-content,
.page-scripts .wrap > .main-content,
.page-system .wrap > .main-content,
.page-docs .wrap > .main-content {
  margin-top: 24.5rem;
  margin-bottom: 0;
  transition: margin-top 0.25s ease;
}
/* When bar is collapsed (topbar + ticker visible; PnL hero hidden), space so content clears the ticker */
.dashboard-bar-collapsed.page-overview .wrap > .positions-section,
.dashboard-bar-collapsed.page-positions .wrap > .main-content,
.dashboard-bar-collapsed.page-dashboard .wrap > .main-content,
.dashboard-bar-collapsed.page-settings .wrap > .main-content,
.dashboard-bar-collapsed.page-scripts .wrap > .main-content,
.dashboard-bar-collapsed.page-system .wrap > .main-content,
.dashboard-bar-collapsed.page-docs .wrap > .main-content {
  margin-top: 8.5rem;
}
/* All dashboard pages: main content card full width + same inner padding */
.page-overview .wrap > .positions-section,
.page-positions .wrap > .main-content,
.page-dashboard .wrap > .main-content,
.page-settings .wrap > .main-content,
.page-scripts .wrap > .main-content,
.page-system .system-single-card,
.page-docs .wrap > .main-content {
  width: 100%;
  box-sizing: border-box;
  padding: 1.25rem 1rem 2rem;
}

/* CHECKPOINT 3: Card grid for index.html (dashboard). One row div per position, CSS Grid columns. */
/* CHECKPOINT 7: 3-row layout. Header and each card have 3 horizontal bands. */
.dashboard-grid {
  /* Container; header and rows stack vertically */
}
.dashboard-grid-header {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  padding: 0.5rem 0.5rem 0.5rem 0;
  margin-bottom: 0.5rem;
  border-bottom: 1px solid rgba(100, 130, 255, 0.25);
}
.dashboard-grid-header-row {
  display: grid;
  gap: 0 0.75rem;
  align-items: center;
}
.dashboard-grid-header-row--1 {
  grid-template-columns: 4.5rem minmax(8rem, 1fr) 4rem 6rem 6rem;
}
.dashboard-grid-header-row--2 {
  grid-template-columns: 5rem 5rem 5rem 6rem;
}
.dashboard-grid-header-row--3 {
  grid-template-columns: 5rem 5rem 6rem 6rem;
}
.dashboard-grid-header .grid-col {
  font-size: 0.75rem;
  font-weight: 700;
  color: var(--muted, #6b7280);
}
.dashboard-grid-rows {
  display: block;
}
.position-row-card {
  display: flex;
  flex-direction: column;
  gap: 0.9rem;
  padding: 1rem 1.25rem;
  margin-bottom: 0.75rem;
  border-radius: 0.75rem;
  background: linear-gradient(145deg, rgba(90, 115, 255, 0.06), rgba(0, 0, 0, 0.15));
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, "SF Mono", "Consolas", "Monaco", monospace;
  /* Raised + soft glowing edge: no sharp border */
  box-shadow:
    0 0 0 1px rgba(100, 130, 255, 0.08),
    0 0 20px rgba(100, 130, 255, 0.06),
    0 4px 12px rgba(0, 0, 0, 0.12),
    0 8px 24px rgba(0, 0, 0, 0.08);
  transition: box-shadow 0.25s ease, background 0.2s ease;
}
.position-row-card:hover {
  background: linear-gradient(145deg, rgba(90, 115, 255, 0.1), rgba(0, 0, 0, 0.2));
  box-shadow:
    0 0 0 1px rgba(100, 130, 255, 0.12),
    0 0 28px rgba(100, 130, 255, 0.1),
    0 6px 16px rgba(0, 0, 0, 0.14),
    0 12px 32px rgba(0, 0, 0, 0.1);
}

/* Title row: status dot | token name | ticker | mint (xxxx…xxxx) | copy | pills */
.dashboard-card-title-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 1rem;
  margin-bottom: 0.35rem;
  margin-top: 0;
  min-width: 0;
}
.dashboard-card-title-status {
  flex-shrink: 0;
}
.dashboard-card-title-name {
  font-weight: 700;
  font-size: 1.1rem;
  color: var(--text, #e7eeff);
  white-space: nowrap;
  flex-shrink: 0;
}
.dashboard-card-title-ticker {
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--text-muted, #98abde);
}
.dashboard-card-title-mint {
  font-size: 0.75rem;
  color: var(--text-muted, #98abde);
}
.dashboard-card-title-copy {
  margin: 0;
  padding: 0.25rem;
  background: none;
  border: none;
  color: var(--text-muted, #98abde);
  cursor: pointer;
  border-radius: 0.25rem;
  flex-shrink: 0;
}
.dashboard-card-title-copy:hover {
  color: var(--text, #e7eeff);
}
.dashboard-card-title-pills {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.2rem;
}
.dashboard-card-title-pills .pill {
  font-size: 0.65rem;
  padding: 0.18rem 0.32rem;
  border-radius: 0.2rem;
}
.dashboard-card-title-pills .pill-latest .pill-latest-icon {
  width: 0.7rem;
  height: 0.7rem;
}
.dashboard-card-title-chart.pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.65rem;
  padding: 0.18rem 0.32rem;
  border-radius: 0.2rem;
  text-decoration: none;
}
.dashboard-card-title-chart.pill svg {
  width: 0.85rem;
  height: 0.85rem;
}

/* Card: title | one open middle (aside + rows + chart) | trades */
.dashboard-card-inner {
  display: grid;
  grid-template-columns: 5rem 1fr 520px;
  grid-template-rows: auto 1fr auto;
  grid-template-areas:
    "title title chart"
    "aside rows chart"
    "trades trades trades";
  gap: 0 1rem;
  min-width: 0;
  align-items: start;
}
.dashboard-card-inner .dashboard-card-aside,
.dashboard-card-inner .dashboard-card-rows,
.dashboard-card-inner .dashboard-card-chart-col {
  align-self: stretch;
  min-height: 0;
}

/* Small screens / mobile: hide chart, single-column middle so card stays readable */
@media (max-width: 900px) {
  .dashboard-card-inner {
    grid-template-columns: 5rem 1fr;
    grid-template-rows: auto 1fr auto;
    grid-template-areas:
      "title title"
      "aside rows"
      "trades trades";
  }
  .dashboard-card-chart-col {
    display: none !important;
  }
}

.dashboard-card-trades-row {
  grid-area: trades;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  min-width: 0;
  padding-top: 0.75rem;
  margin-top: 0.75rem;
}
.dashboard-card-trades-row-label {
  font-size: 0.65rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  color: var(--text-muted, #98abde);
  flex-shrink: 0;
}
.dashboard-card-trades-row--empty {
  justify-content: flex-start;
}
.dashboard-card-trades-row--empty .dashboard-card-trades-scroll {
  max-height: none;
  display: flex;
  align-items: center;
  min-height: 2rem;
}
/* Action pills (30, 60, Dump, Block) in aside: same style as title pills (New, Ad, chart) */
.dashboard-card-aside-actions {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.35rem;
  width: 100%;
  margin-top: 0.5rem;
  min-width: 0;
}
.dashboard-card-aside-actions-row {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0.2rem;
  flex-wrap: nowrap;
}
.dashboard-card-aside-actions .pill {
  font-size: 0.65rem;
  padding: 0.18rem 0.32rem;
  border-radius: 0.2rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.2rem;
  flex-shrink: 0;
}
.dashboard-card-aside-actions .pill svg {
  width: 0.85rem;
  height: 0.85rem;
  flex-shrink: 0;
}
.dashboard-card-aside-actions .dump-never-buy-btn {
  appearance: none;
  -webkit-appearance: none;
  font: inherit;
}
/* Token image as link (pump.fun) inside aside */
.dashboard-card-token-image-link {
  display: block;
  line-height: 0;
}
.dashboard-card-token-image-link:hover {
  opacity: 0.9;
}
.dashboard-card-trades-scroll {
  max-height: 5.5rem;
  overflow-y: auto;
  overflow-x: hidden;
  font-size: 0.7rem;
  min-width: 0;
}
.trade-detail-table--compact {
  width: max-content;
  max-width: 100%;
  border-collapse: collapse;
}
.trade-detail-table--compact td {
  padding: 0.2rem 0.25rem;
  text-align: left;
  white-space: nowrap;
}
.trade-detail-table--compact td.side-with-status {
  padding-right: 0.2rem;
  white-space: nowrap;
}
.trade-detail-table--compact td:nth-child(2) {
  padding-left: 0;
  padding-right: 0.2rem;
}
.trade-detail-table--compact td.trade-supply-cell {
  padding-left: 0;
  padding-right: 0.25rem;
}
.trade-detail-table--compact .side-with-status {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}
.trade-detail-table--compact .trade-icon--buy {
  color: #22c55e;
}
.trade-detail-table--compact .trade-icon--sell {
  color: #ef4444;
}
.trade-detail-table--compact .trade-supply-cell {
  font-size: 0.65rem;
  color: var(--text-muted, #98abde);
}
.trade-detail-table--compact .trade-date-cell {
  font-size: 0.65rem;
  color: var(--text-muted, #98abde);
}
.trade-detail-table--compact td.trade-date-cell {
  text-align: right;
  padding-left: 0.5rem;
}
/* No row hover on compact fills table so the gap next to the icon doesn’t feel like an extra column */
.trade-detail-table--compact tbody tr:hover td {
  background: transparent;
}
.dashboard-card-row-1-extended {
  grid-area: title;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.4rem;
  min-width: 0;
  padding-bottom: 0.5rem;
  margin-bottom: 0.25rem;
}
.dashboard-card-row-1-title {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.4rem;
  min-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}
.dashboard-card-row-1-title .dashboard-card-title-status,
.dashboard-card-row-1-title .dashboard-card-title-name,
.dashboard-card-row-1-title .dashboard-card-title-ticker,
.dashboard-card-row-1-title .dashboard-card-title-mint-copy,
.dashboard-card-row-1-title .dashboard-card-title-pills {
  flex-shrink: 0;
}
.dashboard-card-title-mint-copy {
  display: inline-flex;
  align-items: center;
  gap: 0.15rem;
}
.dashboard-card-row-1-closed {
  flex-shrink: 0;
  font-size: 0.8rem;
}
.dashboard-card-row-1-right-label {
  font-size: 0.65rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--text-muted, #98abde);
  margin-right: 0.2rem;
}
.dashboard-card-title-age {
  white-space: nowrap;
}
.dashboard-card-aside {
  grid-area: aside;
}
.dashboard-card-rows {
  grid-area: rows;
}
.dashboard-card-chart-col {
  grid-area: chart;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: stretch;
}
.dashboard-card-chart-container {
  flex: 1 1 auto;
  min-height: 180px;
  width: 100%;
  min-width: 0;
  background: rgba(0, 0, 0, 0.2);
  border-radius: 0.5rem;
}
.dashboard-card-chart-container--empty {
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--text-muted, #98abde);
}
/* DexScreener embed: aspect-ratio wrapper; lower % = shorter chart height */
.dexscreener-embed {
  position: relative;
  width: 100%;
  padding-bottom: 90%;
}
@media (min-width: 1400px) {
  .dexscreener-embed {
    padding-bottom: 48%;
  }
}
.dexscreener-embed iframe {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  border: 0;
}
.dashboard-card-aside {
  flex: 0 0 auto;
  width: 7rem;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  padding: 0.5rem 1rem 0.5rem 0;
}
.dashboard-card-aside-icon {
  display: flex;
  align-items: center;
  justify-content: center;
}
.dashboard-card-aside-pnl {
  margin-top: 0.35rem;
  margin-bottom: 0.25rem;
  font-size: 0.95rem;
  font-weight: 600;
  text-align: center;
  line-height: 1.25;
}
.dashboard-card-aside-pnl.is-up {
  color: #22c55e;
}
.dashboard-card-aside-pnl.is-down {
  color: #ef4444;
}
.dashboard-card-aside-pnl.muted {
  color: var(--text-muted, #98abde);
}
.dashboard-card-aside-pnl-pct {
  font-size: 0.85rem;
  font-weight: 500;
  opacity: 0.9;
}
.dashboard-card-rows {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding: 0.5rem 1rem 0.5rem 0;
  justify-content: flex-start;
}

/* Middle rows: stats grid (Cost basis/Qty/Entry/Current) + PnL row (Realized/Leg/Total) — PnL-card inspired */
.dashboard-card-stats-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.35rem;
}
.dashboard-card-stat {
  border-radius: 0.4rem;
  padding: 0.5rem 0.45rem;
  background: linear-gradient(145deg, rgba(40, 55, 110, 0.35), rgba(8, 12, 28, 0.5));
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  min-height: 0;
  transition: box-shadow 0.2s ease;
}
.dashboard-card-stat:hover {
  box-shadow: inset 0 1px 0 rgba(140, 165, 255, 0.1);
}
.dashboard-card-stat span {
  display: block;
  font-size: 0.6rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: rgba(160, 178, 230, 0.85);
  margin-bottom: 0.15rem;
}
.dashboard-card-stat strong {
  font-size: 0.88rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: #f0f4ff;
  line-height: 1.25;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.2);
}

.dashboard-card-pnl-row {
  display: grid;
  grid-template-columns: 1fr 1fr 1.15fr;
  gap: 0.4rem;
  align-items: stretch;
}
.dashboard-card-pnl-cell {
  border-radius: 0.35rem;
  padding: 0.55rem 0.5rem;
  background: linear-gradient(160deg, rgba(18, 28, 58, 0.75), rgba(6, 10, 24, 0.65));
  box-shadow: inset 0 1px 0 rgba(140, 165, 255, 0.1), inset 0 -1px 0 rgba(0, 0, 0, 0.25);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 0.2rem;
  min-width: 0;
  transition: box-shadow 0.2s ease;
}
.dashboard-card-pnl-cell:hover {
  box-shadow: inset 0 1px 0 rgba(140, 165, 255, 0.12), 0 0 14px rgba(93, 114, 255, 0.08);
}
.dashboard-card-pnl-cell--hero {
  background: linear-gradient(160deg, rgba(22, 35, 72, 0.8), rgba(10, 16, 38, 0.7));
  box-shadow: inset 0 1px 0 rgba(140, 165, 255, 0.14), inset 0 -1px 0 rgba(0, 0, 0, 0.3);
}
.dashboard-card-pnl-cell span:first-child {
  font-size: 0.6rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: rgba(170, 188, 240, 0.9);
}
.dashboard-card-pnl-cell strong {
  font-size: 0.95rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.2;
  color: #f0f4ff;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.25);
}
.dashboard-card-pnl-cell--hero strong {
  font-size: 1.05rem;
}
.dashboard-card-pnl-cell .position-pnl-pct-line {
  font-size: 0.75rem;
  font-weight: 600;
  opacity: 0.95;
}
.dashboard-card-pnl-cell strong.is-up { color: var(--success, #22c55e); }
.dashboard-card-pnl-cell strong.is-down { color: var(--danger, #ef4444); }
.dashboard-card-pnl-cell .position-pnl-pct-line.is-up { color: var(--success, #22c55e); }
.dashboard-card-pnl-cell .position-pnl-pct-line.is-down { color: var(--danger, #ef4444); }
.dashboard-card-pnl-cell strong.muted,
.dashboard-card-pnl-cell .position-pnl-pct-line.muted { color: var(--text-muted, #98abde); }

@media (max-width: 380px) {
  .dashboard-card-stats-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .dashboard-card-pnl-row {
    grid-template-columns: 1fr 1fr;
  }
  .dashboard-card-pnl-cell--hero {
    grid-column: span 2;
  }
}

.dashboard-card-rows > .dashboard-card-row-3-and-trades {
  padding-bottom: 0;
}
.dashboard-card-copy-btn {
  color: var(--text-muted, #98abde);
}
.dashboard-card-copy-btn:hover {
  color: var(--text, #e7eeff);
}
.dashboard-card-chart-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--text-muted, #98abde);
}
.dashboard-card-chart-link:hover {
  color: var(--text, #e7eeff);
}
.dashboard-card-aside .dashboard-card-token-image {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  object-fit: cover;
  background: var(--bg, #0f1219);
}
.dashboard-card-token-placeholder {
  display: block;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: rgba(100, 130, 255, 0.15);
}

.dashboard-card-row {
  display: grid;
  align-items: center;
  gap: 0.75rem 1.5rem;
}
.dashboard-card-row--1 {
  grid-template-columns: 5.5rem;
}
.dashboard-card-row--2 {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: 0 2.5rem;
  align-items: flex-end;
  justify-content: space-between;
}
.dashboard-card-row--2 .grid-col-with-label {
  flex: 1 1 0;
  min-width: 5rem;
  max-width: 6.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  align-items: flex-start;
}
.dashboard-card-row--2 .grid-col-label {
  min-height: 1.35em;
  line-height: 1.35;
}
.dashboard-card-row--2 .grid-col-with-label .grid-col-value {
  font-weight: 600;
  font-size: 0.85rem;
  line-height: 1.3;
}
.position-row-card .grid-col-label {
  display: block;
  font-size: 0.65rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  color: var(--text-muted, #98abde);
  margin-bottom: 0.15rem;
}
.position-row-card .grid-col {
  font-size: 0.8rem;
  min-width: 0;
  padding: 0.15rem 0;
}
.page-dashboard .grid-col-actions {
  display: flex;
  align-items: center;
  justify-content: center;
}
.dashboard-grid-loading,
.dashboard-grid-empty,
.dashboard-grid-error {
  padding: 1.5rem;
  text-align: center;
}

/* Dashboard index: expand/collapse trades — icon on same row as row 3 */
.dashboard-card-row-3-and-trades {
  flex: 1 1 auto;
  min-width: 0;
}
.dashboard-card-trades-toggle-wrap {
  flex-shrink: 0;
}
.dashboard-card-trades-toggle {
  font: inherit;
  font-size: 0.75rem;
  color: var(--text-muted, #98abde);
  background: none;
  border: none;
  padding: 0.25rem;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.35rem;
}
.dashboard-card-trades-toggle:hover {
  color: var(--text, #e7eeff);
}
.dashboard-card-trades-toggle .dashboard-card-trades-icon[hidden] {
  display: none;
}
.dashboard-card-trades-toggle .dashboard-card-trades-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.dashboard-card-trades-content[hidden] {
  display: none;
}
.dashboard-card-trades-content {
  margin-top: 1.25rem;
  padding-top: 1rem;
  overflow-x: auto;
  width: 100%;
}
.dashboard-card-trades-inner {
  font-size: 0.8rem;
  min-width: 0;
}
.dashboard-card-trades-inner .trade-detail-table {
  font-size: 0.75rem;
  width: 100%;
  border-collapse: collapse;
}
.dashboard-card-trades-inner .trade-detail-table thead th {
  padding: 0.35rem 0.5rem;
  text-align: left;
  font-weight: 600;
  color: var(--text-muted, #98abde);
  border-bottom: 1px solid var(--border, rgba(255,255,255,0.1));
}
.dashboard-card-trades-inner .trade-detail-table tbody td {
  padding: 0.35rem 0.5rem;
  border-bottom: 1px solid rgba(255,255,255,0.06);
  color: var(--text, #e7eeff);
}
.dashboard-card-trades-inner .trade-detail-table .side-with-status {
  white-space: nowrap;
}
.dashboard-card-trades-inner .trade-detail-table .status-icon--ok {
  color: #6ee7b7;
}
.dashboard-card-trades-inner .trade-detail-table .status-icon--fail {
  color: #f87171;
}

.pnl-panel {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.pnl-hero {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  padding: 0.6rem;
  border: 1px solid rgba(100, 130, 255, 0.25);
  border-radius: 0.75rem;
  background: linear-gradient(145deg, rgba(90, 115, 255, 0.08), rgba(0, 0, 0, 0.22));
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow:
    inset 0 1px 0 rgba(140, 165, 255, 0.1),
    inset 0 2px 10px rgba(0, 0, 0, 0.2),
    0 2px 8px rgba(0, 0, 0, 0.1);
}

.pnl-hero-cell {
  display: flex;
  flex: 1;
  align-items: center;
  justify-content: center;
  min-width: 0;
  border-radius: 0.5rem;
  padding: 0.85rem 0.85rem;
  background: linear-gradient(145deg, rgba(90, 115, 255, 0.06), rgba(0, 0, 0, 0.16));
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  box-shadow:
    inset 0 1px 0 rgba(140, 165, 255, 0.08),
    inset 0 -1px 0 rgba(0, 0, 0, 0.1);
}

.pnl-hero-cell.pnl-hero-left {
  margin-right: 0.25rem;
}

.pnl-hero-cell.pnl-hero-right {
  margin-left: 0.25rem;
}

.pnl-hero-line {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: center;
  gap: 0.4rem;
}

.pnl-hero-right-sep {
  color: var(--border-soft);
  font-weight: 700;
  margin: 0 0.1rem;
}

.pnl-hero-divider {
  display: none;
}

.pnl-hero-label {
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #5c6eb5;
}

.pnl-hero-value {
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, "SF Mono", "Consolas", "Monaco", monospace;
  font-size: 1.45rem;
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1;
  display: inline-flex;
  align-items: center;
}

.pnl-hero-tokens-value {
  font-size: 1.45rem;
  font-weight: 700;
  color: #1e2d5c;
  letter-spacing: -0.02em;
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, "SF Mono", "Consolas", "Monaco", monospace;
}

.pnl-hero-value.pnl-flash,
.pnl-hero-tokens-value.pnl-flash {
  animation: pnl-flash 0.6s ease-out;
  border-radius: 0.25rem;
}

@keyframes pnl-flash {
  0% { background: rgba(90, 115, 255, 0.25); }
  100% { background: transparent; }
}

.pnl-hero-pill {
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, "SF Mono", "Consolas", "Monaco", monospace;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.22rem 0.5rem;
  border-radius: 0.35rem;
  border: 1px solid var(--border-soft);
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1;
  transform: translateY(0.05em);
  letter-spacing: 0.02em;
  background: #f7f9ff;
  min-width: 4em;
  text-align: center;
  box-sizing: border-box;
}

.is-up {
  color: var(--success);
}

.is-down {
  color: var(--danger);
}

.pnl-stats-wrap {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}

.pnl-stats-grid {
  display: grid;
  gap: 0.4rem;
}

.pnl-stats-grid--4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.pnl-stats-grid--5 {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.pnl-stat {
  border: 1px solid rgba(100, 130, 255, 0.22);
  border-radius: 0.5rem;
  padding: 0.85rem 0.7rem;
  background: linear-gradient(145deg, rgba(90, 115, 255, 0.06), rgba(0, 0, 0, 0.18));
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  box-shadow:
    inset 0 1px 0 rgba(140, 165, 255, 0.08),
    inset 0 -1px 0 rgba(0, 0, 0, 0.1);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 0;
  transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.pnl-stat:hover {
  transform: translateY(-2px);
  border-color: rgba(100, 130, 255, 0.4);
  box-shadow:
    0 12px 28px rgba(0, 0, 0, 0.25),
    inset 0 1px 0 rgba(140, 165, 255, 0.12),
    inset 0 -1px 0 rgba(0, 0, 0, 0.12),
    0 0 20px rgba(93, 114, 255, 0.15);
}

.pnl-stat span {
  display: block;
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #5c6eb5;
  margin-bottom: 0.12rem;
  font-weight: 700;
}

.pnl-stat strong {
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, "SF Mono", "Consolas", "Monaco", monospace;
  color: #27345e;
}

.pnl-stat strong.is-up {
  color: var(--success);
}

.pnl-stat strong.is-down {
  color: var(--danger);
}

.pnl-stat.pnl-stat--no-route strong,
.pnl-stat.pnl-stat--rug strong {
  color: var(--warning, #e6a23c);
}

.pnl-pos {
  color: var(--success);
  font-weight: 700;
}

.pnl-neg {
  color: var(--danger);
  font-weight: 700;
}

.unit-badge {
  font-size: 0.67rem;
  padding: 0.22em 0.42rem;
  min-height: 1.5em;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  vertical-align: middle;
  box-sizing: border-box;
  background: var(--primary-soft);
  border-color: #d6defd;
  color: #3047ad;
}

#tokenControlsList .card {
  background: #ffffff;
  border-color: var(--border-soft);
}

.ticker-banner {
  margin-bottom: 0.12rem;
  padding: 0.28rem 0.6rem;
  display: flex;
  align-items: center;
  gap: 0.6rem;
  width: 100%;
  box-sizing: border-box;
}

/* Left: mode pill (fixed); middle: scroll; right: bot pill (fixed) */
.ticker-mode {
  flex-shrink: 0;
  display: flex;
  align-items: center;
}
.ticker-fixed {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 0.6rem;
}

.ticker-scroll-outer {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  position: relative;
  padding: 0 0.25rem;
  /* Fade at left/right edges so scrolling content softens at the sides */
  -webkit-mask-image: linear-gradient(
    to right,
    transparent 0,
    black 3rem,
    black calc(100% - 3rem),
    transparent 100%
  );
  mask-image: linear-gradient(
    to right,
    transparent 0,
    black 3rem,
    black calc(100% - 3rem),
    transparent 100%
  );
}

.ticker-track {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  width: max-content;
  min-width: 100%;
  will-change: transform;
  animation: ticker-scroll 40s linear infinite;
}

.ticker-scroll-outer:hover .ticker-track,
.ticker-scroll-outer:focus-within .ticker-track {
  animation-play-state: paused;
}

.ticker-item {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  white-space: nowrap;
  border: 1px solid rgba(100, 130, 255, 0.3);
  border-radius: 0.35rem;
  padding: 0.32rem 0.62rem;
  font-size: 0.9rem;
  font-weight: 700;
  background: linear-gradient(135deg, rgba(24, 38, 85, 0.55), rgba(18, 28, 65, 0.4));
  backdrop-filter: blur(10px) saturate(140%);
  -webkit-backdrop-filter: blur(10px) saturate(140%);
  box-shadow:
    inset 0 1px 0 rgba(140, 165, 255, 0.1),
    inset 0 -1px 0 rgba(0, 0, 0, 0.12);
  color: #c8d4f0;
  text-transform: uppercase;
  line-height: 1.2;
}

.ticker-label {
  color: #90a8e8;
  font-weight: 700;
  font-size: 0.95rem;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  display: inline-flex;
  align-items: center;
}

.ticker-label--icon {
  text-transform: none;
  font-size: 0;
}

.ticker-icon {
  display: inline-block;
  flex-shrink: 0;
  vertical-align: middle;
}

.ticker-value {
  color: #f0f4ff;
  font-size: 0.75rem;
  display: inline-flex;
  align-items: center;
}

.ticker-value.status-up {
  color: var(--success);
}

.ticker-value.status-down {
  color: var(--danger);
}

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

@media (max-width: 760px) {
  .wrap {
    width: min(1180px, 95vw);
  }

  .nav-row {
    flex-direction: column;
    align-items: flex-start;
  }

  .api-brand {
    width: 100%;
    justify-content: space-between;
  }

  .top-header-markets {
    width: 100%;
    justify-content: center;
  }

  h1 {
    font-size: 1.32rem;
  }

  .pnl-stats-grid--4,
  .pnl-stats-grid--5 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .pnl-hero-value {
    font-size: 1.25rem;
  }

  .pnl-hero-tokens-value {
    font-size: 1.25rem;
  }

  th,
  td {
    font-size: 0.79rem;
    padding: 0.52rem 0.42rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ticker-scroll-outer .ticker-track {
    animation: none;
  }
}

/* --- Dark theme: variables and overrides (only when data-theme="dark") --- */
html[data-theme="dark"] {
  --bg: #060a18;
  --bg-soft: #0e1830;
  --text: #eaf0ff;
  --muted: #a0b0d8;
  --primary: #5d72ff;
  --primary-2: #9055ff;
  --primary-3: #00d4ff;
  --primary-soft: rgba(93, 114, 255, 0.18);
  --border: rgba(130, 160, 255, 0.28);
  --border-soft: rgba(130, 160, 255, 0.18);
  --danger: #ff5080;
  --success: #00e68a;
  --warn: #ffb347;
  --shadow-sm: 0 16px 34px rgba(0, 0, 0, 0.32);
  --shadow-lg: 0 28px 76px rgba(0, 0, 0, 0.48);
  --glow-primary: 0 0 20px rgba(93, 114, 255, 0.25);
  --glow-success: 0 0 16px rgba(0, 230, 138, 0.2);
  --glow-danger: 0 0 16px rgba(255, 80, 128, 0.2);
}

html[data-theme="dark"] body {
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, "SF Mono", "Consolas", "Monaco", monospace;
  font-weight: 700;
  color: var(--text);
  background:
    radial-gradient(1100px 700px at -8% -18%, rgba(93, 114, 255, 0.5), transparent 55%),
    radial-gradient(900px 600px at 115% -15%, rgba(144, 85, 255, 0.45), transparent 55%),
    radial-gradient(800px 500px at 50% 110%, rgba(0, 212, 255, 0.2), transparent 60%),
    radial-gradient(600px 400px at 85% 60%, rgba(144, 85, 255, 0.12), transparent 50%),
    linear-gradient(160deg, #040710 0%, #080e20 40%, #0a1228 100%);
  background-attachment: fixed;
}

html[data-theme="dark"] .wrap {
  width: min(1260px, 95vw);
  padding: 1.15rem 0 2.7rem;
}

html[data-theme="dark"] .sticky-header {
  width: min(1260px, 95vw);
}

html[data-theme="dark"] .nav a {
  border-color: rgba(100, 130, 255, 0.28);
  color: #bcc8f0;
  background: linear-gradient(135deg, rgba(24, 38, 85, 0.48), rgba(18, 28, 65, 0.35));
  backdrop-filter: blur(14px) saturate(160%);
  -webkit-backdrop-filter: blur(14px) saturate(160%);
  box-shadow:
    inset 0 1px 0 rgba(140, 165, 255, 0.12),
    inset 0 -1px 0 rgba(0, 0, 0, 0.12);
  border-radius: 0.5rem;
}

html[data-theme="dark"] .nav a:hover {
  border-color: rgba(100, 130, 255, 0.45);
  color: #f4f7ff;
  background: linear-gradient(135deg, rgba(32, 48, 95, 0.55), rgba(24, 35, 72, 0.42));
  backdrop-filter: blur(14px) saturate(160%);
  -webkit-backdrop-filter: blur(14px) saturate(160%);
  box-shadow:
    inset 0 1px 0 rgba(140, 165, 255, 0.14),
    inset 0 -1px 0 rgba(0, 0, 0, 0.1),
    0 4px 16px rgba(0, 0, 0, 0.2);
  transform: translateY(-1px);
}

html[data-theme="dark"] .nav a.active {
  background: linear-gradient(135deg, rgba(45, 65, 130, 0.5), rgba(35, 52, 105, 0.4));
  backdrop-filter: blur(14px) saturate(160%);
  -webkit-backdrop-filter: blur(14px) saturate(160%);
  border: 1px solid rgba(93, 114, 255, 0.55);
  color: #e8eeff;
  box-shadow:
    inset 0 1px 0 rgba(140, 165, 255, 0.2),
    inset 0 -1px 0 rgba(0, 0, 0, 0.1),
    0 0 0 1px rgba(93, 114, 255, 0.15);
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

html[data-theme="dark"] .brand {
  font-family: Sora, Inter, ui-sans-serif, system-ui, sans-serif;
  font-size: 1.28rem;
  color: #f2f6ff;
}

html[data-theme="dark"] .brand-dot {
  background: linear-gradient(135deg, #5d72ff, #00d4ff);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

html[data-theme="dark"] .topbar .top-header-markets {
  flex: 1;
  justify-content: center;
}

html[data-theme="dark"] .market-pill .market-symbol {
  color: #c8d4ff;
}

html[data-theme="dark"] .nav-row {
  margin-bottom: 1.05rem;
}

html[data-theme="dark"] .nav {
  gap: 0.65rem;
  margin-bottom: 0;
}

html[data-theme="dark"] .card {
  border: 1px solid var(--border-soft);
  border-radius: 1rem;
  background:
    linear-gradient(150deg, rgba(18, 28, 62, 0.94), rgba(12, 18, 42, 0.86)),
    radial-gradient(120% 140% at 100% 0%, rgba(93, 114, 255, 0.12), transparent 55%),
    radial-gradient(80% 100% at 0% 100%, rgba(0, 212, 255, 0.06), transparent 50%);
  color: #e7eeff;
  box-shadow: var(--shadow-sm), inset 0 1px 0 rgba(255, 255, 255, 0.03);
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

html[data-theme="dark"] h1,
html[data-theme="dark"] h2 {
  color: #f2f6ff;
}

html[data-theme="dark"] h1 {
  font-size: 1.56rem;
  background: linear-gradient(135deg, #f0f4ff 0%, #c4d0ff 50%, #a0b8ff 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

html[data-theme="dark"] h2 {
  font-size: 1.06rem;
  color: #dde6ff;
}

html[data-theme="dark"] p,
html[data-theme="dark"] label,
html[data-theme="dark"] .muted {
  color: var(--muted);
}

html[data-theme="dark"] button {
  border: 1px solid var(--border);
  background: linear-gradient(180deg, rgba(24, 36, 78, 0.92), rgba(18, 28, 62, 0.86));
  color: #e9efff;
  border-radius: 0.66rem;
  transition: all 0.2s ease;
}

html[data-theme="dark"] button:hover {
  border-color: rgba(93, 114, 255, 0.7);
  box-shadow: 0 8px 20px rgba(93, 114, 255, 0.3), var(--glow-primary);
  background: linear-gradient(180deg, rgba(30, 44, 88, 0.95), rgba(22, 34, 72, 0.9));
}

html[data-theme="dark"] button.primary {
  background: linear-gradient(135deg, #5d72ff 0%, #9055ff 55%, #00d4ff 100%);
  color: #fff;
  box-shadow: 0 10px 28px rgba(93, 114, 255, 0.35), 0 0 16px rgba(93, 114, 255, 0.15);
}

html[data-theme="dark"] button.primary:hover {
  box-shadow: 0 12px 32px rgba(93, 114, 255, 0.45), 0 0 24px rgba(93, 114, 255, 0.25);
}

html[data-theme="dark"] input[type="number"],
html[data-theme="dark"] input[type="text"],
html[data-theme="dark"] select {
  border: 1px solid var(--border);
  background: rgba(10, 16, 38, 0.92);
  color: #ecf2ff;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

html[data-theme="dark"] input[type="number"]:focus,
html[data-theme="dark"] input[type="text"]:focus,
html[data-theme="dark"] select:focus {
  border-color: rgba(93, 114, 255, 0.8);
  box-shadow: 0 0 0 3px rgba(93, 114, 255, 0.18), 0 0 12px rgba(93, 114, 255, 0.12);
}

html[data-theme="dark"] table {
  border: 1px solid var(--border-soft);
  border-radius: 0.9rem;
  overflow: hidden;
  background: rgba(8, 14, 34, 0.78);
}

html[data-theme="dark"] th {
  background: linear-gradient(180deg, rgba(22, 34, 72, 0.9), rgba(18, 28, 60, 0.85));
  color: #b0c2f0;
  border-bottom: 1px solid var(--border-soft);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

html[data-theme="dark"] th,
html[data-theme="dark"] td {
  border-bottom: 1px solid rgba(130, 160, 255, 0.12);
}

html[data-theme="dark"] tbody tr:nth-child(even) td {
  background: rgba(18, 28, 62, 0.3);
}

html[data-theme="dark"] tbody tr:hover td {
  background: rgba(93, 114, 255, 0.1);
}
html[data-theme="dark"] .trade-detail-table--compact tbody tr:hover td {
  background: transparent;
}

html[data-theme="dark"] .pill {
  border: 1px solid rgba(130, 155, 255, 0.3);
  background: linear-gradient(135deg, rgba(35, 48, 100, 0.5), rgba(28, 40, 88, 0.4));
  color: #d0dcff;
}

/* Color-coded pills in dark theme — transparent fill, keep color */
html[data-theme="dark"] .pill-chart {
  border-color: rgba(0, 212, 255, 0.35);
  background: linear-gradient(135deg, rgba(0, 100, 130, 0.2), rgba(0, 80, 100, 0.16));
  color: #70e8ff;
}
html[data-theme="dark"] .pill-chart:hover {
  background: linear-gradient(135deg, rgba(0, 120, 150, 0.28), rgba(0, 90, 115, 0.22));
  box-shadow: 0 0 12px rgba(0, 212, 255, 0.14);
}
html[data-theme="dark"] .pill-copy {
  border-color: rgba(130, 155, 255, 0.28);
  background: linear-gradient(135deg, rgba(45, 60, 115, 0.22), rgba(35, 50, 100, 0.18));
  color: #b0c4f0;
}
html[data-theme="dark"] .pill-moonbag {
  border-color: rgba(255, 179, 71, 0.35);
  background: linear-gradient(135deg, rgba(150, 90, 0, 0.2), rgba(110, 65, 0, 0.16));
  color: #ffd88a;
  box-shadow: 0 0 10px rgba(255, 179, 71, 0.08);
}
html[data-theme="dark"] .pill-history {
  border-color: rgba(130, 155, 255, 0.24);
  background: linear-gradient(135deg, rgba(40, 55, 105, 0.2), rgba(30, 45, 90, 0.16));
  color: #a8bcee;
}
html[data-theme="dark"] .pill-blocked {
  border-color: rgba(160, 170, 210, 0.28);
  background: linear-gradient(135deg, rgba(65, 72, 95, 0.22), rgba(50, 58, 80, 0.18));
  color: #c0c8e0;
}
html[data-theme="dark"] .pill-supply {
  border-color: rgba(180, 160, 253, 0.32);
  background: linear-gradient(135deg, rgba(85, 55, 140, 0.2), rgba(65, 40, 110, 0.16));
  color: #d8d0fe;
  box-shadow: 0 0 10px rgba(144, 85, 255, 0.08);
}
html[data-theme="dark"] .pill-paid {
  border-color: rgba(91, 155, 213, 0.38);
  background: linear-gradient(135deg, rgba(30, 58, 95, 0.22), rgba(20, 45, 80, 0.18));
  color: #90b8e8;
}
html[data-theme="dark"] .pill-paid-expired {
  opacity: 0.75;
}
html[data-theme="dark"] .pill-ad {
  border-color: rgba(0, 212, 255, 0.32);
  background: linear-gradient(135deg, rgba(0, 100, 120, 0.2), rgba(0, 80, 100, 0.16));
  color: #70e8ff;
}
html[data-theme="dark"] .pill-boost {
  border-color: rgba(255, 200, 71, 0.38);
  background: linear-gradient(135deg, rgba(180, 120, 0, 0.2), rgba(140, 90, 0, 0.16));
  color: #ffd88a;
}
html[data-theme="dark"] .pill-ad-expired,
html[data-theme="dark"] .pill-boost-expired {
  opacity: 0.75;
}
html[data-theme="dark"] .pill-cto {
  border-color: rgba(120, 200, 140, 0.38);
  background: linear-gradient(135deg, rgba(20, 80, 45, 0.22), rgba(15, 60, 35, 0.18));
  color: #8ae0a0;
}
html[data-theme="dark"] .pill-cto-expired {
  opacity: 0.75;
}
/* Launchpad: Pump (green), Migrated (blue M) */
.pill-pump {
  border-color: rgba(0, 160, 90, 0.5);
  background: linear-gradient(135deg, rgba(0, 140, 70, 0.22), rgba(0, 110, 55, 0.18));
  color: #0a9e50;
}
.pill-migrated {
  border-color: rgba(74, 112, 255, 0.5);
  background: linear-gradient(135deg, rgba(50, 80, 220, 0.22), rgba(40, 70, 200, 0.18));
  color: #4a6fff;
}
html[data-theme="light"] .pill-pump {
  border-color: rgba(0, 140, 70, 0.55);
  background: linear-gradient(135deg, rgba(200, 255, 220, 0.6), rgba(180, 240, 200, 0.5));
  color: #0d7a3d;
}
html[data-theme="light"] .pill-migrated {
  border: 1px solid rgba(74, 103, 255, 0.5);
  background: linear-gradient(135deg, rgba(230, 235, 255, 0.7), rgba(220, 228, 255, 0.6));
  color: #3d5ce6;
}
html[data-theme="dark"] .pill-pump {
  border-color: rgba(0, 200, 110, 0.45);
  background: linear-gradient(135deg, rgba(0, 120, 65, 0.22), rgba(0, 90, 50, 0.18));
  color: #4ae099;
}
html[data-theme="dark"] .pill-migrated {
  border-color: rgba(100, 140, 255, 0.45);
  background: linear-gradient(135deg, rgba(40, 70, 180, 0.22), rgba(30, 55, 150, 0.18));
  color: #7aa0ff;
}
html[data-theme="dark"] .pill-latest {
  border-color: rgba(220, 80, 80, 0.55);
  background: linear-gradient(135deg, rgba(140, 50, 50, 0.22), rgba(100, 35, 35, 0.18));
  color: #f0a0a0;
}
html[data-theme="dark"] .pill-latest .pill-latest-icon {
  color: #f0a0a0;
}

/* Position card action buttons: transparent fill, keep color (dark theme) */
html[data-theme="dark"] .manual-sell-btn {
  background: linear-gradient(135deg, rgba(74, 112, 255, 0.28), rgba(53, 85, 208, 0.22));
  color: #b8d0ff;
  border-color: rgba(74, 112, 255, 0.4);
  box-shadow: 0 4px 12px rgba(60, 90, 220, 0.18);
}
html[data-theme="dark"] .manual-sell-btn:hover {
  background: linear-gradient(135deg, rgba(74, 112, 255, 0.38), rgba(53, 85, 208, 0.3));
  box-shadow: 0 8px 20px rgba(60, 90, 220, 0.28), 0 0 14px rgba(93, 114, 255, 0.12);
}
html[data-theme="dark"] .manual-sell-dump {
  background: linear-gradient(135deg, rgba(255, 80, 128, 0.35), rgba(208, 48, 96, 0.28));
  color: #ffb8d0;
  border-color: rgba(255, 80, 128, 0.4);
  box-shadow: 0 4px 12px rgba(255, 80, 128, 0.18);
}
html[data-theme="dark"] .manual-sell-dump:hover {
  background: linear-gradient(135deg, rgba(255, 80, 128, 0.45), rgba(208, 48, 96, 0.36));
  box-shadow: 0 8px 20px rgba(255, 80, 128, 0.28), 0 0 14px rgba(255, 80, 128, 0.12);
}
html[data-theme="dark"] .hold-toggle-btn {
  background: linear-gradient(135deg, rgba(251, 146, 60, 0.28), rgba(217, 119, 6, 0.22));
  color: #ffd4a8;
  border-color: rgba(251, 146, 60, 0.4);
  box-shadow: 0 4px 10px rgba(251, 146, 60, 0.18);
}
html[data-theme="dark"] .hold-toggle-btn:hover {
  background: linear-gradient(135deg, rgba(251, 146, 60, 0.38), rgba(217, 119, 6, 0.3));
  box-shadow: 0 8px 18px rgba(251, 146, 60, 0.28);
}
html[data-theme="dark"] .never-buy-btn {
  background: linear-gradient(135deg, rgba(107, 120, 152, 0.28), rgba(77, 88, 110, 0.22));
  color: #c8d4e8;
  border-color: rgba(107, 120, 152, 0.35);
  box-shadow: 0 4px 10px rgba(70, 85, 115, 0.16);
}
html[data-theme="dark"] .never-buy-btn:hover {
  background: linear-gradient(135deg, rgba(107, 120, 152, 0.38), rgba(77, 88, 110, 0.3));
  box-shadow: 0 8px 18px rgba(70, 85, 115, 0.24);
}
html[data-theme="dark"] .remove-card-btn {
  background: linear-gradient(135deg, rgba(112, 128, 152, 0.28), rgba(85, 96, 120, 0.22));
  color: #c8d4e8;
  border-color: rgba(112, 128, 152, 0.35);
  box-shadow: 0 4px 10px rgba(80, 95, 120, 0.16);
}
html[data-theme="dark"] .remove-card-btn:hover {
  background: linear-gradient(135deg, rgba(112, 128, 152, 0.38), rgba(85, 96, 120, 0.3));
  box-shadow: 0 8px 18px rgba(80, 95, 120, 0.24);
}

html[data-theme="dark"] .pill-status.status-on {
  border-color: rgba(0, 230, 138, 0.45);
  background: linear-gradient(135deg, rgba(0, 140, 80, 0.35), rgba(0, 100, 60, 0.3));
  color: #70f0b8;
  box-shadow: 0 0 10px rgba(0, 230, 138, 0.12);
}

html[data-theme="dark"] .pill-status.status-off {
  border-color: rgba(255, 80, 128, 0.4);
  background: linear-gradient(135deg, rgba(140, 20, 55, 0.4), rgba(100, 15, 40, 0.35));
  color: #ff90b0;
  box-shadow: 0 0 10px rgba(255, 80, 128, 0.1);
}

/* Dark: control buttons same glass as nav */
html[data-theme="dark"] .bot-control-btn--stop-sells {
  border-color: rgba(100, 130, 255, 0.28);
  color: #bcc8f0;
}
html[data-theme="dark"] .bot-control-btn--stop-sells.active {
  color: #f0e090;
  border-color: rgba(201, 162, 39, 0.5);
}
html[data-theme="dark"] .bot-control-btn--start,
html[data-theme="dark"] .bot-control-btn--stop,
html[data-theme="dark"] .bot-control-btn--kill,
html[data-theme="dark"] .bot-control-btn--reset {
  border-color: rgba(100, 130, 255, 0.28);
  color: #bcc8f0;
  background: linear-gradient(135deg, rgba(24, 38, 85, 0.48), rgba(18, 28, 65, 0.35));
}

html[data-theme="dark"] .bot-control-btn--stop-sells:hover {
  border-color: rgba(100, 130, 255, 0.45);
  color: #f4f7ff;
}
html[data-theme="dark"] .bot-control-btn--start:hover,
html[data-theme="dark"] .bot-control-btn--stop:hover,
html[data-theme="dark"] .bot-control-btn--kill:hover,
html[data-theme="dark"] .bot-control-btn--reset:hover {
  border-color: rgba(100, 130, 255, 0.45);
  color: #f4f7ff;
  background: linear-gradient(135deg, rgba(32, 48, 95, 0.55), rgba(24, 35, 72, 0.42));
}

html[data-theme="dark"] .bot-control-btn--acked {
  border-color: rgba(93, 114, 255, 0.55);
  color: #e8eeff;
  background: linear-gradient(135deg, rgba(45, 65, 130, 0.5), rgba(35, 52, 105, 0.4));
}

.pill-chart {
  border-color: rgba(0, 212, 255, 0.35);
  background: linear-gradient(135deg, rgba(0, 100, 130, 0.2), rgba(0, 80, 100, 0.16));
  color: #70e8ff;
}

.pill-chart:hover {
  background: linear-gradient(135deg, rgba(0, 120, 150, 0.28), rgba(0, 90, 115, 0.22));
  box-shadow: 0 0 12px rgba(0, 212, 255, 0.14);
}

.pill-hold-toggle {
  padding: 0.28rem 0.4rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-color: rgba(255, 179, 71, 0.35);
  background: linear-gradient(135deg, rgba(150, 90, 0, 0.18), rgba(110, 65, 0, 0.14));
  color: #ffd88a;
}
.pill-hold-toggle:hover {
  background: linear-gradient(135deg, rgba(180, 110, 0, 0.28), rgba(130, 75, 0, 0.2));
  box-shadow: 0 0 10px rgba(255, 179, 71, 0.12);
}
.pill-hold-toggle .hold-toggle-icon {
  display: block;
}

.pill-copy {
  border-color: rgba(130, 155, 255, 0.28);
  background: linear-gradient(135deg, rgba(45, 60, 115, 0.22), rgba(35, 50, 100, 0.18));
  color: #b0c4f0;
}

.pill-moonbag {
  border-color: rgba(255, 179, 71, 0.35);
  background: linear-gradient(135deg, rgba(150, 90, 0, 0.2), rgba(110, 65, 0, 0.16));
  color: #ffd88a;
  box-shadow: 0 0 10px rgba(255, 179, 71, 0.08);
}

.pill-moonbag-condensed {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding-left: 0.35rem;
  padding-right: 0.5rem;
}

.pill-moonbag-condensed .pill-moonbag-icon {
  flex-shrink: 0;
  color: currentColor;
}

.pill-moonbag-condensed .pill-moonbag-pct {
  font-weight: 700;
  font-size: 0.85em;
}

.pill-history {
  border-color: rgba(130, 155, 255, 0.24);
  background: linear-gradient(135deg, rgba(40, 55, 105, 0.2), rgba(30, 45, 90, 0.16));
  color: #a8bcee;
}

.pill-blocked {
  border-color: rgba(160, 170, 210, 0.28);
  background: linear-gradient(135deg, rgba(65, 72, 95, 0.22), rgba(50, 58, 80, 0.18));
  color: #c0c8e0;
}

.pill-not-tradable {
  border-color: rgba(140, 120, 90, 0.35);
  background: linear-gradient(135deg, rgba(80, 65, 50, 0.2), rgba(60, 50, 40, 0.16));
  color: #c8b8a0;
}

.pill.pill-rug {
  border: 1px solid rgba(240, 70, 60, 0.6) !important;
  background: linear-gradient(135deg, rgba(220, 50, 45, 0.4), rgba(180, 35, 30, 0.3)) !important;
  color: #ffb0b0 !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.2rem;
  min-width: 1.25rem;
  min-height: 1.5em;
  padding: 0.22em 0.35rem;
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  text-align: center;
  box-sizing: border-box;
  border-radius: 0.35rem;
}
.pill.pill-rug svg {
  flex-shrink: 0;
  width: 11px;
  height: 11px;
  opacity: 0.95;
  color: inherit;
}
html[data-theme="light"] .pill.pill-rug {
  border-color: rgba(220, 60, 55, 0.65) !important;
  background: linear-gradient(135deg, rgba(255, 120, 110, 0.35), rgba(255, 80, 70, 0.25)) !important;
  color: #b83030 !important;
}

.pill-supply {
  border-color: rgba(180, 160, 253, 0.32);
  background: linear-gradient(135deg, rgba(85, 55, 140, 0.2), rgba(65, 40, 110, 0.16));
  color: #d8d0fe;
  box-shadow: 0 0 10px rgba(144, 85, 255, 0.08);
}

.pill-paid {
  border-color: rgba(91, 155, 213, 0.38);
  background: linear-gradient(135deg, rgba(30, 58, 95, 0.22), rgba(20, 45, 80, 0.18));
  color: #90b8e8;
}

.pill-paid-expired {
  opacity: 0.75;
}

.pill-ad {
  border-color: rgba(0, 212, 255, 0.32);
  background: linear-gradient(135deg, rgba(0, 100, 120, 0.2), rgba(0, 80, 100, 0.16));
  color: #70e8ff;
}

.pill-boost {
  border-color: rgba(255, 200, 71, 0.38);
  background: linear-gradient(135deg, rgba(180, 120, 0, 0.2), rgba(140, 90, 0, 0.16));
  color: #ffd88a;
}

.pill-ad-expired,
.pill-boost-expired {
  opacity: 0.75;
}

.pill-cto {
  border-color: rgba(120, 200, 140, 0.38);
  background: linear-gradient(135deg, rgba(20, 80, 45, 0.22), rgba(15, 60, 35, 0.18));
  color: #8ae0a0;
}

.pill-cto-expired {
  opacity: 0.75;
}

.pill-latest {
  border: 1px solid rgba(220, 80, 80, 0.55);
  background: linear-gradient(135deg, rgba(140, 50, 50, 0.22), rgba(100, 35, 35, 0.18));
  color: #f0a0a0;
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
}
.pill-latest .pill-latest-icon {
  width: 0.9rem;
  height: 0.9rem;
  flex-shrink: 0;
  color: #f0a0a0;
}

/* Ticker pills: square with slightly rounded corners (aligned with .pill) */
.ticker-item {
  border-radius: 0.35rem;
  border: 1px solid rgba(100, 130, 255, 0.3);
  background: linear-gradient(135deg, rgba(24, 38, 85, 0.55), rgba(18, 28, 65, 0.4));
  backdrop-filter: blur(10px) saturate(140%);
  -webkit-backdrop-filter: blur(10px) saturate(140%);
  box-shadow:
    inset 0 1px 0 rgba(140, 165, 255, 0.1),
    inset 0 -1px 0 rgba(0, 0, 0, 0.12);
  color: #c8d4f0;
}

.ticker-label {
  color: #90a8e8;
}

.ticker-value {
  color: #f0f4ff;
}

/* Overview positions revamp (dark) */
html[data-theme="dark"] .positions-watch-count.muted {
  color: #98abde;
}

html[data-theme="dark"] .positions-cards {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.78rem;
}

html[data-theme="dark"] .positions-empty {
  border: 1px dashed rgba(152, 173, 255, 0.42);
  background: rgba(15, 24, 53, 0.72);
  color: #b4c2ec;
}

html[data-theme="dark"] .position-card {
  border-color: rgba(148, 170, 255, 0.2);
  background: linear-gradient(135deg, rgba(28, 40, 80, 0.5), rgba(18, 28, 55, 0.35));
  box-shadow:
    0 8px 32px rgba(0, 0, 0, 0.25),
    inset 0 1px 0 rgba(255, 255, 255, 0.08),
    inset 0 -1px 0 rgba(0, 0, 0, 0.15);
}

html[data-theme="dark"] .position-card:hover {
  border-color: rgba(148, 170, 255, 0.35);
  box-shadow:
    0 18px 40px rgba(0, 0, 0, 0.3),
    inset 0 1px 0 rgba(255, 255, 255, 0.1),
    inset 0 -1px 0 rgba(0, 0, 0, 0.12),
    var(--glow-primary);
}

.position-line-mid .mono {
  color: #afc0ef;
}

.position-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.6rem;
  flex-wrap: nowrap;
  min-width: 0;
}

.position-head .position-badges {
  flex-shrink: 0;
}

.position-head-left {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: nowrap;
  flex: 1 1 0;
  min-width: 0;
  overflow: hidden;
}

.position-head-left-scroll {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: nowrap;
  flex-shrink: 0;
  white-space: nowrap;
}

.position-head-left--marquee > .position-head-left-scroll {
  animation: position-head-marquee 22s linear infinite;
}

.position-head-left--marquee > .position-head-left-scroll:hover {
  animation-play-state: paused;
}

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

.position-dex-pills {
  display: inline-flex;
  align-items: center;
  gap: 0.28rem;
  flex-shrink: 0;
}

.position-head-left .position-token-meta {
  flex-shrink: 0;
}

.position-subline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.6rem;
  flex-wrap: wrap;
  font-size: 0.78rem;
}

.mint-with-copy {
  display: inline-flex;
  align-items: center;
  gap: 0.28rem;
}

.mint-copy-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.12rem;
  border: none;
  border-radius: 0.35rem;
  background: transparent;
  color: inherit;
  cursor: pointer;
  opacity: 0.65;
  transition: opacity 0.12s ease, background 0.12s ease;
}

.mint-copy-icon:hover {
  opacity: 1;
  background: rgba(149, 170, 255, 0.18);
}

.mint-copy-icon.is-copied {
  color: var(--success, #0d9668);
  opacity: 1;
}

.mint-copy-icon.is-copied .mint-copy-icon-svg {
  color: inherit;
}

.mint-copy-icon .mint-copy-icon-svg {
  display: block;
}

.position-subline .mint-with-copy .mono {
  color: var(--muted, #6b7280);
}

.pill-supply-subline {
  flex-shrink: 0;
}

.pill-supply-at-cap {
  border-color: rgba(255, 180, 100, 0.45);
  background: linear-gradient(135deg, rgba(140, 80, 20, 0.25), rgba(100, 55, 10, 0.2));
  color: #ffcc88;
  box-shadow: 0 0 10px rgba(255, 160, 60, 0.12);
}

.pill-supply .supply-cap-lock,
.pill-supply-at-cap .supply-cap-lock {
  display: inline-block;
  vertical-align: middle;
  margin-left: 0.2rem;
}

/* Wrapper: grid (left) + vertical action strip (right) for open position cards */
.position-main {
  display: flex;
  align-items: stretch;
  gap: 0.6rem;
  min-height: 0;
}

.position-main .position-grid {
  flex: 1;
  min-width: 0;
}

.position-actions-strip {
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
  align-items: center;
  gap: 0.5rem;
  flex-shrink: 0;
  min-width: 8.5rem;
  width: auto;
  border-left: 1px solid rgba(100, 130, 255, 0.25);
  padding: 0.5rem 0.5rem 0.5rem 0.65rem;
}

/* Match height of other pills in the card (.position-card .pill) */
.position-actions-strip .manual-sell-btn {
  width: 2.5rem;
  min-width: 2.5rem;
  height: 2.25rem;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-sizing: border-box;
}

.position-actions-strip .token-trades-toggle {
  width: 3.25rem;
  min-width: 3.25rem;
  max-width: 3.25rem;
  height: 2.25rem;
  padding: 0 0.35rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.2rem;
  flex-shrink: 0;
  box-sizing: border-box;
}

.position-actions-strip .manual-sell-pill .action-strip-text {
  display: none;
}

.position-actions-strip .manual-sell-pill.action-strip-pct .action-strip-text {
  display: inline;
}

.position-actions-strip .manual-sell-pill.action-strip-pct {
  width: 3.25rem;
  min-width: 3.25rem;
  max-width: 3.25rem;
  padding: 0 0.35rem;
}

.position-actions-strip .manual-sell-pill.manual-sell-dump,
.position-actions-strip .manual-sell-pill.dump-never-buy-btn {
  width: 3.25rem;
  min-width: 3.25rem;
  max-width: 3.25rem;
  padding: 0 0.35rem;
}

/* Show trades: icon only by default; in action strip show icon + count so number of fills fits */
.token-trades-toggle .action-strip-text {
  display: none;
}
.position-actions-strip .token-trades-toggle .action-strip-text {
  display: inline;
  font-size: 0.75rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}

.position-actions-strip .token-trades-toggle {
  border-color: rgba(0, 230, 138, 0.4);
  background: linear-gradient(135deg, rgba(0, 140, 80, 0.25), rgba(0, 100, 60, 0.2));
  color: #70f0b8;
}

.position-actions-strip .token-trades-toggle:hover {
  background: linear-gradient(135deg, rgba(0, 160, 95, 0.35), rgba(0, 120, 70, 0.28));
}

.position-actions-strip-row {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.35rem;
  flex-wrap: nowrap;
}

.position-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.46rem;
}

.position-kpi {
  position: relative;
  border: 1px solid rgba(80, 100, 180, 0.35);
  border-radius: 0.7rem;
  padding: 0.55rem 0.65rem;
  background: linear-gradient(160deg, rgba(12, 20, 48, 0.85), rgba(8, 14, 38, 0.75));
  box-shadow:
    inset 0 1px 2px rgba(0, 0, 0, 0.35),
    inset 0 -1px 0 rgba(255, 255, 255, 0.03);
}

.position-kpi::before {
  content: "";
  position: absolute;
  inset: 2px;
  border-radius: 0.5rem;
  background: rgba(0, 0, 0, 0.25);
  box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.4);
  pointer-events: none;
}

.position-kpi-label,
.position-kpi-value {
  position: relative;
  z-index: 1;
}

.position-kpi-label {
  display: block;
  font-size: 0.66rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #8aa0d8;
  font-weight: 700;
}

.position-kpi-value {
  display: block;
  margin-top: 0.08rem;
  font-size: 0.86rem;
  font-weight: 700;
  color: #edf3ff;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.04), 0 -1px 1px rgba(0, 0, 0, 0.15);
}

.position-kpi-avg-cost {
  font-weight: 700;
  color: var(--muted);
  font-size: 0.9em;
}

/* Under grid: moonbag (and Show trades when closed) right-aligned; no line above */
.position-below-grid {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.75rem;
  margin-top: 0;
  margin-bottom: 0;
  min-height: 0;
  border-top: none;
  padding-top: 0;
}

.position-below-grid-right {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-shrink: 0;
}

.position-below-grid .token-trades-host {
  margin: 0;
  padding: 0;
  border: none;
  border-radius: 0;
  border-top: none;
}

.position-below-grid .pill-moonbag-condensed {
  font-size: 0.8rem;
}

/* Moonbag pill: match height of other pills in action strip (2.25rem) */
.position-actions-strip .pill-moonbag-condensed,
.position-below-grid .pill-moonbag-condensed,
.position-card .pill-moonbag-condensed {
  min-height: 2.25rem;
  height: 2.25rem;
  box-sizing: border-box;
  padding-top: 0;
  padding-bottom: 0;
  display: inline-flex;
  align-items: center;
}

.position-below-grid .token-trades-toggle {
  font-size: 0.8rem;
  padding: 0.35rem 0.5rem;
  display: inline-flex;
  align-items: center;
}

/* Show trades pill: transparent look with green */
.token-trades-toggle {
  border-color: rgba(0, 230, 138, 0.4);
  background: linear-gradient(135deg, rgba(0, 140, 80, 0.25), rgba(0, 100, 60, 0.2));
  color: #70f0b8;
  box-shadow: 0 0 10px rgba(0, 230, 138, 0.08);
}

.token-trades-toggle:hover {
  background: linear-gradient(135deg, rgba(0, 160, 95, 0.35), rgba(0, 120, 70, 0.28));
  box-shadow: 0 0 12px rgba(0, 230, 138, 0.14);
}

/* Last trade at very bottom of card: bold, gray text only (no cell), centered */
.position-last-trade-row {
  margin-top: 0.35rem;
  text-align: center;
}

.position-last-trade-row .position-last-trade {
  display: block;
  margin: 0;
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--muted);
}

/* All pills in position cards: square with slightly rounded corners; same as global .pill; constrain width so columns stay even (supply pill excluded) */
.position-card .pill:not(.pill-supply):not(.pill-supply-at-cap) {
  max-width: 9rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  box-sizing: border-box;
  border-radius: 0.35rem;
}
.position-card .pill {
  font-size: 0.8rem;
  padding: 0.35rem 0.5rem;
  display: inline-flex;
  align-items: center;
  border-radius: 0.35rem;
}

.position-card .manual-sell-pill {
  font-size: 0.8rem;
  padding: 0.35rem 0.5rem;
  border-radius: 0.35rem;
}

/* Shared recessed cell look (system, etc.) */
.kpi-cell {
  position: relative;
  border: 1px solid rgba(80, 100, 180, 0.35);
  border-radius: 0.7rem;
  padding: 0.4rem 0.55rem;
  background: linear-gradient(160deg, rgba(12, 20, 48, 0.85), rgba(8, 14, 38, 0.75));
  box-shadow:
    inset 0 1px 2px rgba(0, 0, 0, 0.35),
    inset 0 -1px 0 rgba(255, 255, 255, 0.03);
}

.kpi-cell::before {
  content: "";
  position: absolute;
  inset: 2px;
  border-radius: 0.5rem;
  background: rgba(0, 0, 0, 0.25);
  box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.4);
  pointer-events: none;
}

.kpi-cell-label,
.kpi-cell-value {
  position: relative;
  z-index: 1;
}

.kpi-cell-label {
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #8aa0d8;
  font-weight: 700;
  margin-bottom: 0.2rem;
}

.kpi-cell-value {
  font-size: 0.88rem;
  font-weight: 700;
  color: #edf3ff;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.04), 0 -1px 1px rgba(0, 0, 0, 0.15);
}

/* Settings page: recessed look consistent with position cards */
.settings-container {
  display: grid;
  gap: 1rem;
}

.settings-section {
  position: relative;
  border: 1px solid rgba(80, 100, 180, 0.35);
  border-radius: 0.85rem;
  overflow: hidden;
  background: linear-gradient(160deg, rgba(12, 20, 48, 0.9), rgba(8, 14, 38, 0.85));
  box-shadow:
    inset 0 1px 2px rgba(0, 0, 0, 0.35),
    inset 0 -1px 0 rgba(255, 255, 255, 0.03);
  transition: border-color 0.2s ease;
}

.settings-section:hover {
  border-color: rgba(93, 114, 255, 0.3);
}

.settings-section::before {
  content: "";
  position: absolute;
  inset: 3px;
  border-radius: 0.6rem;
  background: rgba(0, 0, 0, 0.2);
  box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.35);
  pointer-events: none;
}

.settings-section-header,
.settings-section-body {
  position: relative;
  z-index: 1;
}

.settings-section-header {
  padding: 0.75rem 1rem;
  border-bottom: 1px solid rgba(149, 169, 255, 0.2);
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  user-select: none;
  transition: background 0.2s ease;
}

.settings-section-header:hover {
  background: rgba(93, 114, 255, 0.08);
}

.settings-section-header h2 {
  font-size: 0.95rem;
  margin: 0;
  font-weight: 700;
  color: #dde6ff;
  letter-spacing: -0.01em;
  background: none;
  -webkit-background-clip: unset;
  background-clip: unset;
}

.settings-section-toggle {
  font-size: 1.1rem;
  color: var(--muted);
  transition: transform 0.25s ease;
}

.settings-section.collapsed .settings-section-toggle {
  transform: rotate(-90deg);
}

.settings-section-body {
  padding: 1rem;
  display: block;
}

.settings-section.collapsed .settings-section-body {
  display: none;
}

.settings-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 0.5rem 0.85rem;
  align-items: start;
}

.settings-grid-2col {
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
}

.settings-field {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  padding: 0.4rem 0.5rem;
  border-radius: 0.45rem;
  border: 1px solid rgba(80, 100, 180, 0.3);
  background: linear-gradient(160deg, rgba(12, 20, 48, 0.85), rgba(8, 14, 38, 0.75));
  box-shadow:
    inset 0 1px 2px rgba(0, 0, 0, 0.3),
    inset 0 -1px 0 rgba(255, 255, 255, 0.02);
  transition: border-color 0.2s ease, background 0.2s ease;
}

.settings-field:hover {
  border-color: rgba(93, 114, 255, 0.35);
}

.settings-field::before {
  content: "";
  position: absolute;
  inset: 2px;
  border-radius: 0.35rem;
  background: rgba(0, 0, 0, 0.2);
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.3);
  pointer-events: none;
}

.settings-field label,
.settings-field input,
.settings-field select,
.settings-field .settings-label-wrap {
  position: relative;
  z-index: 1;
}

.settings-label-wrap {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  flex-wrap: wrap;
}

.settings-field label {
  font-size: 0.72rem;
  font-weight: 700;
  color: #90a4d8;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  margin: 0;
}

.settings-tooltip-icon {
  font-size: 0.7rem;
  color: rgba(144, 164, 216, 0.7);
  cursor: help;
  line-height: 1;
  flex-shrink: 0;
}

.settings-tooltip-icon:hover {
  color: #90a4d8;
}

.settings-field input,
.settings-field select {
  font-size: 0.85rem;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  height: 2.25rem;
  min-height: 2.25rem;
  max-height: 2.25rem;
  box-sizing: border-box;
  padding: 0.35rem 0.5rem;
  line-height: 1.25;
  border: 1px solid var(--border);
  border-radius: 0.45rem;
  vertical-align: middle;
}

.settings-field select {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%2390a4d8' d='M2.5 4.5L6 8l3.5-3.5H2.5z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.5rem center;
  padding-right: 1.75rem;
}

.settings-field input[type="number"] {
  min-width: 0;
}

.settings-field select[data-type="bool"] {
  max-width: 100%;
}

.settings-field select:not([data-type="bool"]) {
  min-width: 0;
}

.settings-field input[type="text"]:not(.array-field) {
  min-width: 0;
}

.settings-field input[type="text"].array-field {
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, "SF Mono", "Consolas", "Monaco", monospace;
  font-size: 0.82rem;
  max-width: 100%;
}

.settings-save-status {
  margin-top: 0.6rem;
  margin-bottom: 0.4rem;
  font-size: 0.85rem;
  font-weight: 700;
}

.settings-save-status.saving {
  color: var(--muted);
}

.settings-save-status.saved {
  color: var(--success);
  text-shadow: 0 0 8px rgba(0, 230, 138, 0.2);
}

.settings-save-status.error {
  color: var(--danger);
  text-shadow: 0 0 8px rgba(255, 80, 128, 0.2);
}

/* Docs page: recessed look consistent with dashboard */
.page-docs .docs-sidebar a {
  position: relative;
  border: 1px solid rgba(80, 100, 180, 0.35);
  background: linear-gradient(160deg, rgba(12, 20, 48, 0.85), rgba(8, 14, 38, 0.75));
  box-shadow:
    inset 0 1px 2px rgba(0, 0, 0, 0.35),
    inset 0 -1px 0 rgba(255, 255, 255, 0.03);
}

.page-docs .docs-sidebar a::before {
  content: "";
  position: absolute;
  inset: 2px;
  border-radius: 0.4rem;
  background: rgba(0, 0, 0, 0.2);
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.35);
  pointer-events: none;
}

.page-docs .docs-sidebar a:hover {
  border-color: rgba(93, 114, 255, 0.45);
  background: linear-gradient(160deg, rgba(18, 28, 58, 0.9), rgba(12, 20, 48, 0.85));
}

.page-docs .docs-sidebar a.active {
  border-color: rgba(93, 114, 255, 0.55);
  background: linear-gradient(160deg, rgba(24, 36, 75, 0.9), rgba(18, 28, 58, 0.85));
  box-shadow:
    inset 0 1px 2px rgba(0, 0, 0, 0.3),
    inset 0 -1px 0 rgba(255, 255, 255, 0.05),
    0 0 0 1px rgba(93, 114, 255, 0.2);
}

.page-docs #content pre {
  position: relative;
  border: 1px solid rgba(80, 100, 180, 0.35);
  background: linear-gradient(160deg, rgba(12, 20, 48, 0.9), rgba(8, 14, 38, 0.85));
  box-shadow:
    inset 0 1px 2px rgba(0, 0, 0, 0.35),
    inset 0 -1px 0 rgba(255, 255, 255, 0.03);
}

.page-docs #content pre::before {
  content: "";
  position: absolute;
  inset: 3px;
  border-radius: 0.5rem;
  background: rgba(0, 0, 0, 0.25);
  box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.4);
  pointer-events: none;
}

.page-docs #content pre code,
.page-docs #content pre .copy-btn {
  position: relative;
  z-index: 1;
}

.page-docs #content code:not(pre code) {
  border: 1px solid rgba(80, 100, 180, 0.35);
  background: linear-gradient(160deg, rgba(12, 20, 48, 0.75), rgba(8, 14, 38, 0.65));
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.25);
}

.page-docs .report-json {
  border: 1px solid rgba(80, 100, 180, 0.35);
  background: linear-gradient(160deg, rgba(12, 20, 48, 0.9), rgba(8, 14, 38, 0.85));
  box-shadow:
    inset 0 1px 2px rgba(0, 0, 0, 0.35),
    inset 0 -1px 0 rgba(255, 255, 255, 0.03);
}

.page-docs .report-block {
  margin-bottom: 1.25rem;
}

.page-docs .report-table {
  border: 1px solid rgba(80, 100, 180, 0.35);
  border-radius: 0.7rem;
  overflow: hidden;
  background: linear-gradient(160deg, rgba(12, 20, 48, 0.5), rgba(8, 14, 38, 0.4));
}

.page-docs .report-table th {
  background: linear-gradient(160deg, rgba(18, 28, 58, 0.9), rgba(14, 22, 48, 0.85));
  color: #90a8e8;
}

.position-last-trade {
  font-size: 0.72rem;
  margin-top: 0.35rem;
  margin-bottom: 0.1rem;
}

.position-badges-secondary {
  margin-top: 0.35rem;
}

.position-line-pnl {
  border-top: 1px dashed rgba(149, 169, 255, 0.25);
  padding-top: 0.45rem;
  justify-content: center;
  flex-wrap: nowrap;
  white-space: nowrap;
  min-width: 0;
  overflow-x: auto;
}

.position-line-pnl .position-metric-label {
  font-size: 0.82rem;
}

.position-line-pnl .position-metric-value {
  font-size: 1.05rem;
  white-space: nowrap;
}

.position-pnl-pct {
  font-size: 0.9em;
  opacity: 0.92;
  margin-left: 0.15rem;
}

.position-metric-label {
  color: #92a6df;
}

.position-metric-value {
  color: #ecf3ff;
}

.token-trades-host {
  border-top: 1px solid rgba(149, 169, 255, 0.2);
}

.token-trades-panel {
  border: 1px solid rgba(148, 170, 255, 0.28);
  background: rgba(17, 26, 56, 0.75);
}

.trades-modal-backdrop {
  background: rgba(0, 0, 0, 0.65);
}

.trades-modal-box::before {
  background: rgba(0, 0, 0, 0.25);
  box-shadow: inset 0 2px 8px rgba(0, 0, 0, 0.4);
}

.trades-modal-header {
  border-bottom-color: rgba(149, 169, 255, 0.25);
}

.trades-modal-title {
  color: #e2eaff;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.04), 0 -1px 1px rgba(0, 0, 0, 0.15);
}

.trades-modal-close {
  color: #b8c8f0;
}

.trades-modal-close:hover {
  background: rgba(149, 170, 255, 0.15);
}

.trades-modal-body {
  color: #c8d4f0;
}

.trades-modal-body .muted {
  color: #98abde;
}

.trades-modal-pager {
  border-top-color: rgba(149, 169, 255, 0.2);
}

.pnl-panel {
  gap: 0.6rem;
}

.pnl-hero {
  border-color: rgba(100, 130, 255, 0.25);
  background: linear-gradient(145deg, rgba(90, 115, 255, 0.08), rgba(0, 0, 0, 0.22));
  box-shadow:
    inset 0 1px 0 rgba(140, 165, 255, 0.1),
    inset 0 2px 10px rgba(0, 0, 0, 0.2),
    0 2px 8px rgba(0, 0, 0, 0.1);
}

.pnl-hero-cell {
  position: relative;
  border: 1px solid rgba(80, 100, 180, 0.35);
  border-radius: 0.7rem;
  padding: 0.75rem 0.65rem;
  background: linear-gradient(160deg, rgba(12, 20, 48, 0.85), rgba(8, 14, 38, 0.75));
  box-shadow:
    inset 0 1px 2px rgba(0, 0, 0, 0.35),
    inset 0 -1px 0 rgba(255, 255, 255, 0.03);
}

.pnl-hero-cell::before {
  content: "";
  position: absolute;
  inset: 2px;
  border-radius: 0.35rem;
  background: rgba(0, 0, 0, 0.25);
  box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.4);
  pointer-events: none;
}

.pnl-hero-cell .pnl-hero-label,
.pnl-hero-cell .pnl-hero-value,
.pnl-hero-cell .pnl-hero-tokens-value,
.pnl-hero-cell .pnl-hero-pill {
  position: relative;
  z-index: 1;
}

.pnl-hero-divider {
  display: none;
}

.pnl-hero-label {
  color: #8fa0e8;
}

.pnl-hero-value {
  font-size: 1.65rem;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.04), 0 -1px 1px rgba(0, 0, 0, 0.15);
}

.pnl-hero-pill {
  border-color: rgba(100, 130, 255, 0.45);
  background: rgba(38, 52, 105, 0.5);
}

.pnl-hero-right .pnl-hero-label {
  color: #9aabf0;
}

.pnl-hero-right-sep {
  color: rgba(100, 130, 255, 0.5);
}

.pnl-hero-tokens-value {
  color: #e0e8ff;
  font-size: 1.65rem;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.04), 0 -1px 1px rgba(0, 0, 0, 0.15);
}

.pnl-hero-value.pnl-flash,
.pnl-hero-tokens-value.pnl-flash {
  animation: pnl-flash-dark 0.6s ease-out;
  border-radius: 0.25rem;
}

@keyframes pnl-flash-dark {
  0% { background: rgba(93, 114, 255, 0.3); }
  100% { background: transparent; }
}

.pnl-stats-grid {
  gap: 0.4rem;
}

.pnl-stat {
  position: relative;
  border: 1px solid rgba(80, 100, 180, 0.35);
  border-radius: 0.7rem;
  padding: 0.75rem 0.65rem;
  background: linear-gradient(160deg, rgba(12, 20, 48, 0.85), rgba(8, 14, 38, 0.75));
  box-shadow:
    inset 0 1px 2px rgba(0, 0, 0, 0.35),
    inset 0 -1px 0 rgba(255, 255, 255, 0.03);
  transition: border-color 0.2s ease;
}

.pnl-stat::before {
  content: "";
  position: absolute;
  inset: 2px;
  border-radius: 0.5rem;
  background: rgba(0, 0, 0, 0.25);
  box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.4);
  pointer-events: none;
}

.pnl-stat span,
.pnl-stat strong {
  position: relative;
  z-index: 1;
}

.pnl-stat:hover {
  transform: translateY(-2px);
  border-color: rgba(100, 130, 255, 0.45);
  box-shadow:
    0 12px 28px rgba(0, 0, 0, 0.25),
    inset 0 1px 2px rgba(0, 0, 0, 0.35),
    inset 0 -1px 0 rgba(255, 255, 255, 0.03);
}

.pnl-stat span {
  color: #8fa0e8;
  font-size: 0.72rem;
  letter-spacing: 0.06em;
  font-weight: 700;
}

.pnl-stat strong {
  color: #e0e8ff;
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, "SF Mono", "Consolas", "Monaco", monospace;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.04), 0 -1px 1px rgba(0, 0, 0, 0.15);
}

.pnl-stat strong.is-up {
  color: var(--success);
}

.pnl-stat strong.is-down {
  color: var(--danger);
}

/* Better spacing consistency across pages */
.card + .card,
.grid + .card,
.card + .grid {
  margin-top: 0.82rem;
}

/* Enhanced success/danger color accents */
.is-up {
  color: var(--success);
  text-shadow: 0 0 10px rgba(0, 230, 138, 0.2);
}

.is-down {
  color: var(--danger);
  text-shadow: 0 0 10px rgba(255, 80, 128, 0.2);
}

.pnl-pos {
  color: var(--success);
  text-shadow: 0 0 8px rgba(0, 230, 138, 0.15);
}

.pnl-neg {
  color: var(--danger);
  text-shadow: 0 0 8px rgba(255, 80, 128, 0.15);
}

.ticker-value.status-up {
  color: var(--success);
  text-shadow: 0 0 8px rgba(0, 230, 138, 0.18);
}

.ticker-value.status-down {
  color: var(--danger);
  text-shadow: 0 0 8px rgba(255, 80, 128, 0.18);
}

/* Manual sell / action buttons: transparent fill, keep color */
.manual-sell-btn {
  background: linear-gradient(135deg, rgba(74, 112, 255, 0.28), rgba(53, 85, 208, 0.22));
  border: 1px solid rgba(74, 112, 255, 0.4);
  box-shadow: 0 4px 12px rgba(60, 90, 220, 0.18);
  transition: all 0.18s ease;
}

.manual-sell-btn:hover {
  background: linear-gradient(135deg, rgba(74, 112, 255, 0.38), rgba(53, 85, 208, 0.3));
  box-shadow: 0 8px 20px rgba(60, 90, 220, 0.28), 0 0 14px rgba(93, 114, 255, 0.12);
}

.manual-sell-dump {
  background: linear-gradient(135deg, rgba(255, 80, 128, 0.35), rgba(208, 48, 96, 0.28));
  border-color: rgba(255, 80, 128, 0.4);
  box-shadow: 0 4px 12px rgba(255, 80, 128, 0.18);
}

.manual-sell-dump:hover {
  background: linear-gradient(135deg, rgba(255, 80, 128, 0.45), rgba(208, 48, 96, 0.36));
  box-shadow: 0 8px 20px rgba(255, 80, 128, 0.28), 0 0 14px rgba(255, 80, 128, 0.12);
}

.never-buy-btn {
  background: linear-gradient(135deg, rgba(107, 120, 152, 0.28), rgba(77, 88, 110, 0.22));
  border-color: rgba(107, 120, 152, 0.35);
  box-shadow: 0 4px 10px rgba(70, 85, 115, 0.16);
}

.never-buy-btn:hover {
  background: linear-gradient(135deg, rgba(107, 120, 152, 0.38), rgba(77, 88, 110, 0.3));
  box-shadow: 0 8px 18px rgba(70, 85, 115, 0.24);
}

.remove-card-btn {
  background: linear-gradient(135deg, rgba(112, 128, 152, 0.28), rgba(85, 96, 120, 0.22));
  border-color: rgba(112, 128, 152, 0.35);
  box-shadow: 0 4px 10px rgba(80, 95, 120, 0.16);
}

.remove-card-btn:hover {
  background: linear-gradient(135deg, rgba(112, 128, 152, 0.38), rgba(85, 96, 120, 0.3));
  box-shadow: 0 8px 18px rgba(80, 95, 120, 0.24);
}

/* Scrollbar styling for dark theme */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-track {
  background: rgba(10, 16, 36, 0.5);
  border-radius: 4px;
}

::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(93, 114, 255, 0.4), rgba(144, 85, 255, 0.3));
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, rgba(93, 114, 255, 0.55), rgba(144, 85, 255, 0.45));
}

/* Selection highlight */
::selection {
  background: rgba(93, 114, 255, 0.3);
  color: #f0f4ff;
}

/* Toasts: bottom right, stack upward */
.toast-container {
  position: fixed;
  bottom: 1.25rem;
  right: 1.25rem;
  z-index: 10000;
  display: flex;
  flex-direction: column-reverse;
  gap: 0.5rem;
  max-width: min(360px, calc(100vw - 2.5rem));
  pointer-events: none;
}

.toast {
  padding: 0.65rem 1rem;
  border-radius: 0.5rem;
  font-size: 0.875rem;
  line-height: 1.35;
  background: var(--bg-card, rgba(18, 24, 48, 0.97));
  color: var(--text, #e8ecf8);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4);
  border: 1px solid var(--border-soft, rgba(149, 169, 255, 0.2));
  opacity: 0;
  transform: translateX(2rem);
  transition: opacity 0.25s ease, transform 0.25s ease;
}

.toast.toast--visible {
  opacity: 1;
  transform: translateX(0);
}

.toast--success {
  border-left: 3px solid #4ade80;
}

.toast--error {
  border-left: 3px solid #f87171;
}

.toast--info {
  border-left: 3px solid rgba(93, 114, 255, 0.8);
}

.toast--exit {
  opacity: 0;
  transform: translateX(1rem);
}

.toast .toast-title {
  font-weight: 700;
  display: block;
  margin-bottom: 0.25rem;
}

.toast .toast-line {
  font-size: 0.8rem;
  color: var(--muted, rgba(200, 210, 255, 0.85));
  margin-top: 0.15rem;
}

/* Light theme toasts */
html[data-theme="light"] .toast {
  background: rgba(255, 255, 255, 0.98);
  color: #121a34;
  box-shadow: 0 4px 20px rgba(25, 40, 96, 0.15);
  border: 1px solid rgba(217, 225, 246, 0.9);
}
html[data-theme="light"] .toast--success { border-left-color: #22c55e; }
html[data-theme="light"] .toast--error { border-left-color: #ef4444; }
html[data-theme="light"] .toast--info { border-left-color: #4a67ff; }

/* Positions page: token cell on 2–3 lines, no wrapping; copy icon only */
.page-positions .token-cell--positions,
.page-dashboard .token-cell--positions {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.2rem;
  min-width: 0;
}
.page-positions .token-cell-line--label,
.page-dashboard .token-cell-line--label {
  display: flex;
  align-items: center;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
  display: flex;
  align-items: center;
  gap: 0.35rem;
}
.page-positions .token-cell-line--meta,
.page-dashboard .token-cell-line--meta {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  flex-wrap: nowrap;
}
.page-positions .token-copy-btn.mint-copy-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.2rem;
  border: none;
  border-radius: 0.35rem;
  background: transparent;
  color: inherit;
  cursor: pointer;
  opacity: 0.7;
  transition: opacity 0.12s ease, background 0.12s ease;
}
.page-positions .token-copy-btn.mint-copy-icon:hover {
  opacity: 1;
  background: rgba(149, 170, 255, 0.18);
}
.page-positions .token-copy-btn.mint-copy-icon.is-copied {
  color: var(--success, #0d9668);
  opacity: 1;
}
.page-positions table td.mono {
  white-space: nowrap;
}
.page-positions table td.position-pnl-cell,
.page-dashboard .position-pnl-cell {
  white-space: normal;
}
.page-positions table td.position-pnl-cell .position-pnl-pct-line,
.page-dashboard .position-pnl-cell .position-pnl-pct-line {
  display: block;
}
.page-positions table td.date-cell {
  white-space: normal;
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, "SF Mono", "Consolas", "Monaco", monospace;
  font-size: 0.85rem;
}
.page-positions .date-two-line,
.page-dashboard .date-two-line {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  line-height: 1.25;
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, "SF Mono", "Consolas", "Monaco", monospace;
  font-size: 0.85rem;
}
.page-positions .date-two-line .date-d,
.page-dashboard .date-two-line .date-d {
  white-space: nowrap;
}
.page-positions .date-two-line .date-t,
.page-dashboard .date-two-line .date-t {
  color: var(--muted, #6b7280);
  font-size: 0.8rem;
}
.token-label-with-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}

.page-positions .token-cell-line--label .token-label,
.page-dashboard .token-cell-line--label .token-label {
  color: #90b8ff;
}
.page-positions .pill-fills-count,
.page-dashboard .pill-fills-count {
  min-width: 1.25rem;
  min-height: 1.5em;
  padding: 0.22em 0.35rem;
  font-size: 0.7rem;
  font-weight: 700;
  text-align: center;
  border-radius: 0.35rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
}
.page-positions thead tr th {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  vertical-align: middle;
  line-height: 1.2;
}
.page-positions thead tr th:first-child {
  width: 4.5rem;
  min-width: 4.5rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  box-sizing: border-box;
}
.page-positions .th-icon {
  padding: 0.5rem 0.5rem;
  color: var(--muted, #6b7280);
  font-weight: 700;
}
.page-positions .th-icon svg {
  display: block;
  margin: 0 auto;
}
.page-positions .th-token {
  min-width: 8rem;
}
.page-positions .th-token-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}
.page-positions .th-token-count {
  font-size: 0.75rem;
  font-weight: 700;
  color: var(--muted, #6b7280);
  flex-shrink: 0;
}
.page-positions .th-token-icon {
  flex: 1;
  display: flex;
  justify-content: center;
}
.page-positions .th-token-icon svg {
  margin: 0;
}
.page-positions .status-dot,
.page-dashboard .status-dot {
  display: inline-block;
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
  flex-shrink: 0;
}
.page-positions .status-dot--open,
.page-dashboard .status-dot--open {
  background: #22c55e;
  box-shadow: 0 0 0 1px rgba(34, 197, 94, 0.3);
}
.page-positions .status-dot--closed,
.page-dashboard .status-dot--closed {
  background: #ef4444;
  box-shadow: 0 0 0 1px rgba(239, 68, 68, 0.3);
}
.page-positions .status-cell,
.page-dashboard .status-cell {
  text-align: center;
  vertical-align: middle;
}
.page-positions .token-ticker-inline {
  font-size: 0.75rem;
  font-weight: 700;
  color: var(--muted, #6b7280);
  margin-right: 0.15rem;
}
.page-positions tr.position-row > td {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  min-height: 3.5em;
  box-sizing: border-box;
}
.page-positions table td {
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, "SF Mono", "Consolas", "Monaco", monospace;
  font-size: 0.85rem;
  vertical-align: middle;
}
.page-positions .trade-detail-table .side-with-status {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}
.position-card-in-modal .trade-detail-table .side-with-status .mono {
  margin-right: 0.35rem;
}
.page-positions .trade-detail-table .status-icon {
  font-size: 0.9em;
  font-weight: 700;
}
.page-positions .trade-detail-table .status-icon--ok {
  color: #22c55e;
}
.page-positions .trade-detail-table .status-icon--fail {
  color: #ef4444;
}
.page-positions .trade-detail-table .trade-detail-row--newest td {
  color: var(--text, #e7eeff);
}
.page-positions .trade-detail-table .supply-cap-cell .supply-cap-lock {
  display: inline-block;
  vertical-align: middle;
  margin-left: 0.2rem;
  color: var(--muted, #6b7280);
}
.page-positions .trade-detail-table .trade-detail-row--newest .supply-cap-lock {
  color: var(--text, #e7eeff);
}
.page-positions .trade-detail-table .th-detail-icon {
  padding: 0.25rem 0.4rem;
  font-weight: 700;
  color: var(--muted, #6b7280);
}
.page-positions .trade-detail-table .th-detail-icon svg {
  display: block;
  margin: 0 auto;
}

.position-card-modal {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  box-sizing: border-box;
}
.position-card-modal[hidden] {
  display: none;
}
.position-card-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.5);
  backdrop-filter: blur(4px);
}
.position-card-modal-content {
  position: relative;
  max-width: 720px;
  width: 100%;
  max-height: 90vh;
  overflow-y: auto;
  background: transparent;
  border-radius: 1rem;
  padding: 2.5rem 1.25rem 1rem;
  display: flex;
  flex-direction: column;
  align-items: stretch;
}
.position-card-modal-inner {
  position: relative;
  flex: 0 1 auto;
}
.position-card-modal-content #positionCardModalBody {
  flex: 0 1 auto;
}
.position-card-modal-content .position-card-in-modal {
  margin: 0;
  flex: 0 1 auto;
}
/* Pills in positions table: constrain width so columns stay even (supply pill excluded so owned supply shows fully) */
.page-positions td .pill:not(.pill-supply):not(.pill-supply-at-cap) {
  max-width: 9rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  box-sizing: border-box;
}

.page-positions .pnl-card-cell {
  cursor: pointer;
}
.page-positions .pnl-card-cell:hover {
  text-decoration: underline;
}

.position-card-in-modal .position-head {
  min-height: 2.75em;
  display: flex;
  align-items: center;
}
.position-card-in-modal .position-subline {
  min-height: 2.25em;
}
.position-card-in-modal .position-grid {
  min-height: 2.5em;
}
.position-card-in-modal .position-main .position-actions-strip.position-card-modal-sell {
  margin-top: 0;
  min-height: 0;
  border-top: none;
}

/* Position card (overview + modal): action strip at bottom, right-aligned, pills in one row; no line above show trades pill */
.position-card .position-actions-strip--bottom,
.position-card-in-modal .position-actions-strip--bottom {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
  gap: 0.5rem;
  margin-top: 0.5rem;
  padding-top: 0;
  border-top: none;
  border-left: none;
  min-width: 0;
  width: 100%;
  padding-left: 0;
  padding-right: 0;
}
.position-card .position-actions-strip--bottom .position-actions-strip-pill,
.position-card .position-actions-strip--bottom .manual-sell-btn,
.position-card .position-actions-strip--bottom .token-trades-host,
.position-card-in-modal .position-actions-strip--bottom .position-actions-strip-pill,
.position-card-in-modal .position-actions-strip--bottom .manual-sell-btn {
  flex-shrink: 0;
}
.position-card-in-modal .position-card-trades-cell {
  margin-top: 0.5rem;
  padding-top: 0;
  border-top: none;
}
.position-card-in-modal .position-card-trades {
  margin-top: 0;
}
.position-card-in-modal .token-trades-list--hidden {
  display: none;
}
.position-card-in-modal .token-trades-list {
  margin-top: 0;
  max-height: 14rem;
  overflow-y: auto;
  padding: 0;
}
.position-card-in-modal .trade-detail-table {
  font-size: 0.85rem;
  width: 100%;
  border-collapse: collapse;
  margin: 0;
}
.position-card-in-modal .trade-detail-table thead th {
  padding: 0.5rem 0.5rem;
  box-sizing: border-box;
  line-height: 1.3;
  text-align: left;
  font-weight: 700;
  color: var(--text, #e7eeff);
  border-bottom: none;
  vertical-align: middle;
}
.position-card-in-modal .trade-detail-table thead th:first-child {
  padding: 0.5rem 0.5rem;
  box-sizing: border-box;
}
.position-card-in-modal .trade-detail-table thead th.th-detail-icon {
  padding: 0.5rem 0.5rem;
  white-space: nowrap;
}
.position-card-in-modal .trade-detail-table thead th.th-detail-icon svg {
  display: block;
  margin: 0 auto;
}
.position-card-in-modal .trade-detail-table tbody td {
  padding: 0.5rem 0.5rem;
  box-sizing: border-box;
  border-bottom: 1px solid var(--border-soft, rgba(149, 169, 255, 0.15));
  vertical-align: middle;
}
.position-card-in-modal .trade-detail-table tbody td.side-with-status {
  display: table-cell;
  text-align: left;
}
.position-card-in-modal .trade-detail-table tbody td .pill.unit-badge {
  min-height: 1.5em;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.position-card-in-modal .trade-detail-table .supply-cap-cell .supply-cap-lock {
  display: inline-block;
  vertical-align: middle;
  margin-left: 0.2rem;
}
.position-card-in-modal .trade-detail-table .trade-detail-row--newest td {
  color: var(--text, #e7eeff);
}

/* Positions page: modal is only backdrop + PnL card (no extra box) */
.position-card-modal {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
  box-sizing: border-box;
  overflow-y: auto;
  overflow-x: hidden;
}
.position-card-modal[hidden] {
  display: none;
}
.position-card-modal-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.55);
  cursor: pointer;
  z-index: 0;
}
.position-card-modal-body {
  position: relative;
  z-index: 1;
  max-width: 720px;
  width: 100%;
  flex-shrink: 0;
  margin: auto;
  padding: 0;
  overflow: visible;
}
.position-card-modal-body .position-card-in-modal {
  margin: 0;
}

/* Positions page: position card inside trades-modal (same modal as overview) */
.trades-modal-body .position-card-in-modal {
  margin: 0;
  flex: 0 1 auto;
}

/* Overview: trades modal table — same first-column/row-height as position card */
.trades-modal .trade-detail-table {
  font-size: 0.85rem;
  width: 100%;
  border-collapse: collapse;
  margin: 0;
}
.trades-modal .trade-detail-table thead th {
  padding: 0.5rem 0.5rem;
  box-sizing: border-box;
  line-height: 1.3;
  text-align: left;
  font-weight: 700;
  color: var(--text, #e7eeff);
  border-bottom: 1px solid var(--border-soft, rgba(149, 169, 255, 0.2));
  vertical-align: middle;
}
.trades-modal .trade-detail-table thead th.th-detail-icon {
  padding: 0.5rem 0.5rem;
  white-space: nowrap;
}
.trades-modal .trade-detail-table thead th.th-detail-icon svg {
  display: block;
  margin: 0 auto;
}
.trades-modal .trade-detail-table tbody td {
  padding: 0.5rem 0.5rem;
  box-sizing: border-box;
  border-bottom: 1px solid var(--border-soft, rgba(149, 169, 255, 0.15));
  vertical-align: middle;
}
.trades-modal .trade-detail-table tbody td.side-with-status {
  display: table-cell;
  text-align: left;
}
.trades-modal .trade-detail-table .side-with-status .mono {
  margin-right: 0.35rem;
}
.trades-modal .trade-detail-table .trade-detail-row--newest td {
  color: var(--text, #e7eeff);
}

.table-scroll-wrap {
  max-height: 70vh;
  overflow-y: auto;
  overflow-x: auto;
}

/* Positions page: inner scroll container so sticky thead works; 7 rows when bar expanded, 13 when collapsed */
.page-positions .table-scroll-inner {
  --positions-thead-height: 2.75rem;
  --positions-row-height: 4rem;
  max-height: calc(var(--positions-thead-height) + 7 * var(--positions-row-height));
  overflow-y: auto;
  overflow-x: auto;
}
.dashboard-bar-collapsed.page-positions .table-scroll-inner {
  max-height: calc(var(--positions-thead-height) + 13 * var(--positions-row-height));
}
.page-positions .table-scroll-wrap {
  overflow: visible;
  max-height: none;
}
.page-positions .table-scroll-wrap table {
  overflow: visible;
}
.page-positions .table-scroll-inner thead th {
  position: sticky;
  top: 0;
  left: auto;
  display: table-cell;
  z-index: 2;
  background: rgba(18, 28, 55, 0.98);
  box-shadow: 0 1px 0 0 var(--border-soft, rgba(149, 169, 255, 0.2));
}

.expand-btn {
  width: 2.3rem;
  height: 2.3rem;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.35rem;
  border: 1px solid var(--border-soft);
  background: var(--bg-soft);
  color: var(--muted, #6b7280);
  cursor: pointer;
  font-size: 1rem;
  line-height: 1;
  font-weight: 700;
}

.expand-btn:hover {
  background: var(--primary-soft);
  color: var(--text);
}

.page-positions .position-actions-cell {
  text-align: center;
  vertical-align: middle;
  padding: 0.5rem 0.5rem;
  box-sizing: border-box;
  white-space: nowrap;
}
.page-positions .position-actions-cell .expand-btn {
  margin-right: 0.35rem;
}

/* Expand (+) and PnL pill: same size and style, vertically centered in cell */
.page-positions .position-actions-cell .expand-btn,
.page-positions .pnl-card-open-btn,
.page-dashboard .pnl-card-open-btn {
  width: 2.3rem;
  height: 2.3rem;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  vertical-align: middle;
  border-radius: 0.35rem;
  border: 1px solid var(--border-soft);
  background: var(--bg-soft);
  color: var(--muted, #6b7280);
  cursor: pointer;
  font-size: 1rem;
  line-height: 1;
  text-decoration: none;
}

.page-positions .position-actions-cell .expand-btn:hover,
.page-positions .pnl-card-open-btn:hover,
.page-dashboard .pnl-card-open-btn:hover {
  background: var(--primary-soft);
  color: var(--text);
}

.page-positions .pnl-card-open-btn svg,
.page-dashboard .pnl-card-open-btn svg {
  display: block;
  width: 1rem;
  height: 1rem;
}

.trade-detail-wrap td {
  padding: 0.5rem 0.75rem;
  vertical-align: top;
  border-bottom: 1px solid var(--border-soft);
}

.trade-detail-cell {
  background: rgba(0, 0, 0, 0.03);
}

html[data-theme="dark"] .trade-detail-cell {
  background: rgba(0, 0, 0, 0.2);
}

.trade-detail-table {
  width: 100%;
  font-size: 0.85rem;
  margin: 0;
  background: transparent;
  border: none;
}

.trade-detail-table th {
  text-align: left;
  padding: 0.35rem 0.6rem;
  font-size: 0.75rem;
}

.trade-detail-table td {
  padding: 0.35rem 0.6rem;
  border-bottom: none;
  vertical-align: middle;
}

.trade-detail-table tbody td {
  min-height: 2.75em;
  box-sizing: border-box;
}

.trade-detail-row td {
  border-bottom: 1px solid var(--border-soft);
}

@media (max-width: 920px) {
  .positions-cards {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .wrap {
    width: min(1260px, 96vw);
  }

  .sticky-header {
    width: min(1260px, 96vw);
  }

  .position-grid {
    grid-template-columns: 1fr;
  }
}

/* Theme toggle: hidden (light mode disabled for now) */
.theme-toggle {
  display: none !important;
}

.theme-toggle:hover {
  background: rgba(38, 52, 105, 0.6);
  color: #e0e8ff;
  border-color: rgba(130, 155, 255, 0.5);
}

.pill-done {
  animation: pill-done-pulse 0.5s ease-out;
}

@keyframes pill-done-pulse {
  0% { opacity: 1; filter: brightness(1.2); }
  100% { opacity: 1; filter: brightness(1); }
}

/* ═══ Light theme (data-theme="light") — cohesive override set ═══ */
html[data-theme="light"] {
  color-scheme: light;
}

html[data-theme="light"] body {
  color: var(--text);
  background: linear-gradient(165deg, #f8faff 0%, #eef2ff 45%, #e8eeff 100%);
}

html[data-theme="light"] .sticky-header {
  background: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  box-shadow: none;
}

html[data-theme="light"] .sticky-header::before {
  background: linear-gradient(
    to bottom,
    rgba(238, 242, 255, 0.95) 0%,
    rgba(237, 242, 255, 0.4) 50%,
    transparent 100%
  );
}
html[data-theme="light"] .sticky-header::after {
  background: linear-gradient(
    to bottom,
    transparent 0%,
    rgba(237, 242, 255, 0.5) 40%,
    rgba(238, 242, 255, 0.98) 100%
  );
}

html[data-theme="light"] .topbar {
  border: none;
  background: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  box-shadow: none;
}

html[data-theme="light"] .sticky-header .topbar {
  border: none;
}

html[data-theme="light"] .sticky-header .ticker-banner.card {
  border: none;
  background: transparent;
  box-shadow: none;
}

html[data-theme="light"] .brand a {
  color: var(--text);
}

html[data-theme="light"] .brand-dot {
  color: var(--primary);
}

html[data-theme="light"] .nav a {
  border: 1px solid rgba(100, 130, 255, 0.28);
  color: var(--text);
  background: linear-gradient(135deg, rgba(248, 250, 255, 0.7), rgba(238, 242, 255, 0.5));
  backdrop-filter: blur(14px) saturate(160%);
  -webkit-backdrop-filter: blur(14px) saturate(160%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.6), inset 0 -1px 0 rgba(100, 130, 255, 0.06);
  border-radius: 0.35rem;
}

html[data-theme="light"] .nav a:hover {
  border-color: rgba(100, 130, 255, 0.45);
  background: linear-gradient(135deg, rgba(248, 250, 255, 0.85), rgba(238, 242, 255, 0.65));
  backdrop-filter: blur(14px) saturate(160%);
  -webkit-backdrop-filter: blur(14px) saturate(160%);
  color: var(--text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8), 0 2px 8px rgba(25, 40, 96, 0.08);
  transform: translateY(-1px);
}

html[data-theme="light"] .nav a.active {
  background: linear-gradient(135deg, rgba(248, 250, 255, 0.9), rgba(230, 236, 255, 0.75));
  backdrop-filter: blur(14px) saturate(160%);
  -webkit-backdrop-filter: blur(14px) saturate(160%);
  border: 1px solid rgba(74, 103, 255, 0.5);
  color: var(--primary);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    inset 0 -1px 0 rgba(100, 130, 255, 0.08),
    0 0 0 1px rgba(74, 103, 255, 0.12);
}

html[data-theme="light"] .card {
  border: 1px solid var(--border-soft);
  background: #ffffff;
  color: var(--text);
  box-shadow: 0 2px 8px rgba(25, 40, 96, 0.06);
}

html[data-theme="light"] h1,
html[data-theme="light"] h2 {
  color: var(--text);
}

html[data-theme="light"] h1 {
  color: var(--text);
  background: none;
  -webkit-background-clip: unset;
  background-clip: unset;
}

html[data-theme="light"] h2 {
  color: #2d3854;
}

html[data-theme="light"] .muted {
  color: var(--muted);
}

html[data-theme="light"] button {
  background: #ffffff;
  color: var(--text);
  border: 1px solid var(--border);
}

html[data-theme="light"] button:hover {
  background: var(--primary-soft);
  border-color: var(--primary);
  box-shadow: 0 2px 8px rgba(74, 103, 255, 0.12);
}

html[data-theme="light"] button.primary {
  background: var(--primary);
  color: #ffffff;
  border-color: var(--primary);
}

html[data-theme="light"] button.primary:hover {
  filter: brightness(1.05);
  box-shadow: 0 4px 14px rgba(74, 103, 255, 0.3);
}

html[data-theme="light"] .pill {
  border: 1px solid var(--border-soft);
  background: #f4f6fc;
  color: var(--text);
}

html[data-theme="light"] .pill-status.status-on {
  color: #0d7a4c;
  border-color: #7dd4a8;
  background: #dcf5e9;
}

html[data-theme="light"] .pill-status.status-off {
  color: #a82d4d;
  border-color: #f0b8c9;
  background: #fceef2;
}

html[data-theme="light"] .position-card {
  border: 1px solid rgba(255, 255, 255, 0.8);
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.4));
  backdrop-filter: blur(14px) saturate(160%);
  -webkit-backdrop-filter: blur(14px) saturate(160%);
  box-shadow:
    0 8px 32px rgba(25, 40, 96, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    inset 0 -1px 0 rgba(0, 0, 0, 0.04);
}

html[data-theme="light"] .position-card:hover {
  border-color: rgba(255, 255, 255, 0.95);
  box-shadow:
    0 12px 40px rgba(25, 40, 96, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.95),
    inset 0 -1px 0 rgba(0, 0, 0, 0.03);
}

html[data-theme="light"] .theme-toggle {
  border: 1px solid var(--border-soft);
  background: #f4f6fc;
  color: var(--muted);
}

html[data-theme="light"] .theme-toggle:hover {
  background: #e8ecf8;
  color: var(--text);
  border-color: var(--border);
}


html[data-theme="light"] input[type="number"],
html[data-theme="light"] input[type="text"],
html[data-theme="light"] select {
  background: #ffffff;
  color: var(--text);
  border: 1px solid var(--border);
}

html[data-theme="light"] input:focus,
html[data-theme="light"] select:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 2px rgba(74, 103, 255, 0.15);
}

html[data-theme="light"] .ticker-banner {
  border: 1px solid var(--border-soft);
  background: #ffffff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}

html[data-theme="light"] .ticker-item {
  border-radius: 0.35rem;
  border: 1px solid rgba(100, 130, 255, 0.25);
  background: linear-gradient(135deg, rgba(248, 250, 255, 0.9), rgba(238, 242, 255, 0.75));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8), 0 1px 3px rgba(74, 103, 255, 0.08);
  color: var(--text);
}

html[data-theme="light"] .ticker-label {
  color: var(--muted);
}

html[data-theme="light"] .ticker-value {
  color: var(--text);
}

html[data-theme="light"] .card .position-line-pnl,
html[data-theme="light"] .card .card-actions,
html[data-theme="light"] .card .manual-sell-actions,
html[data-theme="light"] .position-line-pnl {
  border-top-color: var(--border-soft);
}

html[data-theme="light"] .position-line-mid .mono {
  color: var(--muted);
}

html[data-theme="light"] .position-metric-label {
  color: var(--muted);
}

html[data-theme="light"] .position-metric-value {
  color: var(--text);
}

html[data-theme="light"] table {
  background: #fafbff;
  border: 1px solid var(--border-soft);
}

html[data-theme="light"] th {
  background: #f1f4fb;
  color: var(--text);
  border-bottom: 1px solid var(--border-soft);
}

html[data-theme="light"] td {
  border-bottom: 1px solid var(--border-soft);
  color: var(--text);
}

html[data-theme="light"] tbody tr:nth-child(even) td {
  background: #f8faff;
}

html[data-theme="light"] tbody tr:hover td {
  background: #eef2ff;
}
html[data-theme="light"] .trade-detail-table--compact tbody tr:hover td {
  background: transparent;
}

html[data-theme="light"] .position-kpi {
  border-color: rgba(180, 195, 230, 0.5);
  background: linear-gradient(160deg, rgba(235, 238, 250, 0.95), rgba(228, 232, 248, 0.9));
  box-shadow:
    inset 0 1px 3px rgba(0, 0, 0, 0.08),
    inset 0 -1px 0 rgba(255, 255, 255, 0.6);
}

html[data-theme="light"] .position-kpi::before {
  background: rgba(0, 0, 0, 0.06);
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.08);
}

html[data-theme="light"] .position-kpi-label {
  color: var(--muted);
}

html[data-theme="light"] .position-kpi-value {
  color: var(--text);
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.8), 0 -1px 0 rgba(0, 0, 0, 0.06);
}

html[data-theme="light"] .kpi-cell {
  border-color: rgba(180, 195, 230, 0.5);
  background: linear-gradient(160deg, rgba(235, 238, 250, 0.95), rgba(228, 232, 248, 0.9));
  box-shadow:
    inset 0 1px 3px rgba(0, 0, 0, 0.08),
    inset 0 -1px 0 rgba(255, 255, 255, 0.6);
}

html[data-theme="light"] .kpi-cell::before {
  background: rgba(0, 0, 0, 0.06);
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.08);
}

html[data-theme="light"] .kpi-cell-label {
  color: var(--muted);
}

html[data-theme="light"] .kpi-cell-value {
  color: var(--text);
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.8), 0 -1px 0 rgba(0, 0, 0, 0.06);
}

html[data-theme="light"] .settings-section {
  border-color: rgba(180, 195, 230, 0.5);
  background: linear-gradient(160deg, rgba(235, 238, 250, 0.95), rgba(228, 232, 248, 0.9));
  box-shadow:
    inset 0 1px 3px rgba(0, 0, 0, 0.08),
    inset 0 -1px 0 rgba(255, 255, 255, 0.6);
}

html[data-theme="light"] .settings-section::before {
  background: rgba(0, 0, 0, 0.06);
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.08);
}

html[data-theme="light"] .settings-section-header h2 {
  color: var(--text);
}

html[data-theme="light"] .settings-field {
  border-color: rgba(180, 195, 230, 0.5);
  background: linear-gradient(160deg, rgba(235, 238, 250, 0.95), rgba(228, 232, 248, 0.9));
  box-shadow:
    inset 0 1px 3px rgba(0, 0, 0, 0.08),
    inset 0 -1px 0 rgba(255, 255, 255, 0.6);
}

html[data-theme="light"] .settings-field::before {
  background: rgba(0, 0, 0, 0.06);
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.08);
}

html[data-theme="light"] .settings-field label {
  color: var(--muted);
}

/* Docs page recessed — light theme */
html[data-theme="light"] .page-docs .docs-sidebar a {
  border-color: rgba(100, 130, 255, 0.25);
  background: linear-gradient(160deg, rgba(248, 250, 255, 0.95), rgba(238, 242, 252, 0.9));
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.06), inset 0 -1px 0 rgba(255, 255, 255, 0.6);
}
html[data-theme="light"] .page-docs .docs-sidebar a::before {
  background: rgba(0, 0, 0, 0.04);
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.06);
}
html[data-theme="light"] .page-docs .docs-sidebar a:hover {
  border-color: rgba(100, 130, 255, 0.4);
  background: linear-gradient(160deg, rgba(242, 246, 255, 0.98), rgba(232, 238, 252, 0.95));
}
html[data-theme="light"] .page-docs .docs-sidebar a.active {
  border-color: rgba(93, 114, 255, 0.5);
  background: linear-gradient(160deg, rgba(235, 240, 255, 0.98), rgba(225, 232, 252, 0.95));
}
html[data-theme="light"] .page-docs #content pre {
  border-color: rgba(100, 130, 255, 0.25);
  background: linear-gradient(160deg, rgba(248, 250, 255, 0.95), rgba(238, 242, 252, 0.9));
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.06), inset 0 -1px 0 rgba(255, 255, 255, 0.6);
}
html[data-theme="light"] .page-docs #content pre::before {
  background: rgba(0, 0, 0, 0.04);
  box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.06);
}
html[data-theme="light"] .page-docs #content code:not(pre code) {
  border-color: rgba(100, 130, 255, 0.25);
  background: linear-gradient(160deg, rgba(242, 246, 255, 0.9), rgba(232, 238, 252, 0.85));
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.05);
}
html[data-theme="light"] .page-docs .report-json {
  border-color: rgba(100, 130, 255, 0.25);
  background: linear-gradient(160deg, rgba(248, 250, 255, 0.95), rgba(238, 242, 252, 0.9));
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.06), inset 0 -1px 0 rgba(255, 255, 255, 0.6);
}
html[data-theme="light"] .page-docs .report-table {
  border-color: rgba(100, 130, 255, 0.25);
  background: linear-gradient(160deg, rgba(248, 250, 255, 0.5), rgba(238, 242, 252, 0.4));
}

html[data-theme="light"] .token-label,
html[data-theme="light"] .token-ticker {
  color: var(--text);
}

html[data-theme="light"] .manual-sell-btn {
  background: linear-gradient(135deg, #3f7cff 0%, #2958d9 100%);
  color: #f8fbff;
  border: 1px solid transparent;
}

html[data-theme="light"] .manual-sell-dump {
  background: linear-gradient(135deg, #ee496d 0%, #cc2f58 100%);
  color: #fff;
}

html[data-theme="light"] .positions-empty {
  border: 1px dashed var(--border);
  background: #fafbff;
  color: var(--muted);
}

html[data-theme="light"] .page-positions .table-scroll-inner thead th {
  background: #f8faff;
}

html[data-theme="light"] .pnl-stat strong {
  color: var(--text);
}

/* PnL shiny glass — light theme (blue tint) */
html[data-theme="light"] .pnl-card {
  background: linear-gradient(135deg, rgba(248, 250, 255, 0.85), rgba(238, 242, 255, 0.6)) !important;
  border: 1px solid rgba(100, 130, 255, 0.2) !important;
  box-shadow:
    0 8px 32px rgba(25, 40, 96, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    inset 0 -1px 0 rgba(100, 130, 255, 0.05);
}

html[data-theme="light"] .pnl-card::after {
  background: linear-gradient(to bottom, transparent, rgba(248, 250, 255, 0.97));
}

html[data-theme="light"] .header-panel {
  background: linear-gradient(135deg, rgba(248, 250, 255, 0.85), rgba(238, 242, 255, 0.6));
  border: 1px solid rgba(100, 130, 255, 0.2);
  box-shadow:
    0 8px 32px rgba(25, 40, 96, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    inset 0 -1px 0 rgba(100, 130, 255, 0.05);
}

html[data-theme="light"] .header-panel::after {
  background: linear-gradient(
    to bottom,
    transparent 0%,
    rgba(248, 250, 255, 0.4) 30%,
    rgba(248, 250, 255, 0.85) 65%,
    rgba(248, 250, 255, 1) 100%
  );
}

html[data-theme="light"] .pnl-hero {
  border-color: rgba(100, 130, 255, 0.22);
  background: linear-gradient(145deg, rgba(248, 250, 255, 0.7), rgba(230, 236, 255, 0.4));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.8),
    inset 0 2px 8px rgba(100, 130, 255, 0.04),
    0 2px 8px rgba(0, 0, 0, 0.04);
}

html[data-theme="light"] .pnl-hero-cell {
  border-color: rgba(180, 195, 230, 0.5);
  background: linear-gradient(160deg, rgba(235, 238, 250, 0.95), rgba(228, 232, 248, 0.9));
  box-shadow:
    inset 0 1px 3px rgba(0, 0, 0, 0.08),
    inset 0 -1px 0 rgba(255, 255, 255, 0.6);
}

html[data-theme="light"] .pnl-hero-cell::before {
  background: rgba(0, 0, 0, 0.06);
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.08);
}

html[data-theme="light"] .pnl-hero-value,
html[data-theme="light"] .pnl-hero-tokens-value {
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.8), 0 -1px 0 rgba(0, 0, 0, 0.06);
}

html[data-theme="light"] .pnl-stat {
  border-color: rgba(180, 195, 230, 0.5);
  background: linear-gradient(160deg, rgba(235, 238, 250, 0.95), rgba(228, 232, 248, 0.9));
  box-shadow:
    inset 0 1px 3px rgba(0, 0, 0, 0.08),
    inset 0 -1px 0 rgba(255, 255, 255, 0.6);
}

html[data-theme="light"] .pnl-stat::before {
  background: rgba(0, 0, 0, 0.06);
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.08);
}

html[data-theme="light"] .pnl-stat strong {
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.8), 0 -1px 0 rgba(0, 0, 0, 0.06);
}

html[data-theme="light"] .pnl-stat:hover {
  transform: translateY(-2px);
  border-color: rgba(100, 130, 255, 0.45);
  box-shadow:
    0 12px 28px rgba(25, 40, 96, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    inset 0 -1px 0 rgba(100, 130, 255, 0.08),
    0 0 20px rgba(93, 114, 255, 0.12);
}

html[data-theme="light"] .profile-toggle .pill-profile {
  background: #f4f6fc;
  color: var(--text);
  border: 1px solid var(--border-soft);
}

html[data-theme="light"] .profile-toggle .pill-profile:hover {
  background: var(--primary-soft);
  color: var(--primary);
  border: 1px solid rgba(93, 114, 255, 0.4);
}

html[data-theme="light"] .profile-toggle .pill-profile[aria-pressed="true"],
html[data-theme="light"] .profile-toggle .pill-profile.active {
  background: linear-gradient(135deg, rgba(93, 114, 255, 0.25), rgba(93, 114, 255, 0.15));
  color: var(--primary);
  border: 1px solid rgba(93, 114, 255, 0.7);
  box-shadow: 0 0 0 1px rgba(93, 114, 255, 0.15);
}