:root {
    --mx-bg: #02080d;
    --mx-panel: rgba(3, 18, 29, 0.88);
    --mx-panel-soft: rgba(6, 32, 48, 0.72);
    --mx-line: rgba(40, 218, 255, 0.48);
    --mx-line-soft: rgba(40, 218, 255, 0.20);
    --mx-glow: #2cecff;
    --mx-gold: #f5c84b;
    --mx-text: #e8f5ff;
    --mx-muted: #8fb5c5;
    --mx-danger: #ff6b8a;
}
* { box-sizing: border-box; }
html, body { min-height: 100%; }
body.mx-body {
    margin: 0;
    background:
        linear-gradient(rgba(44,236,255,.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(44,236,255,.045) 1px, transparent 1px),
        radial-gradient(circle at 20% 0%, rgba(44,236,255,.12), transparent 36rem),
        radial-gradient(circle at 80% 10%, rgba(245,200,75,.055), transparent 30rem),
        var(--mx-bg);
    background-size: 4.75rem 4.75rem, 4.75rem 4.75rem, auto, auto, auto;
    color: var(--mx-text);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    letter-spacing: .01em;
}
.mx-shell { display: grid; grid-template-columns: 19rem 1fr; min-height: 100vh; gap: 1.1rem; padding: 1.1rem; }
.mx-sidebar, .mx-panel, .mx-hero, .mx-card {
    background: linear-gradient(180deg, rgba(4,21,33,.94), rgba(2,12,20,.84));
    border: 1px solid var(--mx-line);
    box-shadow: 0 0 28px rgba(44,236,255,.07), inset 0 0 24px rgba(44,236,255,.025);
}
.mx-sidebar { position: sticky; top: 1.1rem; height: calc(100vh - 2.2rem); padding: 1.4rem; display:flex; flex-direction:column; }
.mx-brand { display:flex; gap:1rem; align-items:center; margin-bottom:2.8rem; }
.mx-orb { width:2.9rem; height:2.9rem; border:1px solid var(--mx-glow); border-radius:999px; box-shadow:0 0 24px rgba(44,236,255,.65), inset 0 0 22px rgba(44,236,255,.15); }
.mx-brand-title { font-size:1.35rem; font-weight:800; color:var(--mx-glow); letter-spacing:.08em; }
.mx-brand-sub { color:var(--mx-muted); font-size:.74rem; text-transform:uppercase; line-height:1.25; }
.mx-nav { display:grid; gap:.65rem; margin-top:auto; margin-bottom:auto; }
.mx-nav a {
    color: var(--mx-text); text-decoration:none; border:1px solid var(--mx-line-soft); padding:.8rem 1rem;
    background: rgba(6,32,48,.42); position:relative; overflow:hidden;
}
.mx-nav a:hover { border-color: var(--mx-line); box-shadow:0 0 20px rgba(44,236,255,.12); }
.mx-seal { margin-top:auto; color:var(--mx-muted); font-size:.75rem; display:flex; gap:.5rem; align-items:center; }
.mx-dot { width:.45rem; height:.45rem; border-radius:999px; background:var(--mx-glow); box-shadow:0 0 12px var(--mx-glow); }
.mx-main { display:grid; gap:1.1rem; align-content:start; }
.mx-hero { padding:1.5rem 1.6rem; display:flex; justify-content:space-between; align-items:center; }
.mx-kicker { color:var(--mx-muted); text-transform:uppercase; font-size:.75rem; letter-spacing:.08em; }
h1 { margin:.25rem 0 0; font-size:2.15rem; line-height:1.1; letter-spacing:.02em; }
.mx-signal { border:1px solid rgba(245,200,75,.5); color:var(--mx-gold); padding:.55rem .75rem; font-size:.75rem; text-transform:uppercase; }
.mx-grid { display:grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap:.9rem; }
.mx-two { display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap:.9rem; }
.mx-card { min-height:6.1rem; padding:1rem; position:relative; overflow:hidden; }
.mx-card::after {
    content:""; position:absolute; top:0; right:0; width:4.3rem; height:4.3rem;
    border-left:1px solid var(--mx-line-soft); border-bottom:1px solid var(--mx-line-soft);
    transform: translate(1.3rem,-1.3rem) rotate(45deg);
}
.mx-label { color:var(--mx-muted); font-size:.75rem; text-transform:uppercase; }
.mx-value { color:var(--mx-glow); font-size:2.05rem; font-weight:800; margin:.2rem 0; text-shadow:0 0 14px rgba(44,236,255,.55); }
.mx-hint { color:var(--mx-muted); font-size:.74rem; }
.mx-panel { padding:1rem; min-height:6.2rem; }
.mx-panel h2 { margin:0 0 .8rem; font-size:1rem; }
.mx-empty, .mx-row { color:var(--mx-muted); font-size:.78rem; text-transform:uppercase; }
.mx-list { display:grid; gap:.55rem; }
.mx-row { border:1px solid var(--mx-line-soft); padding:.62rem .7rem; background:rgba(4,20,30,.45); display:flex; justify-content:space-between; gap:1rem; text-transform:none; }
.mx-pill { color:var(--mx-gold); border:1px solid rgba(245,200,75,.35); padding:.15rem .4rem; font-size:.68rem; text-transform:uppercase; }
.mx-entity { display:flex; justify-content:space-between; align-items:center; padding:1.35rem; }
.mx-ring { width:5rem; height:5rem; border-radius:999px; border:1px solid var(--mx-gold); color:var(--mx-gold); display:grid; place-items:center; box-shadow:0 0 24px rgba(245,200,75,.14); font-weight:800; }
@media (max-width: 1100px) { .mx-shell { grid-template-columns:1fr; } .mx-sidebar { position:relative; height:auto; } .mx-grid, .mx-two { grid-template-columns:1fr; } }

.mx-hidden-contract { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }


.mx-live-grid {
    display:grid;
    grid-template-columns:2fr 1fr;
    gap:1rem;
}
.mx-stream {
    border:1px solid rgba(44,236,255,.25);
    background:rgba(4,18,28,.55);
    padding:1rem;
    position:relative;
    overflow:hidden;
}
.mx-stream::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(180deg,transparent,rgba(44,236,255,.04),transparent);
    animation:mxscan 5s linear infinite;
}
@keyframes mxscan {
    0% { transform:translateY(-100%); }
    100% { transform:translateY(100%); }
}
.mx-meter {
    height:.5rem;
    background:rgba(255,255,255,.08);
    border:1px solid rgba(44,236,255,.2);
    overflow:hidden;
}
.mx-meter-bar {
    height:100%;
    background:linear-gradient(90deg,#2cecff,#f5c84b);
}
.mx-graph {
    height:240px;
    border:1px solid rgba(44,236,255,.22);
    background:
      radial-gradient(circle at center, rgba(44,236,255,.08), transparent 60%),
      rgba(2,12,20,.72);
    position:relative;
}
.mx-node {
    position:absolute;
    width:.7rem;
    height:.7rem;
    border-radius:999px;
    background:#2cecff;
    box-shadow:0 0 12px #2cecff;
}
.mx-node.gold {
    background:#f5c84b;
    box-shadow:0 0 12px #f5c84b;
}