/*google字体*/
 
 
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@200;300;400;500;600;700;900&display=swap");
 

/*! Generated by Font Squirrel (https://www.fontsquirrel.com) on October 11, 2025 */



@font-face {
    font-family: 'zen_dotsregular';
    src: url('zendots-regular-webfont.woff2') format('woff2'),
         url('zendots-regular-webfont.woff') format('woff'),
         url('zendots-regular-webfont.svg#zen_dotsregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

 .absolute .logo
{ 
 position: absolute;
    top: 20px;
    left: 20px;
    background: url("data:image/svg+xml,%3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M399.377 230.747h55.899v111.797h279.49v-55.899H511.174v-55.898h223.592V174.85H399.377v-55.898h279.491V63.053H119.887v55.898h223.592v55.898H63.99v55.898h167.694v55.898H63.99v55.899H287.58V230.747h55.898v167.695H119.887v279.49h335.389v-55.898h-279.49v-55.898h335.388v279.49H287.58v55.899h279.49V510.238H175.786V454.34h391.287v-55.898H399.377V230.747zM790.664 63.053v55.898H902.46v111.796h55.898V63.053H790.664zm55.898 111.796h-55.898v55.898h55.898V174.85zM622.97 957.423h55.898V398.442H622.97v558.98zm167.694-391.287H902.46v-55.898H734.766v391.287h223.592v-55.899H790.664v-279.49zM119.887 789.728H63.989v167.695h167.694v-55.898H119.887V789.728zm55.898 55.898h55.898v-55.898h-55.898v55.898z' fill='%23fff'/%3E%3C/svg%3E")no-repeat 0 50%;
    background-size: 27px auto;
    padding-left: 35px
}
.text-base {display: none}
.float-btn svg{color: #ffffff7d;}
.clock{position: relative;top: -50px;
        --oran: #e6cbc3;
        --yell: #F5CE5A;}
.clock.w-full{    width: fit-content;}
 
.clock .md\:block{display: inline}
.clock span.clock-time{font-size: 55px;    font-family: "zen_dotsregular", sans-serif;
  font-weight: 400;
  font-style: normal;}
span.clock-date,span.clock-week{position: absolute;
    font-size: 23px; 
       font-weight: 900;
    inset:-45px auto  auto -30px;}
.clock:after,.clock:before{content: "";
position: absolute;
width: 50px;}


.clock:before{ border-left: 5px solid var(--yell);
    border-bottom: 5px solid var(--yell);
     inset:0 auto -20px -20px;
    border-radius: 0 28px;}
.clock:after{    border-right: 5px solid var(--yell);
    border-top: 5px solid var(--yell);
    inset:-25px  -20px 10px auto;
    border-radius: 0 28px;}
span.clock-week{   font-weight: 700;
  
    inset:auto -30px -30px auto;
    font-size: 19px;}
 
 .absolute .logo .md\:text-6xl{ font-size: 1.5rem;   color: #ffffff7d; font-family: 'PingFang Heavy';font-weight: normal}
.app-icon-text-shadow .n-ellipsis,.w-full .n-ellipsis span{    font-family: 'PingFang Heavy';
    font-weight: 900;
  font-size: 19px;
/*    倾斜角度 */
/*        transform: rotatße(356deg);*/
/*    字体阴影接渐变*/
 text-shadow: 1px 1px rgb(0 0 0 / 80%), 0.25rem 0.25rem hsl(0deg 0% 100% / 30%), 0.5rem 0.5rem 0.5rem rgb(0 0 0 / 10%);
    -webkit-mask: linear-gradient(#fff 40%,#00000054 80%) ;
    mask: linear-gradient(#fff 40%,#00000054 80%)  ;
    display: block; 
        position: absolute;
    top: 10px;
    left: 10px;
}

.w-full .text-xs{padding-left: 10px;  font-family: 'PingFang Heavy';
    font-size: 11px;
    font-weight: 200;}

.icon-small-box[data-v-60d0b9c3]{     position: relative;
    z-index: 9999;
gap:18px}

/*
  templete .icon-small-box[data-v-60d0b9c3] {     position: relative;
    z-index: 9999;
    grid-template-columns: repeat(auto-fit, 70px);
    gap: 18px;
    justify-content: space-between;
}
*/
/*
.n-image img {
    width: 48px;
    height: 48px
}
*/
/*图标浅色线条背景 不需要请注释*/
/*
.w-full .font-semibold:before{  position: absolute;
    width: 93px;
    display: block;
    height: 75px;
    content: "";
    border-radius: 50%;
    z-index: -1;
    left: -27px;
    top: -35px;
    background: #ffffff3b;
    box-shadow: -8px 21px 0 #ffffff1a;}
.w-full .font-semibold:after{  position: absolute;
    width:40px;
    display: block;
    height: 40px;
     border: 4px solid #ffffff3b; 
    content: "";
    border-radius: 50%;
      top: -19px;
    left: 48px;
    z-index: -1;}
*/
/*图标浅色线条背景结束*/








.icon-info-box .flex .n-image img  {
    border-radius: inherit;
    position: absolute;
   inset:auto 0 0 auto;
    max-width: 100%;
    max-height: 100%;
    
/*    图标从右边70px宽度开始渐隐*/
    -webkit-mask: linear-gradient(270deg, #000 70px, transparent);
    mask: linear-gradient(270deg, #000 70px, transparent);
}
/* .item-icon .n-avatar .n-avatar__text{  inset:auto 10px 10px auto}*/
.search-box{    margin:-20px auto  30px;
    max-width: 600px;}
/*行列局 每个宽度*/
#app .icon-info-box{gap: 10px;grid-template-columns: repeat(auto-fill,minmax(160px,1fr)); }



/*每组上边距*/
.mx-auto .mt-\[50px\]{margin-top: 20px}
 
.font-extrabold .text-shadow {
    font-family: 'PingFang Heavy';
        font-weight: 200;
    background: #0000007d;
    padding: 3px 10px;
    font-size: 15px;
    border-radius: 0 15px 15px 0;
}
.font-extrabold .text-shadow:before{    content: "";
    display: block;
    width: 11px;
    height: 11px;
    border: 2px solid #ffffff42;
    border-radius: 50%; 
    margin: 9px 8px 0 0;
    float: left;}
.app-icon .rounded-2xl .n-image img,.app-icon .rounded-2xl .n-image img{   
    position: absolute;
    bottom: 0;
    max-width: 100%;
       max-height: 60px;
    right: 0;   border-radius: 19px;
/*    图标从右边70px宽度开始渐隐*/
    -webkit-mask: linear-gradient(270deg, #000 90px, transparent);
    mask: linear-gradient(270deg, #000 90px, transparent);}

.mx-auto .mt-\[50px\] .font-extrabold {     margin-left: 0;
    position: absolute;
    left: 0;
}
#app .w-full .search-container,.w-full .search-container{   border: 2px solid #ffffff52;
    border-radius: 50px;}

 #app .w-full .search-container:hover{ border: 2px solid #fff;}
 
.icon-info-box .flex{ flex-direction: row-reverse;
    flex-wrap: nowrap;
    justify-content: space-between; 
    align-items: flex-end;    
}
 
.icon-info-box .cursor-pointer{}

.app-icon .rounded-2xl {   border-radius: 16px; overflow: hidden}
/*
.app-icon  .item-icon{margin-left: -5px;
margin-top: -5px;
}
.app-icon  .item-icon .n-image{margin: 5px 0 0 5px}
.app-icon  .item-card-small-title{font-size: 12px;
    text-shadow: 1px 1px 2px black;}
*/
.icon-info-box .rounded-2xl{  position: relative;
/*    连接块圆角角度*/
    border-radius: 10px;
overflow: hidden;   height: auto;
    width: auto;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);}

/*
.icon-info-box div:first-child .rounded-2xl{position: absolute;
}
*/
   templete .icon-small-box[data-v-60d0b9c3] {
    width: 100%;padding:0 ;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(90px, 1fr));
          gap: 18px; 
}

.app-icon{position: relative}
.app-icon  .item-card-small-title {display: none}
.app-icon-small-title{
position: absolute;
    top: 5px;
    left: 10px;}
.app-icon-small-title span{font-size: 15px;
    font-family: 'Noto Sans SC';
    font-weight: 900; 
/*
    background: #000;
    padding: 3px 5px;
    border-radius: 10px;
*/
    
     text-shadow: 1px 1px rgb(0 0 0 / 80%), 0.25rem 0.25rem hsl(0deg 0% 100% / 30%), 0.5rem 0.5rem 0.5rem rgb(0 0 0 / 10%);
    -webkit-mask: linear-gradient(#fff 40%,#00000054 80%) ;
    mask: linear-gradient(#fff 40%,#00000054 80%)  ;}
.item-card-small .w-\[70px\]{width: 100%;  
       
/*
display: flex;align-items: flex-end;
    justify-content: flex-end;
*/
}

.app-icon-small-icon{display: flex;align-items: flex-end;
    justify-content: flex-end;}
.app-icon-small-icon .h-\[35px\]{height: 60px;}
.app-icon-small-icon .w-\[35px\]{width:  60px;}
.app-icon-small-icon svg{width: 50px;
height:auto;}
.item-card-small .h-\[70px\]{height: auto;min-height: 90px;}
  .icon-small-box div:first-child{grid-area: 1 / 1 / 2 / 3;
  
}

 .item-group-dock  .icon-small-box div:first-child{grid-area: 1 ;
  
}
.item-group-dock{    position: fixed;
    bottom: 20px;
    width: 460px;
    background: #ffffff4f;
    left: calc(50% - 230px);
    padding: 20px;
    border-radius: 30px;-webkit-backdrop-filter: blur(15px);
    backdrop-filter: blur(15px);}

@media (max-width: 480px)
{
     #app .fixed-element[data-v-60d0b9c3]{top:0;right: 0}
    .absolute .logo{left: 5px;
    top: 5px}
    .mx-auto .mt-\[50px\] .font-extrabold{position: relative;
    margin-left: -10px;} 
    
   templete .icon-small-box[data-v-60d0b9c3] {
    width: 100%;padding:0 ;
    display: grid;
/*    grid-template-columns: repeat(auto-fill, minmax(70px, 1fr));*/
         gap: 10px;
       
}
/*    .item-card-small .h-\[70px\]{height: auto;min-height: 70px;}*/
    
    .clock { 
    top: -40px; 
}
     .search-box {
    margin: 0 auto;
    /* max-width: 600px; */
}

.fixed-element[data-v-60d0b9c3],.absolute .logo{display: none}
    
}
 


 

.absolute,.fixed-element{z-index: 5}