/* Ticker Is — the shell, actions and market data have separate color roles. */
:root {
  --bg: #0a0d15;
  --panel: #111723;
  --border: #2d3749;
  --muted: #a7b4ca;
  --white: #edf3ff;
  --accent: #8ca9ff;
  --signal: #b2c5ff;
  --highlight: #a7bfff;
  --gain: #6ee7b2;
  --loss: #ff92ac;
  --inset: #0e131d;
  --raised: #192131;
  --selected: #1d2c4a;
  --control-border: #62718c;
  /* Existing controls reference this legacy token. */
  --lime: var(--accent);
}

body {
  color: var(--white);
  background: var(--bg);
}

#side, header { background-color: var(--inset); }
.sectionlabel, .rankno, .trend .rank,
.panelhead small, .actions button, .write, .market-arrow { color: var(--muted); }
nav button { color: #c6d1d9; }
#nav button.active, .market-views button[aria-pressed="true"],
.lab-tabs button[aria-pressed="true"], .periods button[aria-pressed="true"] {
  background: var(--selected);
  color: #c7d5ff;
}
.sectionlabel .ico, .phone-nav [aria-current="page"], .phone-nav [aria-expanded="true"],
.new-meta a:hover { color: var(--signal); }
.phone-nav { background-color: #0e131d; }
.phone-create .ico, .sidebarfoot i, .phone-nav .has-unread::after,
.new-head button i { background-color: var(--signal); }
.new-head button[aria-pressed="true"] i { background-color: var(--muted); }
.unread-count { background-color: var(--accent); }
.notice-dot { background-color: var(--border); }
.unread .notice-dot { background-color: var(--signal); }
.unread-count { color: #0a1227; }

.primary, .hero button {
  background: var(--accent);
  color: #0a1227;
}
.primary:hover, .hero button:hover { background: #b5c7ff; color: #0a1227; }
button:focus-visible, a:focus-visible, input:focus-visible,
textarea:focus-visible, select:focus-visible, summary:focus-visible {
  outline-color: var(--signal);
}
.outline, .attach, .chains span, .search,
form input, textarea, select, .reply input, .lab textarea, .lab select {
  border-color: var(--control-border);
}
.search, form input, textarea, select, .reply input, .lab textarea, .lab select {
  color: var(--white);
  background-color: var(--inset);
}
.outline.selected, .filters button.active, .chains input:checked + span {
  color: #c7d5ff;
  border-color: #6788d9;
  background: var(--selected);
}
.type { border-color: #455b91; color: #bdd0ff; }
.me, .initial { color: #10172d; background-color: #b2c4eb; }
.network { color: #c7e9ff; background-color: #233144; }
.desk:focus-within { border-color: #718fd5; }
.mode-switch i:last-child { background: #465057; }
.mode-switch i:last-child::after { background: #d9e1e3; }
.mode-switch[aria-pressed="true"] i:last-child { background: var(--accent); }
.mode-switch[aria-pressed="true"] i:last-child::after { background: #132041; }
#toast { color: #101629; background: #c1d0ff; }

/* The prompt, navigation and install icon share the terminal palette. */
.wordmark strong, .rw-account-brand, .hero h2 {
  font: 700 clamp(24px, 3vw, 36px)/1.12 var(--mono);
  letter-spacing: -.06em;
}
.wordmark strong, .rw-account-brand { font-size: 24px; white-space: nowrap; }
.hero {
  isolation: isolate;
  color: var(--white);
  border: 1px solid #344563;
  background: radial-gradient(circle at 75% 45%, #24375b, transparent 50%), #0e1521;
}
.hero::before {
  position: absolute;
  inset: 0 0 0 53%;
  content: "";
  z-index: -1;
  pointer-events: none;
  background: radial-gradient(circle, #52648577 1px, transparent 1.1px) 0 0 / 12px 12px;
  mask-image: linear-gradient(90deg, transparent, #000 16%);
}
.hero h2 { font-size: clamp(26px, 3vw, 46px); margin: 10px 0 6px; }
.hero h2 em { color: var(--accent); font-style: normal; }
.hero .prompt-art {
  position: absolute;
  top: 0;
  right: 0;
  width: 47%;
  height: 100%;
  pointer-events: none;
  z-index: -1;
}
.desk textarea::placeholder { color: var(--muted); opacity: 1; }
.ticker-intro { display: block; font: 600 10px/1.15 var(--mono); color: var(--muted); }
.ticker-field { position: relative; display: flex; align-items: center; }
.ticker-field b { position: absolute; left: 12px; color: var(--accent); }
.launch-fields .ticker-field input { padding-left: 28px; font-family: var(--mono); text-transform: uppercase; }
.hero .kicker { color: var(--signal); }
.hero p { color: #b7c2d9; }

.market-board, .lab, .tokenpreview, dialog { background-color: var(--panel); }
.tokenpreview, dialog { border-color: var(--control-border); }
.market-views, .lab-tabs { background: var(--inset); }
.market-views small, .funds, .fees, .previewtext, .curve { background: var(--raised); }
.market-card {
  color: var(--white);
  border-color: #344157;
  background: radial-gradient(ellipse at top right, #1f2c41, transparent 62%), var(--panel);
}
.market-card:hover, .profile-token:hover { border-color: #748ac1; }
.profile-token:hover, .discovery-row:hover { background: var(--raised); }
.quotes { border-color: var(--border); }
.market-name small, .quotes small, .curve-line small { color: var(--muted); }
.price-panel {
  border-color: var(--border);
  background: linear-gradient(135deg, #212d35, #171d24);
}
.progress-mini, .meter, .reserve-meter { background-color: #38444d; }
.reserve-meter i { background: linear-gradient(90deg, var(--accent), var(--signal)); }
.status-chip.bonding { color: #b9f4ff; background: #183747; }
.status-chip.graduated { color: #bdccff; background: #26314a; }
.eyeline { color: var(--highlight); }
.call-comment { border-color: #4e607f; }
.profile-cover {
  background: radial-gradient(ellipse at 75% 140%, #516977, #273943 48%, #161e25 88%);
}
.profile-cover i { border-color: #a3d9e39c; }
dialog::backdrop { background: #080610c2; }

/* P&L and direction still use their established green/red semantics. */
.green, .row-quote .green, .change { color: var(--gain); }
.negative, .down, .change.negative { color: var(--loss); }
.quick-actions .q-buy { color: #9df0c9; border-color: #426459; background: #172a29; }
.quick-actions .q-sell { color: #ffbdd0; border-color: #715165; background: #32212d; }
.fill-receipt {
  --fill-accent: var(--signal);
  --fill-wash: #193448;
  color: var(--white);
  background: linear-gradient(122deg, var(--fill-wash), #14121f 76%);
  border-color: color-mix(in srgb, var(--fill-accent) 55%, #3c3345);
}
.fill-sell { --fill-accent: var(--loss); --fill-wash: #422339; }
.fill-medallion img { box-shadow: 0 0 0 3px #14121f, 0 0 0 4px var(--fill-accent); }
.fill-value small, .fill-units { color: #d1ccdf; }

@keyframes launch-enter {
  from { opacity: .25; transform: translateY(-12px); background: #25345a; }
  to { opacity: 1; transform: translateY(0); background: var(--panel); }
}
@media (max-width: 767px) {
  .hero .prompt-art { width: 41%; }
  .hero::before {
    inset-inline-start: 59%;
    background-position: center;
    mask-image: linear-gradient(90deg, transparent, #000 28%);
  }
  #dialogBody > .split { background: var(--panel); }
  .app-mark { background-color: var(--bg); }
}

@media (min-width:1181px) {
  #nav button { column-gap:8px; padding-inline:10px; }
}