:root {
  --guanlan-space: #0A1326;
  --guanlan-teal: #00D4C4;
  --guanlan-blue: #1B6BFF;
  --guanlan-mist: #8FA6C1;
  --guanlan-cloud: #F2F6FA;
  --guanlan-abyss: var(--guanlan-space);
  --guanlan-navy: #071020;
  --guanlan-panel: #0d1c33;
  --guanlan-panel-strong: #102641;
  --guanlan-line: #244258;
  --guanlan-line-soft: #183348;
  --guanlan-text: var(--guanlan-cloud);
  --guanlan-muted: var(--guanlan-mist);
  --guanlan-green: var(--guanlan-teal);
  --guanlan-amber: #f2b84b;
  --guanlan-red: #f26d78;
  --bg: var(--guanlan-abyss);
  --panel: var(--guanlan-panel);
  --panel2: var(--guanlan-navy);
  --ink: var(--guanlan-text);
  --muted: var(--guanlan-muted);
  --line: var(--guanlan-line);
  --blue: var(--guanlan-blue);
  --green: var(--guanlan-green);
  --red: var(--guanlan-red);
  --amber: var(--guanlan-amber);
  --soft: #102f45;
}

html {
  background: var(--guanlan-abyss);
}

body {
  background: var(--guanlan-space);
  color: var(--guanlan-text);
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(0, 212, 196, .025) 1px, transparent 1px),
    linear-gradient(rgba(27, 107, 255, .025) 1px, transparent 1px);
  background-size: 48px 48px;
}

button,
input,
select,
textarea {
  letter-spacing: 0;
}

button {
  border-color: var(--guanlan-line);
  background: #102538;
  color: var(--guanlan-text);
  transition: border-color .16s ease, background-color .16s ease, color .16s ease;
}

button:hover:not(:disabled) {
  border-color: #39708d;
  background: #153149;
}

button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 2px solid var(--guanlan-teal);
  outline-offset: 2px;
}

button.primary,
.primary {
  background: var(--guanlan-blue);
  border-color: var(--guanlan-blue);
  color: var(--guanlan-cloud);
}

button.primary:hover:not(:disabled),
.primary:hover:not(:disabled) {
  background: #237ae9;
}

input,
select,
textarea {
  border-color: #294b61;
  background: #071827 !important;
}

.panel,
.v79-dashboard-card,
.v79-center-band,
.mini-card {
  border-color: var(--guanlan-line-soft);
  border-radius: 8px;
  background: #0d2031;
  box-shadow: 0 12px 30px rgba(0, 0, 0, .16);
}

.v83d-page-kicker {
  margin-bottom: 5px;
  color: var(--guanlan-teal);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0;
}

.v79-page-head {
  align-items: center;
  margin-bottom: 16px;
  padding: 0 2px;
}

.v79-page-head h2 {
  color: #f2fbfd;
  font-size: 23px;
}

.v79-page-head p {
  color: var(--guanlan-muted);
}

/* Auth shell */
#v82k-auth-view {
  background:
    linear-gradient(rgba(22, 199, 181, .04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(47, 125, 244, .04) 1px, transparent 1px),
    #061421;
  background-size: 42px 42px, 42px 42px, auto;
}

.v82k-login-layout {
  width: min(1040px, 100%);
  border-color: #25465c;
  background: #091a29;
  box-shadow: 0 30px 90px rgba(0, 0, 0, .48);
}

.v82k-login-context {
  padding: 38px 44px;
  border-color: #234257;
  background: #0b2032;
}

.v83d-login-logo {
  display: block;
  width: min(400px, 100%);
  height: auto;
  max-height: 118px;
  margin-bottom: 22px;
  object-fit: contain;
  object-position: left center;
}

.v82k-login-context .eyebrow {
  color: var(--guanlan-teal);
  letter-spacing: 0;
}

.v82k-login-context h1 {
  color: #f4fbff;
  font-size: 36px;
}

.v82k-login-context .v83d-brand-slogan {
  margin: 0 0 12px;
  color: #b9d8e2;
  font-weight: 700;
}

.v82k-login-kpis div {
  border-color: #2a4b60;
}

.v82k-login-kpis b,
.v82k-auth-ready {
  color: #6ce7d4;
}

.v82k-login-card {
  background: #091827;
}

/* Persistent product header */
header.terminal-head {
  position: relative;
  padding: 9px 22px;
  border-bottom-color: #1e3d52;
  background: #071421;
  box-shadow: 0 10px 28px rgba(0, 0, 0, .24);
}

.terminal-brand {
  display: flex;
  align-items: center;
  gap: 16px;
  min-width: 0;
}

.v83d-header-logo {
  display: block;
  width: 240px;
  height: 66px;
  flex: 0 0 auto;
  object-fit: contain;
  object-position: left center;
}

.v83d-header-meta {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.v83d-header-meta .mini {
  color: #74d9ce;
}

.terminal-status {
  gap: 8px;
}

.status-tile {
  border-color: #23465d;
  background: #0b1d2d;
}

.status-tile .k {
  color: #7897aa;
}

.status-tile .v {
  color: #e5f5f7;
}

.v82k-session-bar {
  padding: 8px 22px;
  border-bottom-color: #1c394d;
  background: #081827;
}

.v82k-session-metrics span {
  border-color: #23465d;
  background: #0c2032;
}

main {
  max-width: 1480px;
  padding: 16px 22px 28px;
}

.front-nav {
  position: sticky;
  top: 0;
  z-index: 12;
  grid-template-columns: repeat(5, minmax(118px, 1fr));
  gap: 4px;
  margin: 0 0 18px;
  padding: 5px;
  border-color: #1d3c52;
  border-radius: 8px;
  background: rgba(6, 17, 31, .96);
  box-shadow: 0 8px 20px rgba(0, 0, 0, .18);
}

.front-nav button {
  min-height: 40px;
  border-radius: 6px;
  color: #91aab9;
}

.front-nav button.active {
  border-color: #287591;
  background: #10334a;
  color: #e9feff;
  box-shadow: inset 0 -2px 0 var(--guanlan-teal);
}

/* Approved overview hierarchy, backed by the unchanged v8.2k IDs. */
.v79-dashboard-grid {
  gap: 12px;
}

.v79-dashboard-card {
  min-height: 176px;
  padding: 16px;
}

.v79-dashboard-card h2 {
  color: #dff4f6;
  font-size: 13px;
}

.v79-dashboard-card .v79-value {
  color: #f5fbff;
}

.v79-card-market,
.v79-card-signal,
.v79-card-risk,
#v80DashboardCard {
  grid-column: span 3;
}

.v79-card-market {
  border-top: 2px solid var(--guanlan-blue);
}

.v79-card-signal {
  border-top: 2px solid var(--guanlan-teal);
  border-left-width: 1px;
}

.v79-card-risk {
  border-top: 2px solid var(--guanlan-amber);
}

#v80DashboardCard {
  border-top: 2px solid #6f82ff;
}

#v80DashboardCard .v80-inline-metrics {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.v79-card-position {
  grid-column: span 7;
  border-left: 3px solid var(--guanlan-blue);
}

.v79-card-review {
  grid-column: span 5;
  border-left: 3px solid var(--guanlan-teal);
}

.v79-kpi {
  border-color: #27445a !important;
}

/* Manual input keeps every v8.2k field and save handler. */
#trade .front-shell {
  grid-template-columns: minmax(620px, 1.1fr) minmax(390px, .9fr);
  gap: 14px;
}

#trade .front-shell > .panel:first-child {
  border-top: 2px solid var(--guanlan-blue);
}

#trade .front-stack .panel:first-child {
  border-top: 2px solid var(--guanlan-teal);
}

#trade .front-actions {
  border-top: 1px solid #23445a;
  padding-top: 13px;
}

.signal {
  border-radius: 7px;
  background: #0a1b2a;
}

.risk-card .line,
.record-summary,
.note,
.check-grid,
details.t0-panel {
  border-color: #28475c;
  background: #091a29;
}

/* Signal, review and tools retain their original controls and routes. */
.v83d-signal-heading {
  margin-bottom: 10px;
}

#shadowSignal .v80-subnav {
  margin-bottom: 12px;
  border-color: #23465c;
  background: #081827;
}

#shadowSignal .panel,
#reviewCenter .v79-center-band,
#backend .panel {
  border-color: #1f3e53;
}

#shadowSignal .panel.span-7 {
  border-top: 2px solid var(--guanlan-blue);
}

#shadowSignal .panel.span-5 {
  border-top: 2px solid var(--guanlan-teal);
}

#reviewCenter .v79-center-band {
  min-height: 148px;
}

#reviewCenter .v79-center-band:nth-child(1),
#reviewCenter .v79-center-band:nth-child(4) {
  border-left: 3px solid var(--guanlan-blue);
}

#reviewCenter .v79-center-band:nth-child(2),
#reviewCenter .v79-center-band:nth-child(3) {
  border-left: 3px solid var(--guanlan-teal);
}

#backend .panel {
  border-top: 2px solid var(--guanlan-teal);
}

.backend-grid button {
  min-height: 52px;
  text-align: left;
  background: #0b2031;
}

.mobile-bottom-nav {
  border-top-color: #24465c;
  background: #071421;
}

.mobile-bottom-nav button.active {
  background: #10334a;
  color: #e8ffff;
  box-shadow: inset 0 2px 0 var(--guanlan-teal);
}

@media (max-width: 1180px) {
  .v83d-header-logo { width: 205px; height: 58px; }
  .v83d-header-meta { display: none; }
  .v79-card-market,
  .v79-card-signal,
  .v79-card-risk,
  #v80DashboardCard { grid-column: span 6; }
  #trade .front-shell { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 768px) {
  #v82k-auth-view { padding: 12px; }
  .v83d-login-logo { width: min(330px, 100%); max-height: 98px; }
  .v82k-login-context { padding: 24px; }
  .v82k-login-context h1 { font-size: 30px; }
  header.terminal-head { padding: 10px 12px; }
  .terminal-brand { display: block; }
  .v83d-header-logo { width: 190px; height: 54px; }
  main { padding: 12px 12px 88px; }
  .v79-dashboard-card,
  .v79-card-market,
  .v79-card-signal,
  .v79-card-risk,
  #v80DashboardCard,
  .v79-card-position,
  .v79-card-review {
    grid-column: 1;
    min-height: 0;
  }
  #v80DashboardCard .v80-inline-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .backend-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 430px) {
  .v82k-login-kpis { grid-template-columns: 1fr; }
  .v82k-login-context { padding: 20px; }
  .v82k-login-card { padding: 24px 20px; }
  .backend-grid { grid-template-columns: 1fr; }
}
