:root {
  --ink: #f3fff5;
  --muted: #9dbca8;
  --quiet: #62796f;
  --green: #a8ff7a;
  --amber: #ffcf6a;
  --red: #ff6d5d;
  --panel: rgba(8, 20, 15, 0.78);
  --line: rgba(168, 255, 122, 0.22);
  --line-strong: rgba(168, 255, 122, 0.55);
  --shadow: rgba(0, 16, 9, 0.62);
  --aura-evolution-name: "Signal Bloom";
}

body {
  font-family: "Avenir Next", "Trebuchet MS", ui-rounded, sans-serif;
  background:
    radial-gradient(circle at 12% 8%, color-mix(in srgb, var(--green) 18%, transparent), transparent 24rem),
    radial-gradient(circle at 84% 16%, color-mix(in srgb, var(--amber) 16%, transparent), transparent 26rem),
    radial-gradient(circle at 48% 92%, color-mix(in srgb, var(--green) 9%, transparent), transparent 30rem),
    linear-gradient(135deg, #020605 0%, #071913 44%, #14230c 100%);
}

body::before {
  background-image:
    linear-gradient(color-mix(in srgb, var(--green) 7%, transparent) 1px, transparent 1px),
    linear-gradient(90deg, color-mix(in srgb, var(--amber) 5%, transparent) 1px, transparent 1px);
  background-size: 36px 36px;
}

body::after {
  content: "Signal Bloom · visual scanner active · generic defaults blocked";
  position: fixed;
  left: 18px;
  bottom: 12px;
  z-index: 100;
  pointer-events: none;
  color: color-mix(in srgb, var(--green) 62%, transparent);
  font-size: 10px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.panel {
  border-radius: 30px 18px 34px 18px;
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--panel) 84%, transparent), rgba(0,0,0,0.26)),
    repeating-linear-gradient(135deg, rgba(255,255,255,0.018) 0 1px, transparent 1px 9px);
  box-shadow: 0 28px 92px var(--shadow), inset 0 1px 0 color-mix(in srgb, var(--green) 18%, transparent);
}

.entity {
  border-radius: 42% 58% 53% 47% / 48% 43% 57% 52%;
  background:
    radial-gradient(circle at 50% 50%, var(--ink) 0 2.4%, transparent 3.2%),
    radial-gradient(circle at 49% 52%, color-mix(in srgb, var(--green) 38%, transparent), transparent 33%),
    conic-gradient(from 140deg, color-mix(in srgb, var(--amber) 16%, transparent), var(--green), transparent, var(--amber), color-mix(in srgb, var(--green) 22%, transparent));
  filter: saturate(1.1) contrast(1.04);
}

.message.aura {
  border-left: 3px solid var(--green);
}

.message.user {
  border-right: 3px solid var(--amber);
}

button, a.button {
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--green) 28%, transparent), 0 12px 28px color-mix(in srgb, var(--green) 13%, transparent);
}

.scanner-card {
  border: 1px solid var(--line);
  border-radius: 20px;
  padding: 13px;
  background:
    radial-gradient(circle at 0 0, color-mix(in srgb, var(--green) 12%, transparent), transparent 15rem),
    rgba(255,255,255,0.035);
}