/* ══════════════════════════════════════════════════════════════
   BUILD PAGE — Hardware Aesthetic Overrides
   Loaded AFTER build.css. Reskins CRT/terminal with --hw-* tokens.
   No DOM changes — build.js keeps working.
══════════════════════════════════════════════════════════════ */

/* ── Global ── */
body {
  background: var(--hw-bg);
  font-family: var(--hw-font-body);
}

/* ── Nav ── */
.page-nav {
  background: var(--hw-bg);
  border-bottom: 2px solid var(--hw-metal-dark);
}
.nav-brand {
  font-family: var(--hw-font-brand);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--hw-tracking-wide);
  color: var(--hw-text);
}
.nav-brand span { color: var(--hw-metal-bright); }
.nav-links a {
  font-family: var(--hw-font-brand);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--hw-tracking-wide);
  color: var(--hw-text-dim);
  font-size: 0.7rem;
}
.nav-links a:hover { color: var(--hw-text); }
.nav-auth-btn {
  font-family: var(--hw-font-brand);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--hw-tracking-wide);
  background: var(--hw-bg-raised);
  border-color: var(--hw-metal-dark);
  color: var(--hw-text);
}
.nav-auth-btn:hover {
  background: var(--hw-metal-dark);
  border-color: var(--hw-metal);
}

/* ── Monitor/Screen → Clean Workspace ── */
.landing-hero {
  background: var(--hw-bg);
}
.monitor-wrap,
.monitor {
  background: transparent;
}
.monitor {
  border: 2px solid var(--hw-metal-dark);
  border-radius: 0;
  box-shadow: var(--hw-shadow-deep);
}
.screen {
  background: var(--hw-bg);
}

/* Remove CRT effects */
.bloom, .scanlines, .vignette { display: none !important; }
.monitor::before,
.monitor::after { display: none; }

/* ── Idle Screen ── */
.monitor-idle {
  background: var(--hw-bg);
}
.idle-logo {
  font-family: var(--hw-font-brand);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--hw-tracking-ultra);
  color: var(--hw-text-dim);
  text-shadow: none;
}
.idle-version {
  font-family: var(--hw-font-brand);
  text-transform: uppercase;
  letter-spacing: var(--hw-tracking-wide);
  color: var(--hw-text-faint);
}
.idle-press {
  font-family: var(--hw-font-brand);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--hw-tracking-wide);
  color: var(--hw-text-dim);
}

/* ── Progress Pipeline ── */
.progress-pipeline {
  background: var(--hw-bg-raised);
  border-bottom: 1px solid var(--hw-metal-dark);
}
.pp-stage {
  font-family: var(--hw-font-brand);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--hw-tracking-wide);
  color: var(--hw-text-faint);
}
.pp-stage.active { color: var(--hw-text); }
.pp-stage.active .pp-icon { color: var(--led-active); }
.pp-stage.current .pp-icon {
  color: var(--led-signal);
}
.pp-arrow { color: var(--hw-text-faint); }

/* ── Terminal ── */
.terminal {
  font-family: var(--hw-font-mono);
  color: var(--hw-text);
}
.prompt-glyph { color: var(--led-active); }
#user-input-display { color: var(--hw-text); }
.cursor {
  background: var(--led-active);
}

/* Power LED */
.power-led {
  background: var(--led-active);
  box-shadow: 0 0 4px var(--led-active);
}

/* ── Auth Modal ── */
.home-auth-overlay {
  background: var(--hw-bg-overlay);
  backdrop-filter: blur(4px);
}
.home-auth-card {
  background: var(--hw-bg-panel);
  border: var(--hw-border);
  border-radius: 0;
  box-shadow: var(--hw-shadow-deep);
}
.home-auth-tab {
  font-family: var(--hw-font-brand);
  text-transform: uppercase;
  letter-spacing: var(--hw-tracking-wide);
}
.home-auth-input {
  background: var(--hw-bg-inset);
  border-color: var(--hw-metal-dark);
  color: var(--hw-text);
  font-family: var(--hw-font-mono);
  border-radius: var(--hw-radius-md);
}
.home-auth-input:focus { border-color: var(--hw-accent); }
.home-auth-submit {
  font-family: var(--hw-font-brand);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--hw-tracking-wide);
  background: var(--hw-metal-dark);
  border-color: var(--hw-metal);
  border-radius: var(--hw-radius-md);
}
.home-auth-submit:hover {
  background: var(--hw-metal);
}
.home-auth-error { color: var(--led-alert); }

/* ── Help Toolkit ── */
.help-fab {
  background: var(--hw-metal-dark);
  border: 2px solid var(--hw-metal);
  color: var(--hw-text);
  font-family: var(--hw-font-brand);
  box-shadow: var(--hw-shadow-raised);
}
.help-fab:hover {
  background: var(--hw-metal);
  border-color: var(--hw-metal-light);
}
.help-drawer {
  background: var(--hw-bg-panel);
  border: var(--hw-border);
  box-shadow: var(--hw-shadow-deep);
}
.help-drawer-header {
  font-family: var(--hw-font-brand);
  text-transform: uppercase;
  letter-spacing: var(--hw-tracking-wide);
  color: var(--hw-text-dim);
  border-bottom-color: var(--hw-metal-dark);
}
.help-drawer-body {
  font-family: var(--hw-font-body);
  color: var(--hw-text-dim);
}