:root {
  --page: #fcfdfa;
  --surface: #ffffff;
  --soft: #f2f5f0;
  --hover: #eaf4ec;
  --text: #202926;
  --muted: #5e7064;
  --line: #d7e1d9;
  --accent: #076e58;
  --positive: #107552;
  --negative: #b33444;
  --gold: #8b7214;
  --badge: #f1efda;
  --badge-text: #776b2b;
  --avatar: #eaf0dc;
  --chrome: #fffffff2;
  --chart-bar: #087f65;
}
:root[data-theme="dark"] {
  --page: #141917;
  --surface: #1c2320;
  --soft: #232d28;
  --hover: #2c3d34;
  --text: #edf3ee;
  --muted: #b0bfb4;
  --line: #3b4941;
  --accent: #6fe2b9;
  --positive: #6fe2b9;
  --negative: #ff929e;
  --gold: #ebd977;
  --badge: #3b3826;
  --badge-text: #ebd977;
  --avatar: #304538;
  --chrome: #1c2320f2;
  --chart-bar: #55c9a1;
}
body { background: var(--page); color: var(--text); }
header, footer, dialog, input, select, textarea { color: var(--text); }
.primary { background: #087f65; border-color: #087f65; color: #fff; }
.primary:hover { background: #06614f; }
.theme-toggle { border: 1px solid var(--line); color: var(--text); flex-shrink: 0; }
.main-nav a, .docs-nav button, footer nav a, .how-link {
  display: inline-flex; align-items: center; gap: 6px;
}
.main-nav a svg, footer nav a svg, .how-link svg { width: 14px; height: 14px; }
.trade-tabs button, .tabs button { display: inline-flex; align-items: center; justify-content: center; gap: 7px; }
.coin-avatar svg { width: 18px; height: 18px; }
.trade-cell { position: sticky; right: 0; background: var(--surface); width: 54px; }
.trade-action { color: var(--accent); background: var(--hover); border-radius: 6px; }
tr:hover .trade-cell { background: var(--hover); }
.coin-avatar { color: var(--accent); }
.asset-initial { background: #087f65; color: #fff; }
summary { display: flex; align-items: center; gap: 8px; list-style: none; }
summary::-webkit-details-marker { display: none; }
details[open]>summary>svg { transform: rotate(180deg); }
.coin-button img.coin-avatar { padding: 3px; background: #fff; }
.toolbar label>svg { width: 13px; height: 13px; }
.toolbar .market-search-field { display: flex; align-items: center; gap: 7px; border: 1px solid var(--line); background: var(--surface); border-radius: 6px; padding: 0 10px; }
.toolbar .market-search-field input { border: 0; background: transparent; padding-inline: 0; width: 160px; }
input::placeholder, textarea::placeholder { color: var(--muted); opacity: .85; }
input:disabled, select:disabled { opacity: .6; }
img { color-scheme: light; }
.brand-logo { background: #087f65; border-radius: 7px; }
.toast { color: #fff; background: #203b30; }
.toast.error { background: #a44046; }
[data-theme="dark"] .brand { color: var(--accent); }
[data-theme="dark"] .favorite-button.selected svg { fill: #685821; }
[data-theme="dark"] .pulse-chart span { background: #6fe2b9; }
[data-theme="dark"] .pulse-row:nth-child(4) .pulse-chart span { background: #ebd977; }
[data-theme="dark"] .legend-dot { background: var(--chart-bar); }
[data-theme="dark"] .legend-dot.green { background: #ebd977; }
@media (max-width: 1250px) {
  .header-inner { gap: 14px; }
  .how-link { display: none; }
  .main-nav a { padding: 10px 8px; }
  .search-trigger { min-width: 36px; width: 36px; padding: 9px; }
  .search-trigger span, .search-trigger kbd { display: none; }
}
@media (max-width: 1000px) {
  .main-nav { display: none; position: absolute; left: 0; right: 0; top: 76px; background: var(--surface); border-bottom: 1px solid var(--line); padding: 15px 24px; flex-wrap: wrap; }
  .main-nav.open { display: flex; }
  .menu-button { display: grid; }
}
@media (max-width: 600px) {
  .main-nav { top: 68px; }
  .toolbar .market-search-field { width: 100%; order: -1; }
  .toolbar .market-search-field input { width: 100%; }
  .header-actions { gap: 3px; }
  header [data-wallet] { padding: 9px; }
  header [data-wallet] span { display: none; }
  header [data-wallet] svg { width: 17px; height: 17px; }
}
@media (prefers-reduced-motion: no-preference) {
  body, header, footer, dialog, .stats, .table-wrap, td, th, .asset { transition: background-color 180ms ease, color 180ms ease, border-color 180ms ease; }
}
