:root {
  --bg: #0b1416;
  --bg-2: #101d20;
  --card: #122226;
  --card-2: #16292e;
  --line: #1e363c;
  --text: #e6f2f0;
  --dim: #8aa5a3;
  --dim-2: #6f8b89;
  --accent: #49eacb;
  --accent-2: #70c7ba;
  --up: #3fd684;
  --down: #ff6b6b;
  --maxw: 1120px;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; }
body {
  background: radial-gradient(1200px 600px at 70% -10%, #12292e 0%, var(--bg) 55%) no-repeat, var(--bg);
  color: var(--text);
  font: 15px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  min-height: 100vh;
}
a { color: var(--accent-2); text-decoration: none; }
a:hover { color: var(--accent); }
.wrap { max-width: var(--maxw); margin: 0 auto; padding: 0 20px; }

/* Top bar */
.topbar { border-bottom: 1px solid var(--line); background: rgba(11,20,22,.72); backdrop-filter: blur(10px); position: sticky; top: 0; z-index: 10; }
/* Deep-links (#activity etc.) must clear the sticky nav so section headings aren't hidden under it. */
section[id], [id].wrap { scroll-margin-top: 74px; }
.topbar-inner { display: flex; align-items: center; justify-content: space-between; height: 60px; }
/* Kill any horizontal overflow so the page never shifts / decenters (esp. iOS Safari). */
html { overflow-x: clip; }
/* Mobile: the 7-item nav must not force the page wider than the screen — make it a contained
   horizontally-scrollable strip instead of overflowing. */
@media (max-width: 760px) {
  .topbar-inner { gap: 12px; }
  .topnav { min-width: 0; overflow-x: auto; gap: 16px; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
  .topnav::-webkit-scrollbar { display: none; }
  .topnav a { flex: 0 0 auto; white-space: nowrap; }
  .pills { flex-wrap: wrap; }
}
.brand { display: flex; align-items: center; gap: 9px; font-weight: 700; font-size: 18px; letter-spacing: .2px; }
.brand-link { display: inline-flex; align-items: center; gap: 7px; color: inherit; text-decoration: none; }
.brand-link:hover { opacity: .85; }
.brand-mark { color: var(--accent); font-size: 15px; }
.brand-name { color: var(--text); }
.brand-live { color: var(--accent); font-weight: 600; margin-left: 1px; }
.brand-tag { font-size: 11px; font-weight: 600; letter-spacing: .3px; color: var(--dim); border-left: 1px solid var(--line); padding-left: 9px; }
@media (max-width: 560px) { .brand-tag { display: none; } }
.live-pill { display: inline-flex; align-items: center; gap: 5px; margin-left: 4px; font-size: 10px; font-weight: 700; letter-spacing: .8px; color: var(--accent); border: 1px solid var(--line); background: var(--card-2); border-radius: 20px; padding: 2px 8px 2px 7px; }
.live-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 3px rgba(73,234,203,.15); animation: pulse 2.4s ease-in-out infinite; }
.live-pill.stale { color: var(--dim); }
.live-pill.stale .live-dot { background: var(--dim-2); box-shadow: none; animation: none; }
.topnav { display: flex; align-items: center; gap: 22px; font-size: 14px; }
.topnav a { color: var(--dim); }
.topnav a:hover { color: var(--text); }
.nav-cta { color: var(--accent) !important; font-weight: 600; }

/* Hero */
.hero { padding: 54px 0 32px; }
.eyebrow { color: var(--accent-2); font-size: 13px; font-weight: 600; letter-spacing: .6px; text-transform: uppercase; margin-bottom: 14px; }
.tocc-badge { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 16px; padding: 6px 13px 6px 11px; border: 1px solid rgba(73,234,203,.35); background: linear-gradient(100deg, rgba(73,234,203,.14), rgba(18,34,38,.35) 70%); border-radius: 20px; font-size: 12px; font-weight: 700; letter-spacing: .5px; }
.tocc-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 3px rgba(73,234,203,.18); animation: pulse 2.4s ease-in-out infinite; }
.tocc-lead { color: var(--accent); }
.tocc-sep { color: var(--dim); font-weight: 400; }
.tocc-since { color: var(--text); font-variant-numeric: tabular-nums; letter-spacing: .3px; }
.hero h1 { font-size: clamp(28px, 5vw, 46px); line-height: 1.08; font-weight: 800; letter-spacing: -.5px; }
.accent { color: var(--accent); }
.sub { color: var(--dim); font-size: clamp(15px, 2vw, 18px); margin-top: 14px; max-width: 620px; }

/* Search */
.search { position: relative; margin-top: 26px; max-width: 560px; }
.search-box { display: flex; align-items: center; gap: 10px; background: var(--card); border: 1px solid var(--line); border-radius: 13px; padding: 0 13px; transition: border-color .12s, box-shadow .12s; }
.search-box:focus-within { border-color: var(--accent-2); box-shadow: 0 0 0 3px rgba(73,234,203,.1); }
.search-ic { color: var(--dim-2); font-size: 18px; flex: none; }
.search-input { flex: 1; min-width: 0; background: none; border: none; outline: none; color: var(--text); font-family: inherit; font-size: 15px; padding: 14px 0; }
.search-input::placeholder { color: var(--dim-2); }
.search-kbd { flex: none; color: var(--dim-2); font-size: 12px; font-weight: 600; border: 1px solid var(--line); border-radius: 6px; padding: 2px 7px; background: var(--bg-2); font-family: inherit; }
.search-box:focus-within .search-kbd { display: none; }
.search-menu { position: absolute; left: 0; right: 0; top: calc(100% + 6px); background: var(--card); border: 1px solid var(--line); border-radius: 13px; overflow: hidden; z-index: 30; box-shadow: 0 18px 44px rgba(4,10,11,.55); }
.sr-item { display: flex; align-items: center; gap: 11px; padding: 11px 14px; cursor: pointer; border-bottom: 1px solid var(--line); }
.sr-item:last-child { border-bottom: none; }
.sr-item.is-active, .sr-item:hover { background: var(--card-2); }
.sr-item img, .sr-item .tok-ph { width: 30px; height: 30px; border-radius: 50%; flex: none; background: var(--bg-2); object-fit: cover; border: 1px solid var(--line); }
.sr-item .tok-ph { display: flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 700; color: var(--accent-2); }
.sr-main { min-width: 0; flex: 1; }
.sr-tick { font-size: 14px; font-weight: 700; }
.sr-sub { display: block; font-size: 12px; color: var(--dim-2); }
.sr-side { text-align: right; flex: none; font-variant-numeric: tabular-nums; }
.sr-price { display: block; font-size: 13px; font-weight: 600; }
.sr-rank { display: block; font-size: 11px; color: var(--dim-2); }
.sr-hint { padding: 11px 14px; color: var(--dim-2); font-size: 13px; display: flex; align-items: center; gap: 8px; }
.sr-hint b { color: var(--accent); font-weight: 700; }
.sr-wallet { color: var(--accent); }

/* Stats */
.stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-top: 34px; }
.stat { background: linear-gradient(180deg, var(--card-2), var(--card)); border: 1px solid var(--line); border-radius: 14px; padding: 16px 16px 14px; }
.stat-k { display: block; color: var(--dim-2); font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .5px; }
.stat-v { display: block; font-size: clamp(18px, 2.6vw, 24px); font-weight: 700; margin-top: 6px; font-variant-numeric: tabular-nums; }

/* Kaspa.com co-brand slot */
.cobrand { display: flex; align-items: center; gap: 15px; margin-top: 26px; padding: 15px 20px; border: 1px solid var(--line); border-radius: 14px;
  background: linear-gradient(100deg, rgba(73,234,203,.07), rgba(18,34,38,.4) 60%); transition: border-color .15s, background .15s; }
.cobrand:hover { border-color: var(--accent-2); background: linear-gradient(100deg, rgba(73,234,203,.12), rgba(18,34,38,.4) 60%); }
.cobrand-mark { font-size: 20px; color: var(--accent); flex: none; }
.cobrand-txt { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.cobrand-lead { font-size: 14px; font-weight: 600; color: var(--text); }
.cobrand-lead b { color: var(--accent); font-weight: 700; }
.cobrand-sub { font-size: 12.5px; color: var(--dim); }
.cobrand-cta { margin-left: auto; flex: none; font-size: 13px; font-weight: 700; color: var(--accent); white-space: nowrap; }
.cobrand:hover .cobrand-arrow { display: inline-block; transform: translate(2px,-2px); }
.cobrand-arrow { transition: transform .15s; }

/* Why-us wedge → funnels to the 1.75% mint tool */
.wedge { display: flex; align-items: center; gap: 22px; margin-top: 18px; padding: 22px 24px; border: 1px solid var(--line); border-radius: 16px;
  background: linear-gradient(105deg, rgba(73,234,203,.10), rgba(18,34,38,.5) 55%); }
.wedge-txt { min-width: 0; }
.wedge-eyebrow { color: var(--accent-2); font-size: 12px; font-weight: 700; letter-spacing: .5px; text-transform: uppercase; }
.wedge-h { font-size: clamp(20px, 3vw, 27px); font-weight: 800; letter-spacing: -.3px; margin-top: 6px; }
.wedge-sub { color: var(--dim); font-size: 13.5px; line-height: 1.5; margin-top: 8px; max-width: 640px; }
.wedge-sub b { color: var(--text); font-weight: 700; }
.wedge-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 13px; }
.wedge-tag { font-size: 12px; font-weight: 600; color: var(--accent-2); border: 1px solid var(--line); background: var(--card-2); border-radius: 20px; padding: 4px 11px; }
.wedge-cta { margin-left: auto; flex: none; display: inline-flex; align-items: center; gap: 7px; background: var(--accent); color: var(--bg); font-weight: 800; font-size: 14.5px; padding: 13px 20px; border-radius: 12px; white-space: nowrap; transition: transform .12s, box-shadow .12s; box-shadow: 0 8px 24px rgba(73,234,203,.18); }
.wedge-cta:hover { color: var(--bg); transform: translateY(-1px); box-shadow: 0 12px 30px rgba(73,234,203,.28); }
.wedge-arrow { transition: transform .15s; }
.wedge-cta:hover .wedge-arrow { transform: translate(2px,-2px); }
/* hero action row — the money action (mint) is the FIRST thing a visitor sees */
.hero-cta-row { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; margin: 22px 0 4px; }
.hero-cta-row .wedge-cta { margin-left: 0; font-size: 15.5px; padding: 15px 26px; }
.hero-cta-ghost { display: inline-flex; align-items: center; gap: 7px; padding: 15px 22px; border-radius: 12px;
  border: 1px solid var(--line); color: var(--text); font-weight: 700; font-size: 14.5px; white-space: nowrap;
  transition: border-color .12s, transform .12s; }
.hero-cta-ghost:hover { border-color: var(--accent); transform: translateY(-1px); }
.hero-cta-note { font-size: 12.5px; color: var(--dim-2); margin: 6px 0 0; }
@media (max-width:760px){ .hero-cta-row .wedge-cta, .hero-cta-ghost { width: 100%; justify-content: center; } }

/* Section head */
.section-head { display: flex; align-items: baseline; justify-content: space-between; margin: 30px 0 14px; }
.section-head h2 { font-size: 20px; font-weight: 700; }
.updated { color: var(--dim-2); font-size: 12px; font-variant-numeric: tabular-nums; }

/* Launch wave — two-panel feed */
.wave-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.feed-card { background: var(--card); border: 1px solid var(--line); border-radius: 16px; overflow: hidden; display: flex; flex-direction: column; }
.feed-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 13px 16px; border-bottom: 1px solid var(--line); background: var(--bg-2); min-height: 52px; }
.feed-title { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 700; letter-spacing: .2px; }
.feed-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 3px rgba(73,234,203,.15); animation: pulse 2.4s ease-in-out infinite; }
.feed-dot.hot { background: #ffb020; box-shadow: 0 0 0 3px rgba(255,176,32,.15); }
@keyframes pulse { 0%,100% { opacity: 1; } 50% { opacity: .45; } }
.feed-note { color: var(--dim-2); font-size: 12px; }

.pills { display: flex; gap: 5px; }
.pill { background: var(--card-2); border: 1px solid var(--line); color: var(--dim); font-size: 12px; font-weight: 600; padding: 5px 10px; border-radius: 8px; cursor: pointer; font-family: inherit; transition: color .12s, border-color .12s, background .12s; }
.pill:hover { color: var(--text); }
.pill.is-on { color: var(--bg); background: var(--accent); border-color: var(--accent); }

.feed-body { display: flex; flex-direction: column; }
.frow { display: grid; grid-template-columns: 20px minmax(0,1fr) auto; align-items: center; gap: 11px; padding: 11px 16px; border-bottom: 1px solid var(--line); cursor: pointer; transition: background .12s; }
.frow:last-child { border-bottom: none; }
.frow:hover { background: var(--card-2); }
.frow:hover .frow-tick { color: var(--accent); }
.frow-i { color: var(--dim-2); font-size: 12px; font-variant-numeric: tabular-nums; text-align: center; }
.frow-main { display: flex; align-items: center; gap: 10px; min-width: 0; }
.frow-main img, .frow-main .tok-ph { width: 26px; height: 26px; border-radius: 50%; flex: none; background: var(--bg-2); object-fit: cover; border: 1px solid var(--line); }
.frow-main .tok-ph { display: flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 700; color: var(--accent-2); }
.frow-txt { min-width: 0; }
.frow-tick { font-weight: 700; letter-spacing: .2px; display: flex; align-items: center; gap: 7px; }
.frow-tick .badge { margin-left: 0; }
.frow-meta { color: var(--dim-2); font-size: 12px; margin-top: 2px; }
.frow-side { text-align: right; font-variant-numeric: tabular-nums; }
.frow-val { font-weight: 700; font-size: 14px; }
.frow-side small { display: block; color: var(--dim-2); font-size: 11px; margin-top: 1px; }
.mini-bar { width: 58px; height: 4px; background: var(--bg-2); border-radius: 3px; overflow: hidden; margin: 4px 0 0 auto; }
.mini-fill { height: 100%; background: linear-gradient(90deg, var(--accent-2), var(--accent)); }
.badge.new { color: var(--bg); background: var(--accent); border-color: var(--accent); }

/* Marketplace */
.section-note { color: var(--dim); font-size: 13px; margin: -6px 0 16px; max-width: 640px; }
.mkt-pulse { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 18px; }
.stat-sub { display: block; color: var(--dim-2); font-size: 12px; font-weight: 600; margin-top: 5px; font-variant-numeric: tabular-nums; }
.mkt-card .thead.mkt-row, .mkt-card .row.mkt-row { grid-template-columns: 42px minmax(120px,1.7fr) 1.1fr .9fr .8fr 1.1fr; }

/* M26: Screener — multi-criteria filter controls */
.scr-controls { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 14px 20px; padding: 16px 18px; background: var(--card); border: 1px solid var(--line); border-radius: 12px; margin-bottom: 18px; }
.scr-group { display: flex; flex-direction: column; gap: 7px; }
.scr-label { color: var(--dim-2); font-size: 11px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.scr-nums { flex-direction: row; gap: 16px; }
.scr-num { display: flex; flex-direction: column; gap: 7px; }
.scr-num input { width: 96px; background: var(--card-2); border: 1px solid var(--line); color: var(--text); font-family: inherit; font-size: 13px; font-weight: 600; padding: 6px 9px; border-radius: 8px; font-variant-numeric: tabular-nums; }
.scr-num input:focus { outline: none; border-color: var(--accent-2); }
.scr-toggles { flex-direction: row; align-items: center; gap: 8px; }
.scr-tog.is-on { color: var(--bg); background: var(--accent); border-color: var(--accent); }
.scr-reset { background: none; border: 1px solid var(--line); color: var(--dim); font-family: inherit; font-size: 12px; font-weight: 600; padding: 5px 12px; border-radius: 8px; cursor: pointer; transition: color .12s, border-color .12s; }
.scr-reset:hover { color: var(--text); border-color: var(--accent-2); }
.scr-share { align-self: center; }

/* M16: Closing-soon mint radar */
.close-card .thead.close-row, .close-card .row.close-row { grid-template-columns: 42px minmax(120px,1.7fr) 1.3fr .9fr 1fr .8fr; }
.mint-fill.hot { background: linear-gradient(90deg, #ffb547, var(--down)); }
.eta-soon { color: var(--accent); font-weight: 700; }

/* Table */
.table-card { background: var(--card); border: 1px solid var(--line); border-radius: 16px; overflow: hidden; }
.thead, .row { display: grid; grid-template-columns: 42px minmax(120px,1.7fr) 1fr .7fr 1.1fr .9fr .9fr; align-items: center; gap: 10px; padding: 12px 18px; }
.thead { color: var(--dim-2); font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .5px; border-bottom: 1px solid var(--line); background: var(--bg-2); }
.tbody .row { border-bottom: 1px solid var(--line); transition: background .12s; }
.tbody .row:last-child { border-bottom: none; }
.tbody .row:hover { background: var(--card-2); }
.c-num { text-align: right; font-variant-numeric: tabular-nums; }
.c-rank { color: var(--dim-2); font-variant-numeric: tabular-nums; }

.tok { display: flex; align-items: center; gap: 11px; min-width: 0; }
.tok img, .tok .tok-ph { width: 30px; height: 30px; border-radius: 50%; flex: none; background: var(--bg-2); object-fit: cover; border: 1px solid var(--line); }
.tok-ph { display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 700; color: var(--accent-2); }
.tok-name { font-weight: 700; letter-spacing: .3px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tok-sub { color: var(--dim-2); font-size: 12px; }
.badge { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .4px; color: var(--accent); border: 1px solid var(--line); border-radius: 6px; padding: 1px 6px; margin-left: 6px; }

.chg-up { color: var(--up); }
.chg-down { color: var(--down); }
.mint-wrap { display: inline-flex; flex-direction: column; align-items: flex-end; gap: 4px; width: 100%; }
.mint-bar { width: 74px; height: 5px; background: var(--bg-2); border-radius: 3px; overflow: hidden; }
.mint-fill { height: 100%; background: linear-gradient(90deg, var(--accent-2), var(--accent)); }
.dim { color: var(--dim-2); }

.row-msg { padding: 26px 18px; color: var(--dim); text-align: center; }
.row-msg .retry { display: inline-block; margin-top: 12px; background: var(--card-2); border: 1px solid var(--line); color: var(--accent); font-family: inherit; font-size: 13px; font-weight: 600; padding: 7px 16px; border-radius: 9px; cursor: pointer; transition: border-color .12s, color .12s; }
.row-msg .retry:hover { border-color: var(--accent-2); color: var(--accent); }
.row-msg.err::before { content: ""; display: block; width: 8px; height: 8px; border-radius: 50%; background: var(--down); margin: 0 auto 10px; box-shadow: 0 0 0 3px rgba(255,107,107,.14); }

/* Skeleton loaders */
.skel-row, .skel-frow { position: relative; overflow: hidden; border-bottom: 1px solid var(--line); }
.skel-row { height: 55px; }
.skel-frow { height: 49px; }
.skel-row::after, .skel-frow::after { content: ""; position: absolute; inset: 0;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.035), transparent);
  transform: translateX(-100%); animation: shimmer 1.35s infinite; }
@keyframes shimmer { 100% { transform: translateX(100%); } }

/* Footer */
.footer { border-top: 1px solid var(--line); margin-top: 46px; padding: 26px 0 40px; }
.footer-inner p { color: var(--dim); font-size: 13px; }
.footer-inner p + p { margin-top: 6px; }

/* Clickable rows */
.tbody .row { cursor: pointer; }
.tbody .row:hover .tok-name { color: var(--accent); }

/* Token detail drawer */
.drawer-overlay { position: fixed; inset: 0; background: rgba(4,10,11,.62); backdrop-filter: blur(2px); z-index: 40; opacity: 0; animation: fade .16s ease forwards; }
@keyframes fade { to { opacity: 1; } }
.drawer {
  position: fixed; top: 0; right: 0; height: 100%; width: 480px; max-width: 94vw; z-index: 50;
  background: linear-gradient(180deg, var(--bg-2), var(--bg)); border-left: 1px solid var(--line);
  box-shadow: -18px 0 50px rgba(0,0,0,.4); overflow-y: auto; transform: translateX(100%);
  animation: slidein .22s cubic-bezier(.2,.8,.2,1) forwards;
}
@keyframes slidein { to { transform: translateX(0); } }
.drawer-inner { padding: 22px 24px 40px; }

.dw-head { display: flex; align-items: center; gap: 14px; padding-bottom: 18px; border-bottom: 1px solid var(--line); }
.dw-head img, .dw-head .tok-ph { width: 46px; height: 46px; border-radius: 50%; flex: none; background: var(--bg-2); object-fit: cover; border: 1px solid var(--line); }
.dw-head .tok-ph { display: flex; align-items: center; justify-content: center; font-size: 16px; font-weight: 700; color: var(--accent-2); }
.dw-title { display: flex; align-items: center; gap: 9px; font-size: 22px; font-weight: 800; letter-spacing: .3px; }
.dw-sub { color: var(--dim-2); font-size: 13px; margin-top: 3px; }
/* M20: in-app wallet drawer — every address is a clickable on-site entity */
.ka { cursor: pointer; text-decoration: none; }
.ka:hover { text-decoration: underline; text-underline-offset: 2px; text-decoration-color: var(--accent-2); }
.w-ava { flex: none; width: 44px; height: 44px; border-radius: 11px; display: flex; align-items: center; justify-content: center; font-size: 20px; color: var(--accent); background: color-mix(in srgb, var(--accent) 12%, transparent); border: 1px solid var(--line); }
.dw-title.mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 16px; font-weight: 700; letter-spacing: 0; word-break: break-all; }
.w-drawer-foot { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--line); font-size: 12.5px; }
.w-drawer-foot a { color: var(--dim); }
.w-drawer-foot a:hover { color: var(--accent-2); }
.dw-close { margin-left: auto; align-self: flex-start; background: var(--card); border: 1px solid var(--line); color: var(--dim); width: 32px; height: 32px; border-radius: 9px; font-size: 17px; cursor: pointer; line-height: 1; }
.dw-close:hover { color: var(--text); border-color: var(--accent-2); }
.dw-actions { margin-left: auto; display: flex; align-items: center; gap: 8px; }
.dw-actions .dw-close { margin-left: 0; }
.dw-share { align-self: flex-start; display: inline-flex; align-items: center; gap: 6px; background: var(--card); border: 1px solid var(--line); color: var(--dim); height: 32px; padding: 0 12px; border-radius: 9px; font-family: inherit; font-size: 12.5px; font-weight: 600; cursor: pointer; transition: color .12s, border-color .12s; }
.dw-share:hover { color: var(--text); border-color: var(--accent-2); }
.dw-share.done { color: var(--accent); border-color: var(--accent-2); }
.dw-card { align-self: flex-start; display: inline-flex; align-items: center; gap: 6px; background: var(--card); border: 1px solid var(--line); color: var(--dim); height: 32px; padding: 0 12px; border-radius: 9px; font-family: inherit; font-size: 12.5px; font-weight: 600; cursor: pointer; transition: color .12s, border-color .12s; }
.dw-card:hover { color: var(--text); border-color: var(--accent-2); }
.dw-card.done { color: var(--accent); border-color: var(--accent-2); }
.dw-embed { align-self: flex-start; display: inline-flex; align-items: center; gap: 6px; background: var(--card); border: 1px solid var(--line); color: var(--dim); height: 32px; padding: 0 12px; border-radius: 9px; font-family: inherit; font-size: 12.5px; font-weight: 600; cursor: pointer; transition: color .12s, border-color .12s; }
.dw-embed:hover { color: var(--text); border-color: var(--accent-2); }
.dw-embed.done { color: var(--accent); border-color: var(--accent-2); }
.dw-embed span[aria-hidden] { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 11px; letter-spacing: -.5px; }

.dw-price { display: flex; align-items: baseline; gap: 12px; margin: 18px 0 6px; }
.dw-price .p { font-size: 26px; font-weight: 800; font-variant-numeric: tabular-nums; }

.dw-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 16px 0 6px; }
.dw-cell { background: var(--card); border: 1px solid var(--line); border-radius: 12px; padding: 12px 13px; }
.dw-cell .k { color: var(--dim-2); font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .5px; }
.dw-cell .v { font-size: 17px; font-weight: 700; margin-top: 5px; font-variant-numeric: tabular-nums; }
.dw-cell .v small { color: var(--dim-2); font-weight: 600; font-size: 12px; }

.dw-mint { margin: 18px 0 4px; }
.dw-mint-top { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 7px; }
.dw-mint-top .k { color: var(--dim); font-size: 13px; font-weight: 600; }
.dw-mint-top .pct { font-weight: 700; font-variant-numeric: tabular-nums; }
.dw-mint-bar { height: 7px; background: var(--bg-2); border-radius: 4px; overflow: hidden; border: 1px solid var(--line); }
.dw-mint-fill { height: 100%; background: linear-gradient(90deg, var(--accent-2), var(--accent)); }

/* M90: honest money-path mint CTA in the token drawer (open mint → primary; else soft cross-link) */
.dw-mint-cta { margin: 14px 0 4px; }
.dw-mint-cta .mint-btn { display: flex; align-items: center; justify-content: center; gap: 8px; background: var(--accent); color: var(--bg); font-weight: 800; font-size: 14.5px; padding: 13px 18px; border-radius: 12px; text-align: center; transition: transform .12s, box-shadow .12s; box-shadow: 0 8px 24px rgba(73,234,203,.16); }
.dw-mint-cta .mint-btn:hover { color: var(--bg); transform: translateY(-1px); box-shadow: 0 12px 30px rgba(73,234,203,.26); }
.dw-mint-cta .mint-note { color: var(--dim); font-size: 12px; line-height: 1.5; margin: 8px 2px 0; }
.dw-mint-cta .mint-ghost { display: inline-block; font-size: 13px; font-weight: 600; color: var(--accent-2); }
.dw-mint-cta .mint-ghost:hover { color: var(--accent); }

.dw-sec-title { font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .5px; color: var(--dim); margin: 24px 0 10px; }
.holders { display: flex; flex-direction: column; gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.holder { display: grid; grid-template-columns: 26px 1fr auto; align-items: center; gap: 10px; padding: 10px 13px; background: var(--card); }
.holder .hr { color: var(--dim-2); font-size: 12px; font-variant-numeric: tabular-nums; }
.holder .ha { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; color: var(--accent-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.holder .ha:hover { color: var(--accent); }
.holder .hp { text-align: right; font-variant-numeric: tabular-nums; }
.holder .hp b { font-weight: 700; }
.holder .hp small { display: block; color: var(--dim-2); font-size: 11px; }
.dep-tag { font-family: inherit; font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: .4px; color: #f5b544; border: 1px solid rgba(245,181,68,.4); border-radius: 5px; padding: 0 4px; margin-left: 5px; vertical-align: middle; }
/* Holder distribution read (M13) */
.dist { --dc: var(--up); border: 1px solid var(--line); border-left: 3px solid var(--dc); border-radius: 12px; background: var(--card); padding: 13px 14px; }
.dist.moderate { --dc: #f5b544; }
.dist.concentrated { --dc: var(--down); }
.dist-head { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; margin-bottom: 12px; }
.dist-badge { flex: none; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .5px; color: var(--dc); border: 1px solid var(--dc); border-radius: 6px; padding: 2px 8px; }
.dist-note { font-size: 12.5px; color: var(--dim); line-height: 1.4; }
.dist-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: 10px; overflow: hidden; }
.dist-m { background: var(--card); padding: 9px 11px; }
.dist-m .k { color: var(--dim-2); font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: .4px; }
.dist-m .v { font-size: 15px; font-weight: 700; margin-top: 3px; font-variant-numeric: tabular-nums; }
.dist-m.warn .v { color: var(--dc, var(--down)); }
.dist.distributed .dist-m.warn .v { color: var(--text); }

/* M12: Holder distribution visualization (donut + concentration bars) */
.hv-wrap { display: flex; gap: 16px; border: 1px solid var(--line); border-radius: 12px; background: var(--card); padding: 16px; }
.hv-donut-col { flex: none; display: flex; flex-direction: column; align-items: center; gap: 12px; }
.hv-donut { width: 130px; height: 130px; }
.hv-donut-num { fill: var(--text); font-size: 16px; font-weight: 800; font-family: inherit; }
.hv-donut-label { fill: var(--dim-2); font-size: 7px; font-weight: 600; text-transform: uppercase; letter-spacing: .5px; font-family: inherit; }
.hv-legend { display: flex; flex-direction: column; gap: 4px; }
.hv-leg-item { display: flex; align-items: center; gap: 5px; font-size: 10px; color: var(--dim-2); font-weight: 500; }
.hv-leg-dot { width: 8px; height: 8px; border-radius: 2px; flex: none; }
.hv-leg-item b { color: var(--text); font-variant-numeric: tabular-nums; font-weight: 700; }
.hv-bars-col { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 8px; }
.hv-bars-head { margin-bottom: 2px; }
.hv-risk { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .4px; }
.hv-bar-row { display: flex; align-items: center; gap: 8px; }
.hv-bar-label { flex: none; width: 42px; font-size: 10px; font-weight: 600; color: var(--dim-2); text-align: right; }
.hv-bar-track { flex: 1; height: 8px; background: var(--bg); border-radius: 4px; overflow: hidden; }
.hv-bar-fill { display: block; height: 100%; border-radius: 4px; transition: width .4s ease; }
.hv-bar-fill.high { background: linear-gradient(90deg, #ff4757, #ff6348); }
.hv-bar-fill.moderate { background: linear-gradient(90deg, #f5b544, #ffa502); }
.hv-bar-fill.low { background: linear-gradient(90deg, #2ed573, #7bed9f); }
.hv-bar-pct { flex: none; width: 42px; font-size: 11px; font-weight: 700; font-variant-numeric: tabular-nums; color: var(--text); }
.hv-extra-stats { display: flex; gap: 12px; margin-top: 6px; flex-wrap: wrap; }
.hv-stat { display: flex; flex-direction: column; gap: 2px; }
.hv-stat-k { font-size: 9px; font-weight: 600; text-transform: uppercase; letter-spacing: .4px; color: var(--dim-2); }
.hv-stat-v { font-size: 13px; font-weight: 700; font-variant-numeric: tabular-nums; color: var(--text); }
.hv-stat.warn .hv-stat-v { color: var(--down); }
.hv-untracked { font-size: 10px; color: var(--dim-2); margin-top: 2px; line-height: 1.3; }
@media (max-width: 520px) {
  .hv-wrap { flex-direction: column; align-items: stretch; padding: 12px; }
  .hv-donut-col { flex-direction: row; justify-content: space-between; align-items: flex-start; }
  .hv-donut { width: 100px; height: 100px; }
  .hv-bar-label { width: 36px; }
  .hv-bar-pct { width: 36px; }
}

.dw-msg { padding: 30px 4px; color: var(--dim); text-align: center; }
/* Launch quality score (M14) */
.score { --sc: var(--up); border: 1px solid var(--line); border-left: 3px solid var(--sc); border-radius: 12px; background: var(--card); padding: 14px 15px; }
.score.sA { --sc: var(--up); } .score.sB { --sc: #7ed99f; } .score.sC { --sc: #f5b544; }
.score.sD { --sc: #f59a44; } .score.sF { --sc: var(--down); }
.score.none { color: var(--dim); font-size: 12.5px; border-left-color: var(--line); }
.score-head { display: flex; align-items: center; gap: 14px; }
.score-grade { flex: none; width: 52px; height: 52px; border-radius: 12px; display: grid; place-items: center; font-size: 30px; font-weight: 800; color: var(--bg); background: var(--sc); line-height: 1; }
.score-headtxt { min-width: 0; }
.score-title { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .5px; color: var(--dim); }
.score-num { color: var(--text); margin-left: 6px; font-size: 16px; font-variant-numeric: tabular-nums; }
.score-num small { color: var(--dim-2); font-weight: 700; font-size: 11px; }
.score-verdict { font-size: 13px; color: var(--text); line-height: 1.4; margin-top: 4px; }
.score-bars { display: flex; flex-direction: column; gap: 9px; margin: 14px 0 4px; }
.score-bar .sb-k { display: flex; justify-content: space-between; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .4px; color: var(--dim-2); margin-bottom: 4px; }
.score-bar .sb-k b { color: var(--text); font-variant-numeric: tabular-nums; }
.sb-track { height: 6px; background: var(--bg-2); border: 1px solid var(--line); border-radius: 4px; overflow: hidden; }
.sb-track span { display: block; height: 100%; background: linear-gradient(90deg, var(--accent-2), var(--sc)); }
.score-foot { font-size: 10.5px; color: var(--dim-2); margin-top: 11px; line-height: 1.4; }
/* Creator track record (M17) */
.creator { --cc: var(--line); border: 1px solid var(--line); border-left: 3px solid var(--cc); border-radius: 12px; background: var(--card); padding: 13px 14px; }
.creator.good { --cc: var(--up); }
.creator.warn { --cc: var(--down); }
.cr-head { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px 12px; }
.cr-addr { flex: none; font-size: 12.5px; color: var(--accent-2); }
.cr-addr:hover { color: var(--accent); }
.cr-note { font-size: 12.5px; color: var(--dim); line-height: 1.4; }
.creator.good .cr-note { color: var(--text); }
.creator.warn .cr-note { color: #ffb0b0; }
.cr-list { display: flex; flex-direction: column; gap: 2px; margin-top: 11px; }
.crow { display: flex; align-items: center; gap: 10px; width: 100%; text-align: left; background: none; border: none; border-top: 1px solid var(--line); padding: 9px 2px; cursor: pointer; font-family: inherit; color: var(--text); }
.crow:first-child { border-top: none; }
.crow:hover { background: var(--card-2); }
.cr-tick { font-weight: 700; font-size: 13px; letter-spacing: .3px; }
.cr-b { flex: none; font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: .4px; border-radius: 5px; padding: 1px 5px; border: 1px solid currentColor; }
.cr-b.done { color: var(--up); }
.cr-b.live { color: var(--accent-2); }
.cr-b.stall { color: var(--down); }
.cr-side { margin-left: auto; display: flex; align-items: center; gap: 8px; }
.cr-pct { font-size: 12px; font-variant-numeric: tabular-nums; color: var(--text); }
.cr-pct.dim { color: var(--dim-2); }
.cr-side .mini-bar { margin: 0; }
.cr-age { flex: none; width: 62px; text-align: right; font-size: 11px; color: var(--dim-2); font-variant-numeric: tabular-nums; }
@media (max-width: 440px) { .cr-side .mini-bar { display: none; } }

/* M28: Builders leaderboard */
.bld-row { display: flex; align-items: flex-start; gap: 12px; padding: 14px 16px; border-top: 1px solid var(--line); }
.bld-row:first-child { border-top: none; }
.bld-rank { flex: none; width: 22px; text-align: right; font-size: 13px; font-weight: 700; color: var(--dim); font-variant-numeric: tabular-nums; padding-top: 2px; }
.bld-main { flex: 1 1 auto; min-width: 0; }
.bld-top { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.bld-addr { font-size: 13px; font-weight: 600; word-break: break-all; }
.bld-rep { flex: none; font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: .5px; border-radius: 5px; padding: 2px 6px; border: 1px solid currentColor; }
.bld-rep.good { color: var(--up); }
.bld-rep.warn { color: var(--down); }
.bld-counts { display: inline-flex; gap: 10px; margin-left: auto; font-variant-numeric: tabular-nums; }
.bc { font-size: 11px; font-weight: 600; white-space: nowrap; }
.bc.done { color: var(--up); }
.bc.live { color: var(--accent-2); }
.bc.stall { color: var(--down); }
.bld-note { font-size: 12px; color: var(--dim); margin: 5px 0 9px; }
.bld-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.bld-chip { --cc: var(--line); font-family: inherit; font-size: 11px; font-weight: 700; letter-spacing: .3px; color: var(--text); background: var(--card-2); border: 1px solid var(--cc); border-left: 3px solid var(--cc); border-radius: 6px; padding: 3px 8px; cursor: pointer; transition: background .15s; }
.bld-chip:hover { background: var(--line); }
.bld-chip.done { --cc: var(--up); }
.bld-chip.live { --cc: var(--accent-2); }
.bld-chip.stall { --cc: var(--down); }
.bld-more { font-size: 11px; color: var(--dim); align-self: center; }
.bld-count-big { flex: none; display: flex; flex-direction: column; align-items: flex-end; font-size: 22px; font-weight: 800; line-height: 1; color: var(--accent); font-variant-numeric: tabular-nums; padding-top: 1px; }
.bld-count-big small { font-size: 9px; font-weight: 600; text-transform: uppercase; letter-spacing: .5px; color: var(--dim); margin-top: 4px; }
@media (max-width: 560px) {
  .bld-counts { margin-left: 0; width: 100%; }
  .bld-count-big { font-size: 18px; }
}
/* Live activity feed (M7) */
.dw-sec-note { font-size: 10px; font-weight: 700; letter-spacing: .5px; color: var(--dim-2); margin-left: 8px; }
.op-pulse { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 12px; }
.op-stat { font-size: 12px; color: var(--dim); background: var(--card-2); border: 1px solid var(--line); border-radius: 8px; padding: 4px 9px; font-variant-numeric: tabular-nums; }
.op-stat b { color: var(--text); font-weight: 700; }
.ops { display: flex; flex-direction: column; gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.op { display: grid; grid-template-columns: 64px minmax(0,1fr) auto; align-items: center; gap: 10px; padding: 9px 13px; background: var(--card); }
.op-badge { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .4px; text-align: center; border: 1px solid var(--line); border-radius: 6px; padding: 2px 0; color: var(--dim); }
.op-badge.op-mint { color: var(--accent); border-color: rgba(73,234,203,.35); background: rgba(73,234,203,.08); }
.op-badge.op-xfer { color: var(--accent-2); border-color: rgba(112,199,186,.3); }
.op-badge.op-send { color: #d7b26b; border-color: rgba(215,178,107,.3); }
.op-badge.op-list { color: var(--up); border-color: rgba(63,214,132,.3); }
.op-mid { min-width: 0; }
.op-amt { display: block; font-size: 13px; font-weight: 700; font-variant-numeric: tabular-nums; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.op-amt small { color: var(--dim-2); font-weight: 600; font-size: 11px; }
.op-flow { display: block; font-size: 11.5px; color: var(--dim-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.op-flow a { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; color: var(--accent-2); }
.op-flow a:hover { color: var(--accent); }
.op-arw { color: var(--dim-2); padding: 0 1px; }
.op-time { font-size: 11px; color: var(--dim-2); font-variant-numeric: tabular-nums; white-space: nowrap; text-align: right; }
.dw-foot { margin-top: 22px; font-size: 12px; color: var(--dim-2); }
body.drawer-open { overflow: hidden; }

/* M5: Token Trust Profile */
.tp { background: var(--card); border: 1px solid var(--line); border-radius: 14px; padding: 16px; display: flex; flex-direction: column; gap: 14px; }
.tp-desc { font-size: 14px; line-height: 1.55; color: var(--text); opacity: .88; }
.tp-socials { display: flex; flex-wrap: wrap; gap: 8px; }
.tp-social { display: inline-flex; align-items: center; gap: 6px; background: var(--bg-2); border: 1px solid var(--line); border-radius: 8px; padding: 6px 11px; font-size: 12.5px; font-weight: 600; color: var(--dim); transition: color .12s, border-color .12s; }
.tp-social:hover { color: var(--accent); border-color: var(--accent-2); }
.tp-ico { font-size: 14px; line-height: 1; }
.tp-sname { white-space: nowrap; }
.tp-rug { display: flex; flex-direction: column; gap: 6px; }
.tp-rug-head { display: flex; justify-content: space-between; align-items: baseline; }
.tp-rug-label { font-size: 13px; font-weight: 600; color: var(--dim); }
.tp-rug-score { font-size: 18px; font-weight: 800; font-variant-numeric: tabular-nums; }
.tp-rug-gauge { height: 7px; background: var(--bg-2); border-radius: 4px; overflow: hidden; border: 1px solid var(--line); }
.tp-rug-fill { height: 100%; border-radius: 3px; transition: width .3s ease; }
.tp-rug-note { font-size: 11.5px; font-weight: 600; }
.tp-sent { display: flex; flex-direction: column; gap: 6px; }
.tp-sent-head { display: flex; justify-content: space-between; align-items: baseline; }
.tp-sent-label { font-size: 13px; font-weight: 600; color: var(--dim); }
.tp-sent-total { font-size: 11.5px; color: var(--dim-2); }
.tp-sent-bar { display: flex; height: 8px; border-radius: 4px; overflow: hidden; background: var(--bg-2); border: 1px solid var(--line); gap: 1px; }
.tp-sent-pos { background: var(--up); min-width: 0; transition: flex .3s ease; }
.tp-sent-neu { background: var(--dim-2); min-width: 0; transition: flex .3s ease; }
.tp-sent-neg { background: var(--down); min-width: 0; transition: flex .3s ease; }
.tp-sent-legend { display: flex; flex-wrap: wrap; gap: 10px; font-size: 12px; }
.tp-sl { display: inline-flex; align-items: center; gap: 3px; font-weight: 600; }
.tp-sl.pos { color: var(--up); }
.tp-sl.love { color: #ff6b9d; }
.tp-sl.neu { color: var(--dim-2); }
.tp-sl.neg { color: var(--down); }
@media (max-width: 480px) {
  .tp-sname { display: none; }
  .tp-social { padding: 8px 10px; }
  .tp-ico { font-size: 16px; }
}

/* Global live activity firehose (M8) */
.fh-card .op-pulse { margin: 0; padding: 12px 16px; border-bottom: 1px solid var(--line); background: var(--bg-2); }
.fh-card .op-pulse:empty { display: none; }
.fh { display: grid; grid-template-columns: 62px minmax(84px, auto) minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 11px 16px; border-bottom: 1px solid var(--line); cursor: pointer; transition: background .12s; }
.fh:last-child { border-bottom: none; }
.fh:hover { background: var(--card-2); }
.fh:hover .fh-tick { color: var(--accent); }
.fh-tok { display: flex; align-items: center; gap: 8px; min-width: 0; }
.fh-logo, .fh-tok .tok-ph { width: 24px; height: 24px; border-radius: 50%; flex: none; background: var(--bg-2); object-fit: cover; border: 1px solid var(--line); }
.fh-tok .tok-ph { display: flex; align-items: center; justify-content: center; font-size: 10px; font-weight: 700; color: var(--accent-2); }
.fh-tick { font-weight: 700; letter-spacing: .2px; font-size: 13.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fh-mid { min-width: 0; text-align: right; }
.fh-amt { display: inline-block; font-size: 13px; font-weight: 700; font-variant-numeric: tabular-nums; }
.fh-flow { display: block; font-size: 11.5px; color: var(--dim-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fh-flow a { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; color: var(--accent-2); }
.fh-flow a:hover { color: var(--accent); }

/* Whale watch (M18) — largest KRC-20 moves ranked by live USD value */
.whale-card .op-pulse { margin: 0; padding: 12px 16px; border-bottom: 1px solid var(--line); background: var(--bg-2); }
.whale-card .op-pulse:empty { display: none; }
.wh { display: grid; grid-template-columns: 34px minmax(84px, auto) minmax(96px, auto) minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 11px 16px; border-bottom: 1px solid var(--line); cursor: pointer; transition: background .12s; }
.wh:last-child { border-bottom: none; }
.wh:hover { background: var(--card-2); }
.wh:hover .fh-tick { color: var(--accent); }
.wh-tier { font-size: 20px; line-height: 1; text-align: center; filter: saturate(1.1); }
.wh-tier.wh-mid { font-size: 17px; }
.wh-tier.wh-sm { font-size: 15px; opacity: .8; }
.wh-val { text-align: right; min-width: 0; font-size: 15px; font-weight: 800; font-variant-numeric: tabular-nums; color: var(--accent); }
.wh-amt { display: block; font-size: 11px; font-weight: 600; color: var(--dim-2); font-variant-numeric: tabular-nums; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wh-flow { min-width: 0; display: flex; align-items: center; gap: 8px; overflow: hidden; }
.wh-flow .op-badge { flex: none; width: 62px; }
.wh-parties { font-size: 11.5px; color: var(--dim-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wh-parties a { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; color: var(--accent-2); }
.wh-parties a:hover { color: var(--accent); }

/* Wallet lookup (M5) */
.wallet-form { display: flex; gap: 10px; margin: 0 0 18px; max-width: 640px; }
.wallet-input { flex: 1; min-width: 0; background: var(--card); border: 1px solid var(--line); border-radius: 12px; color: var(--text); font-family: inherit; font-size: 14px; padding: 13px 15px; transition: border-color .12s; font-variant-numeric: tabular-nums; }
.wallet-input::placeholder { color: var(--dim-2); }
.wallet-input:focus { outline: none; border-color: var(--accent-2); }
.wallet-go { background: var(--accent); border: none; border-radius: 12px; color: #06231d; font-family: inherit; font-size: 14px; font-weight: 700; padding: 0 22px; cursor: pointer; transition: filter .12s, transform .06s; white-space: nowrap; }
.wallet-go:hover { filter: brightness(1.08); }
.wallet-go:active { transform: translateY(1px); }
.wallet-result { margin-top: 4px; }
.w-skel { background: var(--card); border: 1px solid var(--line); border-radius: 16px; overflow: hidden; }
.w-addr { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 14px; margin-bottom: 14px; font-size: 13px; }
.w-addr .mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; color: var(--dim); }
.w-addr a { color: var(--accent-2); text-decoration: none; }
.w-addr a:hover { color: var(--accent); }
.w-addr #w-add-portfolio { font-size: 12px; padding: 5px 12px; border-radius: 8px; }
.w-summary { display: grid; grid-template-columns: 1.1fr 1.4fr; gap: 12px; margin-bottom: 18px; }
.w-total { background: linear-gradient(180deg, var(--card-2), var(--card)); border: 1px solid var(--line); border-radius: 14px; padding: 18px; display: flex; flex-direction: column; justify-content: center; }
.w-total-k { color: var(--dim-2); font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .5px; }
.w-total-v { font-size: clamp(26px, 5vw, 38px); font-weight: 700; margin-top: 4px; font-variant-numeric: tabular-nums; color: var(--accent); }
.w-total-sub { color: var(--dim-2); font-size: 12px; margin-top: 4px; }
.w-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.w-card .thead.wrow, .w-card .wrow { grid-template-columns: minmax(120px,1.7fr) 1.2fr .9fr; }
.thead.wrow, .wrow { display: grid; align-items: center; gap: 10px; padding: 12px 18px; }
.thead.wrow { color: var(--dim-2); font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .5px; border-bottom: 1px solid var(--line); background: var(--bg-2); }
.tbody .wrow { border-bottom: 1px solid var(--line); cursor: pointer; transition: background .12s; }
.tbody .wrow:last-child { border-bottom: none; }
.tbody .wrow:hover { background: var(--card-2); }
.tbody .wrow:hover .tok-name { color: var(--accent); }
.w-usd { font-weight: 600; }
.w-lock { display: inline-block; margin-left: 7px; color: var(--dim-2); font-size: 11px; font-weight: 600; }

/* M6: Multi-wallet portfolio tracker */
.portfolio-add-form { display: flex; gap: 10px; margin: 0 0 20px; max-width: 700px; flex-wrap: wrap; }
.portfolio-add-input { flex: 1 1 240px; min-width: 0; background: var(--card); border: 1px solid var(--line); border-radius: 12px; color: var(--text); font-family: inherit; font-size: 14px; padding: 13px 15px; transition: border-color .12s; font-variant-numeric: tabular-nums; }
.portfolio-add-input::placeholder { color: var(--dim-2); }
.portfolio-add-input:focus { outline: none; border-color: var(--accent-2); }
.portfolio-add-label { flex: 0 1 140px; min-width: 0; background: var(--card); border: 1px solid var(--line); border-radius: 12px; color: var(--text); font-family: inherit; font-size: 14px; padding: 13px 15px; transition: border-color .12s; }
.portfolio-add-label::placeholder { color: var(--dim-2); }
.portfolio-add-label:focus { outline: none; border-color: var(--accent-2); }
.portfolio-add-btn { background: var(--accent); border: none; border-radius: 12px; color: #06231d; font-family: inherit; font-size: 14px; font-weight: 700; padding: 0 22px; cursor: pointer; transition: filter .12s, transform .06s; white-space: nowrap; }
.portfolio-add-btn:hover { filter: brightness(1.08); }
.portfolio-add-btn:active { transform: translateY(1px); }

.portfolio-empty { text-align: center; padding: 48px 20px; background: var(--card); border: 1px dashed var(--line); border-radius: 16px; }
.portfolio-empty-ic { font-size: 42px; margin-bottom: 12px; }
.portfolio-empty-msg { color: var(--text); font-size: 15px; font-weight: 600; margin-bottom: 6px; }
.portfolio-empty-sub { color: var(--dim-2); font-size: 13px; }

.portfolio-summary { display: grid; grid-template-columns: 1.2fr 1fr 1fr 1fr; gap: 12px; margin-bottom: 20px; }
.pf-stat { background: linear-gradient(180deg, var(--card-2), var(--card)); border: 1px solid var(--line); border-radius: 14px; padding: 16px 18px; display: flex; flex-direction: column; justify-content: center; }
.pf-stat-hero { grid-column: 1; }
.pf-stat-k { color: var(--dim-2); font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .5px; }
.pf-stat-v { font-size: clamp(22px, 4vw, 32px); font-weight: 700; margin-top: 4px; font-variant-numeric: tabular-nums; color: var(--accent); }
.pf-stat-hero .pf-stat-v { font-size: clamp(26px, 5vw, 38px); }
.pf-stat-sub { color: var(--dim-2); font-size: 12px; margin-top: 4px; }
.pf-stat-sub.up { color: var(--up); }
.pf-stat-sub.down { color: var(--down); }

.portfolio-holdings-card { margin-bottom: 24px; }
.portfolio-holdings-head { display: flex; align-items: baseline; justify-content: space-between; padding: 14px 18px 0; }
.portfolio-holdings-head h3 { font-size: 15px; font-weight: 700; }
.portfolio-holdings-note { color: var(--dim-2); font-size: 12px; }
.portfolio-row { display: grid; grid-template-columns: minmax(120px,1.6fr) 1.1fr 1fr .7fr .7fr; gap: 10px; align-items: center; padding: 12px 18px; }
.portfolio-holdings-card .thead { display: grid; grid-template-columns: minmax(120px,1.6fr) 1.1fr 1fr .7fr .7fr; gap: 10px; align-items: center; padding: 12px 18px; color: var(--dim-2); font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .5px; border-bottom: 1px solid var(--line); background: var(--bg-2); }
.portfolio-holdings .portfolio-row { border-bottom: 1px solid var(--line); transition: background .12s; }
.portfolio-holdings .portfolio-row:last-child { border-bottom: none; }
.portfolio-holdings .portfolio-row:hover { background: var(--card-2); }
.pf-chg-up { color: var(--up); font-weight: 600; font-size: 13px; }
.pf-chg-down { color: var(--down); font-weight: 600; font-size: 13px; }
.pf-wallets-count { color: var(--dim); font-size: 12px; font-variant-numeric: tabular-nums; }

.portfolio-wallets-head { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 12px; }
.portfolio-wallets-head h3 { font-size: 15px; font-weight: 700; }
.portfolio-wallets-note { color: var(--dim-2); font-size: 12px; }
.portfolio-wallets { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 12px; }
.pf-wallet-card { background: var(--card); border: 1px solid var(--line); border-radius: 14px; padding: 14px 16px; transition: border-color .12s; }
.pf-wallet-card:hover { border-color: var(--accent-2); }
.pf-wallet-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 8px; }
.pf-wallet-label { font-weight: 700; font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pf-wallet-addr { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; color: var(--dim-2); font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pf-wallet-actions { display: flex; gap: 6px; flex-shrink: 0; }
.pf-wallet-btn { background: none; border: 1px solid var(--line); border-radius: 8px; color: var(--dim); font-family: inherit; font-size: 11px; font-weight: 600; padding: 4px 10px; cursor: pointer; transition: all .12s; }
.pf-wallet-btn:hover { color: var(--text); border-color: var(--accent-2); }
.pf-wallet-btn.danger:hover { color: var(--down); border-color: var(--down); }
.pf-wallet-stats { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px; }
.pf-wallet-stat-k { color: var(--dim-2); font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: .4px; }
.pf-wallet-stat-v { font-size: 14px; font-weight: 600; font-variant-numeric: tabular-nums; margin-top: 2px; }
.pf-wallet-stat-v.accent { color: var(--accent); }

.portfolio-loading { text-align: center; padding: 32px; color: var(--dim); }
.portfolio-loading .skel-row { height: 48px; margin-bottom: 8px; }

/* M9: Cost basis + P&L */
.pf-pnl-up { color: var(--up) !important; }
.pf-pnl-down { color: var(--down) !important; }
.pf-pnl-card { border-color: rgba(73,234,203,.2); }
.pf-pnl-card:has(.pf-pnl-down) { border-color: rgba(255,108,108,.2); }
.pf-cb-col { min-width: 0; }
.pf-cb-value { font-variant-numeric: tabular-nums; font-size: 13px; color: var(--text); cursor: pointer; text-decoration: underline; text-decoration-color: var(--line); text-underline-offset: 3px; }
.pf-cb-value:hover { text-decoration-color: var(--accent-2); }
.pf-cb-none { color: var(--dim-2); cursor: pointer; font-size: 13px; }
.pf-cb-none:hover { color: var(--accent-2); }
.pf-cb-add { background: none; border: 1px solid var(--line); border-radius: 6px; color: var(--dim); font-family: inherit; font-size: 11px; font-weight: 600; padding: 3px 8px; cursor: pointer; transition: all .12s; white-space: nowrap; }
.pf-cb-add:hover { color: var(--accent-2); border-color: var(--accent-2); }
.pf-kas-bar { grid-column: 1 / -1; display: flex; align-items: center; gap: 12px; padding: 10px 16px; margin-top: 8px; background: var(--card-2); border: 1px solid var(--line); border-radius: 10px; font-size: 13px; flex-wrap: wrap; }
.pf-kas-cb { color: var(--dim); cursor: pointer; font-weight: 600; }
.pf-kas-cb:hover { color: var(--accent-2); }
.pf-kas-cb.pf-cb-add { border: 1px dashed var(--line); padding: 4px 10px; border-radius: 8px; font-size: 12px; }
.pf-kas-pnl { font-weight: 700; font-variant-numeric: tabular-nums; }

/* M9: Cost basis editor modal */
.cb-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.6); backdrop-filter: blur(4px); z-index: 1000; display: flex; align-items: center; justify-content: center; }
.cb-modal[hidden] { display: none; }
.cb-overlay[hidden] { display: none; }
.cb-modal { position: fixed; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 1001; background: var(--card); border: 1px solid var(--line); border-radius: 16px; padding: 24px; width: 90%; max-width: 380px; box-shadow: 0 12px 48px rgba(0,0,0,.4); }
.cb-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
.cb-title { font-size: 16px; font-weight: 700; }
.cb-close { background: none; border: none; color: var(--dim-2); font-size: 18px; cursor: pointer; padding: 4px; line-height: 1; border-radius: 6px; }
.cb-close:hover { color: var(--text); background: var(--card-2); }
.cb-label { display: block; font-size: 13px; color: var(--dim); margin-bottom: 6px; font-weight: 600; }
.cb-input { width: 100%; background: var(--bg-2); border: 1px solid var(--line); border-radius: 10px; color: var(--text); font-family: inherit; font-size: 18px; font-weight: 600; padding: 12px 14px; font-variant-numeric: tabular-nums; }
.cb-input:focus { outline: none; border-color: var(--accent-2); }
.cb-input::placeholder { color: var(--dim-2); font-weight: 400; }
.cb-hint { font-size: 12px; color: var(--dim-2); margin-top: 8px; }
.cb-actions { display: flex; gap: 8px; margin-top: 16px; flex-wrap: wrap; }
.cb-btn { background: var(--card-2); border: 1px solid var(--line); border-radius: 10px; color: var(--text); font-family: inherit; font-size: 13px; font-weight: 600; padding: 10px 16px; cursor: pointer; transition: all .12s; }
.cb-btn:hover { border-color: var(--accent-2); background: var(--bg-2); }
.cb-save { background: var(--accent); border-color: var(--accent); color: #06231e; }
.cb-save:hover { filter: brightness(1.08); }
.cb-use-current { font-size: 12px; color: var(--accent-2); }
.cb-clear { color: var(--down); font-size: 12px; margin-left: auto; }

/* M10: Portfolio performance chart + allocation donut */
.pf-charts-row { display: grid; grid-template-columns: 1fr 340px; gap: 16px; margin-bottom: 20px; }
.pf-chart-card { background: var(--card); border: 1px solid var(--line); border-radius: 14px; padding: 16px; }
.pf-chart-card .section-head { margin-bottom: 8px; }
.pf-chart-card .chart-box { min-height: 160px; padding: 12px; }
.pf-chart-summary { display: flex; gap: 16px; margin-top: 10px; flex-wrap: wrap; }
.pf-chart-summary .pf-sm { display: flex; flex-direction: column; gap: 2px; }
.pf-chart-summary .pf-sm-k { font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: .5px; color: var(--dim-2); }
.pf-chart-summary .pf-sm-v { font-size: 14px; font-weight: 700; font-variant-numeric: tabular-nums; }
.pf-chart-summary .pf-sm-v.up { color: var(--up); }
.pf-chart-summary .pf-sm-v.down { color: var(--down); }

.pf-alloc-card { background: var(--card); border: 1px solid var(--line); border-radius: 14px; padding: 16px; display: flex; flex-direction: column; }
.pf-alloc-card .section-head { margin-bottom: 12px; }
.pf-alloc-wrap { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; justify-content: center; flex: 1; }
.pf-donut { width: 130px; height: 130px; flex-shrink: 0; }
.pf-donut circle { fill: none; stroke-width: 16; }
.pf-donut .pf-donut-bg { stroke: var(--line); }
.pf-alloc-legend { display: flex; flex-direction: column; gap: 5px; flex: 1; min-width: 100px; }
.pf-alloc-row { display: flex; align-items: center; gap: 6px; font-size: 12px; }
.pf-alloc-dot { width: 10px; height: 10px; border-radius: 3px; flex-shrink: 0; }
.pf-alloc-tick { font-weight: 700; color: var(--text); flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pf-alloc-pct { color: var(--dim-2); font-variant-numeric: tabular-nums; font-weight: 600; }
.pf-alloc-empty { color: var(--dim-2); font-size: 13px; text-align: center; padding: 20px 0; }

.pf-export-row { display: flex; gap: 8px; margin-bottom: 16px; align-items: center; }
.pf-export-btn { background: var(--card); border: 1px solid var(--line); border-radius: 8px; color: var(--dim-2); font-family: inherit; font-size: 12px; font-weight: 600; padding: 6px 14px; cursor: pointer; transition: all .12s; display: inline-flex; align-items: center; gap: 6px; }
.pf-export-btn:hover { color: var(--text); border-color: var(--accent-2); background: var(--card-2); }

@media (max-width: 760px) {
  .portfolio-summary { grid-template-columns: 1fr 1fr; }
  .pf-stat-hero { grid-column: 1 / -1; }
  .portfolio-row, .portfolio-holdings-card .thead { grid-template-columns: minmax(90px,1.5fr) 1fr .8fr; padding: 12px 14px; gap: 8px; }
  .portfolio-row .c-hide-sm, .portfolio-holdings-card .thead .c-hide-sm { display: none; }
  .portfolio-add-form { flex-direction: column; }
  .portfolio-add-input, .portfolio-add-label { flex: 1; }
  .portfolio-add-btn { width: 100%; padding: 13px; }
  .portfolio-wallets { grid-template-columns: 1fr; }
  .pf-charts-row { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
  .portfolio-summary { grid-template-columns: 1fr; }
  .pf-stat-hero { grid-column: 1; }
  .pf-alloc-wrap { flex-direction: column; }
}

/* M29: Portfolio Performance Attribution */
.pf-attrib-card { background: var(--card); border: 1px solid var(--line); border-radius: 14px; padding: 16px; margin-bottom: 20px; }
.pf-attrib-body { display: flex; flex-direction: column; gap: 16px; }
.pf-attrib-heroes { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.pf-attrib-hero { border: 1px solid var(--line); border-radius: 12px; padding: 14px 16px; display: flex; flex-direction: column; gap: 6px; }
.pf-attrib-hero.win { border-color: rgba(73,234,203,.2); background: linear-gradient(135deg, rgba(73,234,203,.05), transparent); }
.pf-attrib-hero.loss { border-color: rgba(255,108,108,.2); background: linear-gradient(135deg, rgba(255,108,108,.05), transparent); }
.pf-attrib-hero-label { font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .5px; color: var(--dim-2); }
.pf-attrib-hero-tick { display: flex; align-items: center; gap: 8px; font-size: 16px; font-weight: 700; color: var(--text); }
.pf-attrib-hero-pnl { font-size: 22px; font-weight: 700; font-variant-numeric: tabular-nums; }
.pf-attrib-hero-pnl.up { color: var(--up); }
.pf-attrib-hero-pnl.down { color: var(--down); }
.pf-attrib-hero-sub { font-size: 12px; color: var(--dim-2); }
.pf-attrib-chart-wrap { position: relative; }
.pf-attrib-chart { width: 100%; height: auto; display: block; }
.pf-attrib-bars { display: flex; flex-direction: column; gap: 4px; }
.pf-attrib-bar-row { display: grid; grid-template-columns: 90px 1fr 80px; align-items: center; gap: 8px; font-size: 12px; }
.pf-attrib-bar-tick { font-weight: 700; color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pf-attrib-bar-track { position: relative; height: 22px; background: var(--bg-2); border-radius: 5px; overflow: hidden; }
.pf-attrib-bar-zero { position: absolute; left: 50%; top: 0; bottom: 0; width: 1px; background: var(--line); z-index: 1; }
.pf-attrib-bar-fill { position: absolute; top: 0; bottom: 0; border-radius: 3px; transition: width .3s ease; }
.pf-attrib-bar-fill.up { background: linear-gradient(90deg, rgba(73,234,203,.5), rgba(73,234,203,.8)); left: 50%; }
.pf-attrib-bar-fill.down { background: linear-gradient(90deg, rgba(255,108,108,.8), rgba(255,108,108,.5)); right: 50%; }
.pf-attrib-bar-val { text-align: right; font-variant-numeric: tabular-nums; font-weight: 600; }
.pf-attrib-bar-val.up { color: var(--up); }
.pf-attrib-bar-val.down { color: var(--down); }
.pf-attrib-bar-val.dim { color: var(--dim-2); }
.pf-attrib-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.pf-attrib-stat { border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; display: flex; flex-direction: column; gap: 2px; }
.pf-attrib-stat-k { font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: .5px; color: var(--dim-2); }
.pf-attrib-stat-v { font-size: 16px; font-weight: 700; font-variant-numeric: tabular-nums; }
.pf-attrib-stat-v.up { color: var(--up); }
.pf-attrib-stat-v.down { color: var(--down); }
.pf-attrib-empty { color: var(--dim-2); font-size: 13px; text-align: center; padding: 20px 0; }
@media (max-width: 600px) {
  .pf-attrib-heroes { grid-template-columns: 1fr; }
  .pf-attrib-stats { grid-template-columns: 1fr 1fr; }
  .pf-attrib-bar-row { grid-template-columns: 70px 1fr 70px; }
}

/* M4: Wallet transaction explorer */
.w-txs-wrap { margin-top: 22px; }
.w-txs-head { display: flex; align-items: baseline; gap: 10px; margin-bottom: 10px; }
.w-txs-title { font-size: 15px; font-weight: 700; margin: 0; color: var(--text); }
.w-txs-note { font-size: 12px; color: var(--dim-2); }
.tx-section { border: 1px solid var(--line); border-radius: 14px; overflow: hidden; background: var(--card); }
.tx-head, .tx-row { display: grid; grid-template-columns: 40px 1.6fr 1.2fr 0.7fr; align-items: center; gap: 10px; padding: 11px 16px; }
.tx-head { color: var(--dim-2); font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .5px; border-bottom: 1px solid var(--line); background: var(--bg-2); }
.tx-body .tx-row { border-bottom: 1px solid var(--line); cursor: pointer; transition: background .12s; }
.tx-body .tx-row:last-child { border-bottom: none; }
.tx-body .tx-row:hover { background: var(--card-2); }
.tx-type { display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 50%; font-size: 14px; font-weight: 700; flex: none; }
.tx-in { color: var(--accent); background: rgba(73,234,203,.12); }
.tx-out { color: #ff7a7a; background: rgba(255,122,122,.12); }
.tx-krc { color: var(--accent-2); background: rgba(112,199,186,.12); }
.tx-info { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.tx-label { font-size: 13.5px; font-weight: 600; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tx-hash { font-size: 11px; color: var(--dim-2); }
.tx-amt-cell { text-align: right; }
.tx-amt { font-size: 13.5px; font-weight: 600; font-variant-numeric: tabular-nums; }
.tx-unit { font-size: 11px; font-weight: 600; color: var(--dim-2); margin-left: 2px; }
.tx-time { text-align: right; font-size: 12px; color: var(--dim-2); white-space: nowrap; }
.tx-pending { color: #f5a623; font-size: 11px; font-weight: 600; }
.tx-more { display: block; text-align: center; padding: 12px; font-size: 13px; color: var(--accent-2); text-decoration: none; border-top: 1px solid var(--line); transition: background .12s, color .12s; }
.tx-more:hover { background: var(--card-2); color: var(--accent); }

@media (max-width: 600px) {
  .tx-head, .tx-row { grid-template-columns: 32px 1fr 0.9fr 0.6fr; padding: 10px 12px; gap: 8px; }
  .tx-type { width: 26px; height: 26px; font-size: 12px; }
  .tx-label { font-size: 12.5px; }
  .tx-amt { font-size: 12.5px; }
}

/* NFT collections (M9) */
.nft-head { border-radius: 0; }
.nft-card .thead.nrow, .nft-card .row.nrow { grid-template-columns: 42px minmax(120px,1.8fr) 1.15fr 1.15fr .9fr .9fr; }
.nft-ph { background: linear-gradient(135deg, rgba(73,234,203,.18), rgba(112,199,186,.06)); color: var(--accent) !important; border-color: rgba(73,234,203,.3) !important; letter-spacing: .3px; }
.nkas { display: flex; flex-direction: column; align-items: flex-end; line-height: 1.25; }
.nkas .unit { color: var(--dim-2); font-size: 11px; font-weight: 600; }
.nkas small { color: var(--dim-2); font-size: 11px; font-weight: 600; margin-top: 1px; }
.dw-ph { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 700; flex: none; }

/* Watchlist (M10) */
.nav-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 18px; height: 18px; padding: 0 5px; margin-left: 6px; font-size: 11px; font-weight: 700; line-height: 1; border-radius: 9px; background: var(--accent); color: var(--bg); vertical-align: middle; }
.nav-badge.hide { display: none; }
.star { flex: none; background: none; border: none; padding: 0 1px; margin-left: -2px; font-size: 16px; line-height: 1; cursor: pointer; color: var(--dim-2); transition: color .12s, transform .1s; }
.star:hover { color: var(--accent); transform: scale(1.18); }
.star.on { color: #f5c518; }
.dw-actions .star { font-size: 22px; padding: 0 2px; margin: 0; }
.section-head-r { display: flex; align-items: center; gap: 12px; }
.watch-share { height: 30px; }
.watch-empty { border: 1px dashed var(--line); border-radius: 14px; padding: 26px 22px; text-align: center; background: linear-gradient(180deg, var(--card-2), var(--card)); }
.watch-empty-star { display: block; font-size: 30px; color: var(--dim-2); margin-bottom: 6px; }
.watch-empty p { max-width: 460px; margin: 6px auto 0; font-size: 14px; }
.watch-empty b { color: var(--text); }
.watch-sub-h { display: flex; align-items: center; gap: 8px; margin: 22px 0 10px; font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .5px; color: var(--dim); }
.watch-sub-h:first-child { margin-top: 0; }
.watch-sub-h span { display: inline-flex; align-items: center; justify-content: center; min-width: 18px; height: 18px; padding: 0 5px; font-size: 11px; border-radius: 9px; background: var(--card-2); border: 1px solid var(--line); color: var(--accent-2); }
.watch-shared { position: relative; display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; padding: 15px 44px 15px 16px; margin-bottom: 16px; border: 1px solid var(--accent-2); border-radius: 14px; background: linear-gradient(100deg, rgba(73,234,203,.1), rgba(18,34,38,.35) 60%); }
.watch-shared-txt { display: flex; flex-direction: column; gap: 2px; }
.watch-shared-txt b { color: var(--accent); font-size: 14px; }
.watch-shared-txt span { color: var(--dim); font-size: 12.5px; }
.watch-chips { display: flex; flex-wrap: wrap; gap: 6px; flex: 1 1 200px; }
.watch-chip { font-size: 11px; font-weight: 700; letter-spacing: .3px; color: var(--accent-2); border: 1px solid var(--line); background: var(--card); border-radius: 7px; padding: 3px 8px; }
.watch-chip.nft { color: #c79bf5; }
.watch-import { margin-left: auto; height: 34px; }
.watch-dismiss { position: absolute; top: 10px; right: 12px; background: none; border: none; color: var(--dim-2); font-size: 15px; cursor: pointer; line-height: 1; }
.watch-dismiss:hover { color: var(--text); }

/* Responsive */
@media (max-width: 760px) {
  .stats { grid-template-columns: repeat(2, 1fr); }
  .wave-grid { grid-template-columns: 1fr; }
  .c-hide-sm { display: none; }
  .thead, .row { grid-template-columns: 30px minmax(90px,1.6fr) 1fr .7fr 1.1fr; padding: 12px 14px; gap: 8px; }
  .mkt-pulse { grid-template-columns: repeat(2, 1fr); }
  .mkt-card .thead.mkt-row, .mkt-card .row.mkt-row { grid-template-columns: 30px minmax(90px,1.6fr) 1.1fr .8fr; padding: 12px 14px; gap: 8px; }
  .nft-card .thead.nrow, .nft-card .row.nrow { grid-template-columns: 30px minmax(90px,1.6fr) 1.2fr 1.1fr; padding: 12px 14px; gap: 8px; }
  .close-card .thead.close-row, .close-card .row.close-row { grid-template-columns: 30px minmax(90px,1.6fr) 1.3fr 1fr; padding: 12px 14px; gap: 8px; }
  .wrap { padding: 0 14px; }
  .hero { padding: 38px 0 22px; }
  .drawer { width: 100%; max-width: 100vw; }
  .cobrand { flex-wrap: wrap; gap: 10px 14px; padding: 14px 16px; }
  .cobrand-cta { margin-left: 0; width: 100%; padding-left: 35px; }
  .wedge { flex-wrap: wrap; gap: 16px; padding: 18px 16px; }
  .wedge-cta { margin-left: 0; width: 100%; justify-content: center; }
  .dw-grid { grid-template-columns: 1fr 1fr; }
  .live-pill { display: none; }
  .w-summary { grid-template-columns: 1fr; }
  .w-card .thead.wrow, .w-card .wrow { grid-template-columns: minmax(90px,1.6fr) 1.1fr .9fr; padding: 12px 14px; gap: 8px; }
  .search { max-width: none; }
  .search-kbd { display: none; }
  .fh { grid-template-columns: 52px minmax(0, 1fr) auto auto; gap: 8px; padding: 11px 14px; }
  .fh-mid { display: block; text-align: right; }
  .fh-flow { display: none; }
  .fh-amt { font-size: 12.5px; }
  .wh { grid-template-columns: 28px minmax(0, 1fr) auto auto; gap: 8px; padding: 11px 14px; }
  .wh-flow { display: none; }
  .wh-val { font-size: 14px; }
  .wh-tier { font-size: 17px; }
  .watch-import { margin-left: 0; width: 100%; }
  .scr-controls { gap: 12px 16px; padding: 14px; }
  .scr-controls .pills { flex-wrap: wrap; }
  .scr-group { flex: 1 1 100%; }
  .scr-nums { flex: 1 1 100%; }
}

@media (max-width: 380px) {
  .stats, .mkt-pulse { grid-template-columns: 1fr; }
  .w-cards { grid-template-columns: 1fr; }
}

/* Respect reduced-motion preference */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
  .skel-row::after, .skel-frow::after { display: none; }
  .cmp-spin { animation: none !important; }
}

.dw-cmp { align-self: flex-start; display: inline-flex; align-items: center; justify-content: center; background: var(--card); border: 1px solid var(--line); color: var(--dim); height: 32px; width: 32px; border-radius: 9px; font-size: 15px; cursor: pointer; transition: color .12s, border-color .12s; }
.dw-cmp:hover { color: var(--accent); border-color: var(--accent-2); }

/* ── M15: Token Compare ─────────────────────────────────────────────── */
.cmp-share { align-self: center; height: 30px; }
.cmp-add { display: flex; gap: 10px; margin: 4px 0 12px; max-width: 460px; }
.cmp-add input { flex: 1; min-width: 0; background: var(--card); border: 1px solid var(--line); color: var(--text); border-radius: 10px; padding: 11px 14px; font-family: inherit; font-size: 14px; }
.cmp-add input:focus { outline: none; border-color: var(--accent-2); box-shadow: 0 0 0 3px rgba(73,234,203,.1); }
.cmp-add input::placeholder { color: var(--dim-2); }
.cmp-add-btn { flex: none; background: var(--accent); color: var(--bg); border: none; border-radius: 10px; padding: 0 20px; font-family: inherit; font-size: 14px; font-weight: 800; cursor: pointer; transition: transform .12s; }
.cmp-add-btn:hover { transform: translateY(-1px); }
.cmp-quick { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 18px; }
.cmp-quick-l { color: var(--dim-2); font-size: 12px; font-weight: 600; }
.cmp-chip { background: var(--card); border: 1px solid var(--line); color: var(--dim); border-radius: 20px; padding: 5px 13px; font-family: inherit; font-size: 12.5px; font-weight: 700; cursor: pointer; transition: color .12s, border-color .12s; }
.cmp-chip:hover { color: var(--accent); border-color: var(--accent-2); }

.cmp-cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 14px; }
.cmp-empty { grid-column: 1 / -1; text-align: center; border: 1px dashed var(--line); border-radius: 14px; padding: 40px 24px; background: var(--card); }
.cmp-empty-i { font-size: 34px; margin-bottom: 10px; filter: grayscale(.2); }
.cmp-empty-t { font-size: 16px; font-weight: 700; color: var(--text); margin-bottom: 6px; }
.cmp-empty-s { color: var(--dim); font-size: 13px; max-width: 460px; margin: 0 auto; line-height: 1.5; }

.cmp-col { position: relative; background: var(--card); border: 1px solid var(--line); border-radius: 14px; padding: 16px 16px 14px; display: flex; flex-direction: column; }
.cmp-col.best { border-color: var(--accent-2); box-shadow: 0 0 0 1px rgba(73,234,203,.25), 0 10px 30px rgba(73,234,203,.08); }
.cmp-toppick { position: absolute; top: -10px; left: 14px; background: var(--accent); color: var(--bg); font-size: 10.5px; font-weight: 800; letter-spacing: .4px; text-transform: uppercase; padding: 3px 9px; border-radius: 20px; }
.cmp-head { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.cmp-head .cmp-logo, .cmp-head .tok-ph { width: 30px; height: 30px; flex: none; border-radius: 50%; object-fit: cover; }
.cmp-head .tok-ph { display: flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 700; color: var(--accent-2); }
.cmp-h-txt { min-width: 0; flex: 1; }
.cmp-tick { font-size: 15px; font-weight: 800; color: var(--text); overflow: hidden; text-overflow: ellipsis; }
.cmp-rank { font-size: 11px; color: var(--dim-2); }
.cmp-x { flex: none; background: none; border: none; color: var(--dim-2); font-size: 14px; cursor: pointer; padding: 4px; border-radius: 6px; line-height: 1; }
.cmp-x:hover { color: var(--down); background: var(--card-2); }

.cmp-state { color: var(--dim); font-size: 13px; padding: 24px 0; text-align: center; display: flex; align-items: center; justify-content: center; gap: 8px; }
.cmp-state.err { color: var(--down); flex-direction: column; }
.cmp-retry, .cmp-detail { background: var(--card-2); border: 1px solid var(--line); color: var(--dim); border-radius: 8px; padding: 6px 12px; font-family: inherit; font-size: 12px; font-weight: 600; cursor: pointer; }
.cmp-retry:hover, .cmp-detail:hover { color: var(--accent); border-color: var(--accent-2); }
.cmp-spin { width: 13px; height: 13px; border: 2px solid var(--line); border-top-color: var(--accent); border-radius: 50%; animation: spin .7s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

.cmp-open { display: block; width: 100%; background: none; border: none; padding: 0; cursor: pointer; }
.cmp-grade { --sc: var(--dim); display: flex; align-items: center; gap: 12px; background: var(--card-2); border: 1px solid var(--line); border-radius: 11px; padding: 12px 14px; }
.cmp-grade.sA { --sc: var(--up); } .cmp-grade.sB { --sc: #7ed99f; } .cmp-grade.sC { --sc: #f5b544; }
.cmp-grade.sD { --sc: #f59a44; } .cmp-grade.sF { --sc: var(--down); }
.cmp-open:hover .cmp-grade { border-color: var(--accent-2); }
.cg-letter { flex: none; width: 42px; height: 42px; border-radius: 10px; display: grid; place-items: center; font-size: 25px; font-weight: 800; color: var(--bg); background: var(--sc); line-height: 1; }
.cmp-grade.none .cg-letter { background: var(--card); color: var(--dim-2); border: 1px solid var(--line); }
.cg-num { font-size: 20px; font-weight: 800; color: var(--text); font-variant-numeric: tabular-nums; }
.cg-num small { font-size: 12px; font-weight: 600; color: var(--dim-2); }
.cg-num.cg-sub { font-size: 13px; font-weight: 600; color: var(--dim-2); }

.cmp-bars { display: flex; flex-direction: column; gap: 8px; margin: 13px 0 4px; }
.cmp-bar .cb-k { display: flex; justify-content: space-between; font-size: 10.5px; font-weight: 600; text-transform: uppercase; letter-spacing: .3px; color: var(--dim-2); margin-bottom: 3px; }
.cmp-bar .cb-k b { color: var(--text); font-variant-numeric: tabular-nums; }
.cb-track { display: block; height: 5px; background: var(--bg-2); border: 1px solid var(--line); border-radius: 4px; overflow: hidden; }
.cb-track i { display: block; height: 100%; background: linear-gradient(90deg, var(--accent-2), var(--accent)); }

.cmp-rows { margin: 12px 0 4px; border-top: 1px solid var(--line); }
.cmp-r { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; padding: 7px 0; border-bottom: 1px solid var(--line); font-size: 13px; }
.cmp-r .cmp-k { color: var(--dim); flex: none; }
.cmp-r .cmp-v { color: var(--text); font-weight: 600; font-variant-numeric: tabular-nums; text-align: right; overflow: hidden; text-overflow: ellipsis; }
.cmp-r.warn .cmp-v { color: var(--down); }
.cmp-r .chg-up { color: var(--up); } .cmp-r .chg-down { color: var(--down); }
.cmp-detail { width: 100%; margin-top: 10px; text-align: center; }

@media (max-width: 560px) {
  .cmp-cols { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; }
  .cmp-col { padding: 14px 12px 12px; }
}

/* ── M23: Fair-launch leaderboard ─────────────────────────────────────────── */
.lb-bar { display: flex; align-items: center; flex-wrap: wrap; gap: 12px 16px; margin: 4px 0 14px; }
.lb-run { background: linear-gradient(90deg, var(--accent-2), var(--accent)); color: var(--bg); border: none; border-radius: 10px; padding: 10px 18px; font-family: inherit; font-size: 14px; font-weight: 700; cursor: pointer; transition: filter .12s, opacity .12s; }
.lb-run:hover { filter: brightness(1.06); }
.lb-run:disabled { opacity: .55; cursor: default; }
.lb-note { color: var(--dim); font-size: 12.5px; display: inline-flex; align-items: center; gap: 8px; }
.lb-prog { display: inline-block; width: 90px; height: 5px; background: var(--bg-2); border: 1px solid var(--line); border-radius: 4px; overflow: hidden; vertical-align: middle; }
.lb-prog i { display: block; height: 100%; background: linear-gradient(90deg, var(--accent-2), var(--accent)); transition: width .3s; }

.lb-rows { display: flex; flex-direction: column; gap: 8px; }
.lb-row { display: grid; grid-template-columns: 26px auto minmax(96px, 160px) 1fr auto auto; align-items: center; gap: 12px; background: var(--card); border: 1px solid var(--line); border-radius: 12px; padding: 10px 14px; }
.lb-row.lb { cursor: pointer; transition: border-color .12s, background .12s; }
.lb-row.lb:hover { border-color: var(--accent-2); background: var(--card-2); }
.lb-row.lb:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.lb-row.pend { opacity: .8; }
.lb-rank { color: var(--dim-2); font-size: 13px; font-weight: 700; font-variant-numeric: tabular-nums; text-align: center; }
.lb-grade { --sc: var(--dim); flex: none; min-width: 44px; height: 40px; padding: 0 10px; border-radius: 9px; display: inline-flex; align-items: baseline; justify-content: center; gap: 3px; font-size: 20px; font-weight: 800; color: var(--bg); background: var(--sc); line-height: 40px; }
.lb-grade small { font-size: 11px; font-weight: 700; opacity: .85; }
.lb-grade.sA { --sc: var(--up); } .lb-grade.sB { --sc: #7ed99f; } .lb-grade.sC { --sc: #f5b544; }
.lb-grade.sD { --sc: #f59a44; } .lb-grade.sF { --sc: var(--down); }
.lb-grade.none { background: var(--card-2); color: var(--dim-2); border: 1px solid var(--line); font-size: 15px; }
.lb-spin { width: 13px; height: 13px; border: 2px solid var(--line); border-top-color: var(--accent); border-radius: 50%; animation: spin .7s linear infinite; align-self: center; }
.lb-tok { display: inline-flex; align-items: center; gap: 8px; min-width: 0; }
.lb-logo { width: 24px; height: 24px; border-radius: 50%; flex: none; object-fit: cover; background: var(--card-2); }
.lb-tick { font-weight: 700; font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lb-nph { width: 24px; height: 24px; flex: none; display: inline-flex; align-items: center; justify-content: center; border-radius: 7px; border: 1px solid; font-size: 10px; font-weight: 800; }
.lb-mid { min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.lb-verdict { color: var(--dim); font-size: 12.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lb-verdict.dim { color: var(--dim-2); }
.lb-bars { display: inline-flex; gap: 4px; }
.lb-b { display: inline-block; width: 40px; height: 4px; background: var(--bg-2); border: 1px solid var(--line); border-radius: 3px; overflow: hidden; }
.lb-b i { display: block; height: 100%; background: linear-gradient(90deg, var(--accent-2), var(--accent)); }
.lb-meta { display: inline-flex; gap: 16px; }
.lb-m { display: flex; flex-direction: column; align-items: flex-end; font-size: 10.5px; text-transform: uppercase; letter-spacing: .3px; color: var(--dim-2); }
.lb-m b { color: var(--text); font-size: 13.5px; font-weight: 700; text-transform: none; letter-spacing: 0; font-variant-numeric: tabular-nums; }
.lb-m.warn b { color: var(--down); }
.lb-row .star { flex: none; }

@media (max-width: 720px) {
  .lb-row { grid-template-columns: 22px auto 1fr auto; row-gap: 8px; }
  .lb-mid { grid-column: 1 / -1; order: 5; }
  .lb-meta { order: 4; }
}
@media (max-width: 460px) {
  .lb-meta .lb-m:first-child { display: none; }
}

/* ── M45: Community Trust & Sentiment Leaderboard ─────────────────────────── */
.tb-score { display: inline-flex; align-items: baseline; gap: 2px; min-width: 56px; font-size: 18px; font-weight: 800; font-variant-numeric: tabular-nums; }
.tb-score small { font-size: 10px; font-weight: 600; opacity: .6; }
.tb-score.none { color: var(--dim-2); font-size: 14px; }
.tb-mid { display: flex; flex-direction: column; gap: 5px; min-width: 0; flex: 1; }
.tb-row-bar { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.tb-bar { display: inline-flex; align-items: center; width: 80px; height: 5px; background: var(--bg-2); border: 1px solid var(--line); border-radius: 4px; overflow: hidden; flex: none; }
.tb-bar i { display: block; height: 100%; transition: width .3s; }
.tb-mini { font-size: 11px; font-weight: 700; font-variant-numeric: tabular-nums; color: var(--dim); min-width: 22px; }
.tb-mini.dim { color: var(--dim-2); }
.tb-row-label { font-size: 10px; color: var(--dim-2); text-transform: uppercase; letter-spacing: .04em; }
.tb-sent-bar { display: inline-flex; width: 80px; height: 5px; border-radius: 4px; overflow: hidden; border: 1px solid var(--line); flex: none; }
.tb-sent-bar i { display: block; height: 100%; }
.tb-sent-bar.empty { background: var(--bg-2); }
.tb-sent-up { background: var(--up); }
.tb-sent-neu { background: var(--dim-3, #555); }
.tb-sent-dn { background: var(--down); }
.tb-row-meta { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.tb-socials { display: inline-flex; gap: 4px; }
.tb-soc { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; font-size: 12px; border-radius: 6px; background: var(--card-2); border: 1px solid var(--line); text-decoration: none; transition: border-color .12s, background .12s; }
.tb-soc:hover { border-color: var(--accent-2); background: var(--card); }
.tb-trades { font-size: 11px; color: var(--dim-2); font-variant-numeric: tabular-nums; }
.lb-row[data-tick] .tb-mid { cursor: pointer; }

@media (max-width: 720px) {
  .tb-mid { grid-column: 1 / -1; order: 5; }
  .tb-bar { width: 60px; }
  .tb-sent-bar { width: 60px; }
}
@media (max-width: 460px) {
  .tb-row-label { display: none; }
}

/* ── M19: Alerts — bell + slide-in panel ──────────────────────────────────── */
.bell-btn { position: relative; margin-left: 6px; width: 30px; height: 30px; display: inline-flex; align-items: center; justify-content: center; background: var(--card-2); border: 1px solid var(--line); border-radius: 9px; color: var(--dim); font-size: 15px; cursor: pointer; line-height: 1; padding: 0; transition: border-color .12s, color .12s; }
.bell-btn:hover { color: var(--text); border-color: var(--accent-2); }
.bell-btn.has-unread { border-color: var(--accent-2); }
.bell-ico { filter: grayscale(.2); }
.bell-badge { position: absolute; top: -6px; right: -6px; min-width: 16px; height: 16px; padding: 0 4px; display: inline-flex; align-items: center; justify-content: center; font-size: 10px; font-weight: 800; line-height: 1; border-radius: 8px; background: var(--down); color: #fff; border: 1px solid var(--bg); }
.bell-badge.hide { display: none; }

.al-overlay { position: fixed; inset: 0; background: rgba(4,10,11,.62); backdrop-filter: blur(2px); z-index: 40; opacity: 0; animation: fade .16s ease forwards; }
.al-panel { position: fixed; top: 0; right: 0; height: 100%; width: 420px; max-width: 94vw; z-index: 50; background: linear-gradient(180deg, var(--bg-2), var(--bg)); border-left: 1px solid var(--line); box-shadow: -18px 0 50px rgba(0,0,0,.4); overflow-y: auto; transform: translateX(100%); animation: slidein .22s cubic-bezier(.2,.8,.2,1) forwards; }
.al-inner { padding: 20px 22px 40px; }
.al-head { display: flex; align-items: center; gap: 12px; padding-bottom: 12px; border-bottom: 1px solid var(--line); }
.al-title { display: flex; align-items: center; gap: 9px; font-size: 20px; font-weight: 800; letter-spacing: .3px; }
.al-head .dw-close { margin-left: auto; }
.al-lead { color: var(--dim); font-size: 12.5px; line-height: 1.5; margin: 14px 0 16px; }

.al-master { display: flex; align-items: center; gap: 12px; background: var(--card); border: 1px solid var(--line); border-radius: 12px; padding: 13px 14px; transition: border-color .14s; }
.al-master.on { border-color: var(--accent-2); background: linear-gradient(180deg, rgba(73,234,203,.06), var(--card)); }
.al-opt-txt { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.al-opt-k { font-weight: 700; font-size: 14px; }
.al-master .al-opt-k { font-size: 15px; }
.al-opt-s { color: var(--dim-2); font-size: 11.5px; }

.al-tog { flex: none; width: 40px; height: 23px; border-radius: 20px; border: 1px solid var(--line); background: var(--bg-2); position: relative; cursor: pointer; padding: 0; transition: background .14s, border-color .14s; }
.al-tog.lg { width: 46px; height: 26px; }
.al-knob { position: absolute; top: 2px; left: 2px; width: 17px; height: 17px; border-radius: 50%; background: var(--dim); transition: transform .16s, background .16s; }
.al-tog.lg .al-knob { width: 20px; height: 20px; }
.al-tog[aria-checked="true"] { background: rgba(73,234,203,.22); border-color: var(--accent-2); }
.al-tog[aria-checked="true"] .al-knob { background: var(--accent); transform: translateX(17px); }
.al-tog.lg[aria-checked="true"] .al-knob { transform: translateX(20px); }

.al-body { margin-top: 14px; transition: opacity .16s; }
.al-body.dim { opacity: .5; pointer-events: none; }
.al-notify { width: 100%; display: block; text-align: center; background: var(--card-2); border: 1px solid var(--accent-2); color: var(--accent); font-family: inherit; font-weight: 700; font-size: 13px; padding: 11px; border-radius: 11px; cursor: pointer; margin-bottom: 14px; transition: background .12s; }
.al-notify:hover { background: rgba(73,234,203,.1); }
.al-notify.on { color: var(--dim); border-color: var(--line); background: var(--card); }
.al-note { font-size: 12px; color: var(--dim-2); background: var(--card); border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; margin-bottom: 14px; line-height: 1.45; }
.al-note.warn { color: #ffc98a; border-color: #4a3a1e; }

.al-scope { display: flex; align-items: center; gap: 10px; margin-bottom: 6px; }
.al-scope-k { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .5px; color: var(--dim-2); }
.al-scope-btns { margin-left: auto; display: inline-flex; gap: 6px; }
.al-scope-b { background: var(--card); border: 1px solid var(--line); color: var(--dim); font-family: inherit; font-size: 12px; font-weight: 600; padding: 6px 11px; border-radius: 8px; cursor: pointer; }
.al-scope-b.on { color: var(--accent); border-color: var(--accent-2); background: rgba(73,234,203,.08); }
.al-scope-note { font-size: 11.5px; color: var(--dim-2); line-height: 1.45; margin-bottom: 14px; }

.al-opt { display: flex; align-items: center; gap: 12px; padding: 11px 0; border-top: 1px solid var(--line); }
.al-opt .al-opt-txt { flex: 1; }
.al-step { flex: none; display: inline-flex; align-items: center; gap: 2px; background: var(--card); border: 1px solid var(--line); border-radius: 9px; padding: 2px; }
.al-mm { width: 26px; height: 26px; border: none; background: transparent; color: var(--dim); font-size: 17px; font-weight: 700; cursor: pointer; border-radius: 7px; line-height: 1; }
.al-mm:hover { color: var(--accent); background: var(--card-2); }
.al-num { min-width: 52px; text-align: center; font-size: 13px; font-weight: 700; font-variant-numeric: tabular-nums; }

.al-feed-head { display: flex; align-items: center; margin: 20px 0 8px; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .5px; color: var(--dim-2); }
.al-clear { margin-left: auto; background: none; border: none; color: var(--dim); font-family: inherit; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .5px; cursor: pointer; }
.al-clear:hover { color: var(--down); }
.al-feed { display: flex; flex-direction: column; gap: 7px; }
.al-empty { color: var(--dim-2); font-size: 12.5px; line-height: 1.5; background: var(--card); border: 1px dashed var(--line); border-radius: 11px; padding: 16px; text-align: center; }
.al-item { display: flex; align-items: center; gap: 10px; width: 100%; text-align: left; background: var(--card); border: 1px solid var(--line); border-radius: 11px; padding: 10px 11px; cursor: pointer; font-family: inherit; transition: border-color .12s; }
.al-item:hover { border-color: var(--accent-2); }
.al-item.fresh { border-left: 2px solid var(--accent); }
.al-i { flex: none; font-size: 15px; width: 20px; text-align: center; }
.al-chip { flex: none; }
.al-chip .al-logo, .al-chip .tok-ph { width: 22px; height: 22px; border-radius: 50%; object-fit: cover; }
.al-chip .tok-ph { display: inline-flex; align-items: center; justify-content: center; font-size: 9px; font-weight: 700; color: var(--accent-2); background: var(--bg-2); border: 1px solid var(--line); }
.al-item-txt { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.al-msg { font-size: 12.5px; font-weight: 600; color: var(--text); line-height: 1.35; }
.al-when { font-size: 11px; color: var(--dim-2); }

/* M3: Price targets UI */
.al-targets { margin-top: 18px; }
.al-targets-head { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .5px; color: var(--dim-2); margin-bottom: 8px; }
.al-target-add { display: flex; gap: 6px; margin-bottom: 10px; flex-wrap: wrap; }
.al-ti { flex: 1; min-width: 80px; background: var(--card); border: 1px solid var(--line); border-radius: 9px; padding: 8px 10px; color: var(--text); font-family: inherit; font-size: 13px; font-weight: 600; }
.al-ti:focus { outline: none; border-color: var(--accent-2); }
.al-ts { background: var(--card); border: 1px solid var(--line); border-radius: 9px; padding: 8px 8px; color: var(--dim); font-family: inherit; font-size: 12px; cursor: pointer; }
.al-tn { width: 72px; background: var(--card); border: 1px solid var(--line); border-radius: 9px; padding: 8px 10px; color: var(--text); font-family: inherit; font-size: 13px; font-weight: 600; text-align: right; }
.al-tn:focus { outline: none; border-color: var(--accent-2); }
.al-tb { background: var(--accent-2); border: 1px solid var(--accent-2); color: var(--bg); font-family: inherit; font-weight: 700; font-size: 12px; padding: 0 14px; border-radius: 9px; cursor: pointer; transition: opacity .12s; }
.al-tb:hover { opacity: .85; }
.al-target-list { display: flex; flex-direction: column; gap: 5px; }
.al-target-row { display: flex; align-items: center; gap: 8px; background: var(--card); border: 1px solid var(--line); border-radius: 9px; padding: 7px 10px; }
.al-target-tick { font-weight: 700; font-size: 13px; min-width: 50px; }
.al-target-op { font-size: 10.5px; font-weight: 600; text-transform: uppercase; letter-spacing: .3px; padding: 2px 6px; border-radius: 5px; }
.al-target-op.above { color: var(--accent); background: rgba(73,234,203,.1); }
.al-target-op.below { color: var(--down); background: rgba(255,85,85,.1); }
.al-target-val { font-size: 13px; font-weight: 700; font-variant-numeric: tabular-nums; flex: 1; }
.al-target-del { width: 22px; height: 22px; border: none; background: transparent; color: var(--dim-2); font-size: 13px; cursor: pointer; border-radius: 5px; line-height: 1; }
.al-target-del:hover { color: var(--down); background: var(--card-2); }
.al-target-empty { color: var(--dim-2); font-size: 12px; line-height: 1.5; background: var(--card); border: 1px dashed var(--line); border-radius: 10px; padding: 12px; text-align: center; }

@media (max-width: 480px) { .al-inner { padding: 18px 16px 36px; } }

/* ── M21: Kaspa Pulse — state-of-the-wave band ── */
.pulse-band { margin-top: 26px; padding: 18px 20px 20px; border: 1px solid var(--line); border-radius: 16px; background: linear-gradient(180deg, var(--card-2), var(--card)); }
.pulse-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.pulse-title { font-size: 15px; font-weight: 700; letter-spacing: .2px; margin: 0; display: flex; align-items: center; gap: 9px; }
.pulse-title::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 3px rgba(73,234,203,.18); animation: pulse 2.4s ease-in-out infinite; }
.pulse-share { align-self: center; }
.pz-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(158px, 1fr)); gap: 10px; }
.pz { background: var(--bg-2); border: 1px solid var(--line); border-radius: 12px; padding: 13px 14px; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.pz-k { color: var(--dim-2); font-size: 11.5px; font-weight: 600; text-transform: uppercase; letter-spacing: .4px; }
.pz-v { font-size: clamp(18px, 2.4vw, 22px); font-weight: 700; font-variant-numeric: tabular-nums; margin-top: 3px; }
.pz-sub { color: var(--dim-2); font-size: 11.5px; }
.pz-card { cursor: pointer; transition: border-color .12s, background .12s; }
.pz-card:hover, .pz-card:focus-visible { border-color: var(--accent-2); background: var(--card-2); outline: none; }
.pz-card:focus-visible { box-shadow: 0 0 0 3px rgba(73,234,203,.14); }
.pz-card-chip { display: flex; align-items: center; gap: 7px; margin: 5px 0 1px; font-size: 14px; font-weight: 700; min-width: 0; }
.pz-card-chip b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pz-logo { width: 20px; height: 20px; border-radius: 50%; flex: none; background: var(--bg); object-fit: cover; border: 1px solid var(--line); }
.pz-card-chip .tok-ph { width: 20px; height: 20px; border-radius: 50%; flex: none; display: flex; align-items: center; justify-content: center; font-size: 9px; font-weight: 700; color: var(--accent-2); background: var(--bg); border: 1px solid var(--line); }
.pz-card-v { font-size: 17px; font-weight: 700; font-variant-numeric: tabular-nums; }
@media (max-width: 560px) { .pz-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 380px) { .pz-grid { grid-template-columns: 1fr; } }

/* ── M8: Market Heatmap — visual treemap of KRC-20 tokens ─────────────────── */
.heatmap-wrap { display: flex; flex-wrap: wrap; gap: 3px; min-height: 280px; }
.hm-tile {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  border-radius: 6px;
  padding: 8px 10px;
  min-width: 0;
  overflow: hidden;
  cursor: pointer;
  text-decoration: none;
  transition: transform .12s ease, filter .12s ease, box-shadow .12s ease;
  border: 1px solid rgba(255,255,255,.04);
}
.hm-tile:hover { transform: scale(1.03); z-index: 2; filter: brightness(1.12); box-shadow: 0 4px 18px rgba(0,0,0,.4); }
.hm-tile:active { transform: scale(.99); }
.hm-tick { font-weight: 700; font-size: 13px; letter-spacing: .3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: #fff; text-shadow: 0 1px 3px rgba(0,0,0,.5); }
.hm-chg { font-weight: 700; font-size: 11px; font-variant-numeric: tabular-nums; color: #fff; text-shadow: 0 1px 2px rgba(0,0,0,.5); }
.hm-tile.hm-sm .hm-tick { font-size: 10px; }
.hm-tile.hm-sm .hm-chg { font-size: 9px; }
.hm-tile.hm-sm { padding: 4px 6px; }
/* legend */
.heatmap-legend { display: flex; align-items: center; gap: 6px; font-size: 10px; font-weight: 600; color: var(--dim); font-variant-numeric: tabular-nums; }
.hm-leg-bar { display: inline-block; width: 60px; height: 10px; border-radius: 3px; overflow: hidden; }
.hm-leg-grad { display: block; width: 100%; height: 100%; background: linear-gradient(90deg, #ff6b6b, #2a3a3e, #3fd684); }
/* responsive sizing */
@media (max-width: 760px) {
  .heatmap-wrap { min-height: 200px; }
  .hm-tile { padding: 6px 7px; }
  .hm-tick { font-size: 11px; }
  .hm-chg { font-size: 10px; }
}
@media (max-width: 480px) {
  .hm-tile.hm-xs { flex: 1 1 calc(25% - 3px) !important; padding: 3px 4px; }
  .hm-tile.hm-xs .hm-tick { font-size: 9px; }
  .hm-tile.hm-xs .hm-chg { font-size: 8px; }
}

/* ── M31: Token Scatter Plot Explorer ── */
.scatter-controls { display: flex; align-items: center; gap: 8px; }
.scatter-axis-pick { display: flex; align-items: center; gap: 4px; font-size: 11px; font-weight: 600; color: var(--dim); }
.scatter-axis-label { font-size: 10px; text-transform: uppercase; letter-spacing: .04em; }
.scatter-axis-pick select {
  background: var(--card-2); color: var(--text); border: 1px solid var(--line); border-radius: 6px;
  padding: 4px 8px; font-size: 12px; font-weight: 600; cursor: pointer; outline: none; transition: border-color .15s;
}
.scatter-axis-pick select:hover { border-color: var(--accent-2); }
.scatter-axis-pick select:focus { border-color: var(--accent); }
.scatter-scale-btn {
  background: var(--card-2); color: var(--dim); border: 1px solid var(--line); border-radius: 6px;
  padding: 4px 10px; font-size: 11px; font-weight: 600; cursor: pointer; transition: all .15s; user-select: none;
}
.scatter-scale-btn:hover { color: var(--text); border-color: var(--accent-2); }
.scatter-scale-btn.is-on { color: var(--accent); border-color: var(--accent-2); background: var(--card-2); }
.scatter-card { position: relative; overflow: hidden; }
.scatter-wrap { width: 100%; min-height: 440px; display: flex; align-items: center; justify-content: center; }
.scatter-svg { width: 100%; height: auto; display: block; cursor: crosshair; }
.scatter-grid line { stroke: rgba(255,255,255,.04); stroke-width: 1; }
.scatter-axis line { stroke: rgba(255,255,255,.12); stroke-width: 1; }
.scatter-axis text { fill: var(--dim); font-size: 10px; font-family: inherit; font-variant-numeric: tabular-nums; }
.scatter-axis-label-text { fill: var(--text); font-size: 11px; font-weight: 600; font-family: inherit; }
.scatter-bubble { cursor: pointer; transition: opacity .15s; }
.scatter-bubble:hover { filter: brightness(1.3); }
.scatter-bubble.dim { opacity: .2; }
.scatter-tooltip {
  position: absolute; pointer-events: none; z-index: 10; background: rgba(18,24,33,.96); border: 1px solid var(--line);
  border-radius: 8px; padding: 8px 12px; font-size: 12px; max-width: 220px; box-shadow: 0 8px 24px rgba(0,0,0,.5);
  backdrop-filter: blur(8px);
}
.scatter-tooltip .stt-tick { font-weight: 700; font-size: 13px; color: var(--text); }
.scatter-tooltip .stt-row { display: flex; justify-content: space-between; gap: 12px; color: var(--dim); font-size: 11px; margin-top: 2px; }
.scatter-tooltip .stt-row b { color: var(--text); font-weight: 600; }
@media (max-width: 760px) {
  .scatter-controls { flex-wrap: wrap; gap: 4px; }
  .scatter-wrap { min-height: 340px; }
  .scatter-axis-pick select { font-size: 11px; padding: 3px 6px; }
}

/* ── M22: Kaspa Network Health — L1/protocol state of the chain ────────────── */
.net-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(158px, 1fr)); gap: 10px; }
.net-halving { grid-column: span 2; background: linear-gradient(180deg, var(--card-2), var(--card)); border: 1px solid var(--line); border-radius: 12px; padding: 14px 16px 15px; display: flex; flex-direction: column; gap: 9px; min-width: 0; }
.nh-head { display: flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 700; letter-spacing: .3px; color: var(--dim); text-transform: uppercase; }
.nh-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 3px rgba(73,234,203,.18); animation: pulse 2.4s ease-in-out infinite; }
.nh-clock { display: flex; align-items: flex-end; gap: 8px; }
.nh-unit { display: flex; flex-direction: column; align-items: center; gap: 1px; min-width: 40px; }
.nh-n { font-size: 27px; font-weight: 800; line-height: 1; font-variant-numeric: tabular-nums; color: var(--accent); }
.nh-l { font-size: 10px; font-weight: 600; letter-spacing: .5px; color: var(--dim-2); text-transform: uppercase; }
.nh-sep { font-size: 22px; font-weight: 700; color: var(--line); line-height: 1; padding-bottom: 11px; }
.nh-sub { font-size: 12px; color: var(--dim); }
.nh-sub b { color: var(--text); font-variant-numeric: tabular-nums; }
.net-card { background: var(--bg-2); border: 1px solid var(--line); border-radius: 12px; padding: 13px 14px; display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.net-card-wide { grid-column: span 2; }
.nc-k { font-size: 11px; font-weight: 600; letter-spacing: .3px; color: var(--dim); text-transform: uppercase; }
.nc-v { font-size: 19px; font-weight: 700; font-variant-numeric: tabular-nums; color: var(--text); }
.nc-sub { font-size: 11px; color: var(--dim-2); font-variant-numeric: tabular-nums; }
.nc-bar { width: 100%; height: 6px; background: var(--bg); border: 1px solid var(--line); border-radius: 4px; overflow: hidden; margin: 3px 0 1px; }
.nc-bar > span { display: block; height: 100%; background: linear-gradient(90deg, var(--accent-2), var(--accent)); border-radius: 4px; transition: width .5s ease; }
@media (max-width: 560px) {
  .net-grid { grid-template-columns: repeat(2, 1fr); }
  .nh-unit { min-width: 0; }
  .nh-n { font-size: 22px; }
}
@media (max-width: 380px) {
  .net-halving, .net-card-wide { grid-column: span 2; }
  .nh-sep { display: none; }
  .nh-clock { gap: 12px; }
}
@media (prefers-reduced-motion: reduce) { .nh-dot { animation: none; } }

/* ── M110: Mobile bottom tab bar — thumb-friendly section navigation ────────── */
.mobile-tabs {
  display: none;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 35;
  background: rgba(11,20,22,.92);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-top: 1px solid var(--line);
  padding: 0;
  padding-bottom: env(safe-area-inset-bottom, 0);
  justify-content: space-around;
  align-items: stretch;
  transition: transform .2s cubic-bezier(.2,.8,.2,1);
}
.mtab {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  padding: 7px 2px 6px;
  text-decoration: none;
  color: var(--dim-2);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .2px;
  position: relative;
  -webkit-tap-highlight-color: transparent;
  transition: color .15s;
}
.mtab-ico { font-size: 18px; line-height: 1; }
.mtab:hover { color: var(--dim); }
.mtab.is-active { color: var(--accent); }
.mtab.is-active::before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 22px;
  height: 2px;
  border-radius: 0 0 3px 3px;
  background: var(--accent);
}
/* Show only on mobile */
@media (max-width: 768px) {
  .mobile-tabs { display: flex; }
  body { padding-bottom: 52px; }
  body.drawer-open .mobile-tabs { transform: translateY(100%); }
}
@media (max-width: 380px) {
  .mtab-l { font-size: 9px; }
  .mtab { padding: 6px 1px 5px; }
}
@media (prefers-reduced-motion: reduce) {
  .mobile-tabs { transition: none; }
}

/* ── M1: Price sparkline in hero stats ──────────────────────────── */
.stat-price { position: relative; overflow: hidden; }
.stat-spark { display: block; height: 24px; margin-top: 2px; }
.stat-spark svg { width: 100%; height: 100%; display: block; }
.stat-spark .spark-line { fill: none; stroke: var(--accent); stroke-width: 1.5; }
.stat-spark .spark-up { stroke: var(--up); }
.stat-spark .spark-down { stroke: var(--down); }
.stat-spark .spark-fill { opacity: .08; }

/* ── M1: Price chart section ───────────────────────────────────── */
.chart-tabs { display: flex; gap: 4px; }
.chart-tab {
  background: var(--card); border: 1px solid var(--line); color: var(--dim);
  font: inherit; font-size: 13px; font-weight: 600; padding: 5px 14px;
  border-radius: 8px; cursor: pointer; transition: all .12s;
}
.chart-tab:hover { color: var(--text); border-color: var(--accent-2); }
.chart-tab.is-on { color: var(--accent); border-color: var(--accent-2); background: var(--card-2); }

.chart-wrap { display: grid; grid-template-columns: 1fr 200px; gap: 16px; align-items: stretch; }
@media (max-width: 720px) { .chart-wrap { grid-template-columns: 1fr; } }

.ta-bar { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-bottom: 10px; }
.ta-bar-label { font-size: 12px; color: var(--dim-2); margin-right: 2px; }
.ta-toggle {
  font-size: 11px; font-family: inherit; padding: 4px 10px; border-radius: 6px;
  border: 1px solid var(--line); background: var(--card); color: var(--dim);
  cursor: pointer; transition: all .15s; letter-spacing: .02em;
}
.ta-toggle:hover { color: var(--text); border-color: var(--accent-2); }
.ta-toggle.is-on { color: var(--accent); border-color: var(--accent); background: rgba(0,212,170,.08); font-weight: 600; }
.ta-toggle[data-ta="sma"].is-on { color: #f5a623; border-color: #f5a623; background: rgba(245,166,35,.08); }
.ta-toggle[data-ta="ema"].is-on { color: #e84393; border-color: #e84393; background: rgba(232,67,147,.08); }
.ta-toggle[data-ta="bb"].is-on { color: #74b9ff; border-color: #74b9ff; background: rgba(116,185,255,.08); }
.ta-toggle[data-ta="vol"].is-on { color: #55efc4; border-color: #55efc4; background: rgba(85,239,196,.08); }
.ta-toggle[data-ta="rsi"].is-on { color: #a29bfe; border-color: #a29bfe; background: rgba(162,155,254,.08); }

.chart-stack { display: flex; flex-direction: column; gap: 6px; }
.chart-sub-box {
  position: relative; background: var(--card); border: 1px solid var(--line);
  border-radius: 10px; padding: 10px 16px 4px; overflow: hidden;
}
.chart-sub-box .sub-label {
  position: absolute; top: 6px; left: 12px; font-size: 10px; color: var(--dim-2);
  text-transform: uppercase; letter-spacing: .05em; pointer-events: none;
}
.sub-chart { width: 100%; height: 60px; display: block; }
#rsi-box .sub-chart { height: 90px; }

/* Price chart overlay lines */
.price-chart .sma-line { fill: none; stroke: #f5a623; stroke-width: 1.5; stroke-linejoin: round; }
.price-chart .ema-line { fill: none; stroke: #e84393; stroke-width: 1.5; stroke-linejoin: round; }
.price-chart .bb-band { fill: rgba(116,185,255,.08); stroke: rgba(116,185,255,.3); stroke-width: .5; stroke-dasharray: 3 3; }
.price-chart .bb-upper { fill: none; stroke: rgba(116,185,255,.5); stroke-width: 1; stroke-dasharray: 3 3; }
.price-chart .bb-lower { fill: none; stroke: rgba(116,185,255,.5); stroke-width: 1; stroke-dasharray: 3 3; }
.price-chart .bb-mid { fill: none; stroke: rgba(116,185,255,.4); stroke-width: 1; stroke-dasharray: 2 4; }

/* Volume bars */
.sub-chart .vol-bar { fill: rgba(85,239,196,.35); }
.sub-chart .vol-bar-up { fill: rgba(0,212,170,.45); }
.sub-chart .vol-bar-down { fill: rgba(255,107,107,.4); }
.sub-chart .sub-grid { stroke: var(--line); stroke-width: .5; stroke-dasharray: 2 4; }
.sub-chart .sub-label-text { fill: var(--dim-2); font-size: 9px; font-family: inherit; }

/* RSI */
.sub-chart .rsi-line { fill: none; stroke: #a29bfe; stroke-width: 1.5; stroke-linejoin: round; }
.sub-chart .rsi-ob { fill: rgba(255,107,107,.06); }
.sub-chart .rsi-os { fill: rgba(0,212,170,.06); }
.sub-chart .rsi-line-70 { stroke: rgba(255,107,107,.4); stroke-width: .5; stroke-dasharray: 3 3; fill: none; }
.sub-chart .rsi-line-50 { stroke: var(--line); stroke-width: .5; stroke-dasharray: 2 4; fill: none; }
.sub-chart .rsi-line-30 { stroke: rgba(0,212,170,.4); stroke-width: .5; stroke-dasharray: 3 3; fill: none; }
.sub-chart .rsi-label { fill: var(--dim-2); font-size: 9px; font-family: inherit; }

.chart-box {
  background: var(--card); border: 1px solid var(--line); border-radius: 12px;
  padding: 16px; position: relative; min-height: 200px;
}
.price-chart { width: 100%; height: 200px; display: block; }
.price-chart .pc-area { fill: url(#pc-grad); }
.price-chart .pc-line { fill: none; stroke: var(--accent); stroke-width: 2; stroke-linejoin: round; }
.price-chart .pc-grid { stroke: var(--line); stroke-width: .5; stroke-dasharray: 2 4; }
.price-chart .pc-label { fill: var(--dim-2); font-size: 10px; font-family: inherit; }
.price-chart .pc-crosshair { stroke: var(--dim); stroke-width: 1; stroke-dasharray: 3 3; }

.chart-hover {
  position: absolute; pointer-events: none; background: var(--bg-2); border: 1px solid var(--line);
  border-radius: 8px; padding: 6px 10px; font-size: 12px; white-space: nowrap;
  transform: translate(-50%, -130%); z-index: 5; box-shadow: 0 4px 12px rgba(0,0,0,.3);
}
.chart-hover .ch-price { font-weight: 700; color: var(--text); }
.chart-hover .ch-time { color: var(--dim); font-size: 11px; }

.chart-summary {
  display: flex; flex-direction: column; gap: 12px; justify-content: center;
}
.chart-summary .stat { background: var(--card); border: 1px solid var(--line); border-radius: 10px; padding: 12px 14px; }

/* ── M1: Block confirmation tracking ───────────────────────────── */
.blocks-table {
  background: var(--card); border: 1px solid var(--line); border-radius: 12px;
  overflow: hidden; margin-top: 12px;
}
.blocks-thead {
  display: grid; grid-template-columns: 1fr 110px 110px 60px 70px;
  padding: 10px 16px; border-bottom: 1px solid var(--line);
  font-size: 11px; font-weight: 700; letter-spacing: .5px; text-transform: uppercase; color: var(--dim-2);
}
.blocks-tbody { display: flex; flex-direction: column; }
.bl-row {
  display: grid; grid-template-columns: 1fr 110px 110px 60px 70px;
  padding: 8px 16px; border-bottom: 1px solid rgba(30,54,60,.4);
  font-size: 13px; align-items: center; transition: background .1s;
}
.bl-row:hover { background: rgba(73,234,203,.04); }
.bl-row:last-child { border-bottom: none; }
.bl-hash { font-family: ui-monospace, "SF Mono", Menlo, monospace; font-size: 12px; color: var(--accent-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bl-daa, .bl-blue { font-variant-numeric: tabular-nums; color: var(--text); }
.bl-tx { font-variant-numeric: tabular-nums; color: var(--dim); }
.bl-age { font-variant-numeric: tabular-nums; color: var(--dim); text-align: right; }
.bl-row.bl-new { animation: blFlash 1.5s ease-out; }
@keyframes blFlash {
  0% { background: rgba(73,234,203,.12); }
  100% { background: transparent; }
}
@media (max-width: 640px) {
  .blocks-thead, .bl-row { grid-template-columns: 1fr 70px 50px; gap: 4px; padding: 8px 10px; }
  .blocks-thead .bl-blue, .bl-row .bl-blue,
  .blocks-thead .bl-tx, .bl-row .bl-tx { display: none; }
  .bl-hash { font-size: 11px; }
}

/* ── M2: Network Analytics — block histogram + 24h volume chart ─────────── */
.analytics-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-top: 16px;
}
@media (max-width: 768px) {
  .analytics-grid { grid-template-columns: 1fr; }
}
.analytics-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 20px;
}
.analytics-card-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 16px;
}
.analytics-card-head h3 {
  font-size: 15px;
  font-weight: 700;
  margin: 0;
  color: var(--text);
}
.analytics-note {
  font-size: 12px;
  color: var(--dim);
}
.analytics-extremes {
  display: flex;
  gap: 24px;
  margin-top: 12px;
  font-size: 12px;
  color: var(--dim);
}
.analytics-extremes b {
  color: var(--text);
  font-weight: 700;
}

/* histogram */
.hm-grid {
  display: flex;
  align-items: flex-end;
  gap: 6px;
  height: 140px;
  padding-top: 8px;
}
.hm-bar {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  height: 100%;
  position: relative;
  min-width: 0;
}
.hm-fill {
  width: 100%;
  max-width: 42px;
  background: linear-gradient(180deg, var(--accent), rgba(73, 234, 203, 0.4));
  border-radius: 4px 4px 0 0;
  min-height: 2px;
  transition: height 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}
.hm-count {
  font-size: 10px;
  color: var(--dim);
  margin-bottom: 2px;
  white-space: nowrap;
}
.hm-label {
  font-size: 9px;
  color: var(--dim);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
  margin-top: 4px;
}

/* 24h volume chart */
.vc-grid {
  display: flex;
  align-items: flex-end;
  gap: 2px;
  height: 140px;
  padding-top: 8px;
}
.vc-bar {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  height: 100%;
  position: relative;
  min-width: 0;
}
.vc-fill {
  width: 100%;
  background: linear-gradient(180deg, var(--accent), rgba(73, 234, 203, 0.3));
  border-radius: 3px 3px 0 0;
  min-height: 1px;
  transition: height 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}
.vc-fill.empty { background: var(--border); }
.vc-label {
  font-size: 9px;
  color: var(--dim);
  margin-top: 4px;
}
.vc-foot {
  display: flex;
  justify-content: space-between;
  font-size: 10px;
  color: var(--dim);
  margin-top: 6px;
}

/* ── M7: KRC-20 price sparklines + drawer chart ─────────────────────────── */
/* Sparkline in token table rows */
.c-spark {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  font-variant-numeric: tabular-nums;
}
.c-spark .c-spark-val { white-space: nowrap; }
.c-spark .spk {
  flex: 0 0 auto;
  opacity: 0.7;
  transition: opacity 0.2s;
}
.c-spark:hover .spk {
  opacity: 1;
}
.spk.spk-up { stroke: var(--up); }
.spk.spk-dn { stroke: var(--dn); }

/* Drawer price chart */
.dw-chart-wrap {
  position: relative;
  margin: 8px 0 4px;
}
.dw-chart {
  width: 100%;
  height: 80px;
  display: block;
}
.dw-chart .mc-line { stroke-width: 1.5; }
.dw-chart-wrap .mc-change {
  position: absolute;
  top: 2px;
  right: 4px;
  font-size: 11px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.dw-chart-wrap .mc-tooltip {
  position: absolute;
  bottom: 4px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--panel2, #13262a);
  border: 1px solid var(--border, #1d3439);
  border-radius: 6px;
  padding: 4px 8px;
  font-size: 11px;
  pointer-events: none;
  white-space: nowrap;
  z-index: 10;
  text-align: center;
}
.dw-chart-wrap .mc-tooltip small {
  color: var(--dim);
}
.dw-chart-wrap .mc-dot {
  cursor: crosshair;
}
.dw-spark-empty {
  color: var(--dim);
  font-size: 12px;
  padding: 8px 0;
  text-align: center;
}

@media (max-width: 480px) {
  .c-spark .spk { display: none; }
}

/* M11: Network metrics history charts */
.net-hist { margin-top: 20px; padding-top: 20px; border-top: 1px solid var(--line); }
.net-hist-head { display: flex; align-items: center; gap: 12px; margin-bottom: 8px; flex-wrap: wrap; }
.net-hist-head h3 { font-size: 15px; font-weight: 700; margin: 0; }
.net-hist-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 12px; }
@media (max-width: 768px) { .net-hist-grid { grid-template-columns: 1fr; } }
.nh-card { background: var(--card); border: 1px solid var(--line); border-radius: 12px; padding: 14px; }
.nh-card-head { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; flex-wrap: wrap; }
.nh-card-title { font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .5px; color: var(--dim-2); }
.nh-card-val { font-size: 15px; font-weight: 700; font-variant-numeric: tabular-nums; margin-left: auto; }
.nh-chg { font-size: 12px; font-weight: 600; font-variant-numeric: tabular-nums; padding: 2px 6px; border-radius: 4px; }
.nh-chg.chg-up { color: var(--up); background: rgba(46, 204, 113, 0.1); }
.nh-chg.chg-down { color: var(--down); background: rgba(231, 76, 60, 0.1); }
.nh-chart-wrap { position: relative; min-height: 80px; }
.nh-chart { width: 100%; height: 80px; display: block; }
.nh-chart .nh-area { opacity: 0.08; }
.nh-chart .nh-line { fill: none; stroke-width: 1.5; stroke-linejoin: round; stroke-linecap: round; }
.nh-chart .nh-grid { stroke: var(--line); stroke-width: .5; stroke-dasharray: 2 4; }
.nh-chart .nh-dot { cursor: pointer; transition: opacity .15s; }
.nh-empty { grid-column: 1 / -1; padding: 32px 16px; text-align: center; color: var(--dim-2); font-size: 13px; background: var(--card); border: 1px solid var(--line); border-radius: 12px; }
.nh-tooltip { position: absolute; top: 0; left: 50%; transform: translateX(-50%); background: var(--bg-2); border: 1px solid var(--line); border-radius: 6px; padding: 4px 8px; font-size: 11px; pointer-events: none; white-space: nowrap; z-index: 10; box-shadow: 0 2px 8px rgba(0,0,0,.3); }
.nh-tooltip b { font-weight: 700; color: var(--text); font-variant-numeric: tabular-nums; }
.nh-tooltip small { display: block; color: var(--dim-2); font-size: 10px; margin-top: 1px; }

/* ── M13: Launch wave velocity ─────────────────────────────────────────────── */
.wv-chart { min-height: 200px; padding: 16px 8px 8px; position: relative; }
.wv-bars { display: flex; align-items: flex-end; gap: 2px; height: 180px; position: relative; }
.wv-bar-col { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; height: 100%; min-width: 0; position: relative; cursor: pointer; }
.wv-bar { width: 100%; max-width: 28px; border-radius: 3px 3px 0 0; min-height: 2px; transition: filter .15s, opacity .15s; opacity: .85; }
.wv-bar-col:hover .wv-bar { filter: brightness(1.25); opacity: 1; }
.wv-bar.peak { box-shadow: 0 0 6px rgba(73, 234, 203, .5); }
.wv-bar.recent { background: var(--teal, #49eacb); }
.wv-bar.other { background: var(--teal-dim, #1a4a45); border: 1px solid rgba(73, 234, 203, .3); }
.wv-line-svg { position: absolute; top: 16px; left: 8px; right: 8px; height: 180px; pointer-events: none; }
.wv-line-svg path { fill: none; stroke: rgba(218, 165, 32, .7); stroke-width: 1.5; stroke-dasharray: 3 2; }
.wv-line-svg circle { fill: rgba(218, 165, 32, .9); r: 2; }
.wv-labels { display: flex; justify-content: space-between; padding: 6px 4px 0; font-size: 10px; color: var(--dim-2, #7fa39c); font-variant-numeric: tabular-nums; overflow: hidden; }
.wv-labels span { white-space: nowrap; }
.wv-tooltip { position: absolute; bottom: calc(100% + 4px); left: 50%; transform: translateX(-50%); background: var(--bg-2, #0f1c1f); border: 1px solid var(--line, #1d3439); border-radius: 6px; padding: 6px 10px; font-size: 11px; pointer-events: none; white-space: nowrap; z-index: 10; box-shadow: 0 2px 8px rgba(0,0,0,.4); opacity: 0; transition: opacity .12s; }
.wv-bar-col:hover .wv-tooltip { opacity: 1; }
.wv-tooltip b { font-weight: 700; color: var(--text, #dcefec); font-variant-numeric: tabular-nums; }
.wv-tooltip small { display: block; color: var(--dim-2, #7fa39c); font-size: 10px; margin-top: 2px; }
.wv-outcomes { padding: 16px; display: flex; gap: 12px; flex-wrap: wrap; }
.wv-oc { flex: 1; min-width: 120px; background: var(--card, #0f1c1f); border: 1px solid var(--line, #1d3439); border-radius: 10px; padding: 12px; text-align: center; }
.wv-oc .lbl { font-size: 11px; color: var(--dim-2, #7fa39c); text-transform: uppercase; letter-spacing: .4px; }
.wv-oc .val { font-size: 22px; font-weight: 700; font-variant-numeric: tabular-nums; margin: 4px 0; }
.wv-oc .pct { font-size: 11px; color: var(--dim-2, #7fa39c); }
.wv-oc.done .val { color: var(--teal, #49eacb); }
.wv-oc.minting .val { color: var(--amber, #f5c451); }
.wv-oc.stalled .val { color: var(--orange, #f59e42); }
.wv-oc.nomint .val { color: var(--dim-2, #7fa39c); }
@media (max-width: 600px) {
  .wv-bars { height: 140px; }
  .wv-line-svg { height: 140px; }
  .wv-outcomes { flex-direction: column; }
}

/* M14: KRC-20 Economy Trend Charts */
.eco-chart { position: relative; min-height: 140px; padding: 8px 0; }
.eco-chart svg { display: block; width: 100%; height: 140px; }
.eco-chart .eco-area { fill: url(#eco-grad-mcap); opacity: .35; }
.eco-chart .eco-area-vol { fill: url(#eco-grad-vol); opacity: .35; }
.eco-chart .eco-area-mints { fill: url(#eco-grad-mints); opacity: .3; }
.eco-chart .eco-area-gainers { fill: url(#eco-grad-gainers); opacity: .3; }
.eco-chart .eco-line { fill: none; stroke-width: 1.8; }
.eco-chart .eco-line-mcap { stroke: var(--teal, #49eacb); }
.eco-chart .eco-line-vol { stroke: var(--amber, #f5c451); }
.eco-chart .eco-line-mints { stroke: #6cc4ff; }
.eco-chart .eco-line-gainers { stroke: var(--green, #49eacb); }
.eco-chart .eco-grid line { stroke: var(--line, #1d3439); stroke-width: .5; opacity: .5; }
.eco-chart .eco-grid text { fill: var(--dim-2, #7fa39c); font-size: 9px; }
.eco-chart .eco-dot { fill: var(--teal, #49eacb); stroke: var(--bg, #0b1416); stroke-width: 1.5; cursor: pointer; }
.eco-chart .eco-dot-vol { fill: var(--amber, #f5c451); }
.eco-chart .eco-dot-mints { fill: #6cc4ff; }
.eco-chart .eco-dot-gainers { fill: var(--green, #49eacb); }
.eco-chart .eco-tip { position: absolute; background: var(--bg-2, #0f1c1f); border: 1px solid var(--line, #1d3439); border-radius: 6px; padding: 6px 10px; font-size: 11px; pointer-events: none; white-space: nowrap; z-index: 10; box-shadow: 0 2px 8px rgba(0,0,0,.4); opacity: 0; transition: opacity .12s; transform: translateX(-50%); }
.eco-chart .eco-tip.show { opacity: 1; }
.eco-chart .eco-tip b { font-weight: 700; font-variant-numeric: tabular-nums; }
.eco-chart .eco-tip small { display: block; color: var(--dim-2, #7fa39c); font-size: 10px; margin-top: 2px; }
@media (max-width: 600px) {
  .eco-chart svg { height: 100px; }
}

/* M15: KRC-20 Composite Index (KKI) */
.kki-hero { display: flex; align-items: center; gap: 32px; padding: 20px 24px; background: var(--card); border: 1px solid var(--line); border-radius: 14px; margin-bottom: 18px; }
.kki-value-block { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.kki-label { color: var(--dim-2); font-size: 12px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; }
.kki-value { font-size: 42px; font-weight: 800; font-variant-numeric: tabular-nums; line-height: 1.1; color: var(--text); letter-spacing: -0.5px; }
.kki-change { font-size: 16px; font-weight: 700; font-variant-numeric: tabular-nums; }
.kki-change.up { color: var(--green, #49eacb); }
.kki-change.down { color: var(--red, #ff6b6b); }
.kki-stats { display: flex; gap: 28px; flex: 1; flex-wrap: wrap; }
.kki-stats .stat { min-width: 0; }
.kki-chart-card { margin-bottom: 18px; }
.kki-chart-card .eco-chart svg { height: 180px; }
.kki-movers { padding: 4px 0; }
.kki-mover { display: grid; grid-template-columns: 24px minmax(0,1fr) auto auto; align-items: center; gap: 12px; padding: 9px 16px; border-bottom: 1px solid var(--line); transition: background .12s; cursor: pointer; }
.kki-mover:last-child { border-bottom: none; }
.kki-mover:hover { background: var(--bg-2); }
.kki-mover .km-rank { color: var(--dim-2); font-size: 12px; font-weight: 700; text-align: center; }
.kki-mover .km-tick { font-weight: 700; font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kki-mover .km-weight { color: var(--dim-2); font-size: 11px; font-variant-numeric: tabular-nums; }
.kki-mover .km-contrib { font-size: 14px; font-weight: 700; font-variant-numeric: tabular-nums; }
.kki-mover .km-contrib.up { color: var(--green, #49eacb); }
.kki-mover .km-contrib.down { color: var(--red, #ff6b6b); }
.kki-mover .km-bar { width: 100%; height: 4px; border-radius: 2px; background: var(--line); overflow: hidden; grid-column: 2 / -1; margin-top: -2px; }
.kki-mover .km-bar-fill { height: 100%; border-radius: 2px; transition: width .3s; }
.kki-mover .km-bar-fill.up { background: linear-gradient(90deg, rgba(73,234,203,.3), rgba(73,234,203,.8)); }
.kki-mover .km-bar-fill.down { background: linear-gradient(90deg, rgba(255,107,107,.3), rgba(255,107,107,.8)); }
@media (max-width: 600px) {
  .kki-hero { flex-direction: column; align-items: flex-start; gap: 16px; padding: 16px; }
  .kki-value { font-size: 34px; }
  .kki-stats { gap: 16px; width: 100%; }
  .kki-stats .stat { flex: 1 1 calc(50% - 16px); min-width: 0; }
  .kki-chart-card .eco-chart svg { height: 120px; }
  .kki-mover { grid-template-columns: 20px minmax(0,1fr) auto; gap: 8px; padding: 8px 12px; }
  .kki-mover .km-weight { display: none; }
}

/* M22: Token Correlation Matrix */
.corr-layout { display: grid; grid-template-columns: 1fr 280px; gap: 14px; align-items: start; }
.corr-matrix-card { overflow: hidden; }
.corr-matrix-wrap { overflow-x: auto; padding: 4px; }
.corr-matrix { border-collapse: collapse; font-size: 10px; font-variant-numeric: tabular-nums; width: 100%; }
.corr-matrix th, .corr-matrix td { padding: 0; text-align: center; border: 1px solid rgba(255,255,255,.04); }
.corr-matrix th { color: var(--dim); font-weight: 600; padding: 3px 2px; position: sticky; top: 0; background: #121821; z-index: 1; font-size: 9px; writing-mode: vertical-rl; transform: rotate(180deg); height: 64px; max-width: 28px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.corr-matrix th.corr-rl { writing-mode: horizontal-tb; transform: none; height: auto; text-align: right; padding: 2px 6px 2px 4px; position: sticky; left: 0; z-index: 2; min-width: 52px; max-width: 72px; overflow: hidden; text-overflow: ellipsis; }
.corr-matrix th.corr-corner { position: sticky; top: 0; left: 0; z-index: 3; writing-mode: horizontal-tb; transform: none; height: auto; min-width: 52px; }
.corr-cell { width: 28px; height: 22px; cursor: pointer; transition: filter .12s, transform .12s; display: flex; align-items: center; justify-content: center; font-size: 8px; font-weight: 700; color: rgba(255,255,255,.6); }
.corr-cell:hover { filter: brightness(1.3); transform: scale(1.12); z-index: 1; box-shadow: 0 0 6px rgba(255,255,255,.15); }
.corr-cell.corr-d { color: var(--dim); font-size: 8px; }
.corr-cell.corr-self { background: rgba(255,255,255,.08) !important; color: var(--dim); cursor: default; }
.corr-info { font-size: 10px; font-weight: 600; color: var(--dim); }
.corr-sidebar { display: flex; flex-direction: column; gap: 8px; }
.corr-sidebar-h { font-size: 11px; font-weight: 700; color: var(--dim); text-transform: uppercase; letter-spacing: .04em; margin: 0; padding: 0 2px; }
.corr-mt { margin-top: 4px; }
.corr-pairs-list { display: flex; flex-direction: column; gap: 4px; }
.corr-pair { display: flex; align-items: center; justify-content: space-between; padding: 5px 8px; border-radius: 6px; background: rgba(255,255,255,.03); cursor: pointer; transition: background .12s; gap: 6px; }
.corr-pair:hover { background: rgba(255,255,255,.07); }
.corr-pair-ticks { font-size: 11px; font-weight: 600; color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.corr-pair-val { font-size: 10px; font-weight: 700; font-variant-numeric: tabular-nums; padding: 1px 5px; border-radius: 3px; flex-shrink: 0; }
.corr-legend { display: flex; align-items: center; gap: 6px; font-size: 9px; font-weight: 600; color: var(--dim); }
.corr-leg-bar { display: inline-block; width: 48px; height: 8px; border-radius: 3px; overflow: hidden; }
.corr-leg-grad { display: block; width: 100%; height: 100%; background: linear-gradient(90deg, #ff5a5a, #2a3a3e, #3fd684); }
.row-msg.small { font-size: 11px; padding: 8px; }
@media (max-width: 760px) {
  .corr-layout { grid-template-columns: 1fr; }
  .corr-sidebar { flex-direction: row; gap: 12px; }
  .corr-sidebar > div { flex: 1; }
  .corr-sidebar-h { white-space: nowrap; }
  .corr-matrix th { font-size: 8px; height: 50px; max-width: 22px; }
  .corr-cell { width: 22px; height: 18px; }
  .corr-matrix th.corr-rl { min-width: 40px; max-width: 56px; font-size: 8px; }
}
@media (max-width: 480px) {
  .corr-sidebar { flex-direction: column; }
  .corr-matrix th { height: 40px; max-width: 18px; }
  .corr-cell { width: 18px; height: 16px; }
}

/* M16: Alpha vs KAS — relative strength bar chart */
.alpha-bars {
  padding: 12px 8px;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.alpha-row {
  display: grid;
  grid-template-columns: 24px minmax(80px,120px) 1fr 60px;
  align-items: center;
  gap: 8px;
  padding: 4px 8px;
  border-radius: 6px;
  cursor: pointer;
  transition: background .12s;
}
.alpha-row:hover { background: rgba(255,255,255,.04); }
.alpha-rank {
  font-size: 11px;
  color: var(--sub, #7fa6a2);
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.alpha-name {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
}
.alpha-name .alpha-tick {
  font-size: 13px;
  font-weight: 600;
  color: var(--ink, #e7f6f2);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.alpha-name .alpha-img {
  width: 18px; height: 18px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
}
.alpha-bar-wrap {
  height: 22px;
  position: relative;
  display: flex;
  align-items: center;
}
/* Center line — the KAS baseline (alpha = 0) */
.alpha-bar-wrap::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 2px; bottom: 2px;
  width: 1px;
  background: var(--line, #1d3238);
}
.alpha-bar {
  height: 16px;
  border-radius: 3px;
  min-width: 3px;
  position: absolute;
  top: 3px;
}
.alpha-bar.up {
  background: linear-gradient(90deg, rgba(63,214,132,.2), rgba(63,214,132,.65));
  left: 50%;
}
.alpha-bar.down {
  background: linear-gradient(270deg, rgba(239,95,95,.2), rgba(239,95,95,.65));
  right: 50%;
}
.alpha-val {
  font-size: 12px;
  font-weight: 600;
  text-align: right;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.alpha-val.up { color: var(--up, #3fd684); }
.alpha-val.down { color: var(--down, #ef5f5f); }
.alpha-divider {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 8px 4px;
  font-size: 11px;
  color: var(--sub, #7fa6a2);
  text-transform: uppercase;
  letter-spacing: .5px;
}
.alpha-divider::after {
  content: "";
  flex: 1;
  height: 1px;
  background: var(--line, #1d3238);
}
@media (max-width: 600px) {
  .alpha-row { grid-template-columns: 18px minmax(60px,90px) 1fr 48px; gap: 6px; padding: 3px 6px; }
  .alpha-name .alpha-img { display: none; }
  .alpha-tick { font-size: 12px; }
}

/* M17: Market Breadth & Fear/Greed Gauge */
.breadth-grid {
  display: grid;
  grid-template-columns: 320px 1fr;
  gap: 16px;
  align-items: start;
}
.fg-gauge-card {
  background: var(--card, #0e1a1c);
  border: 1px solid var(--line, #1d3238);
  border-radius: 12px;
  padding: 20px;
  text-align: center;
}
.fg-gauge-wrap {
  position: relative;
  margin: 0 auto 8px;
  max-width: 200px;
}
.fg-gauge {
  width: 100%;
  height: auto;
  display: block;
}
.fg-readout {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  pointer-events: none;
}
.fg-score {
  font-size: 36px;
  font-weight: 700;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}
.fg-label {
  font-size: 13px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-top: 4px;
}
.fg-label.extreme-fear { color: #e53e3e; }
.fg-label.fear { color: #ed8936; }
.fg-label.neutral { color: #ecc94b; }
.fg-label.greed { color: #48bb78; }
.fg-label.extreme-greed { color: #22c55e; }
.fg-score.extreme-fear { color: #e53e3e; }
.fg-score.fear { color: #ed8936; }
.fg-score.neutral { color: #ecc94b; }
.fg-score.greed { color: #48bb78; }
.fg-score.extreme-greed { color: #22c55e; }
.fg-factors {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px 12px;
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid var(--line, #1d3238);
}
.fg-factor {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 12px;
}
.fg-fk { color: var(--sub, #7fa6a2); }
.fg-fv { font-weight: 600; font-variant-numeric: tabular-nums; }

.breadth-right {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.ad-strip {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}
.ad-stat {
  display: flex;
  align-items: center;
  gap: 6px;
}
.ad-arrow { font-size: 12px; }
.ad-val { font-weight: 700; font-size: 20px; font-variant-numeric: tabular-nums; }
.ad-lbl { font-size: 12px; color: var(--sub, #7fa6a2); }
.ad-up .ad-val, .ad-up .ad-arrow { color: var(--up, #3fd684); }
.ad-down .ad-val, .ad-down .ad-arrow { color: var(--down, #ef5f5f); }
.ad-flat .ad-val, .ad-flat .ad-arrow { color: var(--dim, #5a7a78); }

.ad-bar-wrap { padding: 0; }
.ad-bar {
  display: flex;
  height: 8px;
  border-radius: 4px;
  overflow: hidden;
  background: var(--bg, #0b1416);
}
.ad-bar-up { background: var(--up, #3fd684); transition: flex .3s; }
.ad-bar-flat { background: var(--dim, #5a7a78); transition: flex .3s; }
.ad-bar-down { background: var(--down, #ef5f5f); transition: flex .3s; }

.vol-direction {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.vd-k { font-size: 12px; color: var(--sub, #7fa6a2); }
.vd-bar-wrap {
  height: 8px;
  background: var(--bg, #0b1416);
  border-radius: 4px;
  overflow: hidden;
}
.vd-bar {
  display: flex;
  height: 100%;
}
.vd-up { background: var(--up, #3fd684); transition: width .3s; }
.vd-down { background: var(--down, #ef5f5f); transition: width .3s; }
.vd-labels {
  display: flex;
  justify-content: space-between;
  font-size: 11px;
  font-variant-numeric: tabular-nums;
}
.vd-up-l { color: var(--up, #3fd684); }
.vd-down-l { color: var(--down, #ef5f5f); }

.ad-line-section {
  background: var(--card, #0e1a1c);
  border: 1px solid var(--line, #1d3238);
  border-radius: 8px;
  padding: 14px;
}
.ad-line-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
}
.ad-line-k { font-size: 13px; font-weight: 600; color: var(--text, #c8d3d3); }
.ad-chart-wrap {
  position: relative;
  width: 100%;
}
.ad-chart {
  width: 100%;
  height: 120px;
  display: block;
}
.ad-chart .ad-area { fill: url(#ad-grad); }
.ad-chart .ad-line { fill: none; stroke: var(--accent, #2dd4bf); stroke-width: 1.5; }
.ad-chart .ad-baseline { stroke: var(--line, #2d4a4a); stroke-width: 1; stroke-dasharray: 3,3; }
.ad-chart .ad-dot { fill: var(--accent, #2dd4bf); cursor: pointer; }
.ad-chart .ad-grid { stroke: var(--line, #1d3238); stroke-width: 0.5; }
.ad-chart .ad-gtext { fill: var(--sub, #7fa6a2); font-size: 8px; }
.ad-chart-summary {
  display: flex;
  gap: 24px;
  margin-top: 8px;
}

@media (max-width: 760px) {
  .breadth-grid { grid-template-columns: 1fr; }
  .fg-gauge-card { max-width: 320px; margin: 0 auto; }
}
@media (max-width: 480px) {
  .fg-score { font-size: 28px; }
  .ad-chart-summary { flex-wrap: wrap; gap: 12px; }
}

/* ── M18: Portfolio risk analyzer & smart insights ──────────────────────── */
.pf-risk-card {
  background: var(--card, #11201f);
  border: 1px solid var(--line, #1d3238);
  border-radius: 12px;
  padding: 16px;
  margin: 12px 0;
}
.pf-risk-body {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* Score cards row */
.pf-risk-scores {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  gap: 10px;
}
.pf-risk-score-card {
  background: var(--bg2, #0e1a19);
  border: 1px solid var(--line, #1d3238);
  border-radius: 10px;
  padding: 12px;
  position: relative;
  overflow: hidden;
}
.pf-risk-score-label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--dim, #5a7a78);
  margin-bottom: 4px;
}
.pf-risk-score-val {
  font-size: 26px;
  font-weight: 700;
  line-height: 1.1;
}
.pf-risk-score-max {
  font-size: 13px;
  font-weight: 400;
  color: var(--dim, #5a7a78);
}
.pf-risk-score-tier {
  font-size: 11px;
  margin-top: 2px;
  opacity: 0.9;
}
.pf-risk-ring {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 32px;
  height: 32px;
}

/* Position risk table */
.pf-risk-positions {
  border-top: 1px solid var(--line, #1d3238);
  padding-top: 12px;
}
.pf-risk-positions-head {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--dim, #5a7a78);
  margin-bottom: 8px;
}
.pf-risk-pos-row {
  display: grid;
  grid-template-columns: 1.5fr 1fr 0.8fr 0.8fr 0.8fr 0.8fr 0.7fr;
  gap: 6px;
  align-items: center;
  padding: 6px 4px;
  border-bottom: 1px solid var(--line, rgba(45,74,74,0.4));
  font-size: 13px;
}
.pf-risk-pos-header {
  font-size: 11px;
  text-transform: uppercase;
  color: var(--dim, #5a7a78);
  border-bottom: 1px solid var(--line, #1d3238);
}
.pf-risk-pos-tick {
  display: flex;
  align-items: center;
  gap: 6px;
  font-weight: 600;
  min-width: 0;
}
.pf-risk-pos-logo {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  flex-shrink: 0;
}
.pf-risk-pos-val {
  text-align: right;
  font-size: 12px;
}
.pf-risk-badge {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 600;
  text-transform: capitalize;
  border: 1px solid;
}

/* Smart insights */
.pf-risk-insights {
  border-top: 1px solid var(--line, #1d3238);
  padding-top: 12px;
}
.pf-risk-insights-head {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--dim, #5a7a78);
  margin-bottom: 8px;
}
.pf-risk-insight {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 8px 10px;
  margin-bottom: 6px;
  border-left: 3px solid;
  border-radius: 0 6px 6px 0;
  background: rgba(255,255,255,0.02);
  font-size: 13px;
  line-height: 1.4;
}
.pf-risk-insight-icon {
  flex-shrink: 0;
  font-size: 14px;
  line-height: 1.4;
}
.pf-risk-insight-text {
  min-width: 0;
}
.pf-risk-insight-text b {
  color: var(--text, #e8eef0);
}

/* Allocation bar */
.pf-risk-alloc-bar {
  border-top: 1px solid var(--line, #1d3238);
  padding-top: 12px;
}
.pf-risk-alloc-head {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--dim, #5a7a78);
  margin-bottom: 8px;
}
.pf-risk-alloc-track {
  display: flex;
  height: 8px;
  border-radius: 4px;
  overflow: hidden;
  background: var(--bg2, #0e1a19);
}
.pf-risk-alloc-seg {
  height: 100%;
  min-width: 2px;
  transition: opacity 0.2s;
}
.pf-risk-alloc-seg:hover {
  opacity: 0.75;
}
.pf-risk-alloc-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
  margin-top: 8px;
}
.pf-risk-alloc-li {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  color: var(--sub, #7fa6a2);
}
.pf-risk-alloc-dot {
  width: 8px;
  height: 8px;
  border-radius: 2px;
}

/* Responsive */
@media (max-width: 640px) {
  .pf-risk-pos-row {
    grid-template-columns: 1.5fr 1fr 0.7fr 0.7fr;
  }
  .pf-risk-score-val {
    font-size: 22px;
  }
}
@media (max-width: 480px) {
  .pf-risk-pos-row {
    grid-template-columns: 1.5fr 1fr 0.7fr;
  }
  .pf-risk-scores {
    grid-template-columns: repeat(2, 1fr);
  }
  .pf-risk-insight {
    font-size: 12px;
  }
}

/* ── M19: Mining profitability calculator ───────────────────────────────── */
.mine-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
  margin-top: 14px;
}
.mine-inputs {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.mine-presets {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 4px;
}
.mine-preset {
  background: var(--panel, #0f1c1f);
  border: 1px solid var(--line, #1d3439);
  color: var(--mut, #7fa39c);
  padding: 5px 10px;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: border-color .15s, color .15s, background .15s;
}
.mine-preset:hover {
  border-color: var(--teal, #49eacb);
  color: var(--teal, #49eacb);
}
.mine-preset.is-on {
  background: rgba(73, 234, 203, 0.12);
  border-color: var(--teal, #49eacb);
  color: var(--teal, #49eacb);
}
.mine-field { display: flex; flex-direction: column; gap: 5px; }
.mine-label { font-size: 12px; color: var(--mut, #7fa39c); font-weight: 500; }
.mine-row { display: flex; gap: 6px; }
.mine-input {
  flex: 1;
  background: var(--bg, #0b1416);
  border: 1px solid var(--line, #1d3439);
  color: var(--tx, #dcefec);
  padding: 10px 12px;
  border-radius: 10px;
  font-size: 15px;
  font-variant-numeric: tabular-nums;
  outline: none;
  transition: border-color .15s;
}
.mine-input:focus { border-color: var(--teal, #49eacb); }
.mine-select {
  background: var(--panel, #0f1c1f);
  border: 1px solid var(--line, #1d3439);
  color: var(--tx, #dcefec);
  padding: 10px 8px;
  border-radius: 10px;
  font-size: 14px;
  cursor: pointer;
  outline: none;
}
.mine-net-info {
  background: var(--panel, #0f1c1f);
  border: 1px solid var(--line, #1d3439);
  border-radius: 12px;
  padding: 10px 14px;
  margin-top: 4px;
}
.mni-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 4px 0;
  font-size: 13px;
}
.mni-row + .mni-row { border-top: 1px solid var(--line, #1d3439); }
.mni-k { color: var(--mut, #7fa39c); }
.mni-v { color: var(--tx, #dcefec); font-weight: 600; font-variant-numeric: tabular-nums; }

.mine-results {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.mine-result-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}
.mine-result-card {
  background: linear-gradient(180deg, var(--panel, #0f1c1f), var(--panel2, #13262a));
  border: 1px solid var(--line, #1d3439);
  border-radius: 14px;
  padding: 16px 14px;
  text-align: center;
}
.mine-result-card.mine-profit { border-color: rgba(73, 234, 203, 0.3); }
.mrc-head { font-size: 11px; color: var(--mut, #7fa39c); text-transform: uppercase; letter-spacing: .5px; }
.mrc-big { font-size: 24px; font-weight: 800; margin-top: 6px; font-variant-numeric: tabular-nums; }
.mrc-big.pos { color: var(--teal, #49eacb); }
.mrc-big.neg { color: var(--red, #ff6b6b); }
.mrc-sub { font-size: 12px; color: var(--mut, #7fa39c); margin-top: 3px; }

.mine-breakdown {
  background: var(--panel, #0f1c1f);
  border: 1px solid var(--line, #1d3439);
  border-radius: 12px;
  padding: 12px 14px;
}
.mine-bd-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 7px 0;
  font-size: 14px;
}
.mine-bd-row + .mine-bd-row { border-top: 1px solid var(--line, #1d3439); }
.mine-bd-k { color: var(--mut, #7fa39c); font-weight: 600; min-width: 64px; }
.mine-bd-v { color: var(--tx, #dcefec); font-variant-numeric: tabular-nums; }
.mine-bd-rev { color: var(--teal, #49eacb); }
.mine-bd-net { font-weight: 700; }

.mine-bn {
  background: var(--panel, #0f1c1f);
  border: 1px solid var(--line, #1d3439);
  border-radius: 12px;
  padding: 12px 14px;
}
.mine-bn-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 7px 0;
  font-size: 13px;
}
.mine-bn-row + .mine-bn-row { border-top: 1px solid var(--line, #1d3439); }
.mine-bn-k { color: var(--mut, #7fa39c); }
.mine-bn-v { color: var(--tx, #dcefec); font-weight: 600; font-variant-numeric: tabular-nums; }

/* Fix: result cards grid should use the mine-result-card class properly */
.mine-result-card { display: inline-block; }

@media (max-width: 720px) {
  .mine-layout { grid-template-columns: 1fr; }
  .mine-result-cards { grid-template-columns: 1fr; }
  .mrc-big { font-size: 20px; }
}
@media (max-width: 480px) {
  .mine-preset { font-size: 11px; padding: 4px 8px; }
}

/* ── M20: Adoption Velocity ────────────────────────────────────────── */
.adopt-grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 14px;
  margin-top: 14px;
}
.adopt-chart-card,
.adopt-movers-card {
  background: linear-gradient(180deg, var(--panel, #0f1c1f), var(--panel2, #13262a));
  border: 1px solid var(--line, #1d3439);
  border-radius: 14px;
  padding: 16px 18px;
}
.adopt-chart-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 8px;
}
.adopt-chart-head h3 {
  margin: 0;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .3px;
  color: var(--tx, #dcefec);
}
.adopt-chart-note {
  font-size: 11px;
  color: var(--mut, #7fa39c);
}
.adopt-chart-wrap {
  position: relative;
  width: 100%;
}
.adopt-chart {
  width: 100%;
  height: 160px;
  display: block;
}
#adopt-chart-hover {
  position: absolute;
  pointer-events: none;
  background: rgba(11, 20, 22, .94);
  border: 1px solid var(--line, #1d3439);
  border-radius: 8px;
  padding: 5px 9px;
  font-size: 12px;
  color: var(--tx, #dcefec);
  white-space: nowrap;
  z-index: 10;
  transform: translate(-50%, -120%);
}
.adopt-chart-stats {
  display: flex;
  gap: 18px;
  margin-top: 10px;
  flex-wrap: wrap;
}
.adopt-chart-stats .stat { margin: 0; }

.adopt-movers-card h3 {
  margin: 0 0 10px;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .3px;
}
.adopt-movers {
  display: flex;
  flex-direction: column;
  gap: 4px;
  max-height: 360px;
  overflow-y: auto;
}
.adopt-mover {
  display: grid;
  grid-template-columns: 18px 1fr auto;
  align-items: center;
  gap: 8px;
  padding: 6px 8px;
  border-radius: 8px;
  cursor: pointer;
  transition: background .15s;
}
.adopt-mover:hover { background: rgba(255,255,255,.04); }
.adopt-mover .am-rank {
  font-size: 11px;
  color: var(--mut, #7fa39c);
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.adopt-mover .am-name {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
}
.adopt-mover .am-name .am-tick {
  font-weight: 700;
  font-size: 13px;
  color: var(--tx, #dcefec);
}
.adopt-mover .am-name .am-img {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  flex-shrink: 0;
}
.adopt-mover .am-val {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}
.adopt-mover .am-chg {
  font-weight: 700;
}
.adopt-mover .am-chg.up { color: var(--teal, #49eacb); }
.adopt-mover .am-chg.dn { color: var(--red, #f0616d); }
.adopt-mover .am-bar {
  width: 50px;
  height: 4px;
  border-radius: 2px;
  background: rgba(127,163,156,.15);
  overflow: hidden;
}
.adopt-mover .am-bar i {
  display: block;
  height: 100%;
  border-radius: 2px;
}
.adopt-mover .am-bar i.up { background: var(--teal, #49eacb); }
.adopt-mover .am-bar i.dn { background: var(--red, #f0616d); }
.adopt-mover .am-sec {
  display: block;
}

@media (max-width: 820px) {
  .adopt-grid { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
  .adopt-movers { max-height: 300px; }
  .adopt-chart { height: 120px; }
}

/* ── M21: DCA Investment Calculator ─────────────────────────────────────── */
.dca-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
  margin-top: 14px;
}
.dca-inputs {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.dca-presets {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 4px;
}
.dca-preset {
  background: var(--panel, #0f1c1f);
  border: 1px solid var(--line, #1d3439);
  color: var(--mut, #7fa39c);
  padding: 5px 10px;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.15s;
}
.dca-preset:hover {
  border-color: var(--teal, #49eacb);
  color: var(--teal, #49eacb);
}
.dca-preset.is-on {
  background: rgba(73, 234, 203, 0.1);
  border-color: var(--teal, #49eacb);
  color: var(--teal, #49eacb);
}
.dca-field { display: flex; flex-direction: column; gap: 5px; }
.dca-label { font-size: 12px; color: var(--mut, #7fa39c); font-weight: 500; }
.dca-row { display: flex; align-items: stretch; gap: 0; }
.dca-prefix {
  display: flex;
  align-items: center;
  padding: 0 10px;
  background: var(--panel, #0f1c1f);
  border: 1px solid var(--line, #1d3439);
  border-right: none;
  border-radius: 8px 0 0 8px;
  font-size: 14px;
  color: var(--mut, #7fa39c);
  font-weight: 600;
}
.dca-input {
  flex: 1;
  background: var(--panel, #0f1c1f);
  border: 1px solid var(--line, #1d3439);
  border-radius: 0 8px 8px 0;
  color: var(--text, #e8f4f1);
  padding: 8px 10px;
  font-size: 14px;
  font-weight: 600;
  outline: none;
  min-width: 0;
}
.dca-input:focus { border-color: var(--teal, #49eacb); }
.dca-select {
  background: var(--panel, #0f1c1f);
  border: 1px solid var(--line, #1d3439);
  border-radius: 8px;
  color: var(--text, #e8f4f1);
  padding: 8px 10px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  outline: none;
}
.dca-select:focus { border-color: var(--teal, #49eacb); }
.dca-net-info {
  background: var(--panel, #0f1c1f);
  border: 1px solid var(--line, #1d3439);
  border-radius: 10px;
  padding: 10px 12px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.dni-row { display: flex; justify-content: space-between; align-items: center; font-size: 12px; }
.dni-k { color: var(--mut, #7fa39c); }
.dni-v { color: var(--text, #e8f4f1); font-weight: 600; }

.dca-results {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.dca-result-cards {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 8px;
}
.dca-result-card {
  background: var(--panel, #0f1c1f);
  border: 1px solid var(--line, #1d3439);
  border-radius: 10px;
  padding: 12px;
  text-align: center;
}
.dca-result-card.dca-pnl { border-color: rgba(73, 234, 203, 0.2); }
.drc-head { font-size: 11px; color: var(--mut, #7fa39c); text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 6px; }
.drc-big { font-size: 22px; font-weight: 700; color: var(--text, #e8f4f1); }
.dca-pnl .drc-big.pos { color: var(--teal, #49eacb); }
.dca-pnl .drc-big.neg { color: var(--red, #ff6b6b); }
.drc-sub { font-size: 12px; color: var(--mut, #7fa39c); margin-top: 2px; }

.dca-chart-wrap {
  background: var(--panel, #0f1c1f);
  border: 1px solid var(--line, #1d3439);
  border-radius: 10px;
  padding: 12px;
}
.dca-chart-head {
  display: flex;
  gap: 16px;
  margin-bottom: 8px;
  font-size: 11px;
  color: var(--mut, #7fa39c);
}
.dca-legend-item { display: flex; align-items: center; gap: 4px; }
.dca-legend-line { display: inline-block; width: 16px; height: 2px; border-radius: 1px; }
.dca-ll-invested { background: var(--mut, #7fa39c); border-top: 1px dashed var(--mut, #7fa39c); height: 0; border-bottom: none; }
.dca-ll-value { background: var(--teal, #49eacb); }
.dca-chart { width: 100%; height: 160px; position: relative; }
.dca-chart svg { width: 100%; height: 100%; display: block; }

.dca-breakdown {
  background: var(--panel, #0f1c1f);
  border: 1px solid var(--line, #1d3439);
  border-radius: 10px;
  padding: 4px 12px;
}
.dca-bd-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 0;
  font-size: 13px;
}
.dca-bd-row + .dca-bd-row { border-top: 1px solid var(--line, #1d3439); }
.dca-bd-k { color: var(--mut, #7fa39c); }
.dca-bd-hint { font-size: 11px; opacity: 0.7; }
.dca-bd-v { color: var(--text, #e8f4f1); font-weight: 600; }
.dca-bd-lumpsum .dca-bd-v.pos { color: var(--teal, #49eacb); }
.dca-bd-lumpsum .dca-bd-v.neg { color: var(--red, #ff6b6b); }

@media (max-width: 760px) {
  .dca-layout { grid-template-columns: 1fr; }
  .dca-result-cards { grid-template-columns: 1fr; gap: 6px; }
  .drc-big { font-size: 18px; }
  .dca-chart { height: 140px; }
}
.dca-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  color: var(--mut, #7fa39c);
  font-size: 13px;
}

/* M23: Portfolio vs Benchmark */
.pf-bench-card {
  background: var(--panel, #0f1c1f);
  border: 1px solid var(--line, #1d3439);
  border-radius: 12px;
  padding: 14px;
  margin-bottom: 12px;
}
.pf-bench-card .section-head { margin-bottom: 8px; }
.pf-bench-legend {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  margin: 8px 0 4px;
}
.pf-bench-legend .bl-item {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--mut, #7fa39c);
}
.pf-bench-legend .bl-dot {
  width: 10px;
  height: 3px;
  border-radius: 2px;
}
.pf-bench-summary {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  margin-top: 8px;
}
.pf-bench-summary .pbs-cell {
  background: rgba(255,255,255,0.02);
  border: 1px solid var(--line, #1d3439);
  border-radius: 8px;
  padding: 8px 10px;
}
.pbs-label {
  font-size: 11px;
  color: var(--mut, #7fa39c);
  margin-bottom: 2px;
}
.pbs-value {
  font-size: 15px;
  font-weight: 600;
}
.pbs-value.up { color: var(--teal, #49eacb); }
.pbs-value.down { color: var(--red, #ff6b6b); }
.pbs-sub { font-size: 11px; color: var(--mut, #7fa39c); }
#pf-bench-chart .bench-line { fill: none; stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
#pf-bench-chart .bench-grid { stroke: rgba(255,255,255,0.04); stroke-width: 1; }
#pf-bench-chart .bench-label { fill: var(--mut, #7fa39c); font-size: 10px; }
#pf-bench-chart .bench-zero { stroke: rgba(255,255,255,0.12); stroke-width: 1; stroke-dasharray: 3 3; }
#pf-bench-chart .bench-dot { opacity: 0; }
@media (max-width: 600px) {
  .pf-bench-summary { grid-template-columns: repeat(2, 1fr); }
}

/* M24: Exchange liquidity landscape */
.exch-summary {
  display: grid; grid-template-columns: repeat(5,1fr); gap: 8px; margin-bottom: 14px;
}
.exch-stat {
  background: rgba(125,160,152,0.06); border-radius: 8px; padding: 10px 12px; text-align: center;
}
.exch-stat-label {
  display: block; font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase;
  color: rgba(125,160,152,0.6); margin-bottom: 4px;
}
.exch-stat-val { display: block; font-size: 16px; font-weight: 600; color: var(--txt); font-variant-numeric: tabular-nums; }
.exch-layout { display: grid; grid-template-columns: 1fr 1.4fr; gap: 12px; margin-bottom: 12px; }
.exch-chart-card, .exch-table-card, .exch-arb-card { background: rgba(125,160,152,0.04); border-radius: 10px; padding: 12px; }
.exch-vol-bars { display: flex; flex-direction: column; gap: 3px; }
.exch-vol-row {
  display: flex; align-items: center; gap: 8px; font-size: 11px; min-height: 22px;
}
.exch-vol-name {
  width: 90px; text-align: right; color: rgba(125,160,152,0.8);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.exch-vol-track {
  flex: 1; height: 16px; background: rgba(125,160,152,0.06); border-radius: 3px; position: relative; overflow: hidden;
}
.exch-vol-fill {
  height: 100%; border-radius: 3px;
  background: linear-gradient(90deg, #49eacb, #2db89c);
  transition: width 0.5s ease;
}
.exch-vol-fill.faded { background: rgba(125,160,152,0.3); }
.exch-vol-val {
  width: 72px; font-size: 10px; color: rgba(125,160,152,0.6); font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.exch-table-wrap { overflow-x: auto; }
.exch-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.exch-table th {
  text-align: right; padding: 6px 8px; font-size: 10px; letter-spacing: 0.06em;
  text-transform: uppercase; color: rgba(125,160,152,0.5);
  border-bottom: 1px solid rgba(125,160,152,0.1); white-space: nowrap;
}
.exch-table th:first-child { text-align: left; }
.exch-table td {
  padding: 5px 8px; text-align: right; border-bottom: 1px solid rgba(125,160,152,0.04);
  font-variant-numeric: tabular-nums; white-space: nowrap;
}
.exch-table td:first-child { text-align: left; }
.exch-table tr:hover td { background: rgba(125,160,152,0.04); }
.exch-exchange-name { font-weight: 500; color: var(--txt); }
.exch-pair { color: rgba(125,160,152,0.6); font-size: 11px; }
.exch-price { color: var(--txt); }
.exch-spread { color: rgba(125,160,152,0.7); }
.exch-delta-pos { color: #49eacb; }
.exch-delta-neg { color: #ff6b6b; }
.exch-delta-neutral { color: rgba(125,160,152,0.4); }
.exch-arb-row {
  display: flex; align-items: center; gap: 10px; padding: 8px 12px;
  border-bottom: 1px solid rgba(125,160,152,0.04); font-size: 12px;
}
.exch-arb-pair { flex: 1; display: flex; align-items: center; gap: 6px; }
.exch-arb-from { color: rgba(125,160,152,0.8); }
.exch-arb-arrow { color: rgba(125,160,152,0.4); }
.exch-arb-to { color: rgba(125,160,152,0.8); }
.exch-arb-spread {
  font-weight: 600; font-variant-numeric: tabular-nums; padding: 2px 8px; border-radius: 4px;
}
.exch-arb-spread.hi { background: rgba(73,234,203,0.12); color: #49eacb; }
.exch-arb-spread.md { background: rgba(255,193,7,0.1); color: #ffc107; }
.exch-arb-trade {
  font-size: 11px; color: rgba(125,160,152,0.5); text-decoration: none;
}
.exch-arb-trade:hover { color: var(--accent); }
@media (max-width: 760px) {
  .exch-summary { grid-template-columns: repeat(2,1fr); }
  .exch-layout { grid-template-columns: 1fr; }
  .exch-stat-val { font-size: 14px; }
  .exch-vol-name { width: 70px; font-size: 10px; }
  .exch-table { font-size: 11px; }
  .exch-table th, .exch-table td { padding: 4px 5px; }
}

/* ── M25: Wallet profiler card ───────────────────────────────────────────── */
.wp-card {
  background: var(--card-bg, #121e23);
  border: 1px solid var(--card-border, rgba(125,160,152,0.08));
  border-radius: 12px;
  padding: 16px 18px;
  margin: 12px 0;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.wp-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.wp-age {
  display: flex;
  align-items: baseline;
  gap: 8px;
}
.wp-age-label {
  font-size: 14px;
  font-weight: 600;
}
.wp-age-sub {
  font-size: 11px;
  color: var(--dim, rgba(125,160,152,0.5));
}
.wp-age-new .wp-age-label { color: #4fc3f7; }
.wp-age-fresh .wp-age-label { color: #66bb6a; }
.wp-age-active .wp-age-label { color: #ffc107; }
.wp-age-established .wp-age-label { color: #ff9800; }
.wp-age-og .wp-age-label { color: #ab47bc; }
.wp-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.wp-tag {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: 10px;
  font-weight: 600;
  padding: 3px 8px;
  border-radius: 20px;
  background: rgba(125,160,152,0.08);
  color: rgba(125,160,152,0.85);
  white-space: nowrap;
}
.wp-tag.tag-whale { background: rgba(79,195,247,0.1); color: #4fc3f7; }
.wp-tag.tag-dolphin { background: rgba(102,187,138,0.1); color: #66bb6a; }
.wp-tag.tag-power { background: rgba(255,193,7,0.1); color: #ffc107; }
.wp-tag.tag-active { background: rgba(73,234,203,0.1); color: #49eacb; }
.wp-tag.tag-dormant { background: rgba(125,160,152,0.08); color: rgba(125,160,152,0.5); }
.wp-tag.tag-deployer { background: rgba(255,152,0,0.1); color: #ff9800; }
.wp-tag.tag-minter { background: rgba(171,71,188,0.1); color: #ab47bc; }
.wp-tag.tag-trader { background: rgba(79,195,247,0.1); color: #4fc3f7; }
.wp-tag.tag-diamond { background: rgba(73,234,203,0.1); color: #49eacb; }
.wp-stats {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 12px;
}
.wp-stat {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.wp-stat-k {
  font-size: 10px;
  color: var(--dim, rgba(125,160,152,0.5));
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.wp-stat-v {
  font-size: 16px;
  font-weight: 600;
  color: var(--text, #e8f0ed);
}
.wp-stat-unit {
  font-size: 10px;
  color: var(--dim, rgba(125,160,152,0.5));
  font-weight: 400;
}
.wp-flow-inflow { color: #49eacb; }
.wp-flow-outflow { color: #ff5252; }
.wp-flow-balanced { color: rgba(125,160,152,0.7); }
.wp-spark-wrap {
  display: flex;
  align-items: center;
  gap: 10px;
}
.wp-spark-label {
  font-size: 10px;
  color: var(--dim, rgba(125,160,152,0.5));
  text-transform: uppercase;
  letter-spacing: 0.04em;
  white-space: nowrap;
}
.wp-spark {
  display: flex;
  align-items: flex-end;
  gap: 1px;
  height: 32px;
  flex: 1;
}
.wp-spark-bar {
  flex: 1;
  min-width: 2px;
  background: rgba(125,160,152,0.06);
  border-radius: 1px;
  transition: height 0.2s ease;
}
.wp-spark-bar.has-activity {
  background: var(--accent, #2d8eaa);
}
.wp-spark-bar.is-today {
  background: rgba(73,234,203,0.5);
}
.wp-spark-bar.is-today.has-activity {
  background: #49eacb;
}
.wp-breakdown {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.wp-bar {
  display: flex;
  height: 6px;
  border-radius: 3px;
  overflow: hidden;
  background: rgba(125,160,152,0.06);
}
.wp-seg {
  transition: flex 0.2s ease;
}
.wp-seg-native { background: rgba(125,160,152,0.3); }
.wp-seg-mint { background: #ab47bc; }
.wp-seg-transfer { background: #4fc3f7; }
.wp-seg-deploy { background: #ff9800; }
.wp-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.wp-legend-item {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 10px;
  color: var(--dim, rgba(125,160,152,0.5));
}
.wp-legend-item b { color: var(--text, #e8f0ed); font-weight: 600; }
.wp-legend-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  display: inline-block;
}
.wp-legend-dot.wp-seg-native { background: rgba(125,160,152,0.3); }
.wp-legend-dot.wp-seg-mint { background: #ab47bc; }
.wp-legend-dot.wp-seg-transfer { background: #4fc3f7; }
.wp-legend-dot.wp-seg-deploy { background: #ff9800; }
@media (max-width: 600px) {
  .wp-stats { grid-template-columns: repeat(2,1fr); }
  .wp-card { padding: 12px 14px; }
  .wp-spark-bar { min-width: 1px; }
  .wp-head { flex-direction: column; align-items: flex-start; }
}

/* M26: Network Historical Dashboard */
.nethist-tabs {
  display: flex;
  gap: 4px;
  margin-bottom: 14px;
}
.nethist-tab {
  background: transparent;
  border: 1px solid rgba(125,160,152,0.2);
  color: var(--dim, rgba(125,160,152,0.6));
  padding: 5px 12px;
  border-radius: 6px;
  cursor: pointer;
  font-size: 12px;
  font-weight: 500;
  transition: all 0.15s;
}
.nethist-tab:hover { border-color: rgba(125,160,152,0.4); color: var(--text, #e8f0ed); }
.nethist-tab.is-on {
  background: rgba(52,211,138,0.12);
  border-color: rgba(52,211,138,0.4);
  color: #34d38a;
}

.nethist-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 14px;
}
.nethist-summary .ns-chip {
  background: rgba(125,160,152,0.08);
  border: 1px solid rgba(125,160,152,0.15);
  border-radius: 8px;
  padding: 6px 12px;
  font-size: 11px;
}
.nethist-summary .ns-chip b { color: var(--text, #e8f0ed); font-weight: 600; }
.nethist-summary .ns-chip .ns-k { color: var(--dim, rgba(125,160,152,0.5)); margin-right: 4px; }

.nethist-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
}
.nethist-card {
  background: var(--card, rgba(20,32,30,0.6));
  border: 1px solid rgba(125,160,152,0.1);
  border-radius: 12px;
  padding: 14px 16px;
}
.nethist-wide { grid-column: 1 / -1; }
.nethist-card-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}
.nethist-card-head h3 {
  margin: 0;
  font-size: 13px;
  font-weight: 600;
  color: var(--text, #e8f0ed);
}
.nethist-stat {
  font-size: 11px;
  color: var(--dim, rgba(125,160,152,0.5));
}
.nethist-stat b { color: #34d38a; font-weight: 600; }
.nethist-chart {
  position: relative;
  min-height: 140px;
}
.nethist-chart svg { width: 100%; height: auto; display: block; }
.nethist-loading {
  color: var(--dim, rgba(125,160,152,0.4));
  font-size: 12px;
  text-align: center;
  padding: 40px 0;
}
.nethist-dist {
  min-height: 120px;
}

/* Distribution bar chart */
.nethist-dist-bars {
  display: flex;
  align-items: flex-end;
  gap: 4px;
  height: 140px;
  margin-top: 8px;
}
.nethist-dist-bar {
  flex: 1;
  min-width: 0;
  border-radius: 3px 3px 0 0;
  position: relative;
  cursor: pointer;
  transition: opacity 0.15s;
}
.nethist-dist-bar:hover { opacity: 0.8; }
.nethist-dist-bar-label {
  position: absolute;
  bottom: -18px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 9px;
  color: var(--dim, rgba(125,160,152,0.4));
  white-space: nowrap;
}
.nethist-dist-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
  margin-top: 28px;
  font-size: 10px;
  color: var(--dim, rgba(125,160,152,0.5));
}
.nethist-dist-legend b { color: var(--text, #e8f0ed); font-weight: 600; }

@media (max-width: 720px) {
  .nethist-grid { grid-template-columns: 1fr; }
  .nethist-wide { grid-column: auto; }
}
/* ── M27: Halving & Emission Center ────────────────────────────────────── */
.halving-hero {
  display: flex;
  gap: 32px;
  align-items: center;
  background: var(--card, rgba(255,255,255,0.03));
  border: 1px solid var(--border, rgba(255,255,255,0.06));
  border-radius: 14px;
  padding: 28px 32px;
  margin-bottom: 20px;
}
.halving-ring { flex-shrink: 0; }
.halving-ring-svg text { fill: var(--text, #e8f0ed); }
.halving-ring-num {
  font-size: 22px;
  font-weight: 700;
  fill: var(--teal, #2dd4bf);
}
.halving-ring-lbl {
  font-size: 9px;
  fill: var(--dim, rgba(125,160,152,0.6));
  text-transform: uppercase;
  letter-spacing: 1px;
}
.halving-hero-info { flex: 1; min-width: 0; }
.halving-hero-label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  color: var(--dim, rgba(125,160,152,0.6));
  margin-bottom: 4px;
}
.halving-hero-date {
  font-size: 18px;
  font-weight: 600;
  color: var(--text, #e8f0ed);
  margin-bottom: 6px;
}
.halving-hero-detail {
  font-size: 13px;
  color: var(--dim, rgba(125,160,152,0.7));
  margin-bottom: 14px;
}
.halving-new-reward { color: var(--teal, #2dd4bf); }
.halving-hero-time {
  display: flex;
  align-items: baseline;
  gap: 4px;
  font-variant-numeric: tabular-nums;
}
.hc-unit { display: flex; flex-direction: column; align-items: center; min-width: 48px; }
.hc-num {
  font-size: 24px;
  font-weight: 700;
  color: var(--text, #e8f0ed);
  line-height: 1;
}
.hc-lbl {
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--dim, rgba(125,160,152,0.5));
  margin-top: 4px;
}
.hc-sep {
  font-size: 20px;
  color: var(--dim, rgba(125,160,152,0.3));
  margin-bottom: 12px;
}

/* Pre/Post comparison */
.halving-compare {
  display: grid;
  grid-template-columns: 1fr auto 1fr auto 140px;
  gap: 16px;
  align-items: stretch;
  margin-bottom: 20px;
}
.halving-cc {
  background: var(--card, rgba(255,255,255,0.03));
  border: 1px solid var(--border, rgba(255,255,255,0.06));
  border-radius: 12px;
  padding: 20px;
}
.halving-cc-now { border-left: 3px solid var(--dim, rgba(125,160,152,0.4)); }
.halving-cc-next { border-left: 3px solid var(--teal, #2dd4bf); }
.halving-cc-head {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  color: var(--dim, rgba(125,160,152,0.6));
  margin-bottom: 14px;
  font-weight: 600;
}
.halving-cc-next .halving-cc-head { color: var(--teal, #2dd4bf); }
.halving-cc-row {
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 6px;
  align-items: baseline;
  padding: 6px 0;
  border-bottom: 1px solid var(--border, rgba(255,255,255,0.04));
}
.halving-cc-row:last-child { border-bottom: none; }
.halving-cc-k {
  font-size: 12px;
  color: var(--dim, rgba(125,160,152,0.7));
}
.halving-cc-v {
  font-size: 16px;
  font-weight: 600;
  color: var(--text, #e8f0ed);
  font-variant-numeric: tabular-nums;
}
.halving-cc-next .halving-cc-v { color: var(--teal, #2dd4bf); }
.halving-cc-u {
  font-size: 10px;
  color: var(--dim, rgba(125,160,152,0.5));
}
.halving-cc-arrow {
  display: flex;
  align-items: center;
  font-size: 28px;
  color: var(--dim, rgba(125,160,152,0.4));
}
.halving-cc-delta {
  background: rgba(255,122,0,0.06);
  border: 1px solid rgba(255,122,0,0.15);
  border-radius: 12px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
}
.halving-cc-delta-label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  color: var(--orange, #ff7a00);
  margin-bottom: 8px;
}
.halving-cc-delta-val {
  font-size: 22px;
  font-weight: 700;
  color: var(--orange, #ff7a00);
}
.halving-cc-delta-sub {
  font-size: 11px;
  color: var(--dim, rgba(125,160,152,0.6));
  margin-top: 6px;
}

/* Supply progress */
.halving-supply {
  background: var(--card, rgba(255,255,255,0.03));
  border: 1px solid var(--border, rgba(255,255,255,0.06));
  border-radius: 12px;
  padding: 24px;
  margin-bottom: 20px;
}
.halving-supply-label {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 12px;
}
.halving-supply-label span:first-child {
  font-size: 13px;
  font-weight: 600;
  color: var(--text, #e8f0ed);
}
.halving-supply-pct {
  font-size: 28px;
  font-weight: 700;
  color: var(--teal, #2dd4bf);
  font-variant-numeric: tabular-nums;
}
.halving-supply-track {
  height: 10px;
  background: rgba(255,255,255,0.04);
  border-radius: 5px;
  overflow: hidden;
  margin-bottom: 10px;
}
.halving-supply-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--teal,#2dd4bf), #5eead4);
  border-radius: 5px;
  transition: width 0.8s ease;
}
.halving-supply-nums {
  font-size: 12px;
  color: var(--dim, rgba(125,160,152,0.6));
  font-variant-numeric: tabular-nums;
}
.halving-supply-remaining { color: var(--dim, rgba(125,160,152,0.5)); }

/* Emission schedule table */
.halving-schedule, .halving-milestones {
  background: var(--card, rgba(255,255,255,0.03));
  border: 1px solid var(--border, rgba(255,255,255,0.06));
  border-radius: 12px;
  padding: 24px;
  margin-bottom: 20px;
}
.halving-schedule h3, .halving-milestones h3 {
  font-size: 15px;
  font-weight: 600;
  margin-bottom: 6px;
  color: var(--text, #e8f0ed);
}
.halving-note {
  font-size: 11px;
  color: var(--dim, rgba(125,160,152,0.5));
  margin-bottom: 16px;
}
.halving-sched-table {
  overflow-x: auto;
}
.halving-sched-loading {
  color: var(--dim, rgba(125,160,152,0.5));
  font-size: 12px;
  padding: 20px 0;
  text-align: center;
}
.halving-sched-row {
  display: grid;
  grid-template-columns: 110px 90px 100px 90px 90px 70px;
  gap: 8px;
  padding: 8px 0;
  border-bottom: 1px solid var(--border, rgba(255,255,255,0.04));
  font-size: 12px;
  align-items: center;
}
.halving-sched-row:last-child { border-bottom: none; }
.halving-sched-row.header {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--dim, rgba(125,160,152,0.5));
  border-bottom: 1px solid var(--border, rgba(255,255,255,0.08));
  padding-bottom: 8px;
}
.halving-sched-row.is-next {
  background: rgba(45,212,191,0.05);
  border-radius: 6px;
  padding: 8px 6px;
  margin: 2px -6px;
}
.halving-sched-row.is-current {
  background: rgba(125,160,152,0.04);
  border-radius: 6px;
  padding: 8px 6px;
  margin: 2px -6px;
}
.halving-sched-row.is-next .halving-sched-date { color: var(--teal, #2dd4bf); font-weight: 600; }
.halving-sched-date { color: var(--text, #e8f0ed); font-weight: 500; }
.halving-sched-reward { color: var(--text, #e8f0ed); font-variant-numeric: tabular-nums; }
.halving-sched-emission { color: var(--dim, rgba(125,160,152,0.7)); font-variant-numeric: tabular-nums; }
.halving-sched-inflation { color: var(--dim, rgba(125,160,152,0.7)); font-variant-numeric: tabular-nums; }
.halving-sched-supply { color: var(--dim, rgba(125,160,152,0.7)); font-variant-numeric: tabular-nums; }
.halving-sched-badge {
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 2px 6px;
  border-radius: 3px;
  background: rgba(45,212,191,0.12);
  color: var(--teal, #2dd4bf);
  text-align: center;
  font-weight: 600;
}

/* Milestones grid */
.halving-ms-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 12px;
}
.halving-ms-card {
  background: rgba(255,255,255,0.02);
  border: 1px solid var(--border, rgba(255,255,255,0.05));
  border-radius: 10px;
  padding: 16px;
  text-align: center;
}
.halving-ms-pct {
  font-size: 24px;
  font-weight: 700;
  color: var(--teal, #2dd4bf);
  margin-bottom: 4px;
}
.halving-ms-date {
  font-size: 12px;
  color: var(--text, #e8f0ed);
  font-weight: 500;
  margin-bottom: 4px;
}
.halving-ms-days {
  font-size: 10px;
  color: var(--dim, rgba(125,160,152,0.5));
}

@media (max-width: 760px) {
  .halving-hero { flex-direction: column; text-align: center; gap: 16px; padding: 20px; }
  .halving-compare { grid-template-columns: 1fr; }
  .halving-cc-arrow { transform: rotate(90deg); justify-content: center; }
  .halving-cc-delta { flex-direction: row; gap: 16px; justify-content: space-around; }
  .halving-sched-row { grid-template-columns: 80px 70px 80px 70px; font-size: 11px; }
  .halving-sched-inflation, .halving-sched-supply { display: none; }
}

/* M28: Command Palette (⌘K) */
.cp-btn { width: 30px; height: 30px; display: inline-flex; align-items: center; justify-content: center; background: var(--card-2); border: 1px solid var(--line); border-radius: 9px; color: var(--dim); font-size: 17px; cursor: pointer; line-height: 1; padding: 0; transition: border-color .12s, color .12s; margin-left: 6px; }
.cp-btn:hover { color: var(--text); border-color: var(--accent-2); }
.cp-overlay { position: fixed; inset: 0; background: rgba(4,10,11,.68); backdrop-filter: blur(4px); z-index: 90; opacity: 0; animation: fade .14s ease forwards; }
.cp-modal { position: fixed; top: 12vh; left: 50%; transform: translateX(-50%); width: 580px; max-width: 92vw; z-index: 91; background: var(--bg-2); border: 1px solid var(--line); border-radius: 16px; box-shadow: 0 24px 80px rgba(0,0,0,.5), 0 0 0 1px rgba(73,234,203,.06); padding: 0; margin: 0; opacity: 0; animation: cp-pop .16s cubic-bezier(.2,.8,.2,1) forwards; }
@keyframes cp-pop { to { opacity: 1; transform: translateX(-50%) translateY(0); } }
.cp-modal[open] { display: block; }
.cp-shell { display: flex; flex-direction: column; }
.cp-input-row { display: flex; align-items: center; gap: 10px; padding: 16px 18px; border-bottom: 1px solid var(--line); }
.cp-icon { color: var(--dim); font-size: 20px; flex: none; }
.cp-input { flex: 1; background: transparent; border: none; outline: none; color: var(--text); font-size: 17px; font-family: inherit; }
.cp-input::placeholder { color: var(--dim-2); }
.cp-esc { font-size: 11px; color: var(--dim); background: var(--card); border: 1px solid var(--line); border-radius: 5px; padding: 2px 7px; font-family: inherit; flex: none; }
.cp-results { max-height: 420px; overflow-y: auto; padding: 8px 0; }
.cp-results:empty::after { content: 'Start typing to search…'; display: block; text-align: center; color: var(--dim-2); font-size: 14px; padding: 28px 0; }
.cp-item { display: flex; align-items: center; gap: 12px; padding: 10px 18px; cursor: pointer; color: var(--text); border-left: 3px solid transparent; transition: background .08s, border-color .08s; user-select: none; }
.cp-item:hover, .cp-item.active { background: rgba(73,234,203,.07); border-left-color: var(--accent); }
.cp-item-cat { font-size: 10px; font-weight: 700; letter-spacing: .6px; text-transform: uppercase; color: var(--dim-2); background: var(--card); border: 1px solid var(--line); border-radius: 4px; padding: 2px 6px; flex: none; min-width: 52px; text-align: center; }
.cp-item-label { flex: 1; font-size: 15px; }
.cp-item-sub { font-size: 12px; color: var(--dim-2); }
.cp-item-arrow { color: var(--dim-2); font-size: 14px; opacity: 0; transition: opacity .08s; }
.cp-item:hover .cp-item-arrow, .cp-item.active .cp-item-arrow { opacity: 1; }
.cp-item-token { display: flex; align-items: center; gap: 8px; }
.cp-item-token img { width: 22px; height: 22px; border-radius: 50%; border: 1px solid var(--line); }
.cp-item-token .tok-ph-sm { width: 22px; height: 22px; border-radius: 50%; border: 1px solid var(--line); display: flex; align-items: center; justify-content: center; font-size: 10px; font-weight: 700; color: var(--accent-2); background: var(--card); }
.cp-sep { padding: 6px 18px 4px; font-size: 10px; font-weight: 700; letter-spacing: .8px; text-transform: uppercase; color: var(--dim-2); }
.cp-foot { display: flex; gap: 16px; padding: 10px 18px; border-top: 1px solid var(--line); font-size: 12px; color: var(--dim-2); }
.cp-hint { display: flex; align-items: center; gap: 4px; }
.cp-hint kbd { font-size: 10px; background: var(--card); border: 1px solid var(--line); border-radius: 4px; padding: 1px 5px; font-family: inherit; }
@media (max-width: 560px) {
  .cp-modal { top: 6vh; border-radius: 12px; }
  .cp-foot { display: none; }
  .cp-item { padding: 12px 16px; }
}

/* ── M32: Trade Journal ─────────────────────────────────────────── */
.tj-form { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0 16px; }
.tj-form input, .tj-form select {
  background: var(--card); border: 1px solid var(--line); border-radius: 8px;
  padding: 8px 10px; color: var(--text); font-size: 13px; font-family: inherit;
  transition: border-color .12s;
}
.tj-form input:focus, .tj-form select:focus { border-color: var(--accent); outline: none; }
.tj-type { width: 80px; font-weight: 600; cursor: pointer; }
.tj-type option { background: var(--card); }
.tj-tick { width: 120px; text-transform: uppercase; }
.tj-amount { width: 120px; }
.tj-price { width: 120px; }
.tj-date { width: 140px; }
.tj-note { width: 140px; }
.tj-add-btn {
  background: var(--accent); color: #fff; border: none; border-radius: 8px;
  padding: 8px 16px; font-size: 13px; font-weight: 600; cursor: pointer;
  font-family: inherit; transition: opacity .12s;
}
.tj-add-btn:hover { opacity: .85; }
.tj-add-btn:active { transform: scale(.97); }

.tj-export-btn, .tj-import-btn {
  background: var(--card); border: 1px solid var(--line); border-radius: 6px;
  padding: 5px 10px; color: var(--dim); font-size: 12px; cursor: pointer;
  font-family: inherit; transition: border-color .12s, color .12s;
}
.tj-export-btn:hover, .tj-import-btn:hover { border-color: var(--accent); color: var(--text); }

.tj-summary { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 16px; }
.tj-stat {
  background: var(--card); border: 1px solid var(--line); border-radius: 10px;
  padding: 10px 14px; min-width: 120px; flex: 1 1 120px;
}
.tj-stat-label { font-size: 11px; color: var(--dim-2); text-transform: uppercase; letter-spacing: .5px; margin-bottom: 4px; }
.tj-stat-val { font-size: 16px; font-weight: 700; color: var(--text); }
.tj-stat-val.pos { color: var(--up); }
.tj-stat-val.neg { color: var(--down); }

.tj-history-card { background: var(--card); border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.tj-history-head { display: flex; align-items: center; justify-content: space-between; padding: 12px 14px; border-bottom: 1px solid var(--line); flex-wrap: wrap; gap: 8px; }
.tj-history-head h3 { font-size: 14px; margin: 0; }
.tj-filter-row { display: flex; gap: 4px; }
.tj-filter-btn {
  background: transparent; border: 1px solid var(--line); border-radius: 6px;
  padding: 4px 10px; font-size: 12px; color: var(--dim); cursor: pointer;
  font-family: inherit; transition: all .12s;
}
.tj-filter-btn:hover { border-color: var(--dim-2); color: var(--text); }
.tj-filter-btn.is-on { background: var(--accent); border-color: var(--accent); color: #fff; }

.tj-table-wrap { overflow-x: auto; }
.tj-row { display: grid; grid-template-columns: 90px 56px 80px 110px 90px 100px 100px 1fr 32px; gap: 8px; padding: 8px 14px; align-items: center; font-size: 13px; }
.tj-thead { font-size: 11px; font-weight: 600; color: var(--dim-2); text-transform: uppercase; letter-spacing: .5px; border-bottom: 1px solid var(--line); padding-top: 10px; padding-bottom: 10px; }
.tj-body-row { border-bottom: 1px solid var(--card-2, rgba(255,255,255,.03)); transition: background .1s; }
.tj-body-row:hover { background: rgba(255,255,255,.02); }
.tj-body-row:last-child { border-bottom: none; }
.tj-c-date { color: var(--dim); font-size: 12px; white-space: nowrap; }
.tj-c-type { font-weight: 600; font-size: 12px; }
.tj-c-type.buy { color: var(--up); }
.tj-c-type.sell { color: var(--down); }
.tj-c-tok { font-weight: 600; }
.tj-c-amt { text-align: right; color: var(--text); }
.tj-c-price { text-align: right; color: var(--dim); font-size: 12px; }
.tj-c-total { text-align: right; font-weight: 500; }
.tj-c-pnl { text-align: right; font-size: 12px; }
.tj-c-pnl.pos { color: var(--up); }
.tj-c-pnl.neg { color: var(--down); }
.tj-c-pnl.dim { color: var(--dim-2); }
.tj-c-note { color: var(--dim); font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tj-c-act { text-align: center; }
.tj-del {
  background: transparent; border: none; color: var(--dim-2); cursor: pointer;
  font-size: 16px; padding: 2px 6px; border-radius: 4px; transition: color .12s, background .12s;
}
.tj-del:hover { color: var(--down); background: rgba(255,80,80,.1); }

.tj-empty {
  text-align: center; padding: 32px 20px;
}
.tj-empty-ic { font-size: 40px; margin-bottom: 8px; opacity: .5; }
.tj-empty-msg { font-size: 15px; font-weight: 600; color: var(--dim); margin: 0 0 4px; }
.tj-empty-sub { font-size: 13px; color: var(--dim-2); max-width: 380px; margin: 0 auto; line-height: 1.5; }

@media (max-width: 760px) {
  .tj-row { grid-template-columns: 80px 50px 70px 90px 80px 32px; gap: 6px; padding: 7px 10px; font-size: 12px; }
  .tj-c-price, .tj-c-total, .tj-c-note { display: none; }
  .tj-form input, .tj-form select { width: calc(50% - 4px); }
  .tj-tick { width: calc(50% - 4px) !important; }
  .tj-add-btn { width: 100%; }
}

/* ── M32: Kaspa vs Majors (BTC/ETH ratio tracker) ─────────────────────────── */
.rt-toggle { display: inline-flex; gap: 2px; padding: 3px; background: var(--card-2); border: 1px solid var(--line); border-radius: 9px; }
.rt-tab { font: inherit; font-size: 12px; font-weight: 600; color: var(--dim); background: transparent; border: 0; border-radius: 6px; padding: 5px 10px; cursor: pointer; transition: background .15s, color .15s; white-space: nowrap; }
.rt-tab:hover { color: var(--text); }
.rt-tab.is-on { color: var(--bg); background: var(--accent); }
.rt-card { position: relative; padding: 16px 16px 8px; }
.rt-chart-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 8px; }
.rt-chart-title { font-size: 13px; font-weight: 700; color: var(--text); letter-spacing: .2px; }
.rt-chart-meta { display: flex; align-items: baseline; gap: 14px; font-size: 12px; color: var(--dim); font-variant-numeric: tabular-nums; }
.rt-chg { font-weight: 700; }
.rt-chg.chg-up { color: var(--up); }
.rt-chg.chg-down { color: var(--down); }
.rt-hilo b { color: var(--text); font-weight: 600; }
.rt-chart-wrap { position: relative; width: 100%; min-height: 250px; }
.rt-svg { width: 100%; height: auto; display: block; overflow: visible; aspect-ratio: 900 / 320; }
.rt-grid { stroke: var(--line); stroke-width: 1; opacity: .5; }
.rt-axis { fill: var(--dim-2); font-size: 11px; font-variant-numeric: tabular-nums; }
.rt-area { stroke: none; }
.rt-line { stroke-linejoin: round; stroke-linecap: round; }
.rt-hover-dot { pointer-events: none; }
.rt-tooltip { position: absolute; top: 6px; transform: translateX(-50%); pointer-events: none; background: rgba(11,20,22,.94); border: 1px solid var(--line); border-radius: 8px; padding: 6px 9px; font-size: 12px; white-space: nowrap; z-index: 4; box-shadow: 0 4px 16px rgba(0,0,0,.35); }
.rt-tip-v { display: block; font-weight: 700; color: var(--text); font-variant-numeric: tabular-nums; }
.rt-tip-t { display: block; color: var(--dim-2); font-size: 11px; margin-top: 1px; }
#ratios .stat-v.chg-up { color: var(--up); }
#ratios .stat-v.chg-down { color: var(--down); }
@media (max-width: 640px) {
  #rt-pair, #rt-range { flex-wrap: wrap; }
  .rt-tab { padding: 5px 8px; }
}

/* ============================================================
   M33 — Network Vitals: fee estimator + BlockDAG state
   ============================================================ */
.vt-layout { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 16px; margin-top: 14px; }
.vt-card-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 14px 16px 6px; }
.vt-card-head h3 { margin: 0; font-size: 15px; font-weight: 700; color: var(--text); }
.vt-badge { font-size: 11px; font-weight: 600; color: var(--accent); background: var(--card-2); border: 1px solid var(--line); border-radius: 999px; padding: 3px 10px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.vt-card-note { margin: 0; padding: 0 16px 12px; font-size: 12px; line-height: 1.5; color: var(--dim); }
.vt-card-note b { color: var(--text); }

.vt-tiers { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; padding: 0 16px 14px; }
.vt-tier { background: var(--bg-2); border: 1px solid var(--line); border-radius: 12px; padding: 12px 12px 13px; text-align: center; position: relative; }
.vt-tier[data-tier="priority"] { border-color: var(--accent-2); }
.vt-tier-name { font-size: 11px; font-weight: 700; letter-spacing: .4px; text-transform: uppercase; color: var(--dim); }
.vt-tier-rate { font-size: 26px; font-weight: 800; color: var(--text); font-variant-numeric: tabular-nums; line-height: 1.15; margin-top: 4px; }
.vt-tier[data-tier="priority"] .vt-tier-rate { color: var(--accent); }
.vt-tier-unit { font-size: 10px; color: var(--dim-2, var(--dim)); text-transform: uppercase; letter-spacing: .3px; }
.vt-tier-time { margin-top: 8px; font-size: 12px; font-weight: 600; color: var(--up); font-variant-numeric: tabular-nums; }

.vt-calc { border-top: 1px solid var(--line); padding: 14px 16px 16px; }
.vt-calc-head { font-size: 13px; font-weight: 700; color: var(--text); margin-bottom: 10px; }
.vt-calc-controls { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.vt-seg { display: inline-flex; background: var(--bg-2); border: 1px solid var(--line); border-radius: 9px; padding: 3px; gap: 2px; }
.vt-seg-btn { font: inherit; font-size: 12px; font-weight: 600; color: var(--dim); background: transparent; border: 0; border-radius: 6px; padding: 5px 11px; cursor: pointer; transition: background .15s, color .15s; white-space: nowrap; }
.vt-seg-btn:hover { color: var(--text); }
.vt-seg-btn.is-on { color: var(--bg); background: var(--accent); }
.vt-calc-out { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.vt-calc-stat { background: var(--bg-2); border: 1px solid var(--line); border-radius: 12px; padding: 12px 13px; display: flex; flex-direction: column; gap: 2px; }
.vt-calc-k { font-size: 11px; font-weight: 600; letter-spacing: .3px; text-transform: uppercase; color: var(--dim); }
.vt-calc-v { font-size: 20px; font-weight: 800; color: var(--text); font-variant-numeric: tabular-nums; word-break: break-all; }
.vt-calc-sub { font-size: 11px; color: var(--dim); font-variant-numeric: tabular-nums; }
.vt-calc-foot { margin: 12px 0 0; font-size: 11px; line-height: 1.5; color: var(--dim); }

.vt-side { display: flex; flex-direction: column; gap: 16px; }
.vt-dag-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 0 16px 14px; }
.vt-tips-head { padding: 0 16px 2px; font-size: 12px; font-weight: 700; color: var(--text); text-transform: uppercase; letter-spacing: .3px; }
.vt-tips-count { color: var(--accent); font-weight: 600; margin-left: 4px; text-transform: none; letter-spacing: 0; }
.vt-tips { display: flex; flex-direction: column; gap: 6px; padding: 8px 16px 16px; }
.vt-tip { display: flex; align-items: center; gap: 9px; background: var(--bg-2); border: 1px solid var(--line); border-radius: 9px; padding: 8px 11px; text-decoration: none; transition: border-color .12s; }
.vt-tip:hover { border-color: var(--accent-2); }
.vt-tip code { font-size: 12px; color: var(--text); font-variant-numeric: tabular-nums; }
.vt-tip-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--accent); flex: none; box-shadow: 0 0 0 3px rgba(73,234,203,.14); }
.vt-tip.is-sink .vt-tip-dot { background: var(--up); box-shadow: 0 0 0 3px rgba(63,214,132,.16); }
.vt-tip-tag { margin-left: auto; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .3px; color: var(--up); background: rgba(63,214,132,.12); border-radius: 5px; padding: 2px 7px; }

@media (max-width: 860px) {
  .vt-layout { grid-template-columns: 1fr; }
}
@media (max-width: 520px) {
  .vt-tiers { grid-template-columns: 1fr; }
  .vt-calc-out { grid-template-columns: 1fr; }
  .vt-dag-grid { grid-template-columns: 1fr; }
  .vt-tier-rate { font-size: 22px; }
}

/* ── M34: Kaspa Name Service (KNS / .kas names) ───────────────────────────── */
.kns-layout { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 16px; margin-top: 14px; }
.kns-side { display: flex; flex-direction: column; gap: 16px; }
.kns-mkt-link { color: var(--accent); text-decoration: none; }
.kns-mkt-link:hover { color: var(--text); }

/* recent-registration feed */
.kns-feed { display: flex; flex-direction: column; padding: 4px 8px 10px; max-height: 460px; overflow-y: auto; }
.kns-row { display: grid; grid-template-columns: minmax(0,1fr) auto auto; align-items: center; gap: 8px 10px; padding: 9px 8px; border-bottom: 1px solid var(--line); }
.kns-row:last-child { border-bottom: none; }
.kns-row-name { font-weight: 700; font-size: 14px; color: var(--text); text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kns-row-name:hover { color: var(--accent); }
.kns-kind { font-size: 10px; font-weight: 600; letter-spacing: .3px; text-transform: uppercase; color: var(--dim-2); border: 1px solid var(--line); border-radius: 999px; padding: 2px 7px; }
.kns-row-owner { justify-self: end; }
.kns-owner { color: var(--dim); text-decoration: none; font-size: 12px; }
.kns-owner:hover { color: var(--accent); }
.kns-row-time { justify-self: end; color: var(--dim-2); font-size: 12px; font-variant-numeric: tabular-nums; white-space: nowrap; }

/* name chips (listed + lookup + wallet) */
.kns-chips { display: flex; flex-wrap: wrap; gap: 8px; padding: 4px 16px 16px; }
.kns-chip { display: inline-flex; align-items: center; gap: 4px; font-size: 13px; font-weight: 600; color: var(--text); text-decoration: none; background: var(--card-2); border: 1px solid var(--line); border-radius: 999px; padding: 6px 12px; transition: border-color .12s, color .12s, transform .08s; }
.kns-chip:hover { border-color: var(--accent); color: var(--accent); transform: translateY(-1px); }
.kns-chip.ka { cursor: pointer; }
.kns-chip-more { color: var(--dim); background: none; }
.kns-v { color: var(--accent); font-size: 11px; font-weight: 700; }

/* owner lookup */
.kns-lookup { display: flex; gap: 8px; padding: 2px 16px 12px; }
.kns-input { flex: 1; min-width: 0; background: var(--bg-2); border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; color: var(--text); font-family: inherit; font-size: 13px; outline: none; transition: border-color .12s; }
.kns-input:focus { border-color: var(--accent); }
.kns-lookup-btn { flex: none; background: var(--accent); color: #06201c; border: none; border-radius: 10px; padding: 10px 16px; font-family: inherit; font-size: 13px; font-weight: 700; cursor: pointer; transition: filter .12s; }
.kns-lookup-btn:hover { filter: brightness(1.08); }
.kns-lookup-out { padding: 0 4px; }
.kns-lookup-count { padding: 4px 16px 6px; font-size: 13px; color: var(--dim); }
.kns-lookup-count b { color: var(--text); }
.kns-lookup-count .ka { color: var(--accent); text-decoration: none; }

/* .kas names inside the wallet profile card */
.wp-kns { margin-top: 12px; }
.wp-kns-head { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--dim); margin: 0 0 8px; }
.wp-kns-head b { color: var(--text); }
.wp-kns-ico { font-size: 13px; }
.wp-kns-chips { padding: 0; }

@media (max-width: 860px) {
  .kns-layout { grid-template-columns: 1fr; }
  .kns-feed { max-height: 380px; }
}

/* ── M35: Mint Radar ─────────────────────────────────────────────────────── */
.mr-controls { margin: 4px 0 16px; }
.mr-sorts { display: flex; flex-wrap: wrap; gap: 8px; }
.mr-sort {
  background: var(--card); color: var(--dim); border: 1px solid var(--line);
  border-radius: 999px; padding: 7px 14px; font-size: 13px; font-weight: 600;
  cursor: pointer; transition: all .15s ease;
}
.mr-sort:hover { color: var(--text); border-color: var(--accent-2); }
.mr-sort.active { background: var(--accent); color: #06231f; border-color: var(--accent); }

.mr-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(232px, 1fr));
  gap: 12px;
}
.mr-card {
  text-align: left; background: var(--card); border: 1px solid var(--line);
  border-radius: 14px; padding: 14px; cursor: pointer; color: var(--text);
  display: flex; flex-direction: column; gap: 10px; font: inherit;
  transition: border-color .15s ease, transform .1s ease, box-shadow .15s ease;
}
.mr-card:hover { border-color: var(--accent-2); transform: translateY(-2px); box-shadow: 0 8px 22px rgba(0,0,0,.28); }
.mr-card-top { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.mr-tick { font-weight: 800; font-size: 16px; letter-spacing: .3px; }
.mr-pct { font-variant-numeric: tabular-nums; font-weight: 700; font-size: 15px; color: var(--dim); }
.mr-hot .mr-pct { color: var(--up); }
.mr-mid .mr-pct { color: var(--accent); }

.mr-bar { height: 8px; border-radius: 6px; background: var(--bg-2); overflow: hidden; border: 1px solid var(--line); }
.mr-bar-fill { display: block; height: 100%; border-radius: 6px; background: linear-gradient(90deg, var(--accent-2), var(--accent)); transition: width .4s ease; }
.mr-hot .mr-bar-fill { background: linear-gradient(90deg, #2bb673, var(--up)); }
.mr-low .mr-bar-fill { background: linear-gradient(90deg, #2e6f74, var(--accent-2)); }

.mr-meta { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: 12px; }
.mr-active { color: var(--dim-2); font-variant-numeric: tabular-nums; }
.mr-active.live { color: var(--up); font-weight: 600; }
.mr-eta { color: var(--accent); font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }

.mr-stats { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 12px; color: var(--dim); font-variant-numeric: tabular-nums; }
.mr-stats span i { color: var(--dim-2); font-style: normal; font-size: 11px; text-transform: uppercase; letter-spacing: .4px; margin-right: 4px; }

@media (max-width: 560px) {
  .mr-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
  .mr-card { padding: 12px; border-radius: 12px; }
  .mr-tick { font-size: 15px; }
}
@media (max-width: 380px) {
  .mr-grid { grid-template-columns: 1fr; }
}

/* ── M36: KAS Flow — native KAS large-transfer tape ── */
.kf-controls { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; margin: 4px 0 14px; }
.kf-filters, .kf-sorts { display: flex; flex-wrap: wrap; gap: 8px; }
.kf-filter, .kf-sort {
  background: var(--card); color: var(--dim); border: 1px solid var(--line);
  border-radius: 999px; padding: 7px 14px; font-size: 13px; font-weight: 600;
  cursor: pointer; transition: all .15s ease;
}
.kf-filter:hover, .kf-sort:hover { color: var(--text); border-color: var(--accent-2); }
.kf-filter.active, .kf-sort.active { background: var(--accent); color: #06231f; border-color: var(--accent); }

.kf-body { display: flex; flex-direction: column; gap: 8px; }
.kf-row {
  display: grid; grid-template-columns: minmax(150px, 0.9fr) minmax(180px, 1.4fr) minmax(120px, auto);
  align-items: center; gap: 10px 16px;
  background: var(--card); border: 1px solid var(--line); border-left: 3px solid var(--line);
  border-radius: 12px; padding: 11px 14px; transition: border-color .15s ease, transform .1s ease;
}
.kf-row:hover { border-color: var(--accent-2); transform: translateX(2px); }
.kf-row.kf-whale { border-left-color: var(--up); }
.kf-row.kf-shark { border-left-color: var(--accent); }
.kf-row.kf-dolph { border-left-color: var(--accent-2); }
.kf-row.kf-drop  { border-left-color: var(--line); }

.kf-amt { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 8px; }
.kf-emoji { font-size: 15px; line-height: 1; align-self: center; }
.kf-kas { font-weight: 800; font-size: 16px; font-variant-numeric: tabular-nums; letter-spacing: .2px; }
.kf-whale .kf-kas { color: var(--up); }
.kf-usd { color: var(--dim); font-size: 12.5px; font-variant-numeric: tabular-nums; }

.kf-mid { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 12px; font-size: 12.5px; color: var(--dim); }
.kf-to { overflow: hidden; text-overflow: ellipsis; }
.kf-io, .kf-mass { color: var(--dim-2); font-variant-numeric: tabular-nums; white-space: nowrap; }

.kf-right { display: flex; align-items: center; justify-content: flex-end; gap: 12px; font-size: 12.5px; }
.kf-tx { color: var(--accent-2); }
.kf-tx:hover { color: var(--accent); text-decoration: underline; }
.kf-age { color: var(--dim-2); font-variant-numeric: tabular-nums; white-space: nowrap; }
.kf-age.live { color: var(--up); font-weight: 600; }

@media (max-width: 640px) {
  .kf-row { grid-template-columns: 1fr auto; row-gap: 6px; padding: 10px 12px; }
  .kf-amt { grid-column: 1; }
  .kf-right { grid-column: 2; grid-row: 1; flex-direction: column; align-items: flex-end; gap: 3px; }
  .kf-mid { grid-column: 1 / -1; }
}

/* ── M37: Miner Emission — coinbase distribution + payout tape ── */
.me-grid { display: grid; grid-template-columns: minmax(280px, 1fr) minmax(300px, 1.15fr); gap: 22px; align-items: start; }
.me-h3 { font-size: 14px; font-weight: 700; margin: 0 0 12px; color: var(--text); }
.me-h3-sub { font-weight: 400; color: var(--dim-2); font-size: 12px; }
.me-dist { display: flex; flex-direction: column; gap: 12px; }
.me-mbar { background: var(--card); border: 1px solid var(--line); border-radius: 10px; padding: 9px 12px; }
.me-mbar-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 6px; }
.me-mbar-addr { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12.5px; }
.me-mbar-pct { font-weight: 800; font-size: 13px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.me-mbar-pct.hot { color: var(--down); }
.me-mbar-pct.warm { color: var(--accent); }
.me-mbar-pct.cool { color: var(--accent-2); }
.me-mbar-track { height: 7px; border-radius: 4px; background: var(--card-2); overflow: hidden; }
.me-mbar-fill { display: block; height: 100%; border-radius: 4px; transition: width .3s ease; }
.me-mbar-fill.hot { background: var(--down); }
.me-mbar-fill.warm { background: var(--accent); }
.me-mbar-fill.cool { background: var(--accent-2); }
.me-mbar-sub { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 5px; font-size: 11.5px; color: var(--dim-2); font-variant-numeric: tabular-nums; }

.me-controls { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 12px; }
.me-sorts { display: flex; flex-wrap: wrap; gap: 8px; }
.me-sort {
  background: var(--card-2); border: 1px solid var(--line); color: var(--dim);
  font-family: inherit; font-size: 12.5px; font-weight: 600; padding: 6px 13px;
  border-radius: 8px; cursor: pointer; transition: border-color .12s, color .12s, background .12s;
}
.me-sort:hover { color: var(--text); border-color: var(--accent-2); }
.me-sort.active { background: var(--accent); color: #06231f; border-color: var(--accent); }

.me-body { display: flex; flex-direction: column; gap: 8px; }
.me-row {
  display: grid; grid-template-columns: minmax(150px, 0.9fr) minmax(150px, 1.2fr) minmax(120px, auto);
  align-items: center; gap: 8px 16px;
  background: var(--card); border: 1px solid var(--line); border-left: 3px solid var(--accent-2);
  border-radius: 12px; padding: 10px 14px; transition: border-color .15s ease, transform .1s ease;
}
.me-row:hover { border-color: var(--accent-2); transform: translateX(2px); }
.me-amt { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 8px; }
.me-pick { font-size: 14px; line-height: 1; align-self: center; }
.me-kas { font-weight: 800; font-size: 15px; font-variant-numeric: tabular-nums; letter-spacing: .2px; }
.me-usd { color: var(--dim); font-size: 12.5px; font-variant-numeric: tabular-nums; }
.me-mid { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 12px; font-size: 12.5px; color: var(--dim); }
.me-to { overflow: hidden; text-overflow: ellipsis; }
.me-right { display: flex; align-items: center; justify-content: flex-end; gap: 12px; font-size: 12.5px; }
.me-tx { color: var(--accent-2); }
.me-tx:hover { color: var(--accent); text-decoration: underline; }
.me-age { color: var(--dim-2); font-variant-numeric: tabular-nums; white-space: nowrap; }
.me-age.live { color: var(--up); font-weight: 600; }

@media (max-width: 860px) { .me-grid { grid-template-columns: 1fr; gap: 26px; } }
@media (max-width: 640px) {
  .me-row { grid-template-columns: 1fr auto; row-gap: 6px; padding: 10px 12px; }
  .me-amt { grid-column: 1; }
  .me-right { grid-column: 2; grid-row: 1; flex-direction: column; align-items: flex-end; gap: 3px; }
  .me-mid { grid-column: 1 / -1; }
}

/* M38 — KAS Rich List (wealth distribution + whale concentration) */
.rl-grid { display: grid; grid-template-columns: minmax(280px, 1fr) minmax(300px, 1.2fr); gap: 22px; align-items: start; }
.rl-h3 { font-size: 14px; font-weight: 700; margin: 0 0 12px; color: var(--text); }
.rl-h3-sub { font-weight: 400; color: var(--dim-2); font-size: 12px; }
.rl-conc { display: flex; flex-direction: column; gap: 10px; }
.rl-cbar { background: var(--card); border: 1px solid var(--line); border-radius: 10px; padding: 9px 12px; }
.rl-cbar-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 6px; }
.rl-cbar-k { font-size: 12.5px; font-weight: 600; color: var(--text); }
.rl-cbar-pct { font-weight: 800; font-size: 13px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.rl-cbar-pct.hot { color: var(--down); }
.rl-cbar-pct.warm { color: var(--accent); }
.rl-cbar-pct.cool { color: var(--accent-2); }
.rl-cbar-track { height: 7px; border-radius: 4px; background: var(--card-2); overflow: hidden; }
.rl-cbar-fill { display: block; height: 100%; border-radius: 4px; transition: width .3s ease; }
.rl-cbar-fill.hot { background: var(--down); }
.rl-cbar-fill.warm { background: var(--accent); }
.rl-cbar-fill.cool { background: var(--accent-2); }
.rl-cbar-sub { margin-top: 5px; font-size: 11.5px; color: var(--dim-2); font-variant-numeric: tabular-nums; }

.rl-controls { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 12px; }
.rl-sorts { display: flex; flex-wrap: wrap; gap: 8px; }
.rl-sort {
  background: var(--card-2); color: var(--dim); border: 1px solid var(--line);
  border-radius: 999px; padding: 5px 13px; font-size: 12.5px; font-weight: 600;
  cursor: pointer; transition: color .15s ease, background .15s ease, border-color .15s ease;
}
.rl-sort:hover { color: var(--text); border-color: var(--accent-2); }
.rl-sort.active { background: var(--accent); color: #06231f; border-color: var(--accent); }

.rl-body { display: flex; flex-direction: column; gap: 6px; }
.rl-row {
  display: grid; grid-template-columns: 56px minmax(120px, 1.4fr) minmax(110px, auto) 84px;
  align-items: center; gap: 8px 14px;
  background: var(--card); border: 1px solid var(--line); border-left: 3px solid var(--accent-2);
  border-radius: 10px; padding: 9px 14px; transition: border-color .15s ease, transform .1s ease;
}
.rl-row:hover { border-color: var(--accent-2); transform: translateX(2px); }
.rl-row.rl-head {
  background: transparent; border: none; border-left: 3px solid transparent; padding: 2px 14px 4px;
  font-size: 11px; letter-spacing: .4px; text-transform: uppercase; color: var(--dim-2); transform: none;
}
.rl-row.rl-head:hover { transform: none; }
.rl-rank { font-weight: 800; font-size: 13px; color: var(--dim); font-variant-numeric: tabular-nums; }
.rl-addr { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12.5px; }
.rl-kas { display: flex; align-items: baseline; flex-wrap: wrap; gap: 3px 8px; font-weight: 800; font-size: 14px; font-variant-numeric: tabular-nums; }
.rl-usd { color: var(--dim); font-size: 11.5px; font-weight: 500; }
.rl-pct { text-align: right; font-size: 12.5px; color: var(--dim); font-variant-numeric: tabular-nums; }

@media (max-width: 860px) { .rl-grid { grid-template-columns: 1fr; gap: 26px; } }
@media (max-width: 560px) {
  .rl-row { grid-template-columns: 42px 1fr auto; row-gap: 4px; padding: 9px 12px; }
  .rl-pct { grid-column: 3; grid-row: 2; }
  .rl-kas { grid-column: 2 / 4; grid-row: 2; justify-content: flex-start; }
  .rl-addr { grid-column: 2 / 4; }
  .rl-row.rl-head { display: none; }
}

/* ── M39: OHLC Candlestick Chart + Kaspa Asset Profile ───────────────── */

/* Chart view toggle (Line / Candles) */
.ta-bar-sep { width: 1px; height: 18px; background: var(--line); margin: 0 4px; display: inline-block; vertical-align: middle; }

/* Candlestick elements */
.candle-wick { stroke-width: 1; }
.candle-wick.up { stroke: var(--accent-2); }
.candle-wick.dn { stroke: var(--down); }
.candle-body { stroke-width: 0; }
.candle-body.up { fill: var(--accent-2); }
.candle-body.dn { fill: var(--down); }
.candle-body.doji-up { fill: var(--accent-2); opacity: 0.7; }
.candle-body.doji-dn { fill: var(--down); opacity: 0.7; }

/* Asset Profile section */
#coinprofile { scroll-margin-top: 64px; }
.cp-grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 14px;
}
.cp-card {
  background: var(--card); border: 1px solid var(--line); border-radius: 12px;
  padding: 16px 18px; display: flex; flex-direction: column; gap: 4px;
}
.cp-label { font-size: 11px; letter-spacing: .4px; text-transform: uppercase; color: var(--dim-2); font-weight: 600; }
.cp-value { font-size: 22px; font-weight: 800; font-variant-numeric: tabular-nums; color: var(--text); }
.cp-sub { font-size: 12px; color: var(--dim); }
.cp-change { font-size: 13px; font-weight: 700; font-variant-numeric: tabular-nums; }
.cp-change.neg { color: var(--down); }
.cp-change.pos { color: var(--accent-2); }

.cp-ath { border-left: 3px solid var(--down); }
.cp-atl { border-left: 3px solid var(--accent-2); }

.cp-lower { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.cp-card-head { font-size: 13px; font-weight: 700; margin-bottom: 10px; color: var(--text); }

.cp-dev-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 12px; }
.cp-stat-n { display: block; font-size: 20px; font-weight: 800; font-variant-numeric: tabular-nums; color: var(--accent-2); }
.cp-stat-l { font-size: 11px; color: var(--dim-2); text-transform: uppercase; letter-spacing: .3px; }

.cp-categories { display: flex; flex-wrap: wrap; gap: 6px; }
.cp-tag {
  background: var(--card-2); border: 1px solid var(--line); border-radius: 999px;
  padding: 3px 10px; font-size: 11px; color: var(--dim); font-weight: 500;
}

.cp-comm-row { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 10px; }
.cp-comm-label { font-size: 12.5px; color: var(--dim); }
.cp-comm-val { font-size: 18px; font-weight: 800; font-variant-numeric: tabular-nums; }

.cp-sentiment { margin-bottom: 10px; }
.cp-sent-bar { height: 8px; border-radius: 4px; overflow: hidden; display: flex; background: var(--card-2); }
.cp-sent-up { background: var(--accent-2); transition: width .3s ease; }
.cp-sent-down { background: var(--down); transition: width .3s ease; }
.cp-sent-labels { display: flex; justify-content: space-between; margin-top: 4px; font-size: 11.5px; font-variant-numeric: tabular-nums; }
.cp-sent-up-l { color: var(--accent-2); font-weight: 600; }
.cp-sent-down-l { color: var(--down); font-weight: 600; }

.cp-desc { font-size: 12.5px; line-height: 1.55; color: var(--dim); max-height: 120px; overflow-y: auto; }

@media (max-width: 760px) {
  .cp-grid { grid-template-columns: repeat(2, 1fr); }
  .cp-lower { grid-template-columns: 1fr; }
  .cp-dev-grid { grid-template-columns: repeat(3, 1fr); gap: 8px; }
  .cp-stat-n { font-size: 17px; }
}
@media (max-width: 420px) {
  .cp-grid { grid-template-columns: 1fr; }
  .cp-dev-grid { grid-template-columns: repeat(2, 1fr); }
}

/* ── M40: Perpetual Futures Dashboard ── */
.perps-summary { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-bottom: 14px; }
.perps-stat {
  background: rgba(125,160,152,0.04); border-radius: 10px; padding: 14px;
  display: flex; flex-direction: column; gap: 4px;
}
.perps-stat-label { font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em; color: rgba(125,160,152,0.5); }
.perps-stat-val { font-size: 22px; font-weight: 700; color: var(--txt); font-variant-numeric: tabular-nums; }
.perps-stat-sub { font-size: 11px; color: rgba(125,160,152,0.45); }
.perps-chart-card, .perps-table-card, .perps-funding-card {
  background: rgba(125,160,152,0.04); border-radius: 10px; padding: 12px; margin-bottom: 12px;
}
.perps-sort-toggle { display: flex; gap: 4px; }
.perps-sort-btn {
  background: none; border: 1px solid rgba(125,160,152,0.15); border-radius: 6px;
  color: rgba(125,160,152,0.6); font-size: 11px; padding: 3px 8px; cursor: pointer;
  transition: all 0.15s;
}
.perps-sort-btn:hover { border-color: rgba(125,160,152,0.3); color: var(--txt); }
.perps-sort-btn.active { background: rgba(73,234,203,0.1); border-color: rgba(73,234,203,0.3); color: #49eacb; }
.perps-oi-bars { display: flex; flex-direction: column; gap: 3px; }
.perps-oi-row {
  display: grid; grid-template-columns: 120px 1fr auto; gap: 8px; align-items: center;
  font-size: 12px;
}
.perps-oi-name { color: rgba(125,160,152,0.8); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.perps-oi-track { height: 8px; background: rgba(125,160,152,0.06); border-radius: 4px; overflow: hidden; }
.perps-oi-fill { height: 100%; border-radius: 4px; transition: width 0.4s ease; }
.perps-oi-fill.oi { background: linear-gradient(90deg, rgba(73,234,203,0.3), rgba(73,234,203,0.7)); }
.perps-oi-fill.vol { background: linear-gradient(90deg, rgba(255,179,68,0.3), rgba(255,179,68,0.7)); }
.perps-oi-fill.fund-pos { background: linear-gradient(90deg, rgba(73,234,203,0.2), rgba(73,234,203,0.5)); }
.perps-oi-fill.fund-neg { background: linear-gradient(90deg, rgba(255,107,107,0.2), rgba(255,107,107,0.5)); }
.perps-oi-fill.faded { opacity: 0.5; }
.perps-oi-val { color: var(--txt); font-size: 11px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.perps-oi-extra { color: rgba(125,160,152,0.4); font-size: 10px; }
.perps-table-wrap { overflow-x: auto; }
.perps-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.perps-table th {
  text-align: right; padding: 6px 8px; font-size: 10px; text-transform: uppercase;
  letter-spacing: 0.06em; color: rgba(125,160,152,0.4); border-bottom: 1px solid rgba(125,160,152,0.08);
}
.perps-table th:first-child { text-align: left; }
.perps-table td {
  padding: 5px 8px; text-align: right; border-bottom: 1px solid rgba(125,160,152,0.03);
  font-variant-numeric: tabular-nums; color: rgba(125,160,152,0.8);
}
.perps-table td:first-child { text-align: left; color: var(--txt); font-weight: 500; }
.perps-table tr:hover td { background: rgba(125,160,152,0.04); }
.perps-funding-pos { color: #49eacb; }
.perps-funding-neg { color: #ff6b6b; }
.perps-funding-zero { color: rgba(125,160,152,0.4); }
.perps-basis-pos { color: #49eacb; }
.perps-basis-neg { color: #ff6b6b; }
.perps-basis-zero { color: rgba(125,160,152,0.4); }
.perps-funding-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 8px;
}
.perps-funding-chip {
  background: rgba(125,160,152,0.04); border-radius: 8px; padding: 8px 10px;
  display: flex; flex-direction: column; gap: 2px;
  border-left: 3px solid rgba(125,160,152,0.1);
}
.perps-funding-chip.pos { border-left-color: rgba(73,234,203,0.5); }
.perps-funding-chip.neg { border-left-color: rgba(255,107,107,0.5); }
.perps-fc-name { font-size: 11px; color: rgba(125,160,152,0.7); }
.perps-fc-rate { font-size: 14px; font-weight: 600; font-variant-numeric: tabular-nums; }
.perps-fc-rate.pos { color: #49eacb; }
.perps-fc-rate.neg { color: #ff6b6b; }
.perps-fc-sub { font-size: 10px; color: rgba(125,160,152,0.35); }

@media (max-width: 760px) {
  .perps-summary { grid-template-columns: repeat(2, 1fr); }
  .perps-oi-row { grid-template-columns: 90px 1fr auto; }
}
@media (max-width: 480px) {
  .perps-summary { grid-template-columns: 1fr; }
}


/* ── M41: Global Market Context ────────────────────────────────────────────── */
.mc-global-strip {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 16px;
}
.mc-stat {
  background: rgba(125,160,152,0.03); border: 1px solid rgba(125,160,152,0.08);
  border-radius: 10px; padding: 14px 16px;
  display: flex; flex-direction: column; gap: 3px;
}
.mc-stat-label { font-size: 11px; color: rgba(125,160,152,0.5); text-transform: uppercase; letter-spacing: 0.05em; }
.mc-stat-val { font-size: 22px; font-weight: 700; font-variant-numeric: tabular-nums; }
.mc-stat-sub { font-size: 11px; color: rgba(125,160,152,0.4); }
.mc-kas-card {
  background: rgba(73,234,203,0.06); border-color: rgba(73,234,203,0.2);
}
.mc-kas-card .mc-stat-val { color: #49eacb; }

.mc-kas-vs-card { margin-bottom: 16px; padding: 16px; }
.mc-kas-bars {
  display: flex; align-items: flex-end; gap: 3px; height: 140px;
  padding: 0 4px; position: relative;
}
.mc-bar {
  flex: 1; min-width: 0; border-radius: 3px 3px 0 0; position: relative;
  transition: opacity 0.15s; cursor: default;
}
.mc-bar.gain { background: linear-gradient(180deg, rgba(73,234,203,0.8), rgba(73,234,203,0.3)); }
.mc-bar.loss { background: linear-gradient(180deg, rgba(255,107,107,0.8), rgba(255,107,107,0.3)); }
.mc-bar.kas {
  background: linear-gradient(180deg, #f0a020, rgba(240,160,32,0.3));
  box-shadow: 0 0 8px rgba(240,160,32,0.4);
}
.mc-bar:hover { opacity: 0.8; }
.mc-bar-tip {
  position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%);
  background: rgba(20,24,28,0.95); color: #e0e0e0; font-size: 10px;
  padding: 3px 6px; border-radius: 4px; white-space: nowrap;
  pointer-events: none; opacity: 0; transition: opacity 0.15s; z-index: 10;
  margin-bottom: 4px;
}
.mc-bar:hover .mc-bar-tip { opacity: 1; }
.mc-bar-label {
  position: absolute; bottom: -18px; left: 50%; transform: translateX(-50%);
  font-size: 9px; color: rgba(240,160,32,0.8); font-weight: 600;
}

.mc-movers-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 16px;
}
.mc-movers-card { padding: 14px; }
.mc-movers-list { display: flex; flex-direction: column; gap: 4px; }
.mc-mover-row {
  display: grid; grid-template-columns: 24px 1fr auto auto; gap: 8px; align-items: center;
  padding: 5px 6px; border-radius: 6px; font-size: 12px;
}
.mc-mover-row:hover { background: rgba(125,160,152,0.04); }
.mc-mover-rank { font-size: 10px; color: rgba(125,160,152,0.3); text-align: right; }
.mc-mover-name { font-weight: 600; font-size: 12px; }
.mc-mover-sym { font-size: 10px; color: rgba(125,160,152,0.4); margin-left: 4px; }
.mc-mover-price { font-size: 11px; color: rgba(125,160,152,0.5); font-variant-numeric: tabular-nums; }
.mc-mover-chg { font-weight: 700; font-variant-numeric: tabular-nums; font-size: 12px; }
.mc-mover-chg.pos { color: #49eacb; }
.mc-mover-chg.neg { color: #ff6b6b; }
.mc-mover-spark { width: 48px; height: 16px; opacity: 0.6; }

.mc-dom-card { padding: 16px; }
.mc-dom-wrap {
  display: flex; align-items: center; gap: 24px; flex-wrap: wrap;
}
.mc-dom-svg { flex-shrink: 0; }
.mc-dom-legend {
  display: flex; flex-direction: column; gap: 6px; flex: 1; min-width: 200px;
}
.mc-dom-row {
  display: grid; grid-template-columns: 12px 1fr auto; gap: 8px; align-items: center;
  font-size: 12px; padding: 3px 0;
}
.mc-dom-dot {
  width: 10px; height: 10px; border-radius: 2px;
}
.mc-dom-label { color: rgba(125,160,152,0.7); }
.mc-dom-val { font-weight: 600; font-variant-numeric: tabular-nums; }

@media (max-width: 760px) {
  .mc-global-strip { grid-template-columns: repeat(2, 1fr); }
  .mc-movers-grid { grid-template-columns: 1fr; }
  .mc-dom-wrap { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 480px) {
  .mc-global-strip { grid-template-columns: 1fr; }
  .mc-kas-bars { height: 100px; }
}

/* M42: Block Explorer */
.explorer-search {
  display: flex;
  gap: 10px;
  margin-bottom: 16px;
}
.explorer-input {
  flex: 1;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 12px 16px;
  color: var(--text);
  font-size: 14px;
  font-family: 'JetBrains Mono', monospace;
  outline: none;
  transition: border-color .2s;
}
.explorer-input:focus { border-color: var(--accent); }
.explorer-input::placeholder { color: var(--dim); }
.explorer-btn {
  background: var(--accent);
  color: #06231f;
  border: none;
  border-radius: 10px;
  padding: 12px 20px;
  font-weight: 600;
  font-size: 14px;
  cursor: pointer;
  white-space: nowrap;
  transition: opacity .2s, transform .1s;
}
.explorer-btn:hover { opacity: .9; }
.explorer-btn:active { transform: scale(.97); }

.ex-result { animation: fadeIn .3s ease; }
.ex-block-hash {
  font-family: 'JetBrains Mono', monospace;
  font-size: 13px;
  word-break: break-all;
  color: var(--dim);
  margin-bottom: 12px;
}
.ex-block-hash a {
  color: var(--accent-2);
  text-decoration: none;
}
.ex-block-hash a:hover { text-decoration: underline; }

.ex-stats {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 10px;
  margin-bottom: 16px;
}
.ex-stat {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 12px 14px;
}
.ex-stat .lbl {
  display: block;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--dim);
  margin-bottom: 4px;
}
.ex-stat .val {
  font-size: 18px;
  font-weight: 700;
  color: var(--text);
}
.ex-stat .val.mono {
  font-family: 'JetBrains Mono', monospace;
  font-size: 14px;
  font-weight: 500;
}
.ex-stat .val.chain-yes { color: var(--green); }
.ex-stat .val.chain-no { color: var(--orange); }

.ex-dag {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 14px;
  margin-bottom: 16px;
}
.ex-dag-title {
  font-size: 13px;
  font-weight: 600;
  color: var(--dim);
  margin-bottom: 10px;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.ex-hash-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.ex-chip {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
  padding: 3px 8px;
  border-radius: 6px;
  background: var(--bg);
  border: 1px solid var(--border);
  color: var(--accent-2);
  cursor: pointer;
  text-decoration: none;
  transition: border-color .2s;
}
.ex-chip:hover { border-color: var(--accent); text-decoration: none; }
.ex-chip.parent { color: var(--dim); }
.ex-chip.child { color: var(--accent); }
.ex-chip.blue { color: var(--green); border-color: rgba(73,234,170,.2); }
.ex-chip.red { color: var(--red); border-color: rgba(255,99,99,.15); }
.ex-chip.sink { color: var(--orange); border-color: rgba(255,165,0,.2); }

.ex-txs { display: flex; flex-direction: column; gap: 10px; }
.ex-tx {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 14px;
  transition: border-color .2s;
}
.ex-tx:hover { border-color: var(--accent-2); }
.ex-tx-head {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 10px;
}
.ex-tx-hash {
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
  color: var(--accent-2);
  text-decoration: none;
}
.ex-tx-hash:hover { text-decoration: underline; }
.ex-tx-badge {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: 2px 8px;
  border-radius: 4px;
  font-weight: 600;
}
.ex-tx-badge.coinbase { background: rgba(73,234,170,.12); color: var(--green); }
.ex-tx-badge.accepted { background: rgba(73,234,170,.08); color: var(--green); }
.ex-tx-badge.pending { background: rgba(255,165,0,.12); color: var(--orange); }
.ex-tx-io {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 8px 12px;
  align-items: start;
}
.ex-io-side {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.ex-io-row {
  display: flex;
  align-items: baseline;
  gap: 6px;
  font-size: 12px;
}
.ex-io-addr {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
  color: var(--dim);
  cursor: pointer;
  text-decoration: none;
}
.ex-io-addr:hover { color: var(--accent-2); }
.ex-io-amt {
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
  font-weight: 600;
  color: var(--text);
  white-space: nowrap;
}
.ex-io-arrow {
  text-align: center;
  color: var(--dim);
  font-size: 16px;
  padding-top: 2px;
}
.ex-tx-meta {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  font-size: 11px;
  color: var(--dim);
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid var(--border);
}

.ex-error {
  text-align: center;
  padding: 40px 20px;
  color: var(--dim);
}
.ex-error .ex-error-icon { font-size: 32px; margin-bottom: 8px; }
.ex-loading {
  text-align: center;
  padding: 40px 20px;
  color: var(--dim);
}

@media (max-width: 760px) {
  .explorer-search { flex-direction: column; }
  .ex-tx-io { grid-template-columns: 1fr; }
  .ex-io-arrow { transform: rotate(90deg); padding: 4px 0; }
}
@media (max-width: 480px) {
  .ex-stats { grid-template-columns: 1fr 1fr; }
}
/* ── M42b: PoW Competitive Landscape ───────────────────────────────────── */
.pow-pulse {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 10px;
  margin-bottom: 20px;
}
.pow-pulse .stat {
  background: var(--card, rgba(255,255,255,0.03));
  border: 1px solid var(--border, rgba(255,255,255,0.06));
  border-radius: 10px;
  padding: 14px;
}
.pow-pulse .pow-kas-stat {
  border-color: var(--accent, #14b8a6);
  background: rgba(20, 184, 166, 0.05);
}
.pow-chart-card { margin-bottom: 20px; }
.pow-sort-toggle {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
}
.pow-sort-btn {
  background: transparent;
  border: 1px solid var(--border, rgba(255,255,255,0.08));
  color: var(--dim, #94a3b8);
  font-size: 11px;
  padding: 4px 10px;
  border-radius: 6px;
  cursor: pointer;
  transition: all 0.15s;
}
.pow-sort-btn:hover { color: var(--text, #e2e8f0); border-color: var(--accent, #14b8a6); }
.pow-sort-btn.active {
  background: var(--accent, #14b8a6);
  color: #0a0e14;
  border-color: var(--accent, #14b8a6);
  font-weight: 600;
}
.pow-bars { display: flex; flex-direction: column; gap: 3px; }
.pow-bar-row {
  display: grid;
  grid-template-columns: 120px 1fr 80px;
  align-items: center;
  gap: 8px;
  padding: 4px 0;
  font-size: 12px;
}
.pow-bar-row.kas { background: rgba(20, 184, 166, 0.04); border-radius: 4px; padding: 4px 6px; }
.pow-bar-label { display: flex; align-items: center; gap: 6px; overflow: hidden; }
.pow-bar-sym { font-weight: 600; color: var(--text, #e2e8f0); white-space: nowrap; }
.pow-bar-name { font-size: 11px; color: var(--dim, #64748b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pow-bar-track {
  position: relative;
  height: 18px;
  background: rgba(255,255,255,0.02);
  border-radius: 3px;
  overflow: hidden;
}
.pow-bar-fill {
  height: 100%;
  border-radius: 3px;
  transition: width 0.3s ease;
}
.pow-bar-zero-line {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 1px;
  background: rgba(255,255,255,0.15);
}
.pow-bar-val {
  text-align: right;
  font-variant-numeric: tabular-nums;
  font-size: 11px;
  color: var(--text, #e2e8f0);
}
.pow-table-card { margin-bottom: 20px; }
.pow-tr {
  display: grid;
  grid-template-columns: 32px minmax(100px,1.5fr) 70px 60px 60px 60px 90px 80px 60px 80px 70px;
  align-items: center;
  gap: 4px;
  padding: 7px 10px;
  font-size: 12px;
  border-bottom: 1px solid var(--border, rgba(255,255,255,0.04));
}
.pow-tr.kas { background: rgba(20, 184, 166, 0.05); border-radius: 4px; }
.pow-tr:hover { background: rgba(255,255,255,0.03); }
.pow-tr .c-num.pos, .pow-tr .c-num .pos { color: var(--up, #22c55e); }
.pow-tr .c-num.neg { color: var(--down, #ef4444); }
.pow-tr .c-num.mild { color: var(--dim, #94a3b8); }
.pow-dag-card { margin-bottom: 20px; }
.pow-dag-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 12px;
}
.pow-dag-tile {
  background: var(--card, rgba(255,255,255,0.03));
  border: 1px solid var(--border, rgba(255,255,255,0.06));
  border-radius: 10px;
  padding: 14px;
  position: relative;
}
.pow-dag-tile.kas {
  border-color: var(--accent, #14b8a6);
  background: rgba(20, 184, 166, 0.05);
}
.pow-dag-head {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 8px;
}
.pow-dag-sym { font-weight: 700; font-size: 14px; color: var(--text, #e2e8f0); }
.pow-dag-rank { margin-left: auto; font-size: 11px; color: var(--dim, #64748b); }
.pow-dag-price { font-size: 16px; font-weight: 600; color: var(--text, #e2e8f0); margin-bottom: 2px; }
.pow-dag-change { font-size: 13px; font-weight: 600; }
.pow-dag-change.pos { color: var(--up, #22c55e); }
.pow-dag-change.neg { color: var(--down, #ef4444); }
.pow-dag-period { font-weight: 400; color: var(--dim, #64748b); font-size: 11px; }
.pow-dag-mcap { font-size: 12px; color: var(--dim, #94a3b8); margin-top: 6px; }
.pow-dag-vol { font-size: 11px; color: var(--dim, #64748b); }
.pow-dag-badge {
  display: inline-block;
  margin-top: 6px;
  font-size: 10px;
  padding: 2px 6px;
  border-radius: 4px;
  background: rgba(20, 184, 166, 0.15);
  color: var(--accent, #14b8a6);
  font-weight: 600;
}
.token-logo-sm {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  flex-shrink: 0;
}

@media (max-width: 760px) {
  .pow-bar-row { grid-template-columns: 80px 1fr 60px; }
  .pow-bar-name { display: none; }
  .pow-tr {
    grid-template-columns: 28px minmax(80px,1.5fr) 65px 55px 80px;
  }
}
@media (max-width: 480px) {
  .pow-pulse { grid-template-columns: 1fr 1fr; }
  .pow-dag-grid { grid-template-columns: 1fr 1fr; }
}

/* M43: KRC-20 Liquidity Depth Analysis */
.liquidity-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin-bottom: 30px;
}

.liquidity-heatmap-card,
.liquidity-stats-card {
  background: var(--card-2);
  border-radius: 14px;
  padding: 20px;
}

.liquidity-heatmap-card h3,
.liquidity-stats-card h3 {
  margin-bottom: 12px;
  font-size: 16px;
  font-weight: 700;
}

.liquidity-note {
  font-size: 13px;
  color: var(--dim);
  margin-bottom: 16px;
  line-height: 1.5;
}

.liquidity-heatmap {
  display: grid;
  grid-template-columns: repeat(10, 1fr);
  gap: 2px;
  margin-bottom: 16px;
  height: 200px;
}

.heatmap-cell {
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 600;
  color: var(--bg);
  position: relative;
  min-height: 18px;
}

.heatmap-cell.deep { background: var(--up); }
.heatmap-cell.medium { background: var(--accent); }
.heatmap-cell.shallow { background: var(--accent-2); }
.heatmap-cell.illiquid { background: var(--line); }

.liquidity-legend { margin-top: 16px; }

.legend-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
}

.legend-label {
  font-size: 12px;
  color: var(--dim);
  min-width: 80px;
}

.legend-item {
  font-size: 11px;
  padding: 2px 8px;
  border-radius: 4px;
  font-weight: 600;
}

.legend-item.deep { background: var(--up); }
.legend-item.medium { background: var(--accent); }
.legend-item.shallow { background: var(--accent-2); }
.legend-item.illiquid { background: var(--line); }

.liquidity-alloc {
  background: var(--card);
  border-radius: 12px;
  padding: 20px;
  margin-bottom: 16px;
  height: 200px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}

.liquidity-warnings { margin-bottom: 16px; }

.liquidity-warning {
  background: rgba(255, 107, 107, 0.1);
  border: 1px solid rgba(255, 107, 107, 0.3);
  border-radius: 8px;
  padding: 10px 12px;
  font-size: 13px;
  color: var(--down);
  margin-bottom: 8px;
}

.liquidity-warning.warning {
  background: rgba(255, 193, 7, 0.1);
  border-color: rgba(255, 193, 7, 0.3);
  color: #ffc107;
}

.liquidity-score {
  background: var(--card);
  border-radius: 8px;
  padding: 12px 16px;
  display: flex;
  align-items: center;
  gap: 10px;
}

.liquidity-score-label { font-size: 13px; color: var(--dim); }
.liquidity-score-value { font-size: 18px; font-weight: 700; color: var(--accent); }
.liquidity-score-desc { font-size: 11px; color: var(--dim); }

.liquidity-details { margin-top: 30px; }

.liquidity-filters {
  display: flex;
  gap: 8px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}

.liquidity-filter {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 6px 12px;
  font-size: 12px;
  font-weight: 600;
  color: var(--dim);
  cursor: pointer;
  transition: all 0.12s;
}

.liquidity-filter:hover {
  border-color: var(--accent);
  color: var(--accent);
}

.liquidity-filter.is-on {
  background: var(--accent);
  border-color: var(--accent);
  color: var(--bg);
}

.liquidity-row {
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  padding: 12px 14px;
  gap: 8px;
}

.liquidity-row .c-tok { font-weight: 600; }
.liquidity-row .c-tier { font-weight: 600; }

.liquidity-tier-badge {
  padding: 2px 8px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 600;
}

.liquidity-tier-badge.deep { background: var(--up); color: var(--bg); }
.liquidity-tier-badge.medium { background: var(--accent); color: var(--bg); }
.liquidity-tier-badge.shallow { background: var(--accent-2); color: var(--bg); }
.liquidity-tier-badge.illiquid { background: var(--line); color: var(--text); }

.liquidity-trading-hours { font-size: 12px; font-weight: 600; }

.liquidity-concentration { font-size: 12px; font-weight: 600; }
.liquidity-concentration.low { color: var(--up); }
.liquidity-concentration.medium { color: var(--accent); }
.liquidity-concentration.high { color: var(--down); }

@media (max-width: 760px) {
  .liquidity-grid { grid-template-columns: 1fr; gap: 16px; }
  .liquidity-heatmap { height: 150px; grid-template-columns: repeat(10, 1fr); }
  .liquidity-heatmap-cell { min-height: 12px; font-size: 9px; }
  .liquidity-row { grid-template-columns: 1fr 1fr 1fr; }
  .liquidity-row .c-tok, .liquidity-row .c-tier { grid-column: span 1; }
  .liquidity-row .c-num { display: none; }
  .liquidity-row .c-hide-sm { display: none; }
  .liquidity-filters { justify-content: center; }
}

@media (max-width: 480px) {
  .liquidity-heatmap {
    grid-template-columns: repeat(5, 1fr);
    grid-template-rows: repeat(2, 1fr);
    height: 100px;
  }
  .liquidity-legend { font-size: 10px; }
  .liquidity-score { flex-direction: column; align-items: flex-start; gap: 4px; }
}

/* M44: KRC-20 Volatility & Risk-Adjusted Returns */
.vol-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin-bottom: 24px;
}

.vol-chart-card {
  background: var(--card-2);
  border-radius: 14px;
  padding: 20px;
}

.vol-chart-card h3 {
  margin-bottom: 8px;
  font-size: 16px;
  font-weight: 700;
}

.vol-chart-note {
  font-size: 13px;
  color: var(--dim);
  margin-bottom: 16px;
  line-height: 1.5;
}

#vol-scatter-svg {
  width: 100%;
  height: 320px;
  display: block;
}

.vol-table {
  margin-top: 20px;
}

.vol-table-head {
  display: grid;
  grid-template-columns: 40px 1fr 80px 80px 80px 90px;
  gap: 8px;
  padding: 8px 14px;
  font-size: 11px;
  font-weight: 600;
  color: var(--dim);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  border-bottom: 1px solid var(--line);
}

.vol-row {
  display: grid;
  grid-template-columns: 40px 1fr 80px 80px 80px 90px;
  gap: 8px;
  padding: 10px 14px;
  align-items: center;
  border-bottom: 1px solid var(--line);
  cursor: pointer;
  transition: background 0.12s;
}

.vol-row:hover { background: var(--card-2); }

.vol-row .c-rank { font-size: 13px; color: var(--dim); font-weight: 600; }
.vol-row .c-tick { font-weight: 700; font-size: 14px; }
.vol-row .c-vol { font-size: 13px; font-weight: 600; }
.vol-row .c-ret { font-size: 13px; font-weight: 600; }
.vol-row .c-sharpe { font-size: 13px; font-weight: 700; }
.vol-row .c-tier { text-align: right; }

.vol-tier-badge {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 4px;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.vol-tier-badge.low { background: rgba(63,214,132,0.15); color: var(--up); }
.vol-tier-badge.medium { background: rgba(73,234,203,0.15); color: var(--accent); }
.vol-tier-badge.high { background: rgba(255,193,7,0.15); color: #ffc107; }
.vol-tier-badge.extreme { background: rgba(255,107,107,0.15); color: var(--down); }

.vol-pulse {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  gap: 12px;
  margin-bottom: 20px;
}

@media (max-width: 760px) {
  .vol-grid { grid-template-columns: 1fr; }
  #vol-scatter-svg { height: 260px; }
  .vol-pulse { grid-template-columns: 1fr 1fr; }
  .vol-table-head, .vol-row { grid-template-columns: 28px 1fr 70px 90px; }
  .vol-table-head .c-vol, .vol-row .c-vol,
  .vol-table-head .c-ret, .vol-row .c-ret { display: none; }
}

@media (max-width: 480px) {
  #vol-scatter-svg { height: 220px; }
  .vol-pulse { grid-template-columns: 1fr; }
}

/* ── M45: Token Lifecycle & Survival Analytics ─────────────────────────────── */
.lc-funnel-wrap {
  margin: 0 0 1.5rem;
  padding: 1.25rem;
  background: var(--panel,#121a1c);
  border-radius: 10px;
  border: 1px solid var(--border,#1a2628);
}
.lc-funnel { display: flex; flex-direction: column; gap: 6px; }
.lc-funnel-row { display: flex; align-items: center; gap: 8px; }
.lc-funnel-bar {
  display: flex; align-items: center; justify-content: space-between;
  padding: 8px 14px; border-radius: 6px;
  min-width: 120px; transition: width .5s ease;
  font-size: .8rem; font-weight: 600;
  position: relative; overflow: hidden;
}
.lc-funnel-bar::before {
  content: ''; position: absolute; inset: 0;
  border-radius: 6px; opacity: .15;
}
.lc-stage-deployed::before { background: var(--teal,#2dd4bf); }
.lc-stage-minting::before { background: var(--blue,#60a5fa); }
.lc-stage-finished::before { background: var(--purple,#a78bfa); }
.lc-stage-listed::before { background: var(--green,#4ade80); }
.lc-stage-active::before { background: var(--gold,#fbbf24); }
.lc-stage-dead::before { background: var(--red,#f87171); }
.lc-stage-deployed { border-left: 3px solid var(--teal,#2dd4bf); }
.lc-stage-minting { border-left: 3px solid var(--blue,#60a5fa); }
.lc-stage-finished { border-left: 3px solid var(--purple,#a78bfa); }
.lc-stage-listed { border-left: 3px solid var(--green,#4ade80); }
.lc-stage-active { border-left: 3px solid var(--gold,#fbbf24); }
.lc-stage-dead { border-left: 3px solid var(--red,#f87171); }
.lc-funnel-label { color: var(--fg,#d1d5db); z-index: 1; }
.lc-funnel-count { color: var(--fg,#d1d5db); font-variant-numeric: tabular-nums; z-index: 1; }
.lc-funnel-pct { font-size: .7rem; color: var(--dim-2,#6b7280); margin-left: 6px; z-index: 1; }

.lc-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 1rem;
  margin-bottom: 1.5rem;
}
.lc-panel {
  background: var(--panel,#121a1c);
  border-radius: 10px; border: 1px solid var(--border,#1a2628);
  padding: 1.25rem;
}
.lc-panel-title {
  font-size: .85rem; font-weight: 600; color: var(--fg,#d1d5db);
  margin: 0 0 .75rem;
}
.lc-panel-sub {
  font-size: .7rem; color: var(--dim-2,#6b7280); font-weight: 400;
  margin-left: 6px;
}
.lc-chart-wrap { width: 100%; }
.lc-chart { width: 100%; height: 160px; display: block; }
.lc-chart .lc-bar { fill: var(--teal,#2dd4bf); opacity: .8; rx: 2; }
.lc-chart .lc-bar-now { fill: var(--gold,#fbbf24); }
.lc-chart .lc-axis { stroke: var(--border,#1a2628); stroke-width: 1; }
.lc-chart .lc-label { fill: var(--dim-2,#6b7280); font-size: 9px; }
.lc-chart .lc-val { fill: var(--fg,#d1d5db); font-size: 9px; font-weight: 600; }

.lc-fintime { display: flex; align-items: flex-end; gap: 6px; height: 140px; padding-top: 10px; }
.lc-ft-bar {
  flex: 1; min-width: 0;
  border-radius: 3px 3px 0 0;
  position: relative;
  display: flex; align-items: flex-start; justify-content: center;
  transition: height .5s ease;
}
.lc-ft-bar.b0 { background: var(--teal,#2dd4bf); }
.lc-ft-bar.b1 { background: var(--blue,#60a5fa); }
.lc-ft-bar.b2 { background: var(--green,#4ade80); }
.lc-ft-bar.b3 { background: var(--gold,#fbbf24); }
.lc-ft-bar.b4 { background: var(--orange,#fb923c); }
.lc-ft-bar.b5 { background: var(--red,#f87171); }
.lc-ft-label { font-size: .65rem; color: var(--dim-2,#6b7280); text-align: center; margin-top: 4px; }
.lc-ft-val { font-size: .7rem; color: var(--fg,#d1d5db); font-weight: 600; position: absolute; top: -16px; }
.lc-ft-axis { display: flex; gap: 6px; }
.lc-ft-axis > div { flex: 1; text-align: center; }

.lc-minting-section, .lc-stage-table-section {
  margin-bottom: 1.5rem;
}
.lc-minting-list { display: flex; flex-direction: column; gap: 4px; }
.lc-mint-row {
  display: grid; grid-template-columns: 90px 1fr 70px 70px;
  align-items: center; gap: 8px;
  padding: 6px 10px; border-radius: 6px;
  background: var(--card-bg,#0f1517);
  font-size: .78rem;
}
.lc-mint-tick { font-weight: 700; color: var(--fg,#d1d5db); }
.lc-mint-bar {
  height: 8px; border-radius: 4px; background: var(--border,#1a2628);
  overflow: hidden; position: relative;
}
.lc-mint-bar-fill {
  height: 100%; border-radius: 4px;
  background: linear-gradient(90deg, var(--blue,#60a5fa), var(--teal,#2dd4bf));
  transition: width .5s ease;
}
.lc-mint-pct { font-variant-numeric: tabular-nums; color: var(--fg,#d1d5db); text-align: right; font-weight: 600; }
.lc-mint-age { font-variant-numeric: tabular-nums; color: var(--dim-2,#6b7280); text-align: right; }

.lc-stage-table { width: 100%; border-collapse: collapse; font-size: .78rem; }
.lc-stage-table th {
  text-align: left; padding: 6px 8px; font-weight: 600;
  color: var(--dim-2,#6b7280); border-bottom: 1px solid var(--border,#1a2628);
  white-space: nowrap;
}
.lc-stage-table td {
  padding: 6px 8px; border-bottom: 1px solid var(--border-dim,#131e20);
  font-variant-numeric: tabular-nums; color: var(--fg,#d1d5db);
}
.lc-stage-table tr:hover td { background: var(--hover,#101819); }
.lc-stage-badge {
  display: inline-block; padding: 2px 8px; border-radius: 4px;
  font-size: .65rem; font-weight: 600; text-transform: uppercase;
}
.lc-stage-badge.s-deployed { background: rgba(45,212,191,.15); color: var(--teal,#2dd4bf); }
.lc-stage-badge.s-minting { background: rgba(96,165,250,.15); color: var(--blue,#60a5fa); }
.lc-stage-badge.s-finished { background: rgba(167,139,250,.15); color: var(--purple,#a78bfa); }
.lc-stage-badge.s-listed { background: rgba(74,222,128,.15); color: var(--green,#4ade80); }
.lc-stage-badge.s-active { background: rgba(251,191,36,.15); color: var(--gold,#fbbf24); }
.lc-stage-badge.s-dead { background: rgba(248,113,113,.15); color: var(--red,#f87171); }

@media (max-width: 700px) {
  .lc-grid { grid-template-columns: 1fr; }
  .lc-mint-row { grid-template-columns: 70px 1fr 55px 55px; font-size: .72rem; }
  .lc-funnel-bar { min-width: 90px; font-size: .72rem; }
}
@media (max-width: 480px) {
  .lc-stage-table th:nth-child(4),
  .lc-stage-table td:nth-child(4) { display: none; }
  .lc-mint-row { grid-template-columns: 60px 1fr 50px; }
  .lc-mint-age { display: none; }
}
