
.miko-market-live{position:relative;margin:10px 0 16px;padding:8px 8px 7px;border:1px solid #dce8f4;border-radius:16px;background:linear-gradient(180deg,#fff 0%,#f9fcff 100%);box-shadow:0 7px 22px rgba(32,72,115,.07);overflow:hidden}
.miko-market-live:before{content:"";position:absolute;inset:-1px;border-radius:16px;padding:1px;background:linear-gradient(90deg,rgba(55,142,238,.22),rgba(34,197,122,.18),rgba(239,90,112,.16));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.miko-market-ticker{position:relative;z-index:2;display:flex;align-items:center;height:28px;margin:-8px -8px 7px;background:linear-gradient(90deg,#eef6ff,#fbfdff);border-bottom:1px solid #e2ebf4;overflow:hidden}
.miko-market-ticker-label{flex:0 0 auto;height:100%;display:flex;align-items:center;padding:0 10px;background:#e8f2ff;color:#355a80;font-size:9px;font-weight:800;border-right:1px solid #dbe7f3}
.miko-market-ticker-window{position:relative;flex:1;min-width:0;overflow:hidden}
.miko-market-ticker-window:before,.miko-market-ticker-window:after{content:"";position:absolute;top:0;bottom:0;width:20px;z-index:2;pointer-events:none}
.miko-market-ticker-window:before{left:0;background:linear-gradient(90deg,#f8fbff,transparent)}
.miko-market-ticker-window:after{right:0;background:linear-gradient(270deg,#f8fbff,transparent)}
.miko-market-ticker-track{display:flex;width:max-content;animation:mikoTickerScroll 34s linear infinite}
.miko-market-ticker-set{display:flex;align-items:center;gap:20px;padding:0 10px}
.miko-market-ticker-item{display:inline-flex;align-items:center;gap:5px;white-space:nowrap;color:#17324f;font-size:9px}
.miko-market-ticker-item b{font-size:9px;color:#17304c;font-weight:800}
.miko-market-ticker-item i,.miko-market-ticker-item em{font-style:normal;font-size:9px;font-weight:900;animation:mikoMarketTextBlink 1.35s ease-in-out infinite}
.miko-market-ticker-item.is-up i,.miko-market-ticker-item.is-up em{color:#12a86b}
.miko-market-ticker-item.is-down i,.miko-market-ticker-item.is-down em{color:#ee4960}
.miko-market-ticker-item.is-offline i,.miko-market-ticker-item.is-offline em{color:#8694a5;animation:none}
.miko-market-ticker:hover .miko-market-ticker-track{animation-play-state:paused}

.miko-market-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:6px}
.miko-market-head>div:first-child{display:flex;align-items:center;gap:8px}
.miko-market-kicker{display:inline-flex;align-items:center;gap:5px;color:#2979c9;font-size:9px;font-weight:800;letter-spacing:.08em}
.miko-market-kicker i,.miko-market-dot{width:6px;height:6px;border-radius:50%;background:#21c77a;animation:mikoMarketPulse 1.8s infinite}
.miko-market-head h2{margin:0;color:#173a63;font-size:15px;line-height:1.1}
.miko-market-head p{display:none}
.miko-market-status{display:flex;align-items:center;gap:5px;color:#73879d;font-size:8px;white-space:nowrap}
.miko-market-status strong{color:#18a968;font-size:8px}
.miko-market-status small{color:#8395a8}

.miko-market-grid{display:flex;gap:6px;overflow-x:auto;overflow-y:hidden;padding:1px 1px 4px;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:#d0dcea transparent}
.miko-market-grid::-webkit-scrollbar{height:3px}
.miko-market-grid::-webkit-scrollbar-thumb{background:#d0dcea;border-radius:999px}

.miko-market-card{--accent:#7f8fa2;position:relative;display:block;flex:0 0 184px;min-width:184px;height:82px;padding:8px 9px;border-radius:13px;border:1px solid color-mix(in srgb,var(--accent) 26%, #e5edf5);background:linear-gradient(180deg,#fff 0%,#fbfdff 100%);box-shadow:0 4px 13px rgba(50,82,120,.07),inset 0 1px 0 rgba(255,255,255,.94);overflow:hidden;scroll-snap-align:start;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;text-decoration:none;cursor:pointer}
.miko-market-card:hover{transform:translateY(-1px);border-color:color-mix(in srgb,var(--accent) 40%, #dfe8f2);box-shadow:0 7px 17px rgba(50,82,120,.11),0 0 0 2px color-mix(in srgb,var(--accent) 5%, transparent)}
.miko-market-card.is-up{--accent:#18b873;border-color:#d9f0e6}
.miko-market-card.is-down{--accent:#ef5a70;border-color:#f6dde2}
.miko-market-card.is-offline{--accent:#8b99aa}

.miko-market-card-top,.miko-market-price-row,.miko-market-foot{position:relative;z-index:3;display:flex;align-items:center;justify-content:space-between;gap:6px}
.miko-market-name{display:flex;align-items:center;gap:6px;min-width:0}
.miko-market-name h3{margin:0;color:#17324f;font-size:10px;line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:94px}
.miko-market-name small{display:none}
.miko-market-icon{display:grid;place-items:center;flex:0 0 22px;width:22px;height:22px;border-radius:7px;color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,#fff);border:1px solid color-mix(in srgb,var(--accent) 24%,#e7edf4);font-size:9px;font-weight:900}
.miko-market-symbol{font-size:7px;color:#8a9caf;padding:3px 5px;border-radius:7px;background:#f5f8fb}

.miko-market-price-row{margin-top:4px;align-items:flex-end}
.miko-market-price-row strong{color:#17324f;font-size:14px;line-height:1;font-variant-numeric:tabular-nums;position:relative;z-index:4;text-shadow:0 1px 0 rgba(255,255,255,.9)}
.miko-market-price-row strong.is-price-flash{animation:mikoPriceFlash .8s ease}
.miko-market-price-row em{font-style:normal;font-size:8px;font-weight:900;color:var(--accent);animation:mikoMarketTextBlink 1.35s ease-in-out infinite}
.miko-market-card.is-offline .miko-market-price-row em{animation:none}

.miko-market-spark{position:absolute;left:42px;right:8px;bottom:6px;height:36px;z-index:1;opacity:.96;pointer-events:none}
.miko-market-chart-svg{display:block;width:100%;height:100%}
.miko-market-card .miko-market-chart-svg polyline{stroke-width:2.2}
.miko-market-card .miko-market-chart-svg polygon{opacity:.66}
.miko-market-unavailable{height:36px;display:grid;place-items:center;color:#8c9aaa;font-size:7px}
.miko-market-foot{position:absolute;left:9px;bottom:7px;margin:0;color:#8c9aaa;font-size:7px;z-index:3}
.miko-market-foot span:last-child{display:none}

.miko-market-credit{display:flex;gap:5px;flex-wrap:wrap;margin-top:4px;padding-top:5px;border-top:1px solid #e8eef5;font-size:7px;color:#8091a3}
.miko-market-credit strong{color:#536b84}
.miko-market-credit a{color:#327ac7;text-decoration:none}
.miko-market-credit a:hover{text-decoration:underline}

@keyframes mikoTickerScroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes mikoPriceFlash{0%{transform:translateY(0);filter:brightness(1)}35%{transform:translateY(-1px);filter:brightness(1.14)}100%{transform:translateY(0);filter:brightness(1)}}
@keyframes mikoMarketTextBlink{0%,100%{opacity:1;text-shadow:0 0 0 currentColor}50%{opacity:.62;text-shadow:0 0 6px currentColor}}
@keyframes mikoMarketPulse{0%{box-shadow:0 0 0 0 rgba(33,199,122,.36)}70%{box-shadow:0 0 0 6px rgba(33,199,122,0)}100%{box-shadow:0 0 0 0 rgba(33,199,122,0)}}

@media(min-width:1280px){
  .miko-market-card{flex:1 1 0;min-width:0}
}
@media(max-width:1024px){
  .miko-market-card{flex-basis:170px;min-width:170px;height:80px}
}
@media(max-width:820px){
  .miko-market-live{padding:7px;border-radius:14px}
  .miko-market-ticker{margin:-7px -7px 7px}
  .miko-market-status small{display:none}
  .miko-market-card{flex-basis:164px;min-width:164px;height:78px;padding:7px 8px}
  .miko-market-spark{left:38px;right:7px;height:33px}
}
@media(max-width:560px){
  .miko-market-live{margin:8px -2px 14px;padding:6px}
  .miko-market-ticker{margin:-6px -6px 6px;height:27px}
  .miko-market-head h2{font-size:14px}
  .miko-market-head{margin-bottom:5px}
  .miko-market-card{flex-basis:150px;min-width:150px;height:74px;padding:7px}
  .miko-market-name h3{font-size:9px;max-width:76px}
  .miko-market-icon{width:20px;height:20px;flex-basis:20px}
  .miko-market-price-row strong{font-size:13px}
  .miko-market-price-row em{font-size:7px}
  .miko-market-spark{left:34px;right:6px;bottom:5px;height:31px}
  .miko-market-foot{left:7px;bottom:6px;font-size:6px}
  .miko-market-credit{font-size:6px}
}
@media(max-width:390px){
  .miko-market-card{flex-basis:142px;min-width:142px}
}
@media(prefers-reduced-motion:reduce){
  .miko-market-ticker-track,.miko-market-ticker-item i,.miko-market-ticker-item em,.miko-market-price-row em,.miko-market-kicker i,.miko-market-dot{animation:none}
}
