/* ================================================================
   base.css — リセット・body・背景エフェクト
   ================================================================ */

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent;
}

body {
  font-family: 'Rajdhani', 'Noto Sans JP', sans-serif;
  background: var(--bg);
  color: var(--text);
  min-height: 100vh;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}

/* グリッド背景 */
body::before {
  content: '';
  position: fixed; inset: 0;
  background-image:
    linear-gradient(rgba(0,212,255,0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,212,255,0.03) 1px, transparent 1px);
  background-size: 50px 50px;
  pointer-events: none;
  z-index: 0;
}

/* 背景グラデ発光 */
body::after {
  content: '';
  position: fixed; top: -50%; left: -50%; width: 200%; height: 200%;
  background:
    radial-gradient(ellipse at 30% 20%, rgba(0,102,255,0.08) 0%, transparent 50%),
    radial-gradient(ellipse at 70% 80%, rgba(123,47,255,0.08) 0%, transparent 50%);
  pointer-events: none;
  z-index: 0;
  animation: bgPulse 8s ease-in-out infinite alternate;
}

@keyframes bgPulse {
  from { opacity: 0.6; }
  to   { opacity: 1; }
}

/* スクロールバー */
::-webkit-scrollbar { width: 4px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--surface2); border-radius: 4px; }