.watch {
    position: relative;
    transform: scale(0.7);
}

.watch::after,
.watch::before {
    content: "";
    width: 10rem;
    height: 200px;
    background: #003049;
    box-shadow: inset 0 -10px 18px #010921, 2px 1px 15px #fdf0d5;
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
    position: absolute;
    left: 50%;
    transform: translate(-50%, 0%);
}

.watch::before {
    content: "";
    width: 10rem;
    height: 200px;
    background: #003049;
    box-shadow: inset 0 -10px 18px #010921, 2px 1px 15px #fdf0d5;
    border-radius: 20px 20px 0 0;
    position: absolute;
    left: 50%;
    transform: translate(-50%, -100%);
}

.dots {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translate(-50%, 120%);
    padding: 3px;
    z-index: 20;
}

.dots .dot {
    width: 17px;
    aspect-ratio: 1;
    background-color: #fdf0d5;
    border-radius: 100px;
    display: block;
    margin-bottom: 35px;
    box-shadow: inset 2px 0 5px #ffffff48;
}

.frame {
    background: #003049;
    border-radius: 92px;
    box-shadow: inset 0 0 24px 1px #0d0d0d, inset 0 0 0 12px #606c78,
    0 20px 30px #00000071;
    height: 380px;
    margin: 0 20px;
    padding: 28px 26px;
    position: relative;
    width: 20rem;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.text {
    color: #c1121f;
    font-size: 10rem;
    font-family: serif;
    font-weight: bolder;
    line-height: 0.8;
    text-shadow: 0 0 40px #010921;
}

.sideBtn {
    background: #606c78;
    border-left: 1px solid #003049;
    border-radius: 8px 6px 6px 8px / 20px 6px 6px 20px;
    box-shadow: inset 8px 0 8px 0 #1c1f23, inset -2px 0 6px #669bbc,
    -4px 0 8px #0d0d0d40;
    height: 72px;
    position: absolute;
    right: 6px;
    top: 108px;
    width: 18px;
    z-index: 9;
}

.sideBtn::before {
    background: #003049;
    border-radius: 20%;
    box-shadow: 0 -30px rgba(62, 70, 77, 0.75), 0 -27px #003049, 0 -25px #fdf0d5,
    0 -21px rgba(62, 70, 77, 0.75), 0 -18px #003049, 0 -16px #fdf0d5,
    0 -12px rgba(62, 70, 77, 0.75), 0 -9px #003049, 0 -7px #fdf0d5,
    0 -3px rgba(62, 70, 77, 0.75), 0 0 #003049, 0 2px #fdf0d5,
    0 6px rgba(62, 70, 77, 0.75), 0 9px #003049, 0 11px #fdf0d5,
    0 15px rgba(62, 70, 77, 0.75), 0 18px #003049, 0 20px #fdf0d5,
    0 24px rgba(62, 70, 77, 0.75), 0 27px #003049, 0 29px #fdf0d5;
    content: "";
    height: 3px;
    margin-top: -2px;
    position: absolute;
    right: 2px;
    top: 50%;
    width: 10px;
    z-index: 9;
}

.sideBtn::after {
    background: #16181b;
    border-radius: 2px 4px 4px 2px / 20px 8px 8px 20px;
    box-shadow: inset -2px 0 2px 0 #003049, inset -6px 0 18px #003049;
    content: "";
    height: 72px;
    position: absolute;
    right: 0;
    top: 0;
    width: 6px;
}

.powerBtn {
    background: #003049;
    border-radius: 2px 4px 4px 2px / 2px 8px 8px 2px;
    box-shadow: inset 0 0 1px 0px #fdf0d5;
    height: 72px;
    position: absolute;
    right: 18px;
    top: 212px;
    width: 4px;
}