/* Shared mirror maker palette and typography across the application. */
:root {
  color-scheme: dark;
  --mm-bg: #0b1019;
  --mm-surface: #121b28;
  --mm-surface-raised: #182334;
  --mm-border: #263348;
  --mm-ink: #edf3ff;
  --mm-muted: #9cabc3;
  --mm-accent: #8ef3cd;
  --mm-accent-ink: #09261d;
  --mm-blue: #669aff;
  --mm-font: Inter, ui-sans-serif, system-ui, -apple-system, sans-serif;
}
:root[data-theme="light"] {
  color-scheme: light;
  --mm-bg: #f4f7fa;
  --mm-surface: #ffffff;
  --mm-surface-raised: #eaf0f6;
  --mm-border: #d6e0eb;
  --mm-ink: #142337;
  --mm-muted: #52657c;
  --mm-accent: #126c55;
  --mm-accent-ink: #ffffff;
  --mm-blue: #315fbb;
}
body, body.dark-mode {
  --bg: var(--mm-bg);
  --surface: var(--mm-surface);
  --surface2: var(--mm-surface-raised);
  --card: var(--mm-surface);
  --border: var(--mm-border);
  --line: var(--mm-border);
  --ink: var(--mm-ink);
  --muted: var(--mm-muted);
  --accent: var(--mm-accent);
  --blue: var(--mm-blue);
  --font-body: var(--mm-font);
  background: var(--mm-bg);
  color: var(--mm-ink);
  font-family: var(--mm-font);
}
.brand, .brand-name {
  font-family: var(--mm-font);
  font-size: 22px;
  font-weight: 750;
  letter-spacing: -.8px;
  white-space: nowrap;
  color: var(--mm-ink);
}
/* Adapt the existing discovery/detail components without changing their behavior. */
body.mm-legacy *, body.mm-legacy .brand-name { font-family: var(--mm-font); }
body.mm-legacy .topbar,
body.mm-legacy .tags-panel,
body.mm-legacy .filters-panel,
body.mm-legacy .tags-filter-drawer {
  background: var(--mm-bg) !important;
  border-color: var(--mm-border) !important;
}
body.mm-legacy .topbar { padding: 20px 24px; box-shadow: none; }
body.mm-legacy .app-shell { padding-left: 0; }
body.mm-legacy .paper-entry-nav {
  padding: 17px 24px;
  gap: 30px;
  font-size: 14px;
  border-color: var(--mm-border);
  background: var(--mm-bg);
}
body.mm-legacy .paper-entry-nav a { color: var(--mm-muted); }
body.mm-legacy.traders-mode .paper-entry-nav a:first-child { color: var(--mm-accent); }
body.mm-legacy .paper-entry-nav span { color: var(--mm-accent); }
body.mm-legacy .market-card,
body.mm-legacy .trader-card,
body.mm-legacy .event-card {
  background: var(--mm-surface) !important;
  border: 1px solid var(--mm-border) !important;
  border-radius: 12px;
  box-shadow: none !important;
}
body.mm-legacy .trader-card-head { padding: 20px 20px 12px; }
body.mm-legacy .trader-head-copy h2 { font-size: 16px; font-weight: 650; line-height: 1.35; }
body.mm-legacy .trader-meta-line { font-size: 11px; font-weight: 450; line-height: 1.5; }
body.mm-legacy .trader-stat-value { font-size: 18px; font-weight: 650; font-variant-numeric: tabular-nums; }
body.mm-legacy .trader-stat-label { font-size: 10px; font-weight: 450; }
body.mm-legacy .trader-head-copy h2,
body.mm-legacy .trader-stat-value,
body.mm-legacy .brand,
body.mm-legacy .brand-name { color: var(--mm-ink); }
body.mm-legacy .trader-meta-line,
body.mm-legacy .trader-stat-label,
body.mm-legacy .trader-profile-link { color: var(--mm-muted); }
body.mm-legacy .trader-stats-grid,
body.mm-legacy .trader-stat-cell { border-color: var(--mm-border); }
body.mm-legacy .trader-copy-toggle,
body.mm-legacy .icon-btn,
body.mm-legacy .mobile-search-icon-btn,
body.mm-legacy .search-shell,
body.mm-legacy .wallet-connect-btn,
body.mm-legacy .chip,
body.mm-legacy .filter-control-btn {
  background: var(--mm-surface) !important;
  color: var(--mm-ink) !important;
  border-color: var(--mm-border) !important;
  box-shadow: none !important;
}
body.mm-legacy .wallet-connect-btn.is-logged-out {
  background: var(--mm-accent) !important;
  color: var(--mm-accent-ink) !important;
}
body.mm-legacy .trader-copy-toggle.is-on,
body.mm-legacy .chip.active {
  border-color: var(--mm-accent) !important;
  color: var(--mm-accent) !important;
}
body.mm-legacy .wallet-menu-dropdown,
body.mm-legacy .profile-modal-dialog,
body.mm-legacy .auth-modal-dialog,
body.mm-legacy .strategies-modal-dialog,
body.mm-legacy .alerts-drawer {
  background: var(--mm-surface) !important;
  color: var(--mm-ink);
  border-color: var(--mm-border) !important;
  box-shadow: 0 20px 70px #0004;
  border-radius: 14px;
}
body.mm-legacy .wallet-menu-summary,
body.mm-legacy .wallet-menu-item,
body.mm-legacy .profile-card-name,
body.mm-legacy .auth-modal-title { color: var(--mm-ink); }
body.mm-legacy .wallet-menu-item:hover { background: var(--mm-surface-raised); }
body.mm-legacy input, body.mm-legacy select, body.mm-legacy textarea {
  color: var(--mm-ink) !important;
  background-color: var(--mm-bg) !important;
  border-color: var(--mm-border) !important;
}
body.mm-legacy .primary-btn, body.mm-legacy .auth-primary-btn {
  background: var(--mm-accent);
  color: var(--mm-accent-ink);
  border-color: var(--mm-accent);
  box-shadow: none;
}
body.mm-legacy :focus-visible { outline: 2px solid var(--mm-accent); outline-offset: 3px; }
@media (max-width: 640px) {
  .brand, .brand-name { font-size: 21px; }
  body.mm-legacy .topbar { padding: 16px 18px; }
  body.mm-legacy .paper-entry-nav { padding: 16px 18px; gap: 26px; font-size: 12px; }
  body.mm-legacy .trader-card-head { padding: 18px 16px 10px; }
  body.mm-legacy .trader-stat-value { font-size: 16px; }
}
.pill { color: var(--mm-accent); border-color: color-mix(in srgb,var(--mm-accent) 30%,transparent); background: color-mix(in srgb,var(--mm-accent) 7%,transparent); }
.virtual-note { color: var(--mm-accent); background: color-mix(in srgb,var(--mm-accent) 7%,transparent); }
:root[data-theme="light"] .empty { background: var(--mm-surface); }
:root[data-theme="light"] #create-error,
:root[data-theme="light"] #trade-status { color: #854318; }
body.mm-legacy .auth-provider-btn { background: var(--mm-surface-raised); border-color: var(--mm-border); color: var(--mm-ink); }
body.mm-legacy .auth-provider-btn-primary { background: var(--mm-accent); color: var(--mm-accent-ink); }
body.mm-legacy .wallet-connect-btn.is-logged-out {
  padding: 9px 13px;
  border: 1px solid var(--mm-accent) !important;
  border-radius: 8px;
  min-height: 34px;
  font-size: 12px;
  font-weight: 650;
}
@media (max-width: 640px) {
 body.mm-legacy .topbar-actions { gap: 7px; }
 body.mm-legacy .brand-name { font-size: 20px; }
 body.mm-legacy .wallet-connect-btn.is-logged-out { padding: 8px 11px; }
}
@media (max-width: 360px) {
 body.mm-legacy .topbar { padding: 14px 12px; }
 body.mm-legacy .topbar-main { gap: 8px; }
 body.mm-legacy .brand-name { font-size: 18px; letter-spacing: -.6px; }
 body.mm-legacy .topbar-actions { gap: 5px; }
 body.mm-legacy .wallet-connect-btn.is-logged-out { padding: 8px 9px; }
}
