/* =====================================================================
   超限霓虹破块 · 公共视觉主题 (Neon Breaker Theme)
   注入到每个游戏页面: <link rel="stylesheet" href="../_neon/neon-theme.css">
   配色基准: 深紫夜空底 #07060f / 品红 #ff2d95 / 电青 #00e6ff / 亮金 #ffd23f
   ===================================================================== */

:root {
  --nb-bg: #07060f;
  --nb-panel: #05040c;
  --nb-line: #2c2b52;
  --nb-text: #e8e9ff;
  --nb-dim: #8f97c8;
  --nb-pink: #ff2d95;
  --nb-cyan: #00e6ff;
  --nb-cyan-lt: #7af5ff;
  --nb-purple: #b14dff;
  --nb-gold: #ffd23f;
  --nb-red: #ff3b3b;
}

/* ---------- 页面底色：霓虹夜空 ---------- */
html, body {
  background:
    radial-gradient(1200px 700px at 50% -10%, #241a4d 0%, transparent 60%),
    radial-gradient(900px 600px at 90% 110%, #0d3b4a 0%, transparent 55%),
    var(--nb-bg) !important;
  color: var(--nb-text) !important;
}

body {
  font-family: "Segoe UI", system-ui, -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif !important;
  -webkit-font-smoothing: antialiased;
  overscroll-behavior: none;
}

/* ---------- 标题霓虹辉光 ---------- */
h1 {
  color: #fff !important;
  text-shadow:
    0 0 6px #fff,
    0 0 18px var(--nb-pink),
    0 0 42px var(--nb-pink),
    0 0 80px var(--nb-purple) !important;
}

h2, h3 {
  color: var(--nb-cyan-lt) !important;
  text-shadow:
    0 0 6px rgba(255,255,255,.8),
    0 0 18px var(--nb-cyan),
    0 0 44px rgba(0,230,255,.6) !important;
}

/* ---------- 按钮 / 可点元素霓虹化 ---------- */
button, .btn, input[type="button"],
a.button, .button {
  appearance: none;
  border: 1px solid #4a4a86;
  background: linear-gradient(180deg, #1b1b36 0%, #14142a 100%) !important;
  color: #dfe3ff !important;
  border-radius: 10px;
  transition: transform .12s, box-shadow .12s, border-color .12s;
}

button:hover, .btn:hover, a.button:hover, .button:hover {
  transform: translateY(-2px);
  border-color: var(--nb-cyan-lt) !important;
  box-shadow: 0 0 18px rgba(0, 230, 255, .35) !important;
}

button:active { transform: translateY(0); }

/* ---------- 表单控件 ---------- */
input[type="text"], input[type="number"], input[type="email"], input[type="password"], select, textarea {
  background: #14142a !important;
  color: #dfe3ff !important;
  border: 1px solid #4a4a86 !important;
  border-radius: 9px;
}
input:focus, select:focus, textarea:focus {
  outline: none !important;
  border-color: var(--nb-cyan-lt) !important;
  box-shadow: 0 0 12px rgba(0, 230, 255, .3);
}

/* ---------- 画布 / 舞台霓虹光晕 ---------- */
canvas {
  border-radius: 12px;
}

/* ---------- 链接 ---------- */
a { color: var(--nb-cyan-lt); }
a:hover { color: #fff; text-shadow: 0 0 12px var(--nb-cyan); }

/* ---------- 全局扫描线 + 暗角覆盖层（由 neon-audio.js 注入 DOM） ---------- */
.nb-scan {
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 2147483000;
  background: repeating-linear-gradient(
    to bottom,
    rgba(255, 255, 255, .035) 0px,
    rgba(255, 255, 255, .035) 1px,
    transparent 1px,
    transparent 3px
  );
  mix-blend-mode: overlay;
}

.nb-vig {
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 2147483000;
  background: radial-gradient(120% 90% at 50% 45%, transparent 60%, rgba(0, 0, 0, .5) 100%);
}

/* ---------- 音效/静音开关按钮 ---------- */
.nb-mute {
  position: fixed;
  right: 14px;
  bottom: 14px;
  z-index: 2147483600;
  appearance: none;
  border: 1px solid #4a4a86;
  background: rgba(20, 20, 42, .85);
  color: #cfd4ff;
  font: 700 12.5px/1 "Segoe UI", system-ui, "PingFang SC", "Microsoft YaHei", sans-serif;
  padding: 10px 14px;
  border-radius: 10px;
  cursor: pointer;
  backdrop-filter: blur(6px);
  letter-spacing: 1px;
  box-shadow: 0 0 14px rgba(0, 230, 255, .18);
  user-select: none;
}
.nb-mute:hover {
  border-color: var(--nb-cyan-lt);
  color: #fff;
  box-shadow: 0 0 20px rgba(0, 230, 255, .4);
}
.nb-mute.off {
  border-color: var(--nb-pink);
  color: #fff;
  box-shadow: 0 0 20px rgba(255, 45, 149, .5);
}

/* ---------- 霓虹卡片容器通用化 ---------- */
.nb-panel-glow {
  border: 1px solid var(--nb-line) !important;
  box-shadow:
    0 0 0 1px rgba(255, 45, 149, .25),
    0 0 34px rgba(255, 45, 149, .22),
    0 0 80px rgba(0, 230, 255, .16),
    0 22px 60px rgba(0, 0, 0, .6) !important;
}