
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body, html {
    min-height: 100vh;
    min-width: 100vw;
}

#ANBody-1{
    background-image:linear-gradient(90deg, rgb(210, 78, 78) 10%, rgb(136, 44, 209) 90%),
    linear-gradient(rgb(255, 199, 71) 1%, rgb(244, 177, 83) 100%);
    min-height: 100vh; /* 视口高度的100% */

}
#ANBody-start{
    background-image:linear-gradient(90deg, rgb(210, 78, 78) 10%, rgb(136, 44, 209) 90%),
    linear-gradient(rgb(255, 199, 71) 1%, rgb(244, 177, 83) 100%);
    min-height: 100vh; /* 视口高度的100% */

}
.Kitname{
    color: white;
    font-weight: bold;

}
#main{
    height: 80vh;
    display: flex;
    padding-right: 6vh;
    padding-left: 6vh;
    padding-top: 6vh;
    gap: 3vw;
}
.bottom-row {
    padding-top: 2px;
    display: flex;
    justify-content: space-between; /* 左右两端对齐 */
    align-items: center; /* 垂直居中 */
}

.buy-button {
    width: 30px;
    padding-top: 2px;
    background: #35e43c;
    color: white;
    border: none;
    border-radius: 3px;
    cursor: pointer;
}
.delete-button {
    width: 30px;
    padding-top: 2px;
    background: #35e43c;
    color: white;
    border: none;
    border-radius: 3px;
    cursor: pointer;
}

.buy-button:hover {
    background: #45a049;
}
#left_buttons{
    display: flex;
    flex-direction: column;
    gap: 2vh;
    padding-top: 2vh;
}

:root{
    --gjs-t-color-primary:#cf549e;
    --gjs-t-color-secondary:#b9227d;
    --gjs-t-color-accent:#ffb347;
    --gjs-t-color-success:#28a745;
    --gjs-t-color-warning:#ffc107;
    --gjs-t-color-error:#dc3545;
}
.gjs-heading{
    margin:0;
    color:rgba(29, 40, 55, 1);
}
.gjs-grid-column{
    flex:100%;
    padding:5px 0;
}
.gjs-grid-row{
    display:flex;
    justify-content:flex-start;
    align-items:stretch;
    flex-direction:row;
    min-height:auto;
    padding:10px 0;
}
.gjs-t-body{
    background-color:inherit;
    color:inherit;
    font-size:1rem;
    line-height:1.75rem;
    font-family:Arial, Helvetica, sans-serif;
}
.gjs-link-box{
    color:inherit;
    display:inline-block;
    vertical-align:top;
    padding:10px;
    max-width:100%;
    text-decoration:none;
}
.gjs-link{
    color: whitesmoke;
    vertical-align:top;
    max-width:100%;
    display:inline-block;
    text-decoration:none;
    transition:color 0.3s ease 0s;
}
.gjs-t-h1{
    color:var(--gjs-t-color-secondary);
    font-size:1.5rem;
    line-height:2.5rem;
}
.gjs-t-h2{
    color:#601843;
    font-size:1.2rem;
    line-height:1.75rem;
}
.gjs-t-button{
    background-color:var(--gjs-t-color-primary);
    color:white;
    border-radius:0.3rem;
}
.gjs-t-link{
    color:var(--gjs-t-color-primary);
    text-decoration:underline;
}
.gjs-t-border{
    border-radius:0.3rem;
    border-color:#e0e0e0;
}
.text-content{
    line-height:20px;
}
.text-main-content{
    line-height:30px;
    font-size:1.2rem;
}

.gjs-grid-column.feature-item{
    padding-top:15px;
    padding-right:15px;
    padding-bottom:15px;
    padding-left:15px;
    display:flex;
    flex-direction:column;
    gap:15px;
    min-width:30%;
}
.gjs-grid-column.testimonial-item{
    padding-top:15px;
    padding-right:15px;
    padding-bottom:15px;
    padding-left:15px;
    display:flex;
    flex-direction:column;
    gap:15px;
    min-width:45%;
    background-color:rgba(247, 247, 247, 0.23);
    border-top-left-radius:5px;
    border-top-right-radius:5px;
    border-bottom-right-radius:5px;
    border-bottom-left-radius:5px;
    align-items:flex-start;
    border-top-width:1px;
    border-right-width:1px;
    border-bottom-width:1px;
    border-left-width:1px;
    border-top-style:solid;
    border-right-style:solid;
    border-bottom-style:solid;
    border-left-style:solid;
    border-top-color:rgba(0, 0, 0, 0.06);
    border-right-color:rgba(0, 0, 0, 0.06);
    border-bottom-color:rgba(0, 0, 0, 0.06);
    border-left-color:rgba(0, 0, 0, 0.06);
}
.gjs-button{
    vertical-align:top;
    max-width:100%;
    display:inline-block;
    text-decoration:none;
    color:white;
    padding-right:15px;
    padding-bottom:10px;
    padding-left:15px;
    background-color:rgb(36, 99, 235);
    border-radius:5px;
    padding-top:10px;
    font-size:1.1rem;
    text-align:center;
}
.gjs-text-blue{
    color:rgb(36, 99, 235);
}
.gjs-link:hover{
    color: rgb(0, 138, 255);
    text-decoration:none;
}
.gjs-icon{
    display:inline-block;
    text-decoration:none;
    color:inherit;
    vertical-align:middle;
    fill:currentColor;
    width:50px;
    height:50px;
}
.gjs-icon.gjs-feature-icon{
    padding-top:10px;
    padding-right:10px;
    padding-bottom:10px;
    padding-left:10px;
    background-color:rgb(36, 99, 235);
    color:white;
    border-top-left-radius:10px;
    border-top-right-radius:10px;
    border-bottom-right-radius:10px;
    border-bottom-left-radius:10px;
}
#head-4{
    flex:0 0 auto;
}
#infmy1-2{
    padding:10px;
    font-family:Arial, Helvetica, sans-serif;
    padding-left:20px;
    padding-right:20px;
}

#infmy1-3{
    padding:10px;
    font-family:Arial, Helvetica, sans-serif;
    padding-left:20px;
    padding-right:20px;
}

#irtfd-2{
    flex:0 1 auto;
}

#irtfd-3{
    flex:0 1 auto;
}

#i88iz-2{
    padding-top:14px;
    font-family:Arial, Helvetica, sans-serif;
    padding-left:20px;
    padding-right:20px;
}
#i88iz-3{
    padding:10px;
    font-family:Arial, Helvetica, sans-serif;
    padding-left:20px;
    padding-right:20px;
}
#icyzp-2{
    flex:0 1 auto;

}
#icyzp-3{
    flex:0 1 auto;
}
#it00l-2{
    padding-top:0px;
    padding-bottom:0px;
}
#head-button{
    flex:0 0 auto;
    align-self:center;
    order:0;
    display:block;
    flex-direction:row;
    justify-content:space-evenly;
    align-items:flex-end;
    padding-left:40%;
}
#head-3{
    align-items:center;
    justify-content:space-between;
    border-radius:10px;
    backdrop-filter:blur(13px);
    box-shadow:0px 2px 18px 3px rgb(239, 170, 26);
    max-height:55%;
    border-color: rgb(235, 218, 17);
    border-top-style:solid;
    border-right-style:solid;
    border-bottom-style:solid;
    border-left-style:solid;
}

#cart-main{
    box-shadow:2px 2px 18px 3px rgb(234, 224, 55);
    border-radius:10px;
    border-color: rgb(17, 217, 235);
    border-top-style:solid;
    border-right-style:solid;
    border-bottom-style:solid;
    border-left-style:solid;
    margin-top: 30px;
    margin-right: 80px;
    margin-left: 80px;
}


#AN-BUTTON {
    transition: all 0.3s ease;
    padding: 15px 30px;
    background: dodgerblue;
    color: white;
    border: none;
    border-radius: 10px;
    font-size: 1.2rem;
    text-decoration: none;
}

#AN-BUTTON:hover {
    background-color: #07ff0e;
    border: none;
    box-shadow: 0 0 20px 10px rgba(9, 215, 241, 0.8);
    transform: scale(1.05);
}

#head-2{
    width:100%;
    min-height:0px;
    max-height:89px;
    padding-right:17px;
}
#head-1{
    justify-content:center;
    position:sticky;
    top:15px;
    padding-top:2%;
    padding-bottom:0px;
    padding-left:20px;
    padding-right:20px;
    height:0%;
}
*{
    box-sizing:border-box;
}

.gjs-t-body{
    background-color:inherit;
    color:inherit;
    font-size:1rem;
    line-height:1.75rem;
    font-family:Arial, Helvetica, sans-serif;
}
.gjs-t-h1{
    color:var(--gjs-t-color-secondary);
    font-size:1.5rem;
    line-height:2.5rem;
}
.gjs-t-h2{
    color:#601843;
    font-size:1.2rem;
    line-height:1.75rem;
}
.gjs-t-button{
    background-color:var(--gjs-t-color-primary);
    color:white;
    border-radius:0.3rem;
}
.gjs-t-link{
    color:var(--gjs-t-color-primary);
    text-decoration:underline;
}
.gjs-t-border{
    border-radius:0.3rem;
    border-color:#e0e0e0;
}
.gjs-plg-flex-column{
    flex-grow:1;
}
.gjs-plg-flex-row{
    display:flex;
    align-items:stretch;
    flex-wrap:nowrap;
}
#iunxj{
    position:absolute;
    bottom:0px;
    left:0px;
    right:0px;
    top:14%;
    flex-direction:row;
    justify-content:flex-start;
    gap:28px;
    padding-top:1%;
    padding-right:1%;
    padding-bottom:1%;
    padding-left:1%;
    background-color:rgba(0, 0, 0, 0);
}

#ANmain{
    flex: 1;
    background-image:linear-gradient(rgba(218, 182, 38, 0.8) 1%, rgba(237, 156, 20, 0.85) 100%);
    border-radius:20px;
    opacity:100%;
    mix-blend-mode:normal;
    box-shadow:0px 0px 10px 7px rgba(51, 171, 217, 0.73) ;

}

#icugc{
    height:23%;
    flex-direction:row-reverse;
    align-items:flex-start;
    margin-top: 20px;
    padding-left: 20px;
    padding-right: 20px;
    gap:1%;
}
#ioz0n{
    flex-basis:25%;
    display:flex;
    justify-content:center;
}
#ih1ne{
    height:5%;
    flex-direction:row-reverse;
    align-items:flex-start;
    padding-right: 30px;
    gap:1%;
}
.gjs-image-box{
    height:200px;
    width:100%;
}
#ia2dys{
    background-image:url("assets/3C3U.png");
    background-size:auto auto;
    background-position:center center;
    background-attachment:scroll;
    background-repeat:round;
    height:100%;
    cursor:pointer;

}
#ibwr8g{
    background-image:url('assets/an_g.jpg');
    background-size:contain;
    background-position:center center;
    background-attachment:scroll;
    background-repeat:no-repeat;
    height:100%;
    cursor:pointer;
}
#iunbj8{
    background-image:url('assets/an_g.jpg');
    background-size:contain;
    background-position:center center;
    background-attachment:scroll;
    background-repeat:no-repeat;
    height:100%;
    cursor:pointer;
}

#ilfymp{
    display:none;
    flex-direction:row;
    justify-content:space-around;
    align-items:flex-end;
}
#ifldop{
    width:100px;
    height:35px;
    background-color:rgba(242, 173, 42, 0.85);
    cursor:auto;
    mix-blend-mode:normal;
    border-style:solid;
    border-width:2px;
    border-radius:8px;

}
.server-button {
    width: 100px;
    height: 35px;
    background-color: rgba(242, 173, 42, 0.85);
    cursor: pointer;
    border: 2px solid;
    border-radius: 8px;
    mix-blend-mode: normal;
    transition: all 0.3s ease;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.server-button:hover {
    background-color: rgb(246, 169, 23);
    transform: scale(1.05);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
}

#ioz0n-2{
    flex-basis:25%;
    display:flex;
    justify-content:center;
}
#iukmk-2{
    flex-basis:25%;
    display:flex;
    justify-content:center;
}
#i599c-2{
    flex-basis:25%;
    display:flex;
    justify-content:center;
}
#ih1ne-2{
    height:5%;
    flex-direction:row-reverse;
    align-items:flex-start;
    padding-right: 30px;
    gap:1%;
}
#ibwr8g-2{
    background-image:url('assets/an_g.jpg');
    background-size:contain;
    background-position:center center;
    background-attachment:scroll;
    background-repeat:no-repeat;
    height:100%;
    cursor:pointer;
}
#i7f9y-2{

}
#iunbj8-2{
    background-image:url('assets/an_g.jpg');
    background-size:contain;
    background-position:center center;
    background-attachment:scroll;
    background-repeat:no-repeat;
    height:100%;
    cursor:pointer;
}
#i7gxx-2{


}
#icugc-2{
    height:23%;
    flex-direction:row-reverse;
    align-items:flex-start;
    padding-left: 20px;
    padding-right: 20px;
    gap:1%;
    margin-top:2%;

}
#ioz0n-3{
    flex-basis:25%;
    display:flex;
    justify-content:center;
}
#ioz0n-2-2{
    flex-basis:25%;
    display:flex;
    justify-content:center;
}
#ia2dys-3{
    background-image:url('assets/an_g.jpg');
    background-size:contain;
    background-position:center center;
    background-attachment:scroll;
    background-repeat:no-repeat;
    height:100%;
    cursor:pointer;
}
#imahz-3{

}
#ia2dys-2-3{
    background-image:url('assets/an_g.jpg');
    background-size:contain;
    background-position:center center;
    background-attachment:scroll;
    background-repeat:no-repeat;
    height:100%;
    cursor:pointer;
}
#imahz-2-2{

}
#ia2dys-2-3-2{
    background-image:url('assets/an_g.jpg');
    background-size:contain;
    background-position:center center;
    background-attachment:scroll;
    background-repeat:no-repeat;
    height:100%;
    cursor:pointer;
}
#imahz-2-2-2{

}
#ioz0n-3-2{
    flex-basis:25%;
    display:flex;
    justify-content:center;
}
#ioz0n-3-3{
    flex-basis:25%;
    display:flex;
    justify-content:center;
}
#ia2dys{
    background-image:url('assets/an_g.jpg');
    background-size:contain;
    background-position:center center;
    background-attachment:scroll;
    background-repeat:no-repeat;
}
#ia2dys-3{
    background-image:url('assets/an_g.jpg');
    background-size:contain;
    background-position:center center;
    background-attachment:scroll;
    background-repeat:no-repeat;
}
#ibwr8g{
    background-image:url('assets/an_g.jpg');
    background-size:contain;
    background-position:center center;
    background-attachment:scroll;
    background-repeat:no-repeat;
}
#iunbj8{
    background-image:url('assets/an_g.jpg');
    background-size:contain;
    background-position:center center;
    background-attachment:scroll;
    background-repeat:no-repeat;
}
#ia2dys-2-3{
    background-image:url('assets/an_g.jpg');
    background-size:contain;
    background-position:center center;
    background-attachment:scroll;
    background-repeat:no-repeat;
}
#ia2dys-2-3-2{
    background-image:url('assets/an_g.jpg');
    background-size:contain;
    background-position:center center;
    background-attachment:scroll;
    background-repeat:no-repeat;
}
#ibwr8g-2{
    background-image:url('assets/an_g.jpg');
    background-size:contain;
    background-position:center center;
    background-attachment:scroll;
    background-repeat:no-repeat;
}
#iunbj8-2{
    background-image:url('assets/an_g.jpg');
    background-size:contain;
    background-position:center center;
    background-attachment:scroll;
    background-repeat:no-repeat;
}
#iud83k{
    font-family:'arial black', sans-serif;
}
#ik2zig-2{
    position:relative;
}
#ik2zig-3{
    position:relative;
}
#ik2zig-4{
    position:relative;
}
#ik2zig-5{
    position:relative;
}
#ik2zig-6{
    position:relative;
}
#ik2zig-7{
    position:relative;
}
#ik2zig-8{
    position:relative;
}
#ibj9p3{
    font-family:'arial black', sans-serif;
}
#ilzpeq{
    font-family:'arial black', sans-serif;
}
#ibu0o1{
    font-family:'arial black', sans-serif;
}
#itoewq{
    font-family:'arial black', sans-serif;
}
#iy5jsf{
    font-family:'arial black', sans-serif;
}
#id0qe8{
    font-family:'arial black', sans-serif;
}
#i372rl{
    font-family:'arial black', sans-serif;
}
#iwgegh{
    display:flex;
    height: auto;
    flex-direction:row;
    justify-content:flex-end;
    flex:0 0 auto;
}
#is2s58{
    height:250px;
    margin-top:10px;
}
#ikuj6h{
    justify-content:flex-end;
    flex-direction:row;
    width:354px;
}
#iykzzw{
    background-image:url("assets/3C3U.png");
    background-size:auto auto;
    background-position:0px 0px;
    background-attachment:scroll;
    background-repeat:round;
    height:100%;
    background-origin:border-box;
}
#irfl3k-2-2{
    width:196px;
    height:41px;
}
#iucmr-2-2{
    display:block;
    padding-top:0px;
    padding-bottom:0px;
}
#iqjl-2-2{
    flex:0 1 auto;
}
#icfyb-2-2{
    padding:10px;
    font-family:Arial, Helvetica, sans-serif;
    padding-left:20px;
    padding-right:20px;
}
#infmy1-2-2{
    padding:10px;
    font-family:Arial, Helvetica, sans-serif;
    padding-left:20px;
    padding-right:20px;
}
#irtfd-2-2{
    flex:0 1 auto;
}
#i88iz-2-2{
    padding:10px;
    font-family:Arial, Helvetica, sans-serif;
    padding-left:20px;
    padding-right:20px;
}
#icyzp-2-2{
    flex:0 1 auto;
}
#it00l-2-2{
    padding-top:0px;
    padding-bottom:0px;
}
#iffs-2-2{
    flex:0 0 auto;
    align-self:center;
    order:0;
    display:block;
    flex-direction:row;
    justify-content:space-evenly;
    align-items:flex-end;
    padding-left:40%;
}
#iyd2-2-2{
    align-items:center;
    justify-content:space-between;
    padding-top:0px;
    padding-bottom:0px;
    border-radius:10px;
    backdrop-filter:blur(13px);
    box-shadow:0px 2px 7px 0px rgba(241, 153, 9, 0.43) ;
    max-height:55%;
}
#itjq-2-2{
    width:100%;
    min-height:0px;
    max-height:89px;
}
#i6po-2-2{
    justify-content:center;
    position:sticky;
    top:15px;
    padding-top:8px;
    padding-bottom:0px;
    padding-left:20px;
    padding-right:20px;
    height:0%;
}
#head-5{
    padding:10px;
    padding-top:13px;
    padding-right:9px;
    padding-bottom:17px;
    padding-left:9px;
    box-shadow:unset;

}
#anarchykits{
    font-family:Arial Black, Gadget, sans-serif;
    font-size:50px;
    color:rgb(45, 194, 107);
    text-shadow: 0 0 8px #ffff00, /* 黄色外发光 */
    0 0 12px #ffff00;
}

#cart-sell{
    ont-family:Arial Black, Gadget, sans-serif;
    font-size:36px;
    line-height:39px;
    color: rgb(25, 244, 193);
    text-shadow: 0 0 8px rgba(226, 20, 241, 0.9), /* 黄色外发光 */
    0 0 12px #ffff00;

}

#ifldop-2{
    width:100px;
    height:35px;
    background-color:rgba(242, 173, 42, 0.85);
    cursor:auto;
    mix-blend-mode:normal;
    border-style:solid;
    border-width:2px;
    border-radius:8px;

}
#i4iltl{
    position:relative;
}
#ial4of{
    font-family:'arial black', sans-serif;
    font-size:10pt;
}
#ih87v3{
    font-family:'arial black', sans-serif;
}
#iqrg9q{
    font-family:'arial black', sans-serif;
}
#ihdqvu{
    width:850px;
}
.gjs-custom-code{

    padding-left: 20px;
}
@media (max-width: 992px){
    .gjs-grid-row{
        flex-direction:column;
    }
    #it00l-2{
        flex-direction:row;
    }
    #head-3{
        flex-direction:row;
    }
    #it00l-2-2{
        flex-direction:row;
    }
    #iyd2-2-2{
        flex-direction:row;
    }
}
@media (max-width: 768px){
    #head-button{
        display:none;
    }
    #iffs-2-2{
        display:none;
    }
}
@media (max-width: 480px){
    #irfl3k-2-2{
        width:116px;
        height:24px;
    }
}

.shulker-box {
    width: 280px;
    height: 132px;
    background-color: #2400d3; /* 紫色潜影盒基础色 */
    border: 4px solid #5d4bcc;
    border-radius: 8px;
    padding-top: 5px;
    padding-right: 5px;
    padding-left: 5px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
    position: relative;
}

.CustomKit-shulker-box{
    display: flex;
    justify-content: center;
    padding-top: 4vh;
  gap: 80px;
}

#cart-1{
    display: flex;

    justify-content: center;
}
#cart-2{
    display: flex;
    justify-content: center;
}
#cart-3{
    display: flex;
    justify-content: center;
}

.cart-kit{
    width: 380px;
    height: 165px;
    background-color: #2400d3; /* 紫色潜影盒基础色 */
    border: 4px solid #5d4bcc;
    border-radius: 8px;
    padding-top: 5px;
    padding-right: 5px;
    padding-left: 5px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
    position: relative;
}

#CustomKit {
    width: 30%;
    height: 60%;
    background-color: #efaa1a; /* 紫色潜影盒基础色 */
    border: 4px solid #ebda11;
    border-radius: 8px;
    /* 上:10px, 右:10px, 下:2px, 左:10px */
    padding: 10px 10px 2px 10px;
    box-shadow: 0 4px 8px rgb(216, 81, 81);
    position: relative;
}

.shulker-title {
    color: white;
    text-align: center;
    margin-bottom: 15px;
    text-shadow: 1px 1px 2px #000;
    font-weight: bold;
}

.inventory-grid {
    display: grid;
    grid-template-columns: repeat(9, 1fr);
    gap: 3px;
    background-color: #e9e7f1;
    padding: 5px;
    border-radius: 4px;
}

#MincraftItem-inventory{
    display: grid;
    grid-template-columns: repeat(20, 1fr);
    gap: 1vw;
    background-color: rgba(226, 20, 241, 0.9);
    padding: 20px;
    border-radius: 10px;

}
#MincraftItem{
    width: 80%;
    height: 60%;
    background-color: #efaa1a; /* 紫色潜影盒基础色 */
    border-radius: 8px;
    padding: 5px;

    box-shadow: 0 4px 8px rgb(235, 218, 17);
    position: relative;

}

.slot-1{
    aspect-ratio: 1;
    background-color: rgba(0, 0, 0, 0.3);
    border: 2px solid rgba(255, 255, 255, 0.1);
    border-radius: 6px;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: all 0.2s;
}

.slot {
    aspect-ratio: 1;
    background-color: rgba(0, 0, 0, 0.3);
    border: 2px solid rgba(255, 255, 255, 0.1);
    border-radius: 3px;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: all 0.2s;
}

.slot-1:hover {
    background-color: rgba(255, 255, 255, 0.2);
    border-color: rgba(255, 255, 255, 0.3);
    transform: scale(1.05);
}

.slot:hover {
    background-color: rgba(255, 255, 255, 0.2);
    border-color: rgba(255, 255, 255, 0.3);
    transform: scale(1.05);
}

.slot-img {
    all: unset;
    image-rendering: pixelated;
    width: 100%;
    height: 100%;
}
.slot-img-block {
    all: unset;
    width: 90%;
    height: 90%;
}

.row {
    display: contents;
}

/* 容器样式：固定高度 + 隐藏滚动条 */
#scroll-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 1.2vw;
    height: 350px; /* 容器高度（限制可见区域） */
    overflow-y: scroll; /* 垂直滚动 */
    scrollbar-width: none; /* Firefox 隐藏滚动条 */
    -ms-overflow-style: none; /* IE/Edge 隐藏滚动条 */
    padding-top: 2vw;

}

#scroll-container-1 {
    display: flex;;
    flex-wrap: wrap;
    width: 70%;
    height: 200px; /* 容器高度（限制可见区域） */
    overflow-y: scroll; /* 垂直滚动 */
    scrollbar-width: none; /* Firefox 隐藏滚动条 */
    -ms-overflow-style: none; /* IE/Edge 隐藏滚动条 */
    padding-top: 1.5vw;
    padding-left: 1.5vw;

}

#scroll-container-cart {
    display: flex;;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    height: 580px; /* 容器高度（限制可见区域） */
    overflow-y: scroll; /* 垂直滚动 */
    scrollbar-width: none; /* Firefox 隐藏滚动条 */
    -ms-overflow-style: none; /* IE/Edge 隐藏滚动条 */
    padding-top: 1.3vw;

}

#scroll-container-client {

    display: flex;
    flex-wrap: wrap;
    flex-direction: row;         /* 横向排列子元素 */
    overflow-x: auto;            /* 横向可滚动 */
    overflow-y: hidden;          /* 禁止垂直滚动 */
    gap: 10px;
    height: 580px;
    padding: 20px;
    scrollbar-width: none;       /* Firefox 隐藏滚动条 */
    -ms-overflow-style: none;    /* IE/Edge 隐藏滚动条 */
}

#scroll-container-resource {

    text-align: center;
    flex-wrap: wrap;
    overflow-x: auto;            /* 横向可滚动 */
    overflow-y: hidden;          /* 禁止垂直滚动 */
    gap: 10px;
    height: 580px;
    padding: 20px;
    scrollbar-width: none;       /* Firefox 隐藏滚动条 */
    -ms-overflow-style: none;    /* IE/Edge 隐藏滚动条 */
}

#scroll-container-1::-webkit-scrollbar {
    display: none;
}

/* Chrome/Safari 隐藏滚动条 */
#scroll-container::-webkit-scrollbar {
    display: none;
}

/* 小长方形样式 */
.box {
    width: 800px; /* 略小于容器宽度 */
    height: 30px; /* 每个长方形高度 */
    margin: 10px auto; /* 上下间距 + 水平居中 */
    background: #4CAF50; /* 绿色背景 */
    border-radius: 5px; /* 圆角 */
}

#cart {
    margin-top: 3px;
    display: block; /* 让整个区域可点击 */
    background: #35e43c; /* 绿色背景 */
    padding-left: 4px;
    padding-right: 4px;
    padding-top: 2px;
    padding-bottom: 2px;
    border-radius: 5px;
    text-align: center;
    transition: background-color 0.3s, transform 0.2s, box-shadow 0.2s;

}

/* 鼠标悬停时的样式 */
#cart:hover {
    background-color: #e91e63;
    color: white;
    transform: translateY(-3px);
}

#c3u{
    display: flex;
    flex: auto;
    gap: 20px;
}

#c3u-logo{
    height: 200px;
    width: 300px;
    background-image:url("assets/3C3U.png");
    background-repeat:round;

}
#c3u-logo-1{
    height: 200px;
    width: 300px;
    background-image:url("assets/2BCC.png");
    background-repeat:round;

}

.item-card-horizontal {
    display: flex;
    width: 180px;
    height: 100px;
    background: rgb(51, 221, 162);
    border-radius: 12px;
    padding-left: 10px;
    padding-right: 10px;
    box-shadow: 0 0 12px rgb(129, 241, 9);
    margin-left: 30px ;
    margin-bottom: 30px ;
    align-items: center;
    gap: 10px;
}

.item-card-horizontal img {
    width: 50px;
    height: 50px;
    image-rendering: pixelated;
    border-radius: 8px;
}

.item-info {
    display: flex;
    flex-direction: column;

}

.item-name {
    color: rgba(226, 20, 241, 0.9);
    font-size: 1rem;
}

.item-price {

}

.card {
    display: flex;
    background-color: rgb(148, 48, 241);
    height: 150px;
    width: 600px;
    color: #f0f0f0;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 0 12px rgba(0, 0, 0, 0.3);
    max-width: 500px;

}

.card-image {

    object-fit: contain;
    background-color: #ffffff;
    padding: 10px;

}

.card-content {
    padding: 16px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.card-title {
    font-size: 1.4rem;
    margin: 0 0 8px 0;
}

.card-desc {
    font-size: 0.95rem;
    color: #ccc;
    margin-bottom: 8px;
}
.client-card {
    display: flex;
    background-color: #2a2a2a;
    width: 600px;
    height: 200px;
    border-radius: 12px;
    box-shadow: 0 0 12px rgba(0, 0, 0, 0.3);
    overflow: hidden;
    margin: 20px auto;
    color: #eee;
}
#client-card-meteor {
    display: flex;
    background-color: #7f1ecb;
    width: 600px;
    height: 200px;
    border-radius: 12px;
    box-shadow: 0 0 12px rgb(113, 17, 189);
    overflow: hidden;
    margin: 20px auto;
    color: #eee;
}

#client-card-ANPilot {
    display: flex;
    background-color: #e00000;
    width: 600px;
    height: 200px;
    border-radius: 12px;
    box-shadow: 0 0 12px rgb(113, 17, 189);
    overflow: hidden;
    margin: 20px auto;
    color: #eee;
}

#client-card-thunder{
    display: flex;
    background-color: #1ebdcb;
    width: 600px;
    height: 200px;
    border-radius: 12px;
    box-shadow: 0 0 12px rgb(17, 183, 189);
    overflow: hidden;
    margin: 20px auto;
    color: #eee;
}

#client-card-LiquidBounce{
    display: flex;
    background-color: #1b5dd6;
    width: 600px;
    height: 200px;
    border-radius: 12px;
    box-shadow: 0 0 12px rgb(20, 88, 216);
    overflow: hidden;
    margin: 20px auto;
    color: #eee;
}
#client-card-wrust{
    display: flex;
    background-color: #d6a11b;
    width: 600px;
    height: 200px;
    border-radius: 12px;
    box-shadow: 0 0 12px rgb(226, 184, 45);
    overflow: hidden;
    margin: 20px auto;
    color: #eee;
}

#main-section{
    display: flex;
    flex-direction: column;
    gap: 40px;
    padding: 60px;
    justify-content: center;

}


#main-section-1{
    display: flex;
    flex-direction: column;
    justify-content: center;

}

#client-card-Resource{
    display: flex;
    background-color: #d6a11b;
    width: 600px;
    height: 150px;
    border-radius: 12px;
    box-shadow: 0 0 12px rgb(226, 184, 45);
    overflow: hidden;
    margin: 20px auto;
    color: #eee;
}
.client-image {
    width: 200px;
    height: 200px;
    object-fit: fill;
    background-color: #ffffff;
}

#client-image-wurst{
    object-fit: contain;
    width: 200px;
    height: 200px;
    background-color: rgba(241, 145, 20, 0.9);

}

.client-info {
    padding: 16px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.client-title {
    font-size: 1.4rem;
    margin: 0 0 8px;
}

.client-desc {
    font-size: 0.95rem;
    color: #ccc;
    margin-bottom: 8px;
}

.client-tags {
    font-size: 1rem;
    color: #77ffbb;
}

#CustomKit-tips{

    display: flex;
    justify-items: center;

}