.mac-clock{
  width:100%;
  max-width:var(--mac-max, 1254px);
  margin-inline:auto;
}
.mac-stage{
  position:relative;
  width:100%;
  aspect-ratio:1/1;
  overflow:visible;
  background:transparent;
  isolation:isolate;
}
.mac-layer{
  position:absolute;
  left:50%;
  top:50%;
  width:100%;
  height:100%;
  object-fit:contain;
  transform:translate(-50%, -50%);
  transform-origin:50% 50%;
  user-select:none;
  pointer-events:none;
  will-change:transform;
}
.mac-bg01{z-index:1;}
.mac-bg02{z-index:2;}
.mac-clockface{z-index:3;}
.mac-hand-minute{z-index:4;}
.mac-hand-hour{z-index:5;}
.mac-hand-second{z-index:6;}

.mac-digital{
  position:absolute;
  left:50%;
  bottom:var(--mac-digital-bottom, 0%);
  height:var(--mac-digital-height, 10%);
  width:fit-content;
  max-width:78%;
  transform:translateX(-50%);
  display:flex;
  align-items:flex-end;
  justify-content:center;
  gap:0.8%;
  z-index:7;
  pointer-events:none;
}
.mac-bulb{
  height:100%;
  width:auto;
  max-width:19%;
  display:block;
  object-fit:contain;
  flex:0 1 auto;
  min-width:0;
  user-select:none;
}

