/* Autophage OS — Full-Viewport Game World Styles */

:root {
  --eu-bg: #0a0e1a;
  --eu-border: #4a6fa5;
  --eu-border-light: #7ba3d4;
  --eu-gold: #ffd700;
  --eu-gold-dim: #b8960f;
  --eu-text: #ffffff;
  --eu-text-dim: #8899aa;
  --eu-accent: #a78bfa;
  --eu-teal: #4ecdc4;
  --eu-red: #ef4444;
  --eu-green: #4ade80;
  --eu-blue: #60a5fa;
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: var(--eu-bg);
  font-family: 'GameFont', 'Press Start 2P', monospace;
}

/* ─── Full-Viewport Layout ────────────────────────── */

#eu-layout {
  width: 100%;
  height: 100%;
}

#eu-game-container {
  width: 100%;
  height: 100%;
  position: relative;
  overflow: hidden;
  background: #000;
}

/* ─── In-Game XP Bar Overlay ──────────────────────── */

#eu-game-xp {
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: rgba(0,0,0,0.3);
  z-index: 9999;
  pointer-events: none;
}
#eu-game-xp-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--eu-gold-dim), var(--eu-gold));
  transition: width 0.8s ease;
  box-shadow: 0 0 6px rgba(255,215,0,0.4);
}

#eu-game-level {
  position: absolute;
  bottom: 6px; right: 6px;
  font-size: 9px;
  color: var(--eu-gold);
  background: rgba(0,0,40,0.8);
  border: 1px solid var(--eu-border);
  border-radius: 4px;
  padding: 2px 8px;
  z-index: 9999;
  pointer-events: none;
  opacity: 0.6;
}

/* ─── Notification Toast ──────────────────────────── */

#eu-notification {
  position: fixed;
  top: 40px; left: 50%;
  transform: translateX(-50%);
  font-size: 11px;
  color: var(--eu-gold);
  background: linear-gradient(180deg, rgba(0,8,48,0.95), rgba(0,4,32,0.98));
  border: 2px solid var(--eu-border);
  border-radius: 6px;
  padding: 8px 20px;
  z-index: 10000;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.3s, transform 0.3s;
  box-shadow: inset 0 0 0 1px rgba(123,163,212,0.3), 0 4px 12px rgba(0,0,0,0.5);
}
#eu-notification.visible {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}
