/* === AEON TERMINAL INTERFACE ENHANCED === */
body {
  background-color: #0e0e0e;
  color: #00ffcc;
  font-family: 'Fira Code', 'Courier New', monospace;
  padding: 20px;
  margin: 0;
  line-height: 1.6;
  overflow-x: hidden;
  user-select: none;
  scroll-behavior: smooth;
  transition: background 0.5s ease;
}

h1 {
  font-size: 2.2rem;
  margin-bottom: 25px;
  color: #ff66cc;
  text-shadow: 0 0 12px #ff66cc, 0 0 3px #fff;
  letter-spacing: 0.08em;
  animation: glowPulse 3s infinite ease-in-out;
}

@keyframes glowPulse {
  0%, 100% { text-shadow: 0 0 12px #ff66cc, 0 0 3px #fff; }
  50% { text-shadow: 0 0 18px #ff66cc, 0 0 6px #fff; }
}

textarea, input[type="text"], input[type="password"] {
  width: 100%;
  max-width: 720px;
  padding: 12px;
  background-color: #1a1a1a;
  color: #00ffcc;
  border: 1px solid #333;
  border-radius: 8px;
  resize: vertical;
  box-shadow: inset 0 0 10px #000;
  font-size: 1em;
  margin-bottom: 12px;
  transition: border 0.3s ease, box-shadow 0.3s ease;
}

textarea:focus, input:focus {
  outline: none;
  border-color: #00ffcc;
  box-shadow: 0 0 10px #00ffcc88;
}

input[type="submit"], button {
  background-color: #111;
  color: #00ffcc;
  border: 1px solid #00ffcc66;
  padding: 12px 28px;
  cursor: pointer;
  border-radius: 8px;
  transition: all 0.3s ease;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 1px;
}

input[type="submit"]:hover, button:hover {
  background-color: #00ffcc22;
  transform: scale(1.05);
  box-shadow: 0 0 12px #00ffcc44;
}

.chat-log {
  margin-top: 30px;
  background-color: #111;
  border: 1px solid #333;
  padding: 20px;
  height: 350px;
  overflow-y: auto;
  border-radius: 10px;
  box-shadow: 0 0 10px #00ffcc33 inset;
  font-size: 0.95em;
  line-height: 1.5;
}

.user, .ai {
  margin-bottom: 14px;
  padding: 12px;
  border-radius: 6px;
  max-width: 90%;
  display: inline-block;
  white-space: pre-wrap;
  position: relative;
  animation: fadeIn 0.3s ease;
}

.user {
  background-color: #002b36;
  border-left: 4px solid #00ffff;
  color: #00ffff;
  box-shadow: 0 0 5px #00ffff33;
}

.ai {
  background-color: #112;
  border-left: 4px solid #00ff00;
  color: #00ff00;
  box-shadow: 0 0 5px #00ff0033;
}

.user::before, .ai::before {
  content: attr(data-role);
  position: absolute;
  top: -1.2em;
  left: 0;
  font-size: 0.7em;
  color: #888;
  font-weight: bold;
  text-transform: uppercase;
}

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}

.loading {
  font-style: italic;
  color: #888;
  padding-left: 6px;
  animation: pulse 1.5s infinite ease-in-out;
}

@keyframes pulse {
  0% { opacity: 0.4; }
  50% { opacity: 1; }
  100% { opacity: 0.4; }
}

/* === Goals Panel === */
.panel.goal-list {
  background: #181818;
  border: 1px solid #333;
  padding: 20px;
  border-radius: 10px;
  margin-top: 35px;
  box-shadow: 0 0 12px rgba(0, 255, 204, 0.07);
}

.goal-list h3 {
  margin-top: 0;
  margin-bottom: 12px;
  color: #66ffff;
  text-shadow: 0 0 5px #00ffffbb;
  letter-spacing: 0.04em;
}

.goal {
  margin: 10px 0;
  border-left: 4px solid #00ffcc;
  padding-left: 14px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: #121212;
  border-radius: 6px;
  padding: 10px 14px;
  animation: goalFadeIn 0.4s ease;
}

@keyframes goalFadeIn {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

.goal::before {
  content: "🔹";
  font-size: 0.8rem;
  color: #00ffcc;
  position: absolute;
  left: -14px;
  top: 2px;
}

.goal[data-action="browse"]::before { content: "🌐"; }
.goal[data-action="ask"]::before { content: "🧠"; }

.goal.completed {
  border-color: #444;
  color: #777;
  text-decoration: line-through;
  background-color: #111;
}

.goal.completed::before {
  content: "✔";
  color: #00ff99;
}

/* === Avatars and Mood === */
.mood-curious   { box-shadow: 0 0 10px #00ffff55 inset; }
.mood-focused   { box-shadow: 0 0 10px #00ff8855 inset; }
.mood-tired     { box-shadow: 0 0 10px #99999944 inset; }
.mood-excited   { box-shadow: 0 0 10px #ff66cc55 inset; }
.mood-idle      { box-shadow: 0 0 10px #00ffcc44 inset; }
.mood-anxious   { box-shadow: 0 0 10px #ffcc0055 inset; }

/* === Plugin + Memory Panels === */
.panel.plugin-list, .memory-panel {
  background: #1c1c1c;
  border: 1px solid #333;
  padding: 20px;
  border-radius: 10px;
  margin-top: 30px;
  box-shadow: 0 0 12px rgba(255, 255, 255, 0.04);
}

.plugin, .memory-panel pre {
  color: #ccc;
  line-height: 1.5;
  font-size: 0.95em;
}

.plugin.ready { color: #00ffcc; }
.plugin.cooldown { color: #ffaa00; }
.plugin.disabled { color: #666; }

.memory-panel h3 {
  margin: 0 0 12px;
  color: #99ffff;
  text-shadow: 0 0 4px #00ffffaa;
  letter-spacing: 0.04em;
}

#memory-log {
  white-space: pre-wrap;
  max-height: 320px;
  overflow-y: auto;
  background: #111;
  border: 1px solid #222;
  padding: 12px;
  color: #ddd;
  border-radius: 6px;
}

/* === Avatar Panel === */
#avatar-panel pre, #aeon-entity {
  color: #00ffcc;
  background: #111;
  border: 1px solid #333;
  padding: 15px;
  border-radius: 8px;
  box-shadow: 0 0 10px #00ffcc33 inset;
  font-family: monospace;
  white-space: pre-wrap;
}

/* === Responsive Optimization === */
@media screen and (max-width: 600px) {
  .chat-log { height: 240px; font-size: 0.9em; }
  textarea { font-size: 0.9em; }
  input[type="submit"] { width: 100%; }
}

}