/* UI Kit styles from provided kit */
:root{
  --bg:#05070a;
  --bg2:#0b0f14;
  --panel:#10151c;
  --panel2:#131923;
  --border:rgba(255,255,255,.12);
  --text:#e9eef6;
  --muted:#8d98a9;
  --gold:#f5c84c;
  --cyan:#17c9ff;
  --green:#2ee66b;
  --red:#ff4f4f;
  --orange:#ff7a2d;
  --purple:#9566ff;
  --blue:#3fa7ff;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",Arial,sans-serif;
}
*{box-sizing:border-box}
body{margin:0;background:radial-gradient(circle at top,#101827 0,#05070a 42%,#020305 100%);color:var(--text)}
.app-shell{display:flex;min-height:100vh}
.sidebar{width:250px;border-right:1px solid var(--border);background:linear-gradient(180deg,#0a0d11,#05070a);padding:24px 16px;position:fixed;left:0;top:0;bottom:0}
.brand{display:flex;align-items:center;gap:12px;margin-bottom:34px}
.brand-mark{width:48px;height:48px;border:3px solid var(--gold);border-radius:14px;display:flex;align-items:center;justify-content:center;color:var(--gold);font-weight:900;font-size:26px;box-shadow:0 0 28px rgba(245,200,76,.18)}
.brand-title{font-size:22px;color:var(--gold);font-weight:800}
.brand-subtitle{font-size:14px;color:var(--muted);margin-top:4px}
.nav{display:flex;flex-direction:column;gap:10px}
.nav-item{display:flex;align-items:center;gap:14px;padding:14px 18px;border-radius:10px;color:#c7ced8;text-decoration:none;font-size:17px;border:1px solid transparent}
.nav-item span{font-size:20px;width:20px;text-align:center}
.nav-item.active{background:linear-gradient(90deg,rgba(245,200,76,.18),rgba(245,200,76,.04));border-color:rgba(245,200,76,.55);color:var(--gold)}
.nav-item:hover{background:rgba(255,255,255,.05)}
.sidebar-status{position:absolute;left:16px;right:16px;bottom:72px;border:1px solid var(--border);border-radius:12px;background:rgba(255,255,255,.04);padding:14px 16px}
.status-title{font-weight:700;color:var(--green);margin-bottom:14px}
.status-row{display:flex;justify-content:space-between;color:var(--muted)}
.status-row strong{color:var(--green)}
.version{position:absolute;bottom:28px;color:#5e6674;font-size:12px}
.dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-left:6px}
.dot.green{background:var(--green)}
.main{margin-left:250px;padding:28px;flex:1}
.topbar{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:24px}
.page-title{font-size:32px;font-weight:900}
.title-icon{display:inline-flex;width:30px;height:30px;background:rgba(255,255,255,.1);border-radius:8px;align-items:center;justify-content:center;margin-right:10px;color:#b6bfce}
.last-updated{color:var(--muted);margin-top:8px;font-size:15px}
.chips{display:flex;gap:12px}
.chip{padding:10px 18px;border-radius:9px;border:1px solid var(--border);font-weight:700}
.chip.yellow{color:var(--gold);border-color:rgba(245,200,76,.55);background:rgba(245,200,76,.09)}
.chip.green{color:var(--green);border-color:rgba(46,230,107,.45);background:rgba(46,230,107,.08)}
.chip.muted{color:#c6ccd6;background:rgba(255,255,255,.04)}
.metrics-grid{display:grid;grid-template-columns:repeat(6,minmax(150px,1fr));gap:14px;margin-bottom:16px}
.metric-card{min-height:168px;background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.025));border:1px solid var(--border);border-radius:14px;padding:20px;position:relative;overflow:hidden}
.metric-head{display:flex;align-items:center;gap:12px;color:#dce3ec;font-weight:700}
.metric-icon{width:42px;height:42px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:rgba(255,255,255,.08);font-size:24px}
.metric-card.cyan .metric-icon{color:var(--cyan);background:rgba(23,201,255,.14)}
.metric-card.green .metric-icon{color:var(--green);background:rgba(46,230,107,.14)}
.metric-card.orange .metric-icon{color:var(--orange);background:rgba(255,122,45,.14)}
.metric-card.yellow .metric-icon{color:var(--gold);background:rgba(245,200,76,.14)}
.metric-card.purple .metric-icon{color:var(--purple);background:rgba(149,102,255,.14)}
.metric-card.blue .metric-icon{color:var(--blue);background:rgba(63,167,255,.14)}
.metric-value{font-size:42px;font-weight:900;margin:12px 0 4px}
.metric-card .time-large{font-size:28px;font-weight:900}
.metric-card .time-small{font-size:12px;color:var(--muted)}
.mini-card .small-text{font-size:13px}
.metric-desc{color:var(--muted)}
.metric-desc em{font-style:normal;color:var(--cyan)}
.sparkline{position:absolute;left:20px;right:20px;bottom:18px;height:22px;border-bottom:2px solid currentColor;opacity:.8;clip-path:polygon(0 75%,15% 70%,28% 72%,38% 55%,51% 68%,66% 48%,75% 62%,86% 35%,100% 57%,100% 100%,0 100%)}
.content-grid{display:grid;grid-template-columns:1.25fr 1.05fr .85fr;gap:14px}
.panel{background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.025));border:1px solid var(--border);border-radius:14px;padding:18px;box-shadow:0 18px 40px rgba(0,0,0,.18)}
.panel h2{margin:0 0 16px;font-size:20px}
.panel-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.panel-head h2{margin:0}
.panel-head button{background:rgba(255,255,255,.08);border:1px solid var(--border);color:#dce3ec;border-radius:8px;padding:8px 12px}
.conclusion{min-height:300px}
.quote-box{position:relative;min-height:220px;display:flex;align-items:center;justify-content:center;text-align:left;padding:24px 48px;color:#e9edf5;font-size:18px;line-height:1.85}
.quote{position:absolute;font-size:68px;color:rgba(245,200,76,.18);font-weight:900}
.quote.left{left:20px;top:30px}
.quote.right{right:22px;bottom:12px}
.scope{min-height:300px}
.scope-row{display:flex;gap:16px;margin:16px 0;align-items:flex-start}
.scope-label{width:86px;color:#dce3ec;font-weight:700}
.tags{display:flex;flex-wrap:wrap;gap:8px;flex:1}
.tags span{border:1px solid rgba(245,200,76,.35);background:rgba(245,200,76,.07);color:var(--gold);border-radius:7px;padding:6px 10px;font-size:13px}
.muted-tags span{border-color:rgba(255,255,255,.12);color:#d5dbe4;background:rgba(255,255,255,.05)}
.source-tags span{font-size:12px}
.mini-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.mini-card{height:104px;border:1px solid var(--border);border-radius:10px;background:rgba(255,255,255,.04);padding:14px;display:grid;grid-template-rows:auto auto 1fr;position:relative;overflow:hidden}
.mini-card span{font-size:28px}
.mini-card small{color:#c8d0db}
.mini-card strong{font-size:34px;margin-top:6px}
.futures{grid-column:1 / span 1}
.stablecoin{grid-column:2 / span 1}
.system{grid-column:3 / span 1}
table{width:100%;border-collapse:collapse;font-size:14px}
th,td{border-bottom:1px solid rgba(255,255,255,.08);padding:12px 10px;text-align:left;color:#dfe5ee}
th{color:#aeb7c6;font-weight:700}
.badge{border-radius:7px;padding:5px 10px;font-weight:800;font-size:13px}
.badge.ok{color:var(--green);background:rgba(46,230,107,.12);border:1px solid rgba(46,230,107,.35)}
.badge.warn{color:var(--gold);background:rgba(245,200,76,.12);border:1px solid rgba(245,200,76,.35)}
.green-text{color:var(--green)}
.red{color:var(--red)}
.purple-text{color:var(--purple)}
.lab-note{font-size:12px;color:#d1d7e1;border:1px solid var(--border);border-radius:7px;padding:6px 10px;background:rgba(255,255,255,.04)}
.area-line{height:28px;margin:8px 4px;border-bottom:2px solid currentColor;opacity:.75}
.green-line{color:var(--green);clip-path:polygon(0 70%,10% 66%,20% 55%,30% 60%,43% 42%,55% 50%,67% 30%,80% 45%,90% 28%,100% 35%,100% 100%,0 100%)}
.blue-line{color:var(--blue);clip-path:polygon(0 72%,12% 60%,24% 65%,35% 46%,48% 54%,62% 32%,74% 38%,86% 20%,100% 28%,100% 100%,0 100%)}
.system-row{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.08);padding:14px 0;color:#dce3ec}
.system-row:last-child{border-bottom:0}
@media(max-width:1280px){
  .metrics-grid{grid-template-columns:repeat(3,1fr)}
  .content-grid{grid-template-columns:1fr}
  .futures,.stablecoin,.system{grid-column:auto}
}

/* Manual update button and status */
.top-actions{display:flex;align-items:center;gap:10px}
.manual-update-btn{background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.02));border:1px solid var(--border);color:var(--text);padding:8px 12px;border-radius:8px;cursor:pointer;font-weight:800}
.manual-update-btn.loading{background:linear-gradient(180deg,rgba(23,201,255,.12),rgba(23,201,255,.06));border-color:rgba(23,201,255,.3)}
.manual-update-btn.success{background:linear-gradient(180deg,rgba(46,230,107,.12),rgba(46,230,107,.06));border-color:rgba(46,230,107,.3)}
.manual-update-btn.error{background:linear-gradient(180deg,rgba(255,79,79,.12),rgba(255,79,79,.06));border-color:rgba(255,79,79,.3)}
.update-status{font-weight:700}
.update-status.muted{color:var(--muted)}
.update-status.loading{color:var(--cyan)}
.update-status.success{color:var(--green)}
.update-status.error{color:var(--red)}

/* New update action styles */
.update-action{display:flex;align-items:center;gap:12px}
.update-button{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:10px;background:rgba(10,20,25,0.6);border:1px solid rgba(23,201,255,0.6);color:var(--cyan);font-weight:800;cursor:pointer;transition:all 160ms ease}
.update-button .icon{font-size:16px;line-height:1}
.update-button:hover{box-shadow:0 6px 18px rgba(23,201,255,0.08);transform:translateY(-1px);filter:brightness(1.03)}
.update-button:disabled{opacity:0.6;cursor:not-allowed;filter:grayscale(.06)}
.update-button.loading{background:rgba(5,10,14,0.6);color:var(--muted);border-color:rgba(200,180,20,0.25)}
.update-button.success{background:rgba(18,60,20,0.6);color:var(--green);border-color:rgba(46,230,107,0.45)}
.update-button.error{background:rgba(40,24,8,0.6);color:var(--orange);border-color:rgba(255,122,45,0.35)}

.update-status-box{background:rgba(255,255,255,0.02);border:1px solid var(--border);padding:8px 10px;border-radius:8px;color:var(--muted);font-size:13px;display:flex;flex-direction:column;gap:4px;min-width:220px}
.update-status-row{display:flex;align-items:center;justify-content:space-between}
.update-status-key{color:var(--muted);font-size:12px}
.update-status-val{font-weight:700;font-size:13px}
.log-path{color:#8b95a3;font-size:12px;word-break:break-all}

.status-dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:8px}
.status-dot.idle{background:#6b7280}
.status-dot.running{background:#f5c84c}
.status-dot.success{background:var(--green)}
.status-dot.error{background:var(--orange)}

/* futures row flag styles */
.flag-row{background:linear-gradient(180deg,rgba(255,255,255,0.01),rgba(0,0,0,0.05));border-left:4px solid rgba(255,186,67,0.9)}
.flag-badge{display:inline-block;background:rgba(255,186,67,0.10);color:var(--gold);border:1px solid rgba(255,186,67,0.25);padding:4px 8px;border-radius:6px;margin-right:6px;font-weight:700;font-size:12px}
.flag-row td{color:#fff}

/* futures asset card layout */
.asset-cards{display:flex;flex-wrap:wrap;gap:12px}
.asset-card{background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.02));border:1px solid var(--border);border-radius:10px;padding:10px;min-width:420px;flex:1}
.asset-card-flagged{border-left:4px solid rgba(255,186,67,0.9);box-shadow:0 8px 24px rgba(0,0,0,0.4)}
.asset-card-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.asset-name{font-weight:900;font-size:18px}
.asset-meta{color:var(--muted);font-size:13px}
.asset-table{width:100%;border-collapse:collapse}
.asset-table th,.asset-table td{padding:8px;border-bottom:1px solid rgba(255,255,255,.04);font-size:13px}

/* new mini-card layout */
.exchange-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.exchange-mini-card{background:rgba(255,255,255,0.02);border:1px solid var(--border);padding:10px;border-radius:8px;min-width:220px}
.exchange-mini-card-flagged{border:1px solid rgba(255,186,67,0.6);box-shadow:0 6px 18px rgba(255,186,67,0.06)}
.kv-row{display:flex;justify-content:space-between;padding:4px 0;border-bottom:1px dashed rgba(255,255,255,0.02)}
.kv-label{color:var(--muted);font-size:13px}
.kv-value{font-weight:700;font-size:13px;text-align:right}
.asset-card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.asset-title{font-weight:900;font-size:18px}
.futures-summary{display:flex;gap:12px;margin-bottom:10px;color:var(--muted)}
.empty-flag{color:#9aa6b2;background:rgba(255,255,255,0.03);padding:3px 6px;border-radius:6px}
