/* heatmap.css: /heatmap, /me/heatmap, /crypto/heatmap (static/heatmap.js) + the /crypto list and coin page + the home
   Market moves tabs (Stocks / Macro / Crypto). Tiles keep white ink on the red-gray-green scale in both themes. */
.hmx-wrap{max-width:1280px}
.hmx{position:relative;margin:4px 0 6px}
/* ---- controls (c62j, Oct 22 2026, Jason: "The buttons are terrible on the heat map"). c62e sizes: 32px segments + chips,
   30px back button, 44px tap areas via ::before; Option D selected (var(--sel-bg) / --sel-ink); no lime. One toolbar,
   left-aligned, wraps 8px apart; nothing pushed to opposite edges. ---- */
.hmx-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:8px 12px;margin:0 0 10px}
html[lang][data-theme] body.ct{--hmx-seg-bg:#EEF1F5;--hmx-seg-line:#DDE2E9;--hmx-seg-ink:#3A4352}
html[lang][data-theme=dark] body.ct{--hmx-seg-bg:#1B1E22;--hmx-seg-line:#2D3137;--hmx-seg-ink:#C3C9CF}
/* segmented control: one connected pill */
html[lang][data-theme] body.ct .hmx-seg:not(#_):not(#__):not(#___):not(#____){display:inline-flex!important;flex:none;align-items:center;gap:2px!important;padding:2px!important;margin:0!important;
  border:1px solid var(--hmx-seg-line)!important;border-radius:999px!important;background:var(--hmx-seg-bg)!important;max-width:100%;overflow:visible!important;flex-wrap:nowrap!important;width:auto!important}
html[lang][data-theme] body.ct .hmx-seg>:is(a,button):not(#_):not(#__):not(#___):not(#____){position:relative;box-sizing:border-box!important;display:inline-flex!important;align-items:center;justify-content:center;
  height:32px!important;min-height:32px!important;min-width:44px!important;padding:0 14px!important;margin:0!important;border:0!important;border-radius:999px!important;background:transparent!important;box-shadow:none!important;
  color:var(--hmx-seg-ink)!important;-webkit-text-fill-color:var(--hmx-seg-ink);font:600 13px/1 var(--f-body,"Inter",system-ui,sans-serif)!important;letter-spacing:0!important;text-decoration:none!important;white-space:nowrap;cursor:pointer;flex:none!important;width:auto!important;transition:background-color .15s,color .15s}
html[lang][data-theme] body.ct .hmx-seg>:is(a,button):not(.on):hover:not(#_):not(#__):not(#___):not(#____){color:var(--ink)!important;-webkit-text-fill-color:var(--ink);background:color-mix(in srgb,var(--ink) 6%,transparent)!important}
html[lang][data-theme] body.ct .hmx-seg>:is(a,button).on:not(#_):not(#__):not(#___):not(#____){background:var(--sel-bg,linear-gradient(135deg,#4A9FE3 0%,#3EC8C9 100%))!important;color:var(--sel-ink,#0B1A1B)!important;-webkit-text-fill-color:var(--sel-ink,#0B1A1B);box-shadow:0 1px 2px rgba(10,17,36,.12)!important}
html[lang][data-theme] body.ct .hmx-seg>:is(a,button)::before,html[lang][data-theme] body.ct :is(.hmx-tog,.hmx-zoom,.mkx-hm)::before{content:"";position:absolute;left:0;right:0;top:50%;height:44px;transform:translateY(-50%)}
html[lang][data-theme] body.ct .hmx-seg>:is(a,button):focus-visible,html[lang][data-theme] body.ct :is(.hmx-tog,.hmx-zoom,.mkx-hm):focus-visible{outline:2px solid #3EC8C9;outline-offset:2px}
/* toggle chip (Hide stablecoins) */
html[lang][data-theme] body.ct .hmx-tog:not(#_):not(#__):not(#___):not(#____){position:relative;display:inline-flex;align-items:center;gap:6px;height:32px;min-height:32px;padding:0 13px 0 10px!important;margin:0!important;border:1px solid var(--hmx-seg-line)!important;border-radius:999px!important;
  background:transparent!important;color:var(--hmx-seg-ink)!important;-webkit-text-fill-color:var(--hmx-seg-ink);font:600 13px/1 var(--f-body,"Inter",system-ui,sans-serif)!important;cursor:pointer;white-space:nowrap;width:auto!important;flex:none}
html[lang][data-theme] body.ct .hmx-tog svg{width:14px;height:14px;opacity:.35}
html[lang][data-theme] body.ct .hmx-tog.on:not(#_):not(#__):not(#___):not(#____){background:var(--sel-bg)!important;border-color:transparent!important;color:var(--sel-ink,#0B1A1B)!important;-webkit-text-fill-color:var(--sel-ink,#0B1A1B)}
html[lang][data-theme] body.ct .hmx-tog.on svg{opacity:1}
/* sector zoom: back button (30px, outline) + the sector's name beside it */
.hmx-zbar{display:flex;align-items:center;gap:10px;margin:0 0 10px;min-width:0}
.hmx-zbar[hidden]{display:none}
html[lang][data-theme] body.ct .hmx-zoom:not(#_):not(#__):not(#___):not(#____){position:relative;display:inline-flex;align-items:center;gap:4px;flex:none;height:30px;min-height:30px;padding:0 12px 0 8px!important;margin:0!important;border:1px solid var(--hmx-seg-line)!important;border-radius:999px!important;
  background:var(--card,transparent)!important;color:var(--ink)!important;-webkit-text-fill-color:var(--ink);font:600 13px/1 var(--f-body,"Inter",system-ui,sans-serif)!important;cursor:pointer;width:auto!important}
html[lang][data-theme] body.ct .hmx-zoom svg{width:16px;height:16px}
html[lang][data-theme] body.ct .hmx-zoom:hover{border-color:color-mix(in srgb,#3EC8C9 50%,var(--hmx-seg-line))!important}
.hmx-zname{font:700 15px/20px var(--f-head,"General Sans",system-ui,sans-serif);color:var(--ink);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* /crypto list chips + home Market moves chips: 8px apart, left-aligned */
.ckx-chips{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
html[lang][data-theme] body.ct .ckx-chips .fchip.on:not(#_):not(#__):not(#___):not(#____){background:var(--sel-bg)!important;border-color:transparent!important;color:var(--sel-ink,#0B1A1B)!important;-webkit-text-fill-color:var(--sel-ink,#0B1A1B)!important}
.hmx-meta{display:flex;gap:4px 12px;flex-wrap:wrap;margin:0 0 8px}
.hmx-meta>span:empty{display:none}
.hmx-meta .up,.hmx-breadth .up{color:var(--up,#16a34a)}.hmx-meta .down,.hmx-breadth .down{color:var(--down,#dc2626)}
.hmx-map{position:relative;width:100%;min-height:200px;overflow:hidden;border-radius:6px;background:var(--bg);touch-action:pan-y pinch-zoom;-webkit-user-select:none;user-select:none}
.hmx-map[hidden]{display:none}
.hmx-map .skel{position:absolute;inset:0;height:auto}
.hmt{position:absolute;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;color:#fff!important;text-decoration:none!important;
  border-radius:2px;line-height:1.05;text-align:center;box-sizing:border-box;padding:1px;border:0;font-family:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}
.hmt b{font-weight:700;letter-spacing:.01em;white-space:nowrap;text-shadow:0 1px 1px rgba(0,0,0,.35);font-family:'General Sans',system-ui,sans-serif}
.hmt i{font-style:normal;font-weight:600;opacity:.95;white-space:nowrap;margin-top:1px;font-variant-numeric:tabular-nums;text-shadow:0 1px 1px rgba(0,0,0,.3)}
.hmt em{font-style:normal;font-size:11px;opacity:.85;margin-top:4px;white-space:nowrap}
html[lang] body .hmx-map .hmt:not(#_):not(#__):not(#___):not(#____) :is(b,i,em){color:#fff!important;-webkit-text-fill-color:#fff!important;text-decoration:none!important}
a.hmt:hover,a.hmt:focus-visible{outline:2px solid #fff;outline-offset:-2px;z-index:2;filter:brightness(1.08)}
.hms{padding:6px}.hms b{white-space:normal}
.hmx-sec{position:absolute;border-radius:3px;background:rgba(127,127,127,.18)}
.hmx-st{position:absolute;height:17px;padding:0 6px;border:0;background:transparent;color:var(--ink-2,var(--ink));font:700 10.5px/17px 'General Sans',system-ui,sans-serif;letter-spacing:.04em;text-align:left;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;cursor:zoom-in;z-index:1}
.hmx-sh{position:absolute;left:0;right:0;height:24px;display:flex;justify-content:space-between;align-items:center;padding:0 2px;border:0;background:transparent;color:var(--ink);font:600 13px/24px 'General Sans',system-ui,sans-serif;cursor:zoom-in}
.hmx-sh span{font-variant-numeric:tabular-nums;font-weight:700}.hmx-sh .up{color:var(--up,#16a34a)}.hmx-sh .down{color:var(--down,#dc2626)}
/* legend: one compact scale (max 360px) with the end labels under it, "No data" swatch beside; muted, small */
.hmx-leg{display:grid;grid-template-columns:minmax(0,360px) auto;justify-content:start;align-items:center;gap:4px 14px;margin:12px 0 0;font:500 11.5px/14px var(--f-body,"Inter",system-ui,sans-serif);color:var(--muted,var(--ink-2,var(--ink)))}
.hmx-leg[hidden]{display:none}
.hmx-lg-bar{display:block;grid-column:1;grid-row:1;height:8px;border-radius:999px}
.hmx-lg-l{display:flex;justify-content:space-between;grid-column:1;grid-row:2;font-variant-numeric:tabular-nums}
.hmx-lg-na{display:inline-flex;align-items:center;gap:6px;grid-column:2;grid-row:1/span 2;white-space:nowrap}.hmx-lg-na i{display:inline-block;width:12px;height:8px;border-radius:2px;background:rgb(46,50,62)}
.hmx-tip{position:absolute;z-index:5;pointer-events:none;min-width:200px;max-width:300px;padding:10px 12px;border-radius:8px;background:var(--card,#fff);color:var(--ink);border:1px solid var(--line,rgba(127,127,127,.3));box-shadow:0 8px 24px rgba(0,0,0,.18);font-size:13px}
.hmx-tip .n{color:var(--ink-2,var(--ink))}.hmx-tp{margin:4px 0;font-variant-numeric:tabular-nums}
.hmx-tc{display:flex;gap:8px;flex-wrap:wrap;font-variant-numeric:tabular-nums;font-size:12px}.hmx-tc .cur{font-weight:700}
.hmx-tc .up{color:var(--up,#16a34a)}.hmx-tc .down{color:var(--down,#dc2626)}
.hmx-src{margin:14px 0 24px;line-height:1.5}
.hmx-empty{margin:8px 0}
.hmx-empty[hidden]{display:none}

/* /crypto list */
.ckx-bar{display:flex;gap:8px 12px;flex-wrap:wrap;align-items:center;justify-content:flex-start;margin:4px 0 10px}
.ckx-q{flex:1 1 220px;max-width:340px;min-height:38px;padding:0 12px;border-radius:8px;border:1px solid var(--line,rgba(127,127,127,.35));background:var(--card,transparent);color:var(--ink);font:inherit}
.ckx{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.ckx th{font-size:12px;font-weight:600;color:var(--ink-2,var(--ink));text-align:right;padding:6px 8px;border-bottom:1px solid var(--line,rgba(127,127,127,.25));white-space:nowrap}
.ckx th button{all:unset;cursor:pointer}.ckx th button:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.ckx th.l,.ckx td.l{text-align:left}
.ckx td{padding:9px 8px;text-align:right;border-bottom:1px solid var(--line,rgba(127,127,127,.15));white-space:nowrap}
.ckx td.rk{color:var(--ink-2,var(--ink));width:28px;font-size:12px}
.ckx .cn{display:flex;align-items:center;gap:10px;text-decoration:none!important;color:inherit!important;min-width:0}
.ckx .cn b,.ckc-h b{font-weight:700;text-decoration:none!important}
.ckx .cn .nm{color:var(--ink-2,var(--ink));overflow:hidden;text-overflow:ellipsis;max-width:180px;font-size:13px}
.ckx .up,.ckc .up,.mkx-c .up{color:var(--up,#16a34a)}.ckx .down,.ckc .down,.mkx-c .down{color:var(--down,#dc2626)}
.ckx .stab{font-size:10.5px;font-weight:600;padding:1px 6px;border-radius:999px;border:1px solid var(--line,rgba(127,127,127,.35));color:var(--ink-2,var(--ink))}
.ckx .w{width:34px}
.ckw{all:unset;cursor:pointer;font-size:18px;line-height:1;color:var(--ink-2,var(--ink));padding:4px}.ckw[aria-pressed=true]{color:#C9A227}
.ckw:focus-visible{outline:2px solid var(--ink);outline-offset:2px;border-radius:4px}
.clg{display:inline-flex;flex:0 0 auto;align-items:center;justify-content:center;border-radius:50%;overflow:hidden;background:#fff;box-shadow:inset 0 0 0 1px rgba(127,127,127,.25)}
.clg img{width:72%;height:72%;object-fit:contain}
.clg.mono{background:var(--soft,#eef1f4);color:var(--ink);font:700 11px/1 'General Sans',system-ui,sans-serif}
html[data-theme=dark] .clg.mono{background:#243049;color:#E6EAF0}
.ckx .ckn{display:flex;flex-direction:column;min-width:0}.ckx .cnl{display:flex;align-items:center;gap:8px;min-width:0}.ckx .mcp{display:none;font-size:11.5px;color:var(--ink-2,var(--ink))}
@media(max-width:640px){.ckx .vol,.ckx .rk,.ckx .cap,.ckx .stab{display:none}.ckx .mcp{display:block}.ckx td,.ckx th{padding:9px 4px;font-size:13px}.ckx .cn{gap:6px}.ckx .ckn{align-items:flex-start}.ckx .cnl{flex-direction:column;align-items:flex-start;gap:0}.ckx .cn .nm{max-width:66px;font-size:12px;white-space:nowrap}.ckx .mst{display:none}html[lang] body .ckx:not(#_) .mcp{font-size:11.5px!important}html[lang] body .ckx:not(#_) td:not(.l){font-size:12.5px!important;padding:9px 3px!important}html[lang] body .ckx:not(#_) th{padding:6px 3px!important;min-width:0!important}html[lang] body .ckx:not(#_) th button{min-width:0!important;padding:0!important;font-size:12px!important}html[lang] body .ckx:not(#_) td :is(.up,.down){font-size:12.5px!important}.ckx .clg{width:22px!important;height:22px!important}.ckx .w{width:26px}.ckx td.w,.ckx th.w{padding:0}}
/* coin page */
.ckc-h{display:flex;align-items:center;gap:12px;margin:6px 0 12px}.ckc-h .nm{color:var(--ink-2,var(--ink))}
.ckc-p{font:700 32px/1.1 'General Sans',system-ui,sans-serif;font-variant-numeric:tabular-nums}
.ckc-g{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin:14px 0}
.ckc-g>div{padding:12px;border-radius:10px;border:1px solid var(--line,rgba(127,127,127,.25))}
.ckc-g span{display:block;font-size:12px;color:var(--ink-2,var(--ink))}.ckc-g b{font-size:17px;font-variant-numeric:tabular-nums}

/* home: Market moves tabs */
.mkx-head{display:flex;align-items:center;justify-content:flex-start;gap:8px 12px;flex-wrap:wrap;margin:0 0 8px}
.mkx-head h2{margin:0;font-size:18px}
html[lang][data-theme] body.ct .mkx-hm:not(#_):not(#__){position:relative;display:inline-flex;align-items:center;gap:2px;height:32px;padding:0 4px 0 8px;font:600 13px/1 var(--f-body,"Inter",system-ui,sans-serif);text-decoration:none!important;white-space:nowrap;color:var(--acc,#1C8C8E)}
.mkx-hm svg{width:14px;height:14px}
.mkx-p[hidden]{display:none}
.mkx-c{display:block}
.mkx-c a.row{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:9px 2px;text-decoration:none!important;color:inherit!important;border-bottom:1px solid var(--line,rgba(127,127,127,.15))}
.mkx-c .l{display:flex;align-items:center;gap:10px;min-width:0}.mkx-c .l b{font-weight:700}.mkx-c .l .nm{color:var(--ink-2,var(--ink));font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mkx-c .r{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.mkx-src{font-size:12px;margin:8px 0 0}

html[lang] body .ckx:not(#_) th.l:not(#__){text-align:left!important}
.ckx-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}