/* ========================================================================
   PCS — Industrial Theme Tokens (Cyber-Blue · Black · Glow)
   ======================================================================== */

:root {
  /* Base palette */
  --pcs-bg-0:        #02050d;
  --pcs-bg-1:        #060b1a;
  --pcs-bg-2:        #0b1426;
  --pcs-panel:       rgba(10, 22, 44, 0.62);
  --pcs-panel-strong:rgba(13, 28, 56, 0.85);
  --pcs-line:        rgba(80, 160, 255, 0.18);
  --pcs-line-strong: rgba(120, 200, 255, 0.45);

  --pcs-blue-50:     #eaf6ff;
  --pcs-blue-200:    #93d4ff;
  --pcs-blue-300:    #5fbdff;
  --pcs-blue-400:    #38bdf8;
  --pcs-blue-500:    #0ea5e9;
  --pcs-blue-600:    #0284c7;
  --pcs-blue-700:    #0369a1;
  --pcs-blue-900:    #0c2d57;
  --pcs-cyan-400:    #22d3ee;
  --pcs-indigo-500:  #6366f1;
  --pcs-violet-500:  #8b5cf6;

  --pcs-text:        #d6efff;
  --pcs-text-soft:   #88aacb;
  --pcs-text-mute:   #5b7ea0;

  --pcs-good:        #22c55e;
  --pcs-warn:        #f59e0b;
  --pcs-bad:         #ef4444;

  --pcs-shadow-blue: 0 0 24px rgba(56, 189, 248, 0.35), 0 0 48px rgba(14, 165, 233, 0.18);
  --pcs-shadow-soft: 0 8px 30px rgba(0, 0, 0, 0.55);
  --pcs-glow-text:   0 0 8px rgba(120, 220, 255, 0.6);

  --pcs-radius-sm: 6px;
  --pcs-radius-md: 10px;
  --pcs-radius-lg: 14px;

  --pcs-ease:    cubic-bezier(0.22, 1, 0.36, 1);
  --pcs-fast:    180ms;
  --pcs-normal:  280ms;
  --pcs-slow:    480ms;

  --pcs-mono: ui-monospace, "JetBrains Mono", "Cascadia Mono", Consolas, "Courier New", monospace;
  --pcs-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC",
              "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue",
              Arial, sans-serif;
}

* {
  box-sizing: border-box;
}

html, body {
  margin: 0;
  padding: 0;
  height: 100%;
  background: var(--pcs-bg-0);
  color: var(--pcs-text);
  font-family: var(--pcs-sans);
  font-size: 14px;
  letter-spacing: 0.02em;
  overflow: hidden;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

body.scroll-y { overflow-y: auto; }

a {
  color: var(--pcs-blue-300);
  text-decoration: none;
  transition: color var(--pcs-fast) var(--pcs-ease);
}
a:hover { color: var(--pcs-blue-200); text-shadow: var(--pcs-glow-text); }

::selection { background: rgba(56, 189, 248, 0.35); color: #fff; }

/* Background layers */
.bg-grid {
  position: fixed; inset: 0; pointer-events: none; z-index: 0;
  background-image:
    linear-gradient(rgba(80, 180, 255, 0.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(80, 180, 255, 0.06) 1px, transparent 1px);
  background-size: 56px 56px, 56px 56px;
  mask-image: radial-gradient(ellipse at 50% 30%, #000 30%, transparent 80%);
}
.bg-orbits {
  position: fixed; inset: 0; pointer-events: none; z-index: 0;
  background:
    radial-gradient(circle at 18% 22%, rgba(34, 211, 238, 0.10) 0, transparent 35%),
    radial-gradient(circle at 82% 75%, rgba(99, 102, 241, 0.10) 0, transparent 38%),
    radial-gradient(circle at 50% 110%, rgba(14, 165, 233, 0.18) 0, transparent 55%);
}
.bg-glow {
  position: fixed; inset: 0; pointer-events: none; z-index: 0;
  background: radial-gradient(circle at 50% 0%, rgba(56, 189, 248, 0.10) 0, transparent 60%);
}

/* Scrollbar */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: rgba(10, 22, 44, 0.5); }
::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #1e3a8a, #0ea5e9);
  border-radius: 6px;
}
::-webkit-scrollbar-thumb:hover { background: linear-gradient(180deg, #38bdf8, #0ea5e9); }