@charset "utf-8";
*{box-sizing:border-box;margin:0;padding:0;}
        .carousel{position:relative;width:100%;max-width:820px;border-radius:24px;background:#ccc;box-shadow:0 20px 25px -10px #00000080;overflow:hidden;}
        .carousel-track{display:flex;transition:transform 0.3s ease;list-style:none;}
        .carousel-slide{flex:0 0 100%;background:#ccc;}
        .carousel-slide img{width:100%;height:auto;display:block;aspect-ratio:16/9;object-fit:cover;user-select:none;}
        .carousel-btn{position:absolute;top:50%;transform:translateY(-50%);background:#ffffffb3;border:none;width:44px;height:44px;border-radius:50%;font-size:32px;font-weight:500;color:#1e1e2f;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 10px #0000004d;transition:all 0.15s;z-index:10;line-height:1;}
        .carousel-btn:hover{background:#fff;transform:translateY(-50%) scale(1.05);}
        .prev-btn{left:16px;}
        .next-btn{right:16px;}
        .carousel-dots{position:absolute;bottom:16px;left:0;right:0;display:flex;justify-content:center;gap:12px;z-index:10;}
        .dot{width:12px;height:12px;border-radius:50%;background:#ffffff80;border:1px solid #0000001a;cursor:pointer;transition:all 0.2s;}
        .dot.active{background:#fff;width:28px;border-radius:20px;}
        .dot:hover{background:#fffc;}
        @media (max-width:480px){.carousel-btn{width:36px;height:36px;font-size:28px;}.prev-btn{left:8px;}.next-btn{right:8px;}}
/* CSS Document */