/* Easter egg styles: gor-9000. Moved verbatim out of static/app.css (egg rebuild); linked right after app.css in index.html. */
/* ================================================================
   Default pack — GOR 9000 (giana CodePen XmjOBG / Pure CSS HAL 9000).
   Namespaced .cgor9000*; transparent wrap (no body cast); red lens kept;
   black + Gordian-green chrome; nameplate solid white GOR 9000; lens + plate blink.
   ================================================================ */
.cgor9000-wrap {
  position: fixed;
  inset: 0;
  z-index: 8100;
  pointer-events: none;
  display: flex;
  align-items: center;
  justify-content: flex-end; /* right edge, vertically centered */
  overflow: hidden;
  background: transparent;
}

.cgor9000-panel,
.cgor9000-nameplate,
.cgor9000-base,
.cgor9000-lens,
.cgor9000-reflections,
.cgor9000-animation,
.cgor9000-speaker {
  border-radius: 100%;
  box-sizing: border-box;
  position: relative;
}

.cgor9000-panel::before,
.cgor9000-panel::after,
.cgor9000-nameplate::before,
.cgor9000-nameplate::after,
.cgor9000-base::before,
.cgor9000-base::after,
.cgor9000-lens::before,
.cgor9000-lens::after,
.cgor9000-reflections::before,
.cgor9000-reflections::after,
.cgor9000-animation::before,
.cgor9000-animation::after,
.cgor9000-speaker::before,
.cgor9000-speaker::after {
  border-radius: inherit;
  box-sizing: inherit;
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
}

/* Panel ~985px tall — scale to fit typical viewports; page shows through. */
.cgor9000-panel {
  --cgor9000-g: #1FA621;
  --cgor9000-g2: #158a18;
  --cgor9000-g3: #4db852;
  --cgor9000-g4: #C7E8C7;
  --cgor9000-ink: #0A0A0A;
  background: linear-gradient(90deg, #0A0A0A, #1FA621, #0A0A0A, #158a18, #4db852);
  border-radius: 0;
  margin: 0;
  padding: 7px;
  width: 322px;
  height: 985px;
  z-index: 1;
  flex-shrink: 0;
  transform: scale(0.58);
  transform-origin: right center; /* stay on the rightmost middle after scale */
}

.cgor9000-panel::before {
  /* Inner metal border */
  background: linear-gradient(#158a18, #0A0A0A, #1FA621);
  width: 308px;
  height: 971px;
  top: 0;
  left: 0;
}

.cgor9000-panel::after {
  /* Panel face — near-black, not a full-viewport cast */
  background: radial-gradient(ellipse, #121412, #0A0A0A);
  box-shadow: inset 0 0 80px #050805;
  top: 12px;
  left: 12px;
  width: 298px;
  height: 961px;
}

.cgor9000-nameplate {
  background: #0A0A0A; /* solid black — no green/transparent split */
  border: 1px solid #0A0A0A;
  border-radius: 0;
  color: #fff;
  font-size: 41px;
  font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
  font-weight: 700;
  letter-spacing: 0.04em;
  line-height: 56px;
  text-align: center;
  text-indent: 0.2em;
  -webkit-text-fill-color: #fff;
  -webkit-text-stroke: 0;
  top: 25px;
  left: 25px;
  width: 255px;
  height: 56px;
  z-index: 100;
  animation: cgor9000-plate-blink 3s infinite;
}

.cgor9000-nameplate::before,
.cgor9000-nameplate::after {
  content: none;
}

.cgor9000-speaker {
  background-color: #0A0A0A;
  background-image:
    linear-gradient(rgba(199, 232, 199, 0.35), rgba(10, 10, 10, 0.45)),
    radial-gradient(#0A0A0A 40%, transparent 40%),
    radial-gradient(#121412 40%, transparent 41%);
  background-size: 100% 100%, 12px 12px, 12px 12px;
  background-position: 0 0, 0 0, 0 2px;
  background-blend-mode: overlay, normal, normal;
  border-radius: 0;
  box-shadow: inset 0 0 13px #050805;
  width: 298px;
  height: 205px;
  position: absolute;
  bottom: 11px;
  left: 13px;
  z-index: 10;
}

.cgor9000-speaker::before,
.cgor9000-speaker::after {
  width: 308px;
  height: 5px;
  left: -6px;
}

.cgor9000-speaker::before {
  background: linear-gradient(90deg, #0A0A0A, #4db852, #0A0A0A);
}

.cgor9000-speaker::after {
  border: 5px solid transparent;
  border-top-color: #0A0A0A;
  top: 5px;
  width: 308px;
  height: 5px;
  background: none;
}

.cgor9000-base {
  background-image: linear-gradient(45deg, #C7E8C7 10%, #158a18, #0A0A0A, #1FA621, #C7E8C7 90%);
  height: 260px;
  width: 260px;
  padding: 10px;
  position: absolute;
  bottom: 295px;
  left: 33px;
  z-index: 10;
}

.cgor9000-base::before {
  background-image:
    linear-gradient(#4db852, #0A0A0A),
    linear-gradient(90deg, #158a18, #0A0A0A, #1FA621);
  background-blend-mode: hard-light, normal;
  box-shadow: inset 0 0 14px 9px rgba(10, 10, 10, 0.40);
  width: 240px;
  height: 240px;
  top: 10px;
  left: 10px;
}

.cgor9000-base::after {
  /* Red glow — iconic HAL eye cast */
  background-image: radial-gradient(#b10000 10%, rgba(177, 0, 0, 0) 71%);
  mix-blend-mode: lighten;
  top: -8px;
  left: -10px;
  width: 280px;
  height: 280px;
}

.cgor9000-lens {
  background-image: radial-gradient(#b10000 12%, #120619 67%, #200517);
  border: 8px solid #0A0A0A;
  box-shadow: inset 0 0 0 10px #380014;
  top: 12px;
  left: 12px;
  width: 213px;
  height: 213px;
  z-index: 10;
}

.cgor9000-lens::before {
  background-image: radial-gradient(#f00 20%, #470010 50%, #1a193e 80%);
  mix-blend-mode: soft-light;
  opacity: 0.8;
  z-index: 100;
}

.cgor9000-lens::after {
  background-image: radial-gradient(#fff 2px, #fff300 8px, rgba(255, 0, 0, 0.9) 14px, rgba(255, 0, 0, 0.08) 35px, transparent 35px);
  z-index: 100;
}

.cgor9000-reflections,
.cgor9000-reflections::before,
.cgor9000-reflections::after {
  background-image: radial-gradient(
    transparent 19%, #ec32aa 23%, #d4f6fc 28%, #ec32aa 33%,
    transparent 36%, transparent 38%, #e558d0 40%, #d0fcfe 45%, #ce73df 50%,
    transparent 52%, transparent 56%, #b883e7 60%, #b7ffff 65%, #3564c7 72%,
    transparent);
  background-size: 182px 182px;
  background-position: top center;
  border-radius: 15px 15px 5px 5px / 5px 5px 15px 15px;
  filter: blur(4px);
  position: absolute;
  top: 26px;
  width: 58px;
  height: 75px;
  z-index: 10;
}

.cgor9000-reflections {
  left: 69px;
  transform: perspective(30px) rotate3d(1, 0, 0, -15deg);
  transform-origin: top;
}

.cgor9000-reflections::before,
.cgor9000-reflections::after {
  height: 45px;
  top: 28px;
}

.cgor9000-reflections::before {
  left: -65px;
  transform: rotate(-43deg);
}

.cgor9000-reflections::after {
  right: -65px;
  left: auto;
  transform: rotate(43deg);
}

/* Lens flicker (pen) — keep/enhance */
.cgor9000-animation {
  animation: cgor9000-flicker 2.4s infinite;
  background: radial-gradient(#79b4ba, #47696d, #890000);
  mix-blend-mode: color-dodge;
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1000;
  border-radius: 100%;
}

.cgor9000-animation::before,
.cgor9000-animation::after {
  content: none;
}

@keyframes cgor9000-flicker {
  0% { opacity: 0; }
  8% { opacity: 0.15; }
  12% { opacity: 1; }
  18% { opacity: 0.2; }
  22% { opacity: 0.95; }
  40% { opacity: 0.35; }
  55% { opacity: 0; }
  70% { opacity: 0.6; }
  85% { opacity: 0; }
  100% { opacity: 0; }
}

@keyframes cgor9000-plate-blink {
  0, 55%, 100% {
    color: #fff;
    -webkit-text-fill-color: #fff;
    background: #0A0A0A;
    border-color: #0A0A0A;
    opacity: 1;
  }
  60%, 68% {
    color: #fff;
    -webkit-text-fill-color: #fff;
    background: #0A0A0A;
    border-color: #0A0A0A;
    opacity: 0.35;
  }
  64% {
    color: #fff;
    -webkit-text-fill-color: #fff;
    background: #0A0A0A;
    border-color: #0A0A0A;
    opacity: 1;
  }
}

@media (prefers-reduced-motion: reduce) {
  .cgor9000-wrap { display: none; }
}