/* all.css 公用樣式 ＋ 星空背景 */

*,
*::before,
*::after {
  box-sizing: border-box;
}

:root {
  --astro-bg: #050714;
  --astro-card: rgba(10, 10, 25, 0.9);
  --astro-border: rgba(200, 180, 255, 0.5);
  --astro-accent: #b9afff;
  --astro-accent-soft: rgba(185, 175, 255, 0.45);
  --astro-error: #ff6b81;
  --astro-ok: #9dffb0;
  --astro-text-main: #f5f5ff;
  --astro-text-sub: rgba(210, 210, 235, 0.8);
}

html,
body {
  margin: 0;
  padding: 0;
  height: 100%;
  font-family: "Poppins", system-ui, -apple-system, BlinkMacSystemFont,
    "Segoe UI", sans-serif;
  color: var(--astro-text-main);
  background: radial-gradient(
      circle at center,
      rgba(185, 175, 255, 0.06),
      #050714 60%
    ),
    #050714;
  overflow-x: hidden;
}

/* 星空背景 canvas */
#space-bg {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  display: block;
  background: radial-gradient(circle at 20% 0%, #1b1630 0, #050714 50%);
}

/* 通用按鈕 */
.btn {
  border-radius: 999px;
  border: 0;
  padding: 10px 16px;
  font-size: 0.95rem;
  cursor: pointer;
  transition: 0.18s ease;
}

.btn-primary {
  background: linear-gradient(135deg, #a38aff, #e2dcff);
  color: #13081b;
  font-weight: 600;
  box-shadow: 0 0 16px rgba(190, 170, 255, 0.8);
}

.btn-primary:hover {
  transform: translateY(-1px) scale(1.01);
  box-shadow: 0 0 22px rgba(200, 180, 255, 1);
}

.btn-ghost {
  background: rgba(200, 180, 255, 0.08);
  color: var(--astro-text-main);
  border: 1px solid var(--astro-accent-soft);
}

.btn-ghost:hover {
  background: rgba(200, 180, 255, 0.2);
  box-shadow: 0 0 14px rgba(200, 180, 255, 0.6);
}

.btn-danger {
  background: linear-gradient(135deg, #ff6b81, #ffc3a0);
  color: #1a0b12;
  font-weight: 600;
  box-shadow: 0 0 18px rgba(255, 120, 150, 0.8);
}

.btn-danger:hover {
  transform: translateY(-1px) scale(1.01);
  box-shadow: 0 0 24px rgba(255, 150, 170, 1);
}

/* footer */
.accounts-footer {
  text-align: center;
  padding: 16px 0 20px;
  font-size: 0.8rem;
  color: rgba(200, 200, 230, 0.75);
}

.accounts-footer .copyright {
  margin: 0;
}
