
.jmdw-wrap,
.jmdw-wrap *{
  box-sizing:border-box;
}

.jmdw-wrap{
  width:100%;
  display:flex;
  align-items:flex-start;
  justify-content:center;
  gap:2px;
  flex-wrap:wrap;
}

.jmdw-earth-block{
  width:132px;
  text-align:center;
  flex:0 0 auto;
}

.jmdw-earth-watch{
  width:132px;
  height:132px;
  margin:auto;
  position:relative;
}

.jmdw-bezel{
  position:absolute;
  inset:1px;
  border-radius:50%;
  background:repeating-conic-gradient(
    from -1.15deg,
    #6f0b0e 0deg 1.12deg,
    #260305 1.12deg 2.28deg
  );
  box-shadow:
    inset 0 1px 1px rgba(255,255,255,0.05),
    inset 0 -2px 3px rgba(0,0,0,0.58),
    inset 0 0 4px rgba(0,0,0,0.28);
}

.jmdw-bezel-inner{
  position:absolute;
  inset:7px;
  border-radius:50%;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,0.04),
    inset 0 2px 2px rgba(255,255,255,0.03),
    inset 0 -2px 4px rgba(0,0,0,0.42);
  pointer-events:none;
}

.jmdw-rehaut{
  position:absolute;
  top:7px;
  left:7px;
  width:118px;
  height:118px;
  border-radius:50%;
  background:
    radial-gradient(circle at 50% 18%, rgba(255,255,255,0.38), transparent 38%),
    linear-gradient(to bottom, #e6e6e6 0%, #b8b8b8 18%, #8d8d8d 38%, #666666 58%, #8a8a8a 78%, #d8d8d8 100%);
  box-shadow:
    inset 0 1px 1px rgba(255,255,255,0.55),
    inset 0 -4px 6px rgba(0,0,0,0.58),
    inset 0 0 2px rgba(0,0,0,0.35);
}

.jmdw-marker-screw{
  position:absolute;
  left:50%;
  top:50%;
  width:5px;
  height:5px;
  border-radius:50%;
  background:radial-gradient(circle at 30% 30%, #ffffff 0%, #d7d7d7 28%, #8a8a8a 62%, #4d4d4d 100%);
  box-shadow:
    inset 0 1px 1px rgba(255,255,255,0.55),
    inset 0 -1px 1.5px rgba(0,0,0,0.55),
    0 0 1px rgba(0,0,0,0.45);
  z-index:2;
}

.jmdw-marker-slot{
  position:absolute;
  left:50%;
  top:50%;
  width:3.2px;
  height:1.1px;
  background:#1f1f1f;
  border-radius:1px;
  transform:translate(-50%,-50%);
  opacity:0.9;
}

.jmdw-dial{
  position:absolute;
  top:15px;
  left:15px;
  width:102px;
  height:102px;
  border-radius:50%;
  overflow:hidden;
  background:
    radial-gradient(circle at 50% 30%, rgba(255,255,255,0.16) 0%, rgba(255,255,255,0.05) 16%, rgba(255,255,255,0.00) 34%),
    radial-gradient(circle at 50% 42%, #1a1a1a 0%, #101010 38%, #070707 68%, #000000 100%),
    linear-gradient(to bottom, rgba(255,255,255,0.03) 0%, rgba(0,0,0,0.18) 100%);
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,0.07),
    inset 0 14px 18px rgba(255,255,255,0.06),
    inset 0 -18px 24px rgba(0,0,0,0.72),
    inset 10px 0 14px rgba(0,0,0,0.16),
    inset -10px 0 10px rgba(255,255,255,0.02);
}

.jmdw-dial-depth{
  position:absolute;
  inset:11px;
  border-radius:50%;
  pointer-events:none;
  z-index:1;
  background:
    radial-gradient(circle at 50% 32%, rgba(255,255,255,0.08), transparent 34%),
    radial-gradient(circle at 50% 78%, rgba(0,0,0,0.34), transparent 52%);
}

.jmdw-dial::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:50%;
  pointer-events:none;
  z-index:1;
  background:
    radial-gradient(circle at 50% 50%, transparent 78%, #ffffff 82%, #ffffff 84%, transparent 86%),
    radial-gradient(circle at 50% 50%, transparent 79%, rgba(120,120,120,0.55) 83%, rgba(90,90,90,0.45) 85.5%, transparent 88%),
    radial-gradient(circle at 50% 50%, transparent 81%, rgba(0,0,0,0.25) 86%, rgba(0,0,0,0.45) 89%, transparent 92%);
}

.jmdw-inner-ring{
  position:absolute;
  inset:5px;
  border-radius:50%;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,0.08),
    inset 0 1px 0 rgba(255,255,255,0.03),
    inset 0 -2px 3px rgba(0,0,0,0.35);
  pointer-events:none;
  z-index:2;
}

.jmdw-markers{
  position:absolute;
  left:51px;
  top:51px;
  width:0;
  height:0;
  pointer-events:none;
  z-index:1;
}

.jmdw-dot-marker,
.jmdw-fine-marker,
.jmdw-major-marker{
  position:absolute;
  transform-origin:50% 44px;
}

.jmdw-dot-marker{
  left:-1px;
  top:-44px;
  width:2px;
  height:2px;
  background:#f2f2f2;
  border-radius:50%;
  opacity:0.95;
}

.jmdw-dot-marker.is-low{
  background:#dcdcdc;
}

.jmdw-fine-marker{
  left:-0.5px;
  top:-44px;
  width:1px;
  height:4px;
  background:rgba(255,255,255,.35);
}

.jmdw-major-marker{
  left:-1px;
  top:-43px;
  width:2px;
  height:6px;
  background:#dcdcdc;
  border-radius:2px;
  transform-origin:50% 43px;
}

.jmdw-xii,
.jmdw-vi,
.jmdw-brand,
.jmdw-location,
.jmdw-sign,
.jmdw-swiss{
  position:absolute;
  left:0;
  width:100%;
  text-align:center;
  z-index:2;
}

.jmdw-xii{
  top:12px;
  color:#f2f2f2;
  font-family:'Helvetica Neue',Arial,sans-serif;
  font-size:8px;
  font-weight:600;
  letter-spacing:0.25px;
  line-height:1;
}

.jmdw-brand{
  top:30px;
  font-family:'Helvetica Neue',Arial,sans-serif;
  font-size:8px;
  letter-spacing:1px;
  line-height:1;
}

.jmdw-brand-white{color:#f2f2f2;}
.jmdw-brand-red{color:#c61f1f;}

.jmdw-location{
  top:40px;
  color:#dcdcdc;
  font-family:'Helvetica Neue',Arial,sans-serif;
  font-size:4px;
  letter-spacing:0.8px;
  line-height:1;
  opacity:0.55;
}

.jmdw-sign{
  top:65px;
  color:#f2f2f2;
  font-family:'Brush Script MT','Segoe Script',cursive;
  font-size:5px;
  line-height:1;
  opacity:0.95;
  letter-spacing:0.2px;
}

.jmdw-vi{
  top:79px;
  left:50%;
  width:100%;
  transform:translateX(-50%);
  color:#f2f2f2;
  font-family:'Helvetica Neue',Arial,sans-serif;
  font-size:8px;
  font-weight:600;
  letter-spacing:0.3px;
  line-height:1;
}

.jmdw-swiss{
  top:88px;
  color:#dcdcdc;
  font-family:'Helvetica Neue',Arial,sans-serif;
  font-size:3.8px;
  letter-spacing:0.7px;
  line-height:1;
  opacity:0.85;
}

.jmdw-date{
  position:absolute;
  left:72px;
  top:45px;
  width:16px;
  height:12px;
  background:linear-gradient(to bottom, #ffffff 0%, #f3f3f3 100%);
  color:#000000;
  font-family:'Helvetica Neue',Arial,sans-serif;
  font-size:7px;
  font-weight:600;
  text-align:center;
  line-height:12px;
  border-radius:2px;
  box-shadow:
    inset 0 2px 2px rgba(0,0,0,0.35),
    inset 0 -1px 1px rgba(255,255,255,0.75),
    0 0 0 1px rgba(0,0,0,0.08);
  z-index:3;
}

.jmdw-date-frame{
  position:absolute;
  left:72px;
  top:45px;
  width:16px;
  height:12px;
  border-radius:2px;
  box-shadow:
    inset 0 0 0 1px rgba(0,0,0,0.12),
    inset 0 1px 0 rgba(255,255,255,0.22);
  pointer-events:none;
  z-index:4;
}

.jmdw-hour,
.jmdw-minute,
.jmdw-second{
  position:absolute;
  left:51px;
  top:51px;
  transform-origin:0 50%;
}

.jmdw-hour{
  width:20px;
  height:5px;
  background:linear-gradient(to bottom, #8e9499 0%, #5f666c 22%, #2f3438 48%, #6f767c 72%, #1f2327 100%);
  border-radius:3px;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.28),
    inset 0 -1px 1px rgba(0,0,0,0.45),
    0 0 1px rgba(0,0,0,0.35);
  z-index:6;
}

.jmdw-hour-insert{
  position:absolute;
  left:2px;
  top:50%;
  transform:translateY(-50%);
  width:14px;
  height:2px;
  background:linear-gradient(to right, #b7ff5a 0%, #9cff3a 45%, #7ed81f 100%);
  border-radius:2px;
  box-shadow:0 0 1px rgba(156,255,58,0.45);
}

.jmdw-minute{
  width:30px;
  height:4px;
  background:linear-gradient(to bottom, #969ca1 0%, #666d73 20%, #31363b 48%, #737a80 74%, #202428 100%);
  border-radius:3px;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.26),
    inset 0 -1px 1px rgba(0,0,0,0.45),
    0 0 1px rgba(0,0,0,0.35);
  z-index:7;
}

.jmdw-minute-insert{
  position:absolute;
  left:2px;
  top:50%;
  transform:translateY(-50%);
  width:24px;
  height:2px;
  background:linear-gradient(to right, #b7ff5a 0%, #9cff3a 45%, #7ed81f 100%);
  border-radius:2px;
  box-shadow:0 0 1px rgba(156,255,58,0.45);
}

.jmdw-second{
  width:36px;
  height:1.1px;
  background:#c61f1f;
  border-radius:2px;
  opacity:0.95;
  z-index:8;
}

.jmdw-second-tip{
  position:absolute;
  right:0;
  top:50%;
  width:6px;
  height:6px;
  background:#b71c1c;
  transform:translateY(-50%);
  border-radius:1px;
  box-shadow:0 0 1px rgba(0,0,0,0.4);
}

.jmdw-second-tip-h{
  position:absolute;
  left:1px;
  top:2.5px;
  width:4px;
  height:1.1px;
  background:#ffffff;
  border-radius:1px;
}

.jmdw-second-tip-v{
  position:absolute;
  left:2.5px;
  top:1px;
  width:1px;
  height:4px;
  background:#ffffff;
  border-radius:1px;
}

.jmdw-center-pin{
  position:absolute;
  left:48.5px;
  top:48.5px;
  width:5px;
  height:5px;
  background:radial-gradient(circle at 30% 30%, #a2a8ad 0%, #5d646a 38%, #2a2f34 72%, #161a1d 100%);
  border-radius:50%;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.25),
    inset 0 -1px 1px rgba(0,0,0,0.45),
    0 0 1px rgba(0,0,0,0.35);
  z-index:9;
}

.jmdw-earth-caption{
  margin-top:8px;
  color:#ffffff;
  font-family:Arial,sans-serif;
  font-size:9px;
  line-height:1.3;
  opacity:0.9;
}

.jmdw-earth-seconds{
  margin-top:4px;
  color:#d8d8d8;
  font-family:'Helvetica Neue',Arial,sans-serif;
  font-size:8px;
  line-height:1.2;
  letter-spacing:0.4px;
  opacity:0.9;
}

.jmdw-moon-block{
  width:90px;
  margin-top:6px;
  margin-left:-0.5cm;
  text-align:center;
  flex:0 0 auto;
}

.jmdw-moon-scale{
  transform:scale(0.55);
  transform-origin:top center;
  width:132px;
  height:132px;
  position:relative;
  margin:0 auto;
}

.jmdw-moon-watch{
  width:132px;
  height:132px;
  border-radius:50%;
  position:relative;
  background:
    radial-gradient(circle at 50% 30%, rgba(255,255,255,0.15), transparent 55%),
    linear-gradient(to bottom,#b31212,#3f0707);
  box-shadow:
    inset 0 1px 1px rgba(255,255,255,0.08),
    inset 0 -2px 3px rgba(0,0,0,0.4);
}

.jmdw-moon-xii,
.jmdw-moon-vi{
  position:absolute;
  width:100%;
  text-align:center;
  color:#ffffff;
  font-size:9px;
  font-weight:600;
  letter-spacing:0.3px;
  font-family:'Helvetica Neue',Arial,sans-serif;
}

.jmdw-moon-xii{top:10px;}
.jmdw-moon-vi{top:86px;}

.jmdw-moon-hour,
.jmdw-moon-minute,
.jmdw-moon-second{
  position:absolute;
  left:66px;
  top:66px;
  transform-origin:0 50%;
}

.jmdw-moon-hour{
  width:24px;
  height:3px;
  background:#fff;
  border-radius:3px;
}

.jmdw-moon-minute{
  width:38px;
  height:2px;
  background:#fff;
  border-radius:2px;
}

.jmdw-moon-second{
  width:44px;
  height:2px;
  background:#9cff3a;
  border-radius:2px;
}

.jmdw-moon-center{
  position:absolute;
  left:63.5px;
  top:63.5px;
  width:5px;
  height:5px;
  background:#fff;
  border-radius:50%;
}

.jmdw-moon-label{
  margin-top:-30px;
  color:#ffffff;
  font-size:8px;
  font-family:Arial,sans-serif;
  text-align:center;
}

.jmdw-moon-seconds{
  margin-top:3px;
  color:#d8d8d8;
  font-family:'Helvetica Neue',Arial,sans-serif;
  font-size:7px;
  line-height:1.2;
  letter-spacing:0.3px;
  opacity:0.9;
}
