.fullscreen {
  border-radius: 0px;
  width: 100vw !important;
  height: 100vh !important;
  max-width: 100vw !important;
}

.pop {
  display: none;
  color: white;
  box-shadow: rgba(0, 0, 0, 0.5) 0px 10px 30px;
  position: fixed;
  left: 0px;
  top: 0px;
  width: 100px;
  z-index: 999;
  border-radius: 8px;
  padding: 5px 4px;
  background-color: rgba(11, 11, 11, 0.8);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(11, 11, 11, 0.2);
}

.pop.show {
  animation: 0.2s ease 0s 1 normal both running scale;
  transform-origin: 0% 0%;
  display: block;
}

.pop>div {
  transition: background 0.2s ease 0s;
  font-size: 13px;
  line-height: 30px;
  color: rgb(255, 255, 255);
  padding: 0px 6px;
  cursor: pointer;
  margin: 4px 0px;
  border-radius: 6px;
  clear: both;
}

.pop>div:not(.layout):hover {
  background-color: rgba(255, 255, 255, 0.1);
}

.pop i {
  width: 14px;
  height: 14px;
  display: inline-block;
  margin-right: 5px;
  vertical-align: -2px;
}

.pop .layout i {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><g fill='none' stroke='white' stroke-width='1.3' stroke-linecap='round' stroke-linejoin='round'><rect x='4' y='4' width='16' height='16' rx='2'></rect><path d='M4 9h8'/><path d='M12 15h8'/><path d='M12 4v16'/></g></svg>");
}

.pop .del i,
.pop .dels i {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28'><g fill='white'><path d='M14 2.25a3.75 3.75 0 0 1 3.745 3.55l.005.2h5.5a.75.75 0 0 1 .102 1.493l-.102.007h-1.059l-1.22 15.053A3.75 3.75 0 0 1 17.233 26h-6.466a3.75 3.75 0 0 1-3.738-3.447L5.808 7.5H4.75a.75.75 0 0 1-.743-.648L4 6.75a.75.75 0 0 1 .648-.743L4.75 6h5.5A3.75 3.75 0 0 1 14 2.25zm6.687 5.25H7.313l1.211 14.932a2.25 2.25 0 0 0 2.243 2.068h6.466a2.25 2.25 0 0 0 2.243-2.068L20.686 7.5zm-8.937 3.75a.75.75 0 0 1 .743.648L12.5 12v8a.75.75 0 0 1-1.493.102L11 20v-8a.75.75 0 0 1 .75-.75zm4.5 0a.75.75 0 0 1 .743.648L17 12v8a.75.75 0 0 1-1.493.102L15.5 20v-8a.75.75 0 0 1 .75-.75zM14 3.75a2.25 2.25 0 0 0-2.245 2.096L11.75 6h4.5l-.005-.154A2.25 2.25 0 0 0 14 3.75z'/></g></svg>");
}

.pop .edit i {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'><g fill='white'><path d='M14.499 3a2.5 2.5 0 0 1 2.5 2.5v3.502a2.87 2.87 0 0 0-1 .229V7h-12v7.499a1.5 1.5 0 0 0 1.5 1.5h3.975c-.016.05-.03.103-.043.155l-.211.845H5.5a2.5 2.5 0 0 1-2.5-2.5v-9A2.5 2.5 0 0 1 5.5 3h8.999zm0 1h-9A1.5 1.5 0 0 0 4 5.5V6h12v-.5a1.5 1.5 0 0 0-1.5-1.5zm-3.52 11.376l4.829-4.83a1.87 1.87 0 1 1 2.644 2.646l-4.829 4.828a2.197 2.197 0 0 1-1.02.578l-1.498.375a.89.89 0 0 1-1.078-1.079l.374-1.498c.097-.386.296-.739.578-1.02z'/></g></svg>");
}

.pop .db i {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1024 1024'><g fill='white'><path d='M598.4 831.872H328.192a256 256 0 0 1-34.496-510.528A352 352 0 1 1 598.4 831.872zm-271.36-64h272.256a288 288 0 1 0-248.512-417.664L335.04 381.44l-34.816 3.584a192 192 0 0 0 26.88 382.848z'/></g></svg>");
}

.pop .layout {
  display: flex;
  flex-flow: column;
}

.pop .layout span {
  font-size: 12px;
  height: 20px;
  line-height: 20px;
  width: 36px;
  background-color: rgba(255, 255, 255, 0.1);
  border-radius: 12px;
  text-align: center;
  margin: 0px 2px 4px;
  cursor: pointer;
  float: left;
  transition: background-color 0.25s ease 0s;
}

.pop .layout span:hover {
  background-color: rgba(255, 255, 255, 0.2);
}

.pop .layout span.active {
  background-color: rgba(255, 255, 255, 0.3);
}

.zmodal {
  color: rgba(0, 0, 0, 0.72);
  border-radius: 12px;
  min-width: 550px;
}

.zmodal>.btn {
  cursor: pointer;
  position: absolute;
  right: 0px;
  top: 0px;
  width: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 26px;
}

.zmodal>.max {
  right: 40px;
}

.zmodal>.max:hover {
  background-color: rgb(162, 162, 162);
}

.zmodal>.close:hover {
  background-color: rgb(232, 17, 35);
}

.zmodal>.btn i {
  width: 15px;
  height: 15px;
}

.zmodal>.max i {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1024 1024'><g fill='rgb(80, 80, 80)'><path d='m160 96.064 192 .192a32 32 0 0 1 0 64l-192-.192V352a32 32 0 0 1-64 0V96h64v.064zm0 831.872V928H96V672a32 32 0 1 1 64 0v191.936l192-.192a32 32 0 1 1 0 64l-192 .192zM864 96.064V96h64v256a32 32 0 1 1-64 0V160.064l-192 .192a32 32 0 1 1 0-64l192-.192zm0 831.872-192-.192a32 32 0 0 1 0-64l192 .192V672a32 32 0 1 1 64 0v256h-64v-.064z'/></g></svg>");
}

.zmodal>.close i {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1024 1024'><g fill='rgb(80, 80, 80)'><path d='M764.288 214.592 512 466.88 259.712 214.592a31.936 31.936 0 0 0-45.12 45.12L466.752 512 214.528 764.224a31.936 31.936 0 1 0 45.12 45.184L512 557.184l252.288 252.288a31.936 31.936 0 0 0 45.12-45.12L557.12 512.064l252.288-252.352a31.936 31.936 0 1 0-45.12-45.184z'/></g></svg>");
}

.zmodal>.close:hover i {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1024 1024'><g fill='white'><path d='M764.288 214.592 512 466.88 259.712 214.592a31.936 31.936 0 0 0-45.12 45.12L466.752 512 214.528 764.224a31.936 31.936 0 1 0 45.12 45.184L512 557.184l252.288 252.288a31.936 31.936 0 0 0 45.12-45.12L557.12 512.064l252.288-252.352a31.936 31.936 0 1 0-45.12-45.184z'/></g></svg>");
}

.zbtn,
.zinput {
  border-radius: 30px;
}

.zp117rm {
  top: 0px;
  right: 0px;
}


.Mclock .zmodal {
  height: 100%;
  width: 100%;
  background-color: rgb(0, 0, 0);
  font-size: 27px;
}

.Mclock .fullscreen {
  font-size: 47px;
}

.Mclock .flip {
  position: relative;
  margin: 5px;
  width: 3.75em;
  height: 5.62em;
  font-weight: 700;
  line-height: calc(5.37em);
  border-radius: 0.38em;
  box-shadow: rgba(0, 0, 0, 0.7) 0px 1px 10px;
}

.Mclock .flip .item {
  list-style: none;
  z-index: 1;
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  perspective: 12.5em;
  transition: opacity 0.3s ease 0s;
}

.Mclock .flip .inn span {
  font-size: 5em;
}

.Mclock .flip .item.active,
.Mclock .flip .item:first-child {
  z-index: 2;
}

.Mclock .flip .up,
.Mclock .flip .down {
  z-index: 1;
  position: absolute;
  left: 0px;
  width: 100%;
  height: 50%;
  overflow: hidden;
}

.Mclock .flip .up {
  transform-origin: 50% 100%;
  top: 0px;
}

.Mclock .flip .up::after {
  content: "";
  position: absolute;
  top: calc(2.685em);
  left: 0px;
  z-index: 5;
  width: 100%;
  height: 0.25em;
  background-color: rgba(0, 0, 0, 0.8);
}

.Mclock .flip .down {
  transform-origin: 50% 0%;
  bottom: 0px;
  transition: opacity 0.3s ease 0s;
}

.Mclock .flip .inn {
  position: absolute;
  left: 0px;
  z-index: 1;
  width: 100%;
  height: 200%;
  color: rgb(204, 204, 204);
  text-shadow: rgb(0, 0, 0) 0px 1px 2px;
  text-align: center;
  background-color: rgb(14, 14, 14);
  border-radius: 0.38em;
}

.Mclock .flip .up .inn {
  top: 0px;
}

.Mclock .flip .down .inn {
  bottom: 0px;
}

.Mclock .flip .before {
  z-index: 3;
}

.Mclock .flip .active {
  animation: 0.5s linear 0.5s 1 normal both running asd;
  z-index: 2;
}

.Mclock .flip .before .up {
  z-index: 2;
  animation: 0.5s linear 0s 1 normal both running turn-up;
}

.Mclock .flip .active .down {
  z-index: 2;
  animation: 0.5s linear 0.5s 1 normal both running turn-down;
}

.Mclock .flip .shadow {
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 2;
}

.Mclock .flip .before .up .shadow {
  background: linear-gradient(rgba(0, 0, 0, 0.1) 0%, rgb(0, 0, 0) 100%);
  animation: 0.5s linear 0s 1 normal both running show;
}

.Mclock .flip .active .up .shadow {
  background: linear-gradient(rgba(0, 0, 0, 0.1) 0%, rgb(0, 0, 0) 100%);
  animation: 0.5s linear 0.3s 1 normal both running hide;
}

.Mclock .flip .before .down .shadow {
  background: linear-gradient(rgb(0, 0, 0) 0%, rgba(0, 0, 0, 0.1) 100%);
  animation: 0.5s linear 0s 1 normal both running show;
}

.Mclock .flip .active .down .shadow {
  background: linear-gradient(rgb(0, 0, 0) 0%, rgba(0, 0, 0, 0.1) 100%);
  animation: 0.5s linear 0.3s 1 normal both running hide;
}

.Mclock .colon {
  height: 50px;
  padding: 0px 10px;
  display: flex;
  justify-content: space-around;
  flex-direction: column;
}

.Mclock .colon::after,
.Mclock .colon::before {
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  background: rgba(255, 255, 255, 0.7);
  border-radius: 50%;
}

.Mnotes .zmodal {
  width: calc(100vw - 6px);
  max-width: 900px;
}

.Mnotes .zmodal>div {
  display: flex;
}

.Mnotes .aside {
  background-color: #f0f1f4;
  position: relative;
  height: 600px;
  width: 200px;
  padding: 10px 0px;
}

.Mnotes .fullscreen .aside {
  height: calc(100vh - 13px);
}

.Mnotes .aside h2 {
  font-size: 18px;
  font-weight: 700;
  padding: 10px;
}

.Mnotes .aside p {
  font-size: 14px;
  font-weight: 700;
}

.Mnotes .aside time {
  font-size: 12px;
  opacity: 0.6;
}

.Mnotes .aside div {
  position: relative;
  transition: all 0.2s ease 0s;
  padding: 10px 0px 10px 10px;
  font-size: 14px;
  border-left: 4px solid transparent;
  border-top: 1px solid rgba(0, 0, 0, 0.04);
  cursor: pointer;
}

.Mnotes .aside .active {
  background: #fff;
  border-left-color: #1681ff;
  box-shadow: rgba(0, 0, 0, 0.3) 0px 4px 24px -12px;
}

.Mnotes .aside .del {
  width: 16px;
  height: 16px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><g fill='rgb(22, 129, 255)'><path d='M6.5 7v4a.5.5 0 0 0 1 0V7a.5.5 0 0 0-1 0zM9 6.5a.5.5 0 0 1 .5.5v4a.5.5 0 0 1-1 0V7a.5.5 0 0 1 .5-.5zM10 4h3a.5.5 0 0 1 0 1h-.553l-.752 6.776A2.5 2.5 0 0 1 9.21 14H6.79a2.5 2.5 0 0 1-2.485-2.224L3.552 5H3a.5.5 0 0 1 0-1h3a2 2 0 1 1 4 0zM8 3a1 1 0 0 0-1 1h2a1 1 0 0 0-1-1zM4.559 5l.74 6.666A1.5 1.5 0 0 0 6.79 13h2.42a1.5 1.5 0 0 0 1.49-1.334L11.442 5H4.56z'/></g></svg>");
  position: absolute;
  right: 6px;
  top: 19px;
  transform: scale(0);
  transition: all 0.2s ease-out 0s;
}

.Mnotes .aside div:hover .del {
  transform: scale(1);
}

.Mnotes .aside div:hover {
  color: #1681ff;
}

.Mnotes .aside .add {
  position: absolute;
  bottom: 10px;
  right: 10px;
  width: 32px;
  height: 32px;
  background: #1681ff;
  color: rgb(255, 255, 255);
  cursor: pointer;
  border-radius: 50%;
  transition: all 0.2s ease 0s;
  box-shadow: rgba(0, 0, 0, 0.12) 0px 0px 5px 2px;
}

.Mnotes .aside .add:hover {
  opacity: 0.9;
}

.Mnotes .aside .add i {
  width: 16px;
  height: 16px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1024 1024'><g fill='white'><path d='M480 480V128a32 32 0 0 1 64 0v352h352a32 32 0 1 1 0 64H544v352a32 32 0 1 1-64 0V544H128a32 32 0 0 1 0-64h352z'/></g></svg>");
  display: flex;
  justify-content: center;
  align-items: center;
}

.Mnotes .aside .add:active {
  border-left-color: #1681ff;
  transform: scale(0.92);
}

.Mnotes form {
  flex: 1 1 auto;
  overflow: auto;
  padding: 11px 8px;
}

.Mnotes input {
  position: relative;
  font-size: 14px;
  display: inline-flex;
  width: 100%;
  line-height: 32px;
  box-sizing: border-box;
  vertical-align: middle;
  font-weight: 700;
}

.Mnotes textarea {
  width: calc(100% - 15px);
  height: calc(100% - 60px);
  resize: vertical;
  padding: 1px 5px;
  color: #585858;
  box-shadow: inset 0 1px 0 0 #f2f2f2;
  line-height: 28px;
  font-size: 14px;
  background-size: 100% 28px;
  background-image: linear-gradient(180deg, transparent, transparent 27px, #f2f2f2 27px, #f2f2f2 27px);
}

.Mnotes form div {
  font-size: 12px;
}

.MdaysMatter .zmodal,
.MworldClock .zmodal {
  padding: 35px 15px 0px;
}

.MdaysMatter form>div,
.Madd .diy form>div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 46px;
  position: relative;
}

.Madd .diy form>div:last-child {
  justify-content: flex-start;
  height: 120px;
}

.Madd .diy .link.icon {
  display: flex;
  align-items: center;
  justify-content: center;
}

.MdaysMatter .zinput {
  margin-right: 5px;
}

.Msetting .color,
.MdaysMatter .color,
.Madd .diy .color {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 5px;
}

.Msetting .color>span,
.MdaysMatter .color>span,
.Madd .diy .color>span {
  position: relative;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  border: 1px solid transparent;
  transition: all 0.2s ease 0s;
  display: flex;
  justify-content: center;
  align-items: center;
}

.Msetting .color span:first-child,
.MdaysMatter .color span:first-child,
.Madd .diy .color span:first-child {
  border-color: rgba(0, 0, 0, 0.3);
}

.Msetting .color>span i,
.MdaysMatter .color>span i,
.Madd .diy .color>span i,
.Madd .diy .grid i,
.Msearch .item i {
  display: inline-block;
  width: 12px;
  height: 12px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'><g fill='white'><path d='M9.765 3.205a.75.75 0 0 1 .03 1.06l-4.25 4.5a.75.75 0 0 1-1.075.015L2.22 6.53a.75.75 0 0 1 1.06-1.06l1.705 1.704l3.72-3.939a.75.75 0 0 1 1.06-.03z'/></g></svg>");
}

.Msetting .color>span:first-child i,
.MdaysMatter .color>span:first-child i,
.Madd .diy .color>span:first-child i {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'><g fill='grey'><path d='M9.765 3.205a.75.75 0 0 1 .03 1.06l-4.25 4.5a.75.75 0 0 1-1.075.015L2.22 6.53a.75.75 0 0 1 1.06-1.06l1.705 1.704l3.72-3.939a.75.75 0 0 1 1.06-.03z'/></g></svg>");
}

.Msetting .colors,
.MdaysMatter .colors,
.Madd .diy .colors {
  position: relative;
  overflow: hidden;
}

.Msetting .colors span,
.MdaysMatter .colors span,
.Madd .diy .colors span {
  width: 18px;
  height: 18px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  background-image: url("data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDAAIBAQEBAQIBAQECAgICAgQDAgICAgUEBAMEBgUGBgYFBgYGBwkIBgcJBwYGCAsICQoKCgoKBggLDAsKDAkKCgr/2wBDAQICAgICAgUDAwUKBwYHCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgr/wgARCAAoACgDAREAAhEBAxEB/8QAGwAAAgIDAQAAAAAAAAAAAAAABwgFCQECAwb/xAAbAQEAAgMBAQAAAAAAAAAAAAAHBQgEBgkCA//aAAwDAQACEAMQAAAAtDxz5W1UCFyvPjBIQ3DFlnlQSIjmYjFNq9UXBpsZ4z082a8AvOs5DAi8eCll17Fx33nreeBxljInF9fGdVbdb7EI+oXh8+aZq4cPoRWE8NMu9OXutT//xAAwEAABBAECAwcDAwUAAAAAAAABAgMEBREABgghMQcJEhMUIkFRYXEVUpGBweHx8v/aAAgBAQABPwDi84td0jcs3su7MbdyDGgrLNnZxTh514ZCm0K6oCTyKhhWQeYHXcz1hcFyZZz3n3lc1uyHCtRJ+SVEnW80+QF5T01a7ptdvThYUlrJiSWiFIfivKbWkjoQpJBB/rruzO9I30e0ur4cuIfdD1xXXb6Ye3r+evxSoks8m2HnOrqHFe0KVlYWtIJKelk7ItZ0iwmKK3ZDynHVk5JUo5Jz9zqTEICs9NdrjIq2HHDyH/P51vLc7YecAc6f4+2ou/JtBfRb+rlKalQJbchhxCiClxCgtJB+CCAdekJGPDr9Jcd9qU9dcbZ3PtXbEM0tJ6lEnzPUP+oSnyMKRj2nJVnOOXTVuL6Y+pctzw5+PCP7aVVKJytXPT9S9DluwpDZDjLim3AfhQOCP5GpTkasYL7vXXEbYK3Mw608vI/b/H4+mtx0CGH3EeXg/wCvvqt2jMv7uJQ1jBclTZTceM2gElTi1BKQAOpJI1xJcOF7HvJnaBsGqXLYlrLs2DHGXG3DzUtKRzWFHmQMkE631NnQluRJsV5hYOFIdQUKBGOoIBGu0F31SVk6vNq2txY+hpayRMfWQlLEZhS1qJwAAACSc/TXdi915v17tHq+IniE2u9UVlM+mXQUM5GJEuSnm286jq0hB9wSrCipKSQEjn//xAAlEQABBAEEAgIDAQAAAAAAAAABAAIDBAUGBxESITETIwhBUWH/2gAIAQIBAT8Ar365sDgrB3YpAAFh3d3BVqTLMBa4cgrcbbalWoOymNZ1LfLmj0R/QP0sdqf7eSVpLVcTpACVo2w27wQqzPiYrELbEJZKOQVDmbUb+wKx2tb9KXsF+Ou7ta+ZIckehbx1/wBUOrqU7eY/IQzrHD2pq89eUsKq13Sv44W30AxkgkHsrTeobIiHY+FWzj+PJW4W21uW669jm8tPsfxUMZLV+t7eCtPM+PhYS49o4Cfk52w9fRX/xAAkEQABBAICAgIDAQAAAAAAAAABAAIDBAURBiESMQcTCBRBUf/aAAgBAwEBPwDleVsgGCt6V1skFol6xXnN2sRDJIRpY+rZdB2Fk+OufETpcl4w9kRc0drBNlEv1riHGZrDA/SxXGCYfSODilGiFc4JXug9Li/42NyeVNqOTQHetLEfHEWFg+jw9JuHhg6a1Voopm7Co48OcuIV46ThsK9joJmecY7Ku1YqbC6Q6C4ZyyrHE2ncd469H+LENhmYJGHYKwsbmHtfuVqtIvlOgPZK+YflrFWaEmKxD/NzunPHoD/Af7tf/9k=");
  background-repeat: no-repeat;
  background-size: cover;
  background-color: transparent !important;
}

.Msetting span.colors i,
.MdaysMatter span.colors i,
.Madd .diy span.colors i {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1024 1024'><g fill='white'><path d='M831.872 340.864 512 652.672 192.128 340.864a30.592 30.592 0 0 0-42.752 0 29.12 29.12 0 0 0 0 41.6L489.664 714.24a32 32 0 0 0 44.672 0l340.288-331.712a29.12 29.12 0 0 0 0-41.728 30.592 30.592 0 0 0-42.752 0z'/></g></svg>");
}

.Msetting .colors input,
.MdaysMatter .colors input,
.Madd .diy .colors input {
  width: 0px;
  padding: 0px;
  position: relative;
}

.MdaysMatter .zfright,
.MworldClock .zfright,
.Madd .diy .zfright {
  padding: 20px 0px;
}

.MdaysMatter .zform_name,
.MdaysMatter .zform_title {
  width: 285px;
}

.MdaysMatter .event {
  position: absolute;
  right: 10px;
  top: 15px;
  background-color: transparent;
  color: rgb(22, 129, 255);
  cursor: pointer;
  font-size: 12px;
}

.MdaysMatter .events {
  position: absolute;
  inset: 0px;
}

.MdaysMatter .events>div {
  background-color: white;
  inset: auto 0px 0px auto;
  width: 274px;
  padding: 9px;
  position: absolute;
  min-width: 150px;
  box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.12);
}

.MdaysMatter .events i {
  position: absolute;
  width: 10px;
  top: -4px;
  left: 234px;
}

.MdaysMatter .events i::before {
  position: absolute;
  width: 10px;
  height: 10px;
  content: " ";
  transform: rotate(45deg);
  background: white;
  box-sizing: border-box;
}

.MworldClock form>div input:nth-child(2) {
  width: 45px;
  text-align: right;
}

.MworldClock .zinput {
  margin: 4px;
}

.MdaysMatter .events span,
.MworldClock .city span {
  background-color: rgba(0, 0, 0, 0.06);
  border-radius: 20px;
  margin: 4px;
  cursor: pointer;
  padding: 2px 6px;
  line-height: 18px;
  font-size: 12px;
  display: inline-block;
  transition: background 0.2s ease 0s;
  border: 1px solid rgba(0, 0, 0, 0.02);
  color: rgba(0, 0, 0, 0.66);
}

.MdaysMatter .events span:hover,
.MworldClock .city span:hover {
  background-color: rgba(0, 0, 0, 0.1);
  color: rgba(0, 0, 0, 0.86);
}

.MworldClock .city {
  position: absolute;
  top: 30px;
  height: calc(100% - 30px);
  overflow: auto;
  background-color: white;
  z-index: 99;
}

.Msetting .zmodal>div,
.Madd .zmodal>div {
  display: flex;
  flex-direction: row;
}

.Madd .aside {
  width: 130px;
  height: 600px;
  padding: 50px 10px 10px;
}

.Msetting .aside {
  width: 110px;
  padding: 50px 10px 10px;
}

.Msetting .aside div,
.Madd .aside div {
  padding: 10px;
  cursor: pointer;
  display: flex;
  justify-content: start;
  align-items: center;
}

.Msetting .aside div.active,
.Msetting .aside div:hover,
.Madd .aside div.active,
.Madd .aside div:hover {
  transition: background 0.2s ease 0s, color 0.2s ease 0s;
  color: #1681ff;
}

.Madd .aside i {
  display: inline-block;
  width: 20px;
  height: 20px;
  margin-right: 5px;
}

.Madd .aside div:nth-child(1) i {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><g fill='gray'><path d='M16.66 4.52l2.83 2.83l-2.83 2.83l-2.83-2.83l2.83-2.83M9 5v4H5V5h4m10 10v4h-4v-4h4M9 15v4H5v-4h4m7.66-13.31L11 7.34L16.66 13l5.66-5.66l-5.66-5.65zM11 3H3v8h8V3zm10 10h-8v8h8v-8zm-10 0H3v8h8v-8z'/></g></svg>");
}

.Madd .aside div:nth-child(2) i {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><g fill='gray'><path d='M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10s10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8s8 3.59 8 8s-3.59 8-8 8zm-5.5-2.5l7.51-3.49L17.5 6.5L9.99 9.99L6.5 17.5zm5.5-6.6c.61 0 1.1.49 1.1 1.1s-.49 1.1-1.1 1.1s-1.1-.49-1.1-1.1s.49-1.1 1.1-1.1z'/></g></svg>");
}

.Madd .aside div:nth-child(3) i {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><g fill='gray'><path d='M20.97 7.27a.996.996 0 0 0 0-1.41l-2.83-2.83a.996.996 0 0 0-1.41 0l-4.49 4.49l-3.89-3.89c-.78-.78-2.05-.78-2.83 0l-1.9 1.9c-.78.78-.78 2.05 0 2.83l3.89 3.89L3 16.76V21h4.24l4.52-4.52l3.89 3.89c.95.95 2.23.6 2.83 0l1.9-1.9c.78-.78.78-2.05 0-2.83l-3.89-3.89l4.48-4.48zM5.04 6.94l1.89-1.9L8.2 6.31L7.02 7.5l1.41 1.41l1.19-1.19l1.2 1.2l-1.9 1.9l-3.88-3.88zm11.23 7.44l-1.19 1.19l1.41 1.41l1.19-1.19l1.27 1.27l-1.9 1.9l-3.89-3.89l1.9-1.9l1.21 1.21zM6.41 19H5v-1.41l9.61-9.61l1.3 1.3l.11.11L6.41 19zm9.61-12.44l1.41-1.41l1.41 1.41l-1.41 1.41l-1.41-1.41z'/></g></svg>");
}

.Msetting,
.Madd {
  font-size: 14px;
}

.Msetting .main,
.Madd .main {
  width: 720px;
  overflow: hidden;
  padding: 10px;
  background-color: rgb(241, 240, 245);
}

.Madd select {
  margin: 9px;
}

.Madd .tab span {
  height: 22px;
  line-height: 20px;
  display: inline-block;
  margin-right: 10px;
  font-size: 12px;
  background-color: white;
  border: 1px solid rgba(0, 0, 0, 0.06);
  padding: 0px 6px;
  border-radius: 11px;
  cursor: pointer;
}

.Madd .tab span.active {
  background-color: #1681ff;
  color: white;
}

.Madd .links {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(222px, 1fr));
  grid-auto-flow: dense;
  gap: 11px;
  overflow: hidden auto;
  height: 600px;
  margin-top: 12px;
}

.Madd .links>div {
  padding: 10px 11px 30px;
  background-color: white;
  border-radius: 6px;
  position: relative;
}

.Madd .links a {
  display: flex;
  flex: 1 1 auto;
  flex-direction: row;
}

.Madd .links img {
  margin-right: 10px;
  border-radius: 14px;
  width: 58px;
  height: 58px;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 10px 3px;
}

.Madd .links a div p:last-child {
  font-size: 12px;
  line-height: 18px;
  margin-top: 6px;
  height: 36px;
  text-overflow: ellipsis;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  color: rgba(0, 0, 0, 0.5);
}

.Madd .cpts {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  grid-auto-flow: dense;
  gap: 14px;
  height: 640px;
  overflow: auto;
}

.Madd .cpts>div,
.Madd .diy form {
  border-radius: 12px;
  padding: 10px;
  background-color: white;
  position: relative;
}

.Madd .cpts p {
  height: 20px;
  text-align: center;
  margin: 6px;
  font-size: 16px;
}

.Madd .cpts p:nth-child(2) {
  font-size: 14px;
  color: rgb(136, 136, 136);
}

.Madd .cpts img {
  height: 150px;
  width: 150px;
  display: block;
  margin: auto;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 5px;
  border-radius: var(--icon_radius);
}


.Madd .cpt_exchangerate img,
.Madd .cpt_wallpaper img,
.Madd .cpt_topsearch img,
.Madd .cpt_worldClock img {
  width: 300px;
}

.Madd .main .btn {
  padding: 3px 9px;
  float: right;
  font-size: 12px;
  border-radius: 20px;
  border: 1px solid rgb(220, 223, 230);
  position: absolute;
  inset: auto 5px 5px auto;
  cursor: pointer;
}

.Madd .main .btn:hover {
  color: rgb(24, 144, 255);
  background-color: rgb(236, 245, 255);
}

.Madd .cpts .btn {
  top: 9px;
  bottom: auto;
}

.Madd .diy input {
  width: 442px;
}

.Madd .diy .txt {
  margin: 0px 10px 0px 50px;
}

.Madd .diy .txt .link div {
  font-size: 16px;
}

.Msetting form>p,
.Madd .diy>p {
  margin: 9px 0px;
  font-size: 16px;
}

.Msetting .main {
  width: 400px;
}

.Msetting form section {
  padding: 8px 16px;
  background-color: white;
  border-radius: 6px;
  line-height: 36px;
}

.Msetting form p {
  margin: 15px 0px 5px 9px;
}

.Msetting label {
  min-width: 70px;
  display: inline-block;
}

.Msetting input {
  vertical-align: -3px;
  width: 200px;
}

.Msetting input~span {
  min-width: 45px;
  display: inline-block;
  text-align: right;
}

.Msetting .sync div {
  cursor: pointer;
  color: rgb(24, 144, 255);
}

.Msetting .sync div:hover {
  font-weight: 700;
}

.Mlogin .zmodal {
  min-width: unset;
}

@keyframes aswing {
  0% {
    transform: rotate(0deg) scale(1);
  }

  20% {
    transform: rotate(-2deg) scale(1);
  }

  60% {
    transform: rotate(0deg) scale(1);
  }

  80% {
    transform: rotate(2deg) scale(1);
  }

  100% {
    transform: rotate(0deg) scale(1);
  }
}

@keyframes scale {
  0% {
    transform: scale(0);
    opacity: 0;
  }

  60% {
    transform: scale(1.03);
    opacity: 1;
  }

  100% {
    transform: scale(1);
  }
}

@keyframes turn-down {
  0% {
    transform: rotateX(90deg);
  }

  100% {
    transform: rotateX(0deg);
  }
}

@keyframes turn-up {
  0% {
    transform: rotateX(0deg);
  }

  100% {
    transform: rotateX(-90deg);
  }
}

@keyframes asd {
  0% {
    z-index: 2;
  }

  5% {
    z-index: 4;
  }

  100% {
    z-index: 4;
  }
}

@keyframes show {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@keyframes hide {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}