/* Halloween: orange + purple on a dark plum background, a little pumpkin on the logo */
:root {
  --bg: #0d0814; --bg-elevated: #140c20; --surface: #1a1128; --surface-2: #231638;
  --border: #3d2563; --border-soft: #2b1a47;
  --text-dim: #bba9d8; --text-faint: #85749f;
  --blue: #e8650a; --blue-bright: #ff9a3c; --violet: #8b3fe0; --cyan: #ffb74d;
  --blue-rgb: 232, 101, 10; --blue-bright-rgb: 255, 154, 60; --violet-rgb: 139, 63, 224; --cyan-rgb: 255, 183, 77;
}
body {
  background-image:
    radial-gradient(ellipse 900px 500px at 12% -10%, rgba(139, 63, 224, 0.24), transparent 60%),
    radial-gradient(ellipse 800px 600px at 110% 10%, rgba(255, 122, 24, 0.14), transparent 55%),
    radial-gradient(ellipse 1200px 800px at 50% 120%, rgba(232, 101, 10, 0.12), transparent 60%),
    radial-gradient(ellipse 700px 500px at 90% 90%, rgba(139, 63, 224, 0.10), transparent 55%);
}
.brand-mark::before {
  content: ''; position: absolute; right: -9px; bottom: -7px; width: 19px; height: 17px; z-index: 2;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 36'%3E%3Cellipse cx='11' cy='22' rx='9' ry='12' fill='%23f26a0f'/%3E%3Cellipse cx='29' cy='22' rx='9' ry='12' fill='%23f26a0f'/%3E%3Cellipse cx='20' cy='22' rx='10' ry='13' fill='%23ff8a1f'/%3E%3Cpath d='M18 9 C18 4 22 3 24 0 L27 2 C24 4 23 7 22 10Z' fill='%233d5a1e'/%3E%3Cpath d='M12 20 L16 20 L14 15Z M24 20 L28 20 L26 15Z M12 27 L15 29 L17 27 L20 30 L23 27 L25 29 L28 27 L27 31 L20 33 L13 31Z' fill='%232a0f05'/%3E%3C/svg%3E") center / contain no-repeat;
}
.starfield::before, .starfield::after { filter: sepia(1) hue-rotate(-20deg) saturate(2.2); }