/* Institutional redesign layer for the US Low Caps cockpit.
   Purpose: dense, analytic, table-first, fewer toy-dashboard effects. */
:root {
  --pro-bg: #070a0f;
  --pro-bg-2: #0b1017;
  --pro-panel: rgba(12, 17, 25, 0.96);
  --pro-panel-2: rgba(15, 21, 31, 0.94);
  --pro-line: rgba(142, 154, 170, 0.16);
  --pro-line-strong: rgba(255, 154, 58, 0.34);
  --pro-text: #edf2f7;
  --pro-soft: #cfd9e4;
  --pro-muted: #8391a3;
  --pro-orange: #ff9a3a;
  --pro-orange-soft: #ffd7a8;
  --pro-green: #4fe38f;
  --pro-red: #ff6d86;
  --pro-amber: #f2c766;
  --pro-blue: #8fb7ff;
  --pro-mono: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  --pro-sans: Outfit, "Avenir Next", "Segoe UI", system-ui, sans-serif;
}

* { box-sizing: border-box; }
html { font-size: 13px; }
body {
  color: var(--pro-text) !important;
  background:
    linear-gradient(rgba(255,255,255,0.022) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.018) 1px, transparent 1px),
    radial-gradient(900px 360px at 15% -10%, rgba(255,154,58,0.09), transparent 58%),
    linear-gradient(180deg, #05070b 0%, #080c12 100%) !important;
  background-size: 36px 36px, 36px 36px, auto, auto !important;
  font-family: var(--pro-sans) !important;
}

.bg-glow { display: none !important; }
.bg-grid { opacity: 0.20 !important; }
.app, .wrap {
  max-width: 1580px !important;
  padding: 12px !important;
}

.desk-shell {
  background: rgba(8, 12, 18, 0.94) !important;
  border-bottom: 1px solid rgba(255,154,58,0.18) !important;
  box-shadow: 0 8px 22px rgba(0,0,0,0.24) !important;
}
.desk-shell__inner { max-width: 1580px !important; padding: 8px 12px !important; }
.desk-shell__row { grid-template-columns: minmax(180px, 250px) minmax(0, 1fr) auto !important; }
.desk-shell__title { font-size: 0.86rem !important; }
.desk-shell__link {
  min-height: 30px !important;
  padding: 6px 9px !important;
  border-radius: 8px !important;
  background: rgba(255,255,255,0.018) !important;
  border-color: rgba(255,154,58,0.16) !important;
  font-size: 0.58rem !important;
}
.desk-shell__link.is-active,
.desk-shell__link:hover {
  background: rgba(255,140,36,0.14) !important;
  border-color: rgba(255,154,58,0.45) !important;
  color: #fff0dc !important;
}
.desk-shell__chip { min-height: 28px !important; padding: 5px 8px !important; border-radius: 8px !important; }
.desk-shell__subrow {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 10px !important;
  padding-top: 7px !important;
  color: var(--pro-muted) !important;
  font-size: 0.68rem !important;
}
.desk-shell__context { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.desk-shell__status { display: flex !important; flex-wrap: wrap !important; gap: 6px !important; justify-content: flex-end !important; }

.hero, .shell, .panel, .stat, .note, .dossier, .table-wrap, .mini-card,
.sector-card, .heat, .module, .mini-panel, .info-card, .top20-card,
.asset, .score-card, .signal-card, .badge-card, .card {
  background: linear-gradient(180deg, var(--pro-panel), rgba(9, 13, 20, 0.96)) !important;
  border: 1px solid var(--pro-line) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}
.hero, .shell { padding: 14px !important; border-color: rgba(255,154,58,0.24) !important; }
.panel { margin-top: 10px !important; overflow: hidden; }
.panel-head, .sector-head, .heat-head {
  min-height: 38px;
  padding: 9px 11px !important;
  border-bottom: 1px solid rgba(255,255,255,0.07) !important;
  background: linear-gradient(90deg, rgba(255,154,58,0.08), transparent 40%) !important;
}
.panel-body { padding: 10px !important; }

h1, .title {
  color: #f8fafc !important;
  font-family: var(--pro-mono) !important;
  font-size: clamp(1.35rem, 2.25vw, 2.35rem) !important;
  letter-spacing: -0.055em !important;
  line-height: 0.96 !important;
  margin: 7px 0 !important;
}
h2, h3, .panel-title, .sector-name, .heat-title {
  color: var(--pro-soft) !important;
  font-family: var(--pro-mono) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.07em !important;
}
.panel-title, .sector-name, .heat-title { font-size: 0.72rem !important; }
.sub, .lead, .copy, .muted, .note p, .note li, .footer-note, .legend,
.asset-why, .score-caption, .company, .sector-meta, .heat-note {
  color: var(--pro-muted) !important;
  font-size: 0.80rem !important;
  line-height: 1.42 !important;
}

.chip, .tag, .rank-chip, .metric-chip, .ghost, .badge-mini,
.status, .eyebrow, .btn, .action, .chip-row a, .actions a {
  border-radius: 8px !important;
  font-family: var(--pro-mono) !important;
  font-size: 0.58rem !important;
  letter-spacing: 0.07em !important;
  text-transform: uppercase !important;
}
.chip-row a, .actions a, .action {
  padding: 8px 10px !important;
  border-color: rgba(255,154,58,0.32) !important;
  background: rgba(255,140,36,0.11) !important;
  color: var(--pro-orange-soft) !important;
}
.chip, .tag, .rank-chip, .metric-chip, .ghost, .badge-mini {
  background: rgba(255,255,255,0.025) !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  color: var(--pro-soft) !important;
}
.eyebrow, .chip.active, .clickable.active, .metric-chip.green, .rank-chip {
  color: var(--pro-orange-soft) !important;
  border-color: rgba(255,154,58,0.35) !important;
  background: rgba(255,140,36,0.12) !important;
}

.stat { padding: 9px 10px !important; }
.stat .label, .stat .k, .badge-card .k, .info-card .k, .market-metric .m-k {
  color: var(--pro-muted) !important;
  font: 700 0.57rem var(--pro-mono) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
}
.stat .value, .stat .v, .badge-card .v, .info-card .v, .market-metric .m-v {
  color: var(--pro-text) !important;
  font-family: var(--pro-mono) !important;
  font-weight: 800 !important;
  letter-spacing: -0.04em !important;
}

input, select, button {
  background: rgba(255,255,255,0.035) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  color: var(--pro-text) !important;
  border-radius: 8px !important;
}
input, select { min-height: 34px !important; padding: 8px 10px !important; }
button { cursor: pointer; }

.table-wrap { border-radius: 10px !important; background: rgba(8, 12, 18, 0.74) !important; }
table { width: 100%; border-collapse: collapse; }
th {
  background: rgba(8, 12, 18, 0.98) !important;
  color: #9eabb9 !important;
  font: 800 0.60rem var(--pro-mono) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
}
td {
  color: var(--pro-soft) !important;
  font: 650 0.76rem var(--pro-mono) !important;
}
th, td { padding: 8px 9px !important; border-bottom: 1px solid rgba(255,255,255,0.055) !important; }
tr:hover td { background: rgba(255,154,58,0.045) !important; }
.pos, .good { color: var(--pro-green) !important; }
.neg, .bad { color: var(--pro-red) !important; }
.warn, .amber { color: var(--pro-amber) !important; }
.selected { background: rgba(255,154,58,0.08) !important; color: var(--pro-orange-soft) !important; }

.asset, .top20-card { text-align: left; transition: border-color 120ms ease, background 120ms ease; }
.asset.active, .top20-card.active, tr.active td {
  border-color: rgba(255,154,58,0.48) !important;
  background: linear-gradient(180deg, rgba(255,140,36,0.10), rgba(12,17,25,0.96)) !important;
}
.ticker, .top20-ticker, .s-ticker { color: #ffffff !important; font-family: var(--pro-mono) !important; }
.status.valid { background: rgba(79,227,143,0.10) !important; color: #dfffea !important; border-color: rgba(79,227,143,0.32) !important; }
.status.blocked { background: rgba(255,109,134,0.10) !important; color: #ffdce2 !important; border-color: rgba(255,109,134,0.30) !important; }

/* Main cockpit execution queue */
.ready-panel { border-color: rgba(255,154,58,0.30) !important; }
.ready-kicker { color: var(--pro-orange-soft); font: 800 0.62rem var(--pro-mono); text-transform: uppercase; letter-spacing: 0.09em; }
.ready-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; padding: 10px; }
.ready-card { padding: 10px; border: 1px solid rgba(255,255,255,0.08); border-radius: 10px; background: rgba(255,255,255,0.025); }
.ready-card .k { color: var(--pro-muted); font: 800 0.56rem var(--pro-mono); text-transform: uppercase; letter-spacing: 0.08em; }
.ready-card .v { margin-top: 4px; color: #fff; font: 900 1.04rem var(--pro-mono); letter-spacing: -0.04em; }
.ready-card .s { margin-top: 4px; color: var(--pro-muted); font-size: 0.72rem; }
.ready-table { min-width: 1100px; }
.ready-table .action-buy { color: var(--pro-green) !important; }
.ready-table .action-pullback { color: var(--pro-amber) !important; }
.ready-table .action-watch { color: var(--pro-blue) !important; }
.ready-table .why-cell { font-family: var(--pro-sans) !important; color: var(--pro-muted) !important; max-width: 340px; white-space: normal; line-height: 1.3; }

@media (max-width: 1180px) {
  .desk-shell__row { grid-template-columns: 1fr !important; }
  .ready-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  html { font-size: 12px; }
  .app, .wrap { padding: 8px !important; }
  .hero-top, .hero-row, .content, .toolbar, .spot-grid, .summary-grid, .ready-grid { grid-template-columns: 1fr !important; }
  .desk-shell__nav { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .desk-shell__subrow { grid-template-columns: 1fr !important; }
  .desk-shell__status { justify-content: flex-start !important; }
  .panel-head, .sector-head, .heat-head { align-items: start !important; }
}