/* The living lamp is isolated from the homepage's static promotional content.
   Defaults in styles.css provide the same illuminated scene without JavaScript. */
.home-lamp .lamp-stage {
  width: 390px;
  height: 390px;
  pointer-events: none;
}

/* Keep filtered flame layers in one plane. Firefox can split the old 3D
   stacking context; the bowl's gradients already supply its depth. */
.home-lamp .lamp { transform-style: flat; }
.home-lamp .lamp-bowl { transform: none; }

.home-lamp .flame {
  transition: none;
  border-radius: 72% 28% 45% 55% / 90% 82% 18% 10%;
}

.home-lamp .flame-outer {
  width: 13.5%;
  height: 39%;
  top: 3.6%;
  background:
    radial-gradient(ellipse at 48% 65%, #fff2b9 0%, #ffdb77e6 28%, transparent 65%),
    linear-gradient(180deg, #ffc056e6 0%, #ffab38fa 42%, #f47122d6 84%, #ab48254d 100%);
  filter: blur(.35px) drop-shadow(0 0 9px #ffc35c99) drop-shadow(0 0 24px #fc9b3852);
}

.home-lamp .flame-inner {
  width: 7.2%;
  height: 28%;
  top: 14%;
  border-radius: 68% 32% 46% 54% / 88% 83% 17% 12%;
  background: linear-gradient(180deg, #fff9d9f2, #fff4be 62%, #ffdd9ab3);
  filter: blur(.6px);
}

.home-lamp .flame-core {
  width: 3.8%;
  height: 12%;
  top: 30%;
  background: linear-gradient(180deg, #fffbe4, #fff3cfe6 75%, #afa6ed80);
  border-radius: 65% 35% 40% 60% / 80% 80% 20% 20%;
  filter: blur(.5px);
  box-shadow: 0 0 7px #fff0ba80;
}

.home-lamp .flame-ghost {
  width: 18%;
  height: 36%;
  top: 7%;
}

.home-lamp .flame-halo {
  top: 12%;
  height: 36%;
  width: 32%;
  filter: blur(8px);
}

.home-lamp .lamp::before {
  left: 50%;
  top: -16%;
  width: 15%;
  height: 40%;
  transform: translateX(calc(-50% + var(--heat-drift))) skewX(var(--flame-tilt));
}

.home-lamp .oil-reflection {
  transform: translateX(var(--flame-sway-core)) scaleX(var(--flame-stretch));
}

.home-lamp .lamp-rim-highlight { opacity: var(--oil-reflection-opacity); }
.home-lamp .lamp-light { transition: none; }
.home-lamp .home-lamp-mark { left: 20px; right: auto; top: 27px; }

.lamp-motion-toggle {
  position: absolute;
  top: 10px;
  right: 12px;
  z-index: 20;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 10px 12px;
  border: 1px solid #e5b67938;
  border-radius: 6px;
  background: #171610b8;
  color: #e2cda7;
  font: 500 11px/1.4 "Avenir Next", "Segoe UI", sans-serif;
  cursor: pointer;
}
.lamp-motion-toggle[hidden] { display: none; }
.lamp-motion-toggle:hover { background: #372b1c; border-color: #e5b67980; }
.lamp-motion-toggle:focus-visible { outline: 2px solid #f9c879; outline-offset: 3px; }
.lamp-motion-toggle[aria-disabled="true"] { cursor: default; }
.lamp-motion-icon { width: 8px; height: 10px; border-inline: 2px solid currentColor; }
.lamp-motion-toggle[data-paused="true"] .lamp-motion-icon {
  width: 0;
  height: 0;
  border: 5px solid transparent;
  border-left: 8px solid currentColor;
  border-right: 0;
}
.lamp-motion-toggle[aria-disabled="true"] .lamp-motion-icon {
  width: 8px;
  height: 8px;
  border: 1px solid currentColor;
  border-radius: 50%;
}

@media (max-width: 1100px) {
  .home-lamp .lamp-stage { width: 340px; height: 340px; }
}
@media (max-width: 900px) {
  .home-lamp .lamp-stage { width: 290px; height: 290px; }
}
@media (max-width: 600px) {
  .home-lamp .lamp-stage { width: 230px; height: 230px; }
  .home-lamp .home-lamp-mark { left: 16px; }
}
