* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 100vh;
  /* background: white; */
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

.clock-container {
  width: 300px;
  height: 300px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
  /* border-radius: 50%; */
  background: white;
}

.clock {
  width: 100%;
  height: 100%;
  filter: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.1));
}

.face {
  fill: white;
  stroke: #333;
  stroke-width: 0.5;
}

.band {
  fill: white;
}

.edge {
  fill: none;
  stroke: #333;
  stroke-width: 0.5;
}

.marker {
  stroke: #333;
  stroke-linecap: butt;
}

.hand {
  fill: #333;
}

.hour-hand {
  fill: #333;
}


.label {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-size: 4px;
  fill: #333;
}

.hour-label {
  font-weight: bold;
  font-size: 4px;
}

.min-label {
  font-size: 2px;
}