/* ============================================================
   MASTER VORTEX — Crypto view styles.
   Pairs with crypto.js (view: #cryptoView). Tokens match
   styles.css / earnings.css (--green, --panel, --panel-2,
   --edge, --dim, --ink, --red). Every weight in this file
   is 400 — the platform unbold rule.
   ============================================================ */

/* When the Crypto view is open it owns the workspace: the chart
   grid steps aside. */
body.mv-crypto-open .main{display:none}
body.mv-crypto-open .tf-group{visibility:hidden}

.crypto-view{flex:1; min-height:0; display:flex; flex-direction:column;
  background:var(--panel); margin:10px; border:1px solid var(--edge); border-radius:14px;
  overflow:hidden}
.crypto-view[hidden]{display:none}

.crypto-head{display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  padding:12px 16px; border-bottom:1px solid var(--edge); background:var(--panel-2)}
.crypto-title{font-size:15px; font-weight:400; letter-spacing:1.5px; color:var(--ink)}
.crypto-controls{display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-left:auto}
.crypto-filters{display:flex; gap:0; border:1px solid var(--edge); border-radius:10px; overflow:hidden}
.crypto-filter{font:inherit; font-size:12px; font-weight:400; letter-spacing:.4px;
  background:transparent; color:var(--dim); border:0; padding:7px 14px; cursor:pointer}
.crypto-filter + .crypto-filter{border-left:1px solid var(--edge)}
.crypto-filter:hover{color:var(--ink)}
.crypto-filter.active{background:#17351c; color:var(--green)}
.crypto-refresh{font:inherit; font-size:12px; font-weight:400; letter-spacing:.4px;
  background:var(--panel); color:var(--ink); border:1px solid var(--edge);
  border-radius:10px; padding:7px 14px; cursor:pointer}
.crypto-refresh:hover{border-color:var(--green); color:var(--green)}
.crypto-refresh:disabled{opacity:.5; cursor:default}
.crypto-status{font-size:12px; color:var(--dim); font-weight:400}
.crypto-status.err{color:var(--red)}

.crypto-movers{display:flex; align-items:center; gap:8px; flex-wrap:wrap;
  padding:9px 16px; border-bottom:1px solid var(--edge); background:#0a1322}
.crypto-movers[hidden]{display:none}
.crypto-movers-label{font-size:10.5px; font-weight:400; letter-spacing:1.2px; color:var(--dim)}
.crypto-mover{font:inherit; font-size:12px; font-weight:400;
  background:var(--panel); color:var(--ink); border:1px solid var(--edge);
  border-radius:14px; padding:4px 10px; cursor:pointer; white-space:nowrap}
.crypto-mover:hover{border-color:var(--green)}
.crypto-mover.up{color:var(--green)}
.crypto-mover.dn{color:var(--red)}

.crypto-table-wrap{flex:1; min-height:0; overflow:auto; position:relative}
.crypto-table{width:100%; border-collapse:collapse; font-size:13.5px}
.crypto-table thead th{
  position:sticky; top:0; z-index:2; background:#0a1322; color:var(--dim);
  font-size:11px; font-weight:400; letter-spacing:1.1px; text-align:left;
  padding:9px 12px; border-bottom:1px solid var(--edge); white-space:nowrap; cursor:pointer}
.crypto-table thead th.r, .crypto-table td.r{text-align:right}
.crypto-table tbody td{
  padding:8px 12px; border-bottom:1px solid #101c2e; white-space:nowrap;
  font-variant-numeric:tabular-nums; font-weight:400}
.crypto-table tbody tr.crypto-row{cursor:pointer}
.crypto-table tbody tr.crypto-row:hover{background:#0a1524}
.crypto-table tbody tr.crypto-row.sel{background:#0d1f14}
.crypto-table .sym{font-weight:400; letter-spacing:.3px; color:var(--ink)}
.crypto-table .nm{color:#c6d6ea; max-width:220px; overflow:hidden; text-overflow:ellipsis}
.crypto-table td.up{color:var(--green)}
.crypto-table td.dn{color:var(--red)}
.crypto-empty{padding:34px 16px; text-align:center; color:var(--dim); font-size:13px; font-weight:400}
.crypto-empty[hidden]{display:none}

.crypto-detail{border-top:1px solid var(--edge); background:var(--panel-2); padding:10px 16px 14px}
.crypto-detail[hidden]{display:none}
.crypto-detail-head{display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:8px}
.crypto-detail-sym{font-size:14px; font-weight:400; letter-spacing:.6px; color:var(--ink)}
.crypto-detail-name{font-size:12.5px; color:var(--dim)}
.crypto-detail-px{font-size:12.5px; color:var(--ink); margin-left:auto}
.crypto-detail-close{font:inherit; font-size:11.5px; font-weight:400; letter-spacing:.4px;
  background:transparent; color:var(--dim); border:1px solid var(--edge);
  border-radius:9px; padding:5px 10px; cursor:pointer}
.crypto-detail-close:hover{color:var(--ink); border-color:var(--green)}
.crypto-chart{width:100%; height:220px}
.crypto-chart-note{font-size:12px; color:var(--dim); padding:10px 0 2px}
.crypto-chart-note[hidden]{display:none}

.crypto-risk{padding:9px 16px; border-top:1px solid var(--edge);
  font-size:11.5px; font-weight:400; line-height:1.5; color:var(--dim)}

@media (max-width:700px){
  .crypto-col-name{display:none}
  .crypto-table{font-size:12.5px}
  .crypto-chart{height:180px}
}