/* ECXBay 5.1 — compact observability charts, no fabricated data. */
#ecxm-app .ecxi-trend-console{margin:18px clamp(14px,2.1vw,34px) 8px;padding:23px;background:linear-gradient(140deg,#0a1b31,#081324 66%,#0c1831);border:1px solid rgba(93,152,211,.3);border-radius:24px;box-shadow:0 15px 45px rgba(0,0,0,.26),inset 0 1px 0 rgba(255,255,255,.06);position:relative;overflow:hidden}
#ecxm-app .ecxi-trend-console:before{content:"";position:absolute;inset:0 auto auto 0;height:3px;width:100%;background:linear-gradient(90deg,#3ce6bd,#3dd4ff,#8566ff);opacity:.8}
#ecxm-app .ecxi-trend-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;flex-wrap:wrap;margin-bottom:18px}
#ecxm-app .ecxi-trend-head .ecxi-trend-eyebrow{color:#5fe6d9;font-size:11px;letter-spacing:.17em;font-weight:800}
#ecxm-app .ecxi-trend-head h2{color:#f5faff;margin:5px 0 6px;font-size:clamp(23px,2.1vw,31px);letter-spacing:-.7px;line-height:1.16}
#ecxm-app .ecxi-trend-head p{color:#99b4cf;margin:0;font-size:12px;max-width:710px;line-height:1.6}
#ecxm-app .ecxi-trend-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
#ecxm-app .ecxi-trend-actions button{font-size:12px;font-weight:800;border:1px solid rgba(107,163,213,.24);border-radius:11px;padding:10px 16px;color:#b9d1e8;background:#10243f;min-width:60px;transition:border-color .2s,background .2s,transform .2s}
#ecxm-app .ecxi-trend-actions button[aria-pressed="true"],#ecxm-app .ecxi-trend-actions button:hover{border-color:#53d9fa;color:#fff;background:linear-gradient(130deg,rgba(41,181,205,.32),rgba(89,69,190,.35));box-shadow:inset 0 1px 0 rgba(255,255,255,.12)}
#ecxm-app .ecxi-trend-actions button:focus-visible{outline:2px solid #76e9ff;outline-offset:2px}
#ecxm-app .ecxi-trend-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
#ecxm-app .ecxi-trend-card{min-width:0;display:flex;flex-direction:column;gap:10px;position:relative;background:linear-gradient(155deg,rgba(16,37,62,.88),rgba(8,23,42,.9));border:1px solid rgba(96,153,201,.22);border-radius:19px;padding:16px 16px 12px;box-shadow:inset 0 1px 0 rgba(255,255,255,.03);transition:border-color .2s,transform .2s}
#ecxm-app .ecxi-trend-card:hover{border-color:rgba(79,222,232,.43);transform:translateY(-2px)}
#ecxm-app .ecxi-trend-card-top{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
#ecxm-app .ecxi-trend-card-top small{color:#9bbdd7;font-size:11px;font-weight:780;letter-spacing:.09em;text-transform:uppercase}
#ecxm-app .ecxi-trend-card-top span{border:1px solid rgba(80,214,213,.25);background:rgba(56,193,192,.08);color:#82e8df;border-radius:999px;padding:4px 8px;font-size:10px;font-weight:800}
#ecxm-app .ecxi-trend-value{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;min-height:31px}
#ecxm-app .ecxi-trend-value strong{color:#ecf8ff;font-size:clamp(21px,1.7vw,28px);line-height:1.1;letter-spacing:-.6px;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
#ecxm-app .ecxi-trend-value em{color:#99b5ca;font-size:12px;font-style:normal}
#ecxm-app .ecxi-trend-plot{height:128px;min-height:128px;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:12px;background:linear-gradient(180deg,rgba(9,22,41,.5),rgba(4,17,31,.2));border:1px solid rgba(115,166,205,.08)}
#ecxm-app .ecxi-trend-plot svg{width:100%;height:100%;overflow:visible;display:block}
#ecxm-app .ecxi-trend-empty{font-size:12px;line-height:1.45;color:#8cabc4;text-align:center;padding:12px;max-width:280px}
#ecxm-app .ecxi-trend-meta{display:flex;align-items:center;justify-content:space-between;gap:10px;color:#86a8c3;font-size:11px;line-height:1.4;min-height:16px}
#ecxm-app .ecxi-trend-meta span:last-child{text-align:right}
#ecxm-app .ecxi-trend-note{color:#86a5be;font-size:11px;line-height:1.55;margin-top:14px;border-top:1px solid rgba(100,154,202,.16);padding-top:12px}
#ecxm-app .ecxi-trend-spark{height:36px;margin-top:10px;min-height:36px;position:relative;overflow:hidden;border-radius:7px;background:linear-gradient(180deg,rgba(13,39,62,.19),transparent)}
#ecxm-app .ecxi-trend-spark svg{display:block;width:100%;height:100%}
#ecxm-app .ecxi-trend-spark-empty{color:#6d90ab;font-size:10px;line-height:36px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#ecxm-app .ecxi-metric,#ecxm-app .ecxi-stat,#ecxm-app .ecxi-advanced-metric{position:relative}
#ecxm-app .ecxi-trend-plot .trend-glow,#ecxm-app .ecxi-trend-spark .trend-glow{filter:drop-shadow(0 0 4px var(--trend-color,#3edfd7))}
#ecxm-app .ecxi-trend-line{stroke-dasharray:1;stroke-dashoffset:1;animation:ecxbay-trend-reveal .7s cubic-bezier(.3,.8,.2,1) forwards}
@keyframes ecxbay-trend-reveal{to{stroke-dashoffset:0}}
@media(max-width:1190px){#ecxm-app .ecxi-trend-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){#ecxm-app .ecxi-trend-console{padding:16px;margin:12px}#ecxm-app .ecxi-trend-grid{grid-template-columns:1fr}#ecxm-app .ecxi-trend-card{padding:14px}#ecxm-app .ecxi-trend-plot{height:116px;min-height:116px}#ecxm-app .ecxi-trend-actions{width:100%}#ecxm-app .ecxi-trend-actions button{flex:1}}
@media(prefers-reduced-motion:reduce){#ecxm-app .ecxi-trend-card{transition:none}#ecxm-app .ecxi-trend-line{animation:none;stroke-dashoffset:0}}
