/* Live market widgets (ticker, home cards, /markets). Used by the homepage and the server-rendered pages. */
:root{--up:#12a35c;--down:#e5484d;--grid:#edf0f6;--mk-card:#fff;--mk-line:#e4e8f1;--mk-muted:#5b6478;--mk-ink:#0b1020;--mk-soft:#f5f7fb;--mk-blue:#2f6bff}
.up{color:var(--up)}.down{color:var(--down)}
.mk-empty{color:var(--mk-muted);text-align:center;padding:30px 10px}

/* ticker */
.ticker{overflow:hidden;background:#0b1020;color:#e9edf7;border-bottom:1px solid rgba(255,255,255,.06);font-size:.84rem;white-space:nowrap;height:38px;display:flex;align-items:center}
.tk-track{display:inline-flex;gap:34px;padding-left:20px;animation:tk 60s linear infinite}
.ticker:hover .tk-track{animation-play-state:paused}
.tk-i{display:inline-flex;align-items:center;gap:7px}.tk-i img{width:18px;height:18px;border-radius:50%}.tk-i b{font-weight:700}.tk-i em{font-style:normal;font-weight:700}
.ticker .up{color:#3ddc8b}.ticker .down{color:#ff7a7e}
@keyframes tk{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.tk-track{animation:none}.ticker{overflow-x:auto}}

/* home cards */
.mk-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:30px;text-align:left}
@media(max-width:900px){.mk-grid{grid-template-columns:1fr 1fr}}@media(max-width:560px){.mk-grid{grid-template-columns:1fr}}
.mk-card{display:block;border:1px solid var(--mk-line);border-radius:20px;padding:18px 18px 10px;background:var(--mk-card);transition:transform .2s,box-shadow .2s}
.mk-card:hover{transform:translateY(-3px);box-shadow:0 18px 40px -22px rgba(16,32,80,.35)}
.mk-c-top{display:flex;align-items:center;gap:10px}.mk-c-top img{border-radius:50%}.mk-c-top b{display:block;line-height:1.2}.mk-c-top small{color:var(--mk-muted);font-weight:600}
.mk-c-top em{margin-left:auto;font-style:normal;font-weight:800;font-size:.88rem}
.mk-c-price{font-size:1.45rem;font-weight:850;letter-spacing:-.5px;margin:12px 0 4px;color:var(--mk-ink)}
.mk-spark{width:100%;height:44px;display:block}
.mk-skel{height:150px;border-radius:20px;background:linear-gradient(90deg,var(--mk-soft),#fff,var(--mk-soft));background-size:200% 100%;animation:sk 1.2s infinite}
@keyframes sk{from{background-position:200% 0}to{background-position:-200% 0}}

/* /markets */
.mk-top{display:flex;justify-content:space-between;align-items:flex-end;gap:18px;flex-wrap:wrap;margin-bottom:16px}
.mk-name{display:flex;align-items:center;gap:12px}.mk-name img{border-radius:50%}.mk-name b{display:block;font-size:1.25rem}.mk-name small{color:var(--mk-muted);font-weight:600}
.mk-price{font-size:clamp(1.8rem,4vw,2.6rem);font-weight:900;letter-spacing:-1px;line-height:1.1;margin-top:8px}
.mk-chg{font-weight:800}
.mk-seg{display:inline-flex;background:var(--mk-soft);border:1px solid var(--mk-line);border-radius:12px;padding:3px;gap:2px}
.mk-seg button{border:0;background:none;padding:7px 12px;border-radius:9px;font:inherit;font-weight:700;font-size:.85rem;color:var(--mk-muted);cursor:pointer}
.mk-seg button.on{background:#fff;color:var(--mk-ink);box-shadow:0 1px 4px rgba(16,32,80,.12)}
.mk-panel{border:1px solid var(--mk-line);border-radius:24px;padding:22px;background:var(--mk-card)}
.mk-chart{position:relative;height:320px;margin-top:10px;touch-action:pan-y;cursor:crosshair}
.mk-chart.loading{opacity:.5}
@media(max-width:620px){.mk-chart{height:240px}}
.mk-svg{width:100%;height:100%;display:block}
.mk-axis{position:absolute;left:0;right:0;bottom:0;display:flex;justify-content:space-between;color:var(--mk-muted);font-size:.75rem;font-weight:600;pointer-events:none}
.mk-dot{position:absolute;width:10px;height:10px;border-radius:50%;margin:-5px 0 0 -5px;box-shadow:0 0 0 3px #fff;display:none;pointer-events:none}
.mk-tip{position:absolute;top:0;transform:translateX(-50%);background:#0b1020;color:#fff;padding:6px 10px;border-radius:10px;font-size:.8rem;display:none;pointer-events:none;text-align:center;white-space:nowrap}
.mk-tip b{display:block}.mk-tip span{color:#b9c2d8}
.mk-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:18px}
@media(max-width:700px){.mk-stats{grid-template-columns:1fr 1fr}}
.mk-stats div{background:var(--mk-soft);border-radius:14px;padding:12px 14px}.mk-stats span{display:block;color:var(--mk-muted);font-size:.8rem;font-weight:600}.mk-stats b{font-size:1.02rem}
.mk-tools{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin:34px 0 12px}
.mk-tools input{font:inherit;padding:10px 14px;border:1px solid var(--mk-line);border-radius:12px;min-width:220px;background:#fff}
.mk-table-w{border:1px solid var(--mk-line);border-radius:20px;overflow:hidden}
.mk-table{width:100%;border-collapse:collapse;font-size:.93rem}
.mk-table th{background:var(--mk-soft);color:var(--mk-muted);font-weight:700;font-size:.78rem;text-transform:uppercase;letter-spacing:.4px;text-align:left;padding:11px 12px}
.mk-table td{padding:11px 12px;border-top:1px solid var(--mk-line)}
.mk-table tr{cursor:pointer}.mk-table tbody tr:hover,.mk-table tr.sel{background:#f3f6ff}
.mk-table .r{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}.mk-table .n{color:var(--mk-muted);width:36px}
.mk-table .mk-spark{width:110px;height:34px}
.mk-coin{display:flex;align-items:center;gap:9px}.mk-coin img{border-radius:50%}.mk-coin small{color:var(--mk-muted);font-weight:600}
.mk-coin i{font-style:normal;font-size:.7rem;font-weight:800;color:#1f4fe0;background:#eaf0ff;padding:2px 7px;border-radius:99px}
@media(max-width:700px){.hide-s{display:none}.mk-coin i{display:none}.mk-table td,.mk-table th{padding:10px 8px}}