/*
 * DS Quant terminal interface.
 * Independently implemented from visual references; no Neuberg source,
 * branding, or assets are included in this stylesheet.
 */
:root {
  --nb-bg: #000;
  --nb-panel: #050505;
  --nb-panel-2: #0a0a0a;
  --nb-hover: #111;
  --nb-border: #303030;
  --nb-border-hot: #ff9900;
  --nb-amber: #ff9900;
  --nb-amber-soft: #ffc266;
  --nb-green: #00e676;
  --nb-red: #ff3b30;
  --nb-cyan: #00d9ff;
  --nb-white: #f2f2f2;
  --nb-muted: #a0a0a0;
  --nb-dim: #666;
  --nb-grid: rgba(255, 153, 0, .045);
  --bg: var(--nb-bg);
  --surface: var(--nb-panel);
  --surface-2: var(--nb-panel-2);
  --surface-3: var(--nb-hover);
  --border: var(--nb-border);
  --border-strong: #464646;
  --text: #d8d8d8;
  --text-1: var(--nb-white);
  --text-2: var(--nb-muted);
  --text-3: var(--nb-dim);
  --accent: var(--nb-amber);
  --accent-soft: rgba(255, 153, 0, .13);
  --positive: var(--nb-green);
  --negative: var(--nb-red);
  --mono: "JetBrains Mono", "IBM Plex Mono", Consolas, "Liberation Mono", monospace;
  --sans: var(--mono);
  color-scheme: dark;
}

html { background: #000; }

body {
  background-color: #000 !important;
  background-image:
    linear-gradient(var(--nb-grid) 1px, transparent 1px),
    linear-gradient(90deg, var(--nb-grid) 1px, transparent 1px) !important;
  background-size: 20px 20px !important;
  color: #d8d8d8 !important;
  font-family: var(--mono) !important;
  letter-spacing: 0;
}

::selection { background: var(--nb-amber); color: #000; }
* { scrollbar-color: #383838 #050505; scrollbar-width: thin; }
*::-webkit-scrollbar { width: 7px; height: 7px; }
*::-webkit-scrollbar-track { background: #050505; }
*::-webkit-scrollbar-thumb { background: #383838; border: 1px solid #050505; }
*::-webkit-scrollbar-thumb:hover { background: var(--nb-amber); }

a { color: var(--nb-amber-soft); }
a:hover { color: var(--nb-amber); }

.shell { background: transparent !important; }
.sidebar {
  border-right: 1px solid var(--nb-border) !important;
  background: #020202 !important;
  box-shadow: none !important;
}
.brand {
  min-height: 72px;
  border-bottom: 1px solid var(--nb-border) !important;
  background: #000 !important;
}
.brand-logo { filter: grayscale(1) contrast(1.25) brightness(1.35); }
.brand em { color: var(--nb-amber) !important; }
.nav-label { color: var(--nb-dim) !important; letter-spacing: .15em !important; }
.nav a {
  border: 1px solid transparent !important;
  border-left: 2px solid transparent !important;
  border-radius: 0 !important;
  color: #a8a8a8 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.nav a:hover {
  border-color: #252525 !important;
  border-left-color: var(--nb-amber) !important;
  background: #0b0b0b !important;
  color: #fff !important;
}
.nav a.active {
  border-color: #343434 !important;
  border-left-color: var(--nb-amber) !important;
  background: #101010 !important;
  color: var(--nb-amber) !important;
}
.nav-icon { color: currentColor !important; }
.nav-code, .nav-code.is-accent { color: #777 !important; }
.nav a.active .nav-code { color: var(--nb-amber) !important; }
.sidebar-foot {
  border-top-color: var(--nb-border) !important;
  background: #000 !important;
  color: #888 !important;
}
.live-dot { background: var(--nb-green) !important; box-shadow: 0 0 7px rgba(0,230,118,.65) !important; }

.main { background: transparent !important; }
.topbar, .ops-statusbar, .mobile-shellbar {
  border-color: var(--nb-border) !important;
  background: #030303 !important;
  backdrop-filter: none !important;
  box-shadow: none !important;
}
.ops-strip, .topbar-right, .ops-statusbar { color: #888 !important; }
.ops-seg .label { color: #666 !important; }
.ops-seg .val, .op-id strong { color: #d8d8d8 !important; }
.ops-seg .val.accent { color: var(--nb-green) !important; }
.user-chip {
  border: 1px solid #333 !important;
  border-radius: 0 !important;
  background: #090909 !important;
}
.user-avatar { border-radius: 0 !important; background: var(--nb-amber) !important; color: #000 !important; }
.content { background: transparent !important; }

.page-header, .an-head, .nb-page-head, .bio-nb-head, .decision-top, .audit-topbar {
  border-color: var(--nb-border) !important;
  border-radius: 0 !important;
  background: #030303 !important;
  box-shadow: none !important;
}
.page-header h1, .an-head h1, .nb-page-head h1, .bio-nb-head h1,
.decision-top h1, .audit-topbar h1 { color: var(--nb-white) !important; font-family: var(--mono) !important; }
.page-header-id, .op-id, .section-kicker { color: var(--nb-amber) !important; }

.panel, .card, .terminal, .metric-card, .stat-card, .chart-card,
.an-panel, .nb-panel, .bio-panel, .decision-card, .audit-panel,
.table-responsive, .modal-content, .drawer, .detail-panel {
  border-color: var(--nb-border) !important;
  border-radius: 0 !important;
  background: var(--nb-panel) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}
.panel:hover, .card:hover, .metric-card:hover, .stat-card:hover,
.an-panel:hover, .nb-panel:hover, .bio-panel:hover {
  border-color: #555 !important;
}
.panel-head, .card-header, .terminal-header, .an-panel > header,
.nb-panel > header, .bio-panel > header {
  border-color: var(--nb-border) !important;
  border-radius: 0 !important;
  background: #090909 !important;
}
.panel-head h4, .card-header h2, .terminal-header h4,
.an-panel h2, .nb-panel h2, .bio-panel h2 { color: var(--nb-amber) !important; }

.table, table { color: #d6d6d6 !important; }
.table thead th, table thead th {
  border-color: #3a3a3a !important;
  background: #0d0d0d !important;
  color: var(--nb-amber) !important;
  font-family: var(--mono) !important;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.table td, table td { border-color: #242424 !important; }
.table tbody tr, table tbody tr { background: #030303 !important; }
.table tbody tr:nth-child(even), table tbody tr:nth-child(even) { background: #080808 !important; }
.table tbody tr:hover, table tbody tr:hover { background: #151008 !important; }

.form-control, input, select, textarea {
  border: 1px solid #3a3a3a !important;
  border-radius: 0 !important;
  background: #050505 !important;
  color: var(--nb-white) !important;
  box-shadow: none !important;
  font-family: var(--mono) !important;
}
.form-control:focus, input:focus, select:focus, textarea:focus {
  border-color: var(--nb-amber) !important;
  outline: 1px solid rgba(255,153,0,.25) !important;
  box-shadow: none !important;
}
.form-label, label { color: #aaa !important; }
.btn, button {
  border-radius: 0 !important;
  box-shadow: none !important;
  font-family: var(--mono) !important;
  font-weight: 800 !important;
  letter-spacing: .05em;
}
.btn-primary, .login-card button[type="submit"] {
  border: 1px solid var(--nb-amber) !important;
  background: var(--nb-amber) !important;
  color: #000 !important;
}
.btn-primary:hover, .login-card button[type="submit"]:hover { background: #ffc15e !important; }
.btn-secondary, .btn-ghost {
  border: 1px solid #444 !important;
  background: #090909 !important;
  color: #ccc !important;
}
.btn-danger, .btn-danger-ghost { border-color: var(--nb-red) !important; color: #ff8179 !important; background: transparent !important; }

.status-pill { border-radius: 0 !important; background: transparent !important; }
.status-pill.nom { border-color: var(--nb-green) !important; color: var(--nb-green) !important; }
.status-pill.amb { border-color: var(--nb-amber) !important; color: var(--nb-amber) !important; }
.status-pill.off { border-color: #555 !important; color: #888 !important; }
.alert { border-radius: 0 !important; background: #0b0b0b !important; color: #ddd !important; }
.alert-danger { border-color: var(--nb-red) !important; color: #ff8179 !important; }

/* Login becomes the same terminal system as the authenticated workspace. */
.login-wrap {
  min-height: 100vh;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: minmax(0, 1fr) !important;
  place-items: center !important;
  background: #000 !important;
  background-image:
    linear-gradient(rgba(255,153,0,.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,153,0,.055) 1px, transparent 1px) !important;
  background-size: 20px 20px !important;
}
.login-form-panel {
  grid-column: 1 / -1 !important;
  grid-row: 1 !important;
  justify-self: stretch !important;
  align-self: stretch !important;
  width: 100% !important;
  min-height: 100vh !important;
  display: grid !important;
  place-items: center !important;
  padding: 24px !important;
  box-sizing: border-box !important;
}
.login-card { width: min(420px, 100%) !important; }
.login-stage {
  border: 0 !important;
  border-right: 1px solid var(--nb-border) !important;
  border-radius: 0 !important;
  background: #020202 !important;
  box-shadow: none !important;
}
.stage-grid { background-size: 20px 20px !important; opacity: .45 !important; }
.stage-vignette { background: radial-gradient(circle, transparent 10%, #000 82%) !important; }
.stage-reticle { color: var(--nb-amber) !important; opacity: .7 !important; }
.stage-head, .stage-foot { border-color: #2d2d2d !important; }
.stage-status, .display-eyebrow, .display-sub, .hud-stream, .hud-clock span { color: #8d8d8d !important; }
.display-word { color: var(--nb-amber) !important; text-shadow: 0 0 22px rgba(255,153,0,.16) !important; font-family: var(--mono) !important; }
.login-form-panel { background: #000 !important; }
.login-card {
  border: 1px solid #3a3a3a !important;
  border-radius: 0 !important;
  background: #050505 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}
.login-eyebrow { color: var(--nb-amber) !important; }
.login-eyebrow::before { content: none !important; display: none !important; }
.login-eyebrow, .login-heading, .login-helper { text-align: center !important; }
.login-heading { color: #fff !important; font-family: var(--mono) !important; }
.login-helper { color: #888 !important; }
.crop-tl, .crop-tr, .crop-bl, .crop-br { border-color: var(--nb-amber) !important; }

@media (max-width: 900px) {
  .login-stage { border-right: 0 !important; border-bottom: 1px solid var(--nb-border) !important; }
  .mobile-shellbar { border-bottom: 1px solid var(--nb-border) !important; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
