* {
  box-sizing: border-box;
}

:root {
  --on: 0;
}

body {
  margin: 0;
  height: 100vh;
  display: grid;
  place-items: center;
  background: #121921;
}

.lamp {
  width: 300px;
  overflow: visible;
}

/* COLORS */
.top { fill: #444; }
.post { fill: #666; }
.base { fill: #555; }
.base-top { fill: #777; }
.eye { fill: #000; }
.mouth {
  fill: none;
  stroke: #000;
  stroke-width: 4;
  stroke-linecap: round;
}

.light {
  fill: rgba(255, 220, 120, 0.8);
  opacity: var(--on);
  transition: opacity 0.3s;
}

#cord {
  stroke: #ccc;
  stroke-width: 6;
  stroke-linecap: round;
}

#hit {
  fill: transparent;
  cursor: pointer;
}