body{background:linear-gradient(180deg, #f9f9ff 0%, #f3f6ff 100%);color:#222;font-family:"Poppins",sans-serif;transition:background .5s ease;margin:0;padding:0}.container{width:90%;max-width:1200px;margin:0 auto}.header{position:fixed;top:0;left:0;width:100%;z-index:1000;background:linear-gradient(90deg, rgba(255, 255, 255, 0.85), rgba(248, 249, 255, 0.85));backdrop-filter:blur(15px);border-bottom:1px solid rgba(160,180,255,.25);box-shadow:0 8px 20px rgba(120,100,255,.1);transition:all .4s ease}.header:hover{background:hsla(0,0%,100%,.95);box-shadow:0 10px 25px rgba(150,130,255,.15)}.header .container{display:flex;justify-content:space-between;align-items:center}.header .logo{font-size:22px;font-weight:700;background:linear-gradient(90deg, #7b5cff, #ff66b3);background-clip:text;-webkit-background-clip:text;color:rgba(0,0,0,0);-webkit-text-fill-color:rgba(0,0,0,0);letter-spacing:.5px}.header .nav ul{display:flex;gap:25px;list-style:none;margin:0;padding:0}.header .nav ul a{text-decoration:none;color:#333;font-weight:500;transition:color .3s ease}.header .nav ul a:hover{color:#7b5cff;text-shadow:0 0 8px rgba(123,92,255,.3)}.header .icons i{margin-left:20px;cursor:pointer;font-size:18px;color:#555;transition:color .3s ease}.header .icons i:hover{color:#7b5cff}main{padding-top:100px}section.slider{background:linear-gradient(145deg, #fafaff, #f0f4ff);border-radius:16px;box-shadow:0 10px 25px rgba(100,50,255,.05);transition:all .3s ease}.slider{position:relative;display:flex;justify-content:center;align-items:center;background:#f3f3f3;border-radius:20px;padding:40px 60px;margin:40px auto;max-width:1200px;box-shadow:0 6px 15px rgba(0,0,0,.05)}.slider .slider__image img{display:block;width:100%;max-width:900px;border-radius:12px;transition:opacity .6s ease,transform .6s ease}.slider .slider__right{display:flex;flex-direction:column;justify-content:space-between;margin-left:30px;gap:20px}.slider .slider__block{display:flex;justify-content:center;align-items:center;writing-mode:vertical-rl;text-align:center;color:#fff;font-weight:600;width:70px;height:200px;border-radius:10px;font-size:14px;text-decoration:none;box-shadow:0 4px 8px rgba(0,0,0,.1);transition:transform .2s ease,opacity .2s ease}.slider .slider__block:hover{background:hsla(0,0%,100%,.95);box-shadow:0 10px 25px rgba(150,130,255,.15)}.slider .slider__block--blue{background:#9db5ff}.slider .slider__block--pink{background:#ff73b3}.slider .slider__dots{display:flex;gap:8px;position:absolute;bottom:15px;left:50%;transform:translateX(-50%)}.slider .slider__dot{width:10px;height:10px;border-radius:50%;background:#ddd;cursor:pointer;transition:background .3s ease,transform .2s ease}.slider .slider__dot.active{background:#f06;transform:scale(1.2)}.slider .slider__dot:hover{background:#f48}.fade-in{animation:fadeIn .8s ease forwards}.fade-out{animation:fadeOut .8s ease forwards}@keyframes fadeIn{from{opacity:0;transform:scale(1.02)}to{opacity:1;transform:scale(1)}}@keyframes fadeOut{from{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(0.98)}}.content{display:flex;justify-content:center;gap:40px;padding:20px 10%}.categories{width:200px}.categories h3{margin-bottom:15px}.categories ul{list-style:none;margin:0;padding:0}.categories ul li{padding:10px;cursor:pointer;border-radius:6px}.categories ul li.active,.categories ul li:hover{background:#f06;color:#fff}.books{flex:1}.books #book-list{display:grid;grid-template-columns:repeat(auto-fill, minmax(180px, 1fr));gap:20px}.books .book{background:#fff;border-radius:8px;padding:10px;text-align:center;box-shadow:0 2px 6px rgba(0,0,0,.1);transition:transform .2s ease}.books .book:hover{transform:translateY(-5px)}.books .book img{width:100%;height:250px;object-fit:cover;border-radius:6px}.books .book h3{font-size:16px;margin:10px 0 5px}.books .book p{color:#666;font-size:14px;margin:0 0 10px}.books .book .book__btn{background:#f06;color:#fff;border:none;padding:8px 12px;border-radius:6px;cursor:pointer;font-weight:600}.books .book .book__btn:hover{background:#d0055e}.books #load-more{display:block;margin:30px auto;background:none;border:2px solid #f06;color:#f06;font-weight:600;padding:10px 20px;border-radius:8px;cursor:pointer}.books #load-more:hover{background:#f06;color:#fff}.cart{position:relative;display:inline-flex;align-items:center;justify-content:center}.cart #cart-count{position:absolute;top:30px;right:-8px;background:#f06;color:#fff;font-size:11px;font-weight:600;width:18px;height:18px;display:flex;align-items:center;justify-content:center;border-radius:50%;box-shadow:0 1px 3px rgba(0,0,0,.2);transform:scale(1);transition:transform .2s ease,opacity .2s ease}.book__btn.added{background:#ccc !important;color:#333 !important;cursor:pointer}#toast-container{position:fixed;bottom:20px;right:20px;display:flex;flex-direction:column;gap:10px;z-index:1000}.toast{background:#f06;color:#fff;padding:12px 18px;border-radius:8px;box-shadow:0 4px 10px rgba(0,0,0,.15);font-weight:600;opacity:0;transform:translateY(20px);animation:slideUp .5s forwards}@keyframes slideUp{to{opacity:1;transform:translateY(0)}}.book__rating{color:#f06;font-weight:600;margin:5px 0;font-size:14px}.book__stars{letter-spacing:1px}.book__reviews{color:#777;font-size:12px;margin-left:4px}.book__price{font-weight:700;color:#333;margin:5px 0 10px}.book__desc{color:#666;font-size:14px;margin-bottom:10px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3;overflow:hidden}.book{opacity:0;transform:translateY(8px);animation:bookIn .35s ease forwards}@keyframes bookIn{to{opacity:1;transform:translateY(0)}}.book{opacity:0;transform:translateY(20px);animation:slideUpBook .6s ease forwards}.book:nth-child(2n){animation-delay:.1s}.book:nth-child(3n){animation-delay:.2s}@keyframes slideUpBook{to{opacity:1;transform:translateY(0)}}.book__btn{transition:all .4s ease,transform .2s ease}.book__btn.added{background:#ccc !important;color:#333 !important;transform:scale(0.95)}.book__btn:not(.added){background:#f06;color:#fff}.book__btn:active{transform:scale(0.9)}@keyframes pulse{0%{transform:scale(1);background-color:#f06}50%{transform:scale(1.1);background-color:#ff4081}100%{transform:scale(1);background-color:#ccc}}.book__btn{transition:all .4s ease,transform .2s ease}.book__btn.added{background:#ccc !important;color:#333 !important;transform:scale(1);animation:pulse .6s ease}.book__btn:not(.added){background:#f06;color:#fff}.book__btn:hover{transform:scale(1.05)}.book__btn:active{transform:scale(0.95)}#toast-container{position:fixed;bottom:25px;right:25px;display:flex;flex-direction:column;align-items:flex-end;gap:10px;z-index:9999}.toast{display:flex;align-items:center;gap:10px;font-weight:600;color:#fff;padding:14px 20px;border-radius:12px;box-shadow:0 6px 18px rgba(0,0,0,.25);opacity:0;transform:translateY(40px);animation:toastIn .5s forwards;transition:opacity .4s ease,transform .4s ease;min-width:240px;text-align:left;cursor:default;user-select:none}.toast__icon{font-size:20px;flex-shrink:0}.toast--success{background:#4caf50}.toast--error{background:#e53935}.toast--info{background:#f06}@keyframes toastIn{0%{opacity:0;transform:translateY(40px)}60%{opacity:1;transform:translateY(-6px)}100%{opacity:1;transform:translateY(0)}}.toast.hide{opacity:0;transform:translateY(40px);transition:opacity .5s ease,transform .5s ease}.toast:hover{filter:brightness(1.05);transform:scale(1.03)}@media(max-width: 992px){.header .container{flex-direction:column;gap:10px}.nav ul{gap:15px;flex-wrap:wrap;justify-content:center}.slider{flex-direction:column;padding:30px}.slider__image img{max-width:100%}.slider__right{flex-direction:row;justify-content:center;margin-top:20px}.slider__block{writing-mode:horizontal-tb;width:auto;height:60px;padding:0 20px}.content{flex-direction:column;padding:0 5%}.categories{width:100%;text-align:center;margin-bottom:20px}.categories ul{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}.categories ul li{padding:8px 16px}}@media(max-width: 600px){body{font-size:14px}.header{padding:10px 0}.header .logo{font-size:18px}.slider{padding:20px;margin:20px auto}.slider__block{font-size:12px;height:50px}.books #book-list{grid-template-columns:repeat(auto-fill, minmax(140px, 1fr));gap:15px}.book img{height:200px}.book h3{font-size:14px}.book p{font-size:12px}#load-more{padding:8px 16px;font-size:14px}.toast{font-size:13px;padding:10px 15px;min-width:200px}}@media(max-width: 400px){.nav ul{flex-direction:column;gap:5px}.slider__block{font-size:11px;padding:0 12px}.book img{height:180px}.book__btn{font-size:12px;padding:6px 10px}}.cart-page{max-width:900px;margin:40px auto;background:#fff;padding:30px;border-radius:12px;box-shadow:0 4px 15px rgba(0,0,0,.05)}.cart-page h2{text-align:center;margin-bottom:30px}.cart-page .cart-item{display:flex;align-items:center;gap:20px;border-bottom:1px solid #eee;padding:15px 0}.cart-page .cart-item img{width:100px;border-radius:6px}.cart-page .cart-item__info{flex:1}.cart-page .cart-item__info h3{margin:0 0 5px;font-size:18px}.cart-page .cart-item__info p{margin:4px 0;color:#555}.cart-page .cart-item__info .price{color:#f06;font-weight:600}.cart-page .cart-item__info .remove-btn{background:#f06;color:#fff;border:none;padding:6px 12px;border-radius:6px;cursor:pointer;font-weight:600;transition:.3s}.cart-page .cart-item__info .remove-btn:hover{background:#d0055e}.cart-page #checkout-btn,.cart-page #clear-cart-btn{display:inline-block;margin:20px 10px 0 10px;padding:10px 20px;border:none;border-radius:8px;font-weight:600;cursor:pointer;transition:.3s}.cart-page #checkout-btn{background:#4caf50;color:#fff}.cart-page #checkout-btn:hover{background:#3e8e41}.cart-page #clear-cart-btn{background:#f06;color:#fff}.cart-page #clear-cart-btn:hover{background:#d0055e}.cart{background:#fafafa;padding:40px 0}.cart .cart-item{display:flex;align-items:center;background:#fff;border-radius:12px;padding:15px;margin-bottom:20px;box-shadow:0 2px 6px rgba(0,0,0,.1)}.cart .cart-item img{width:100px;height:140px;object-fit:cover;border-radius:8px;margin-right:20px}.cart .cart-item .cart-item__info{flex:1}.cart .cart-item .cart-item__info h3{margin:0 0 5px}.cart .cart-item .cart-item__info p{margin:3px 0}.cart .cart-item .cart-item__info .cart-item__price{font-weight:700;color:#f06}.cart .cart-item .remove-btn{background:#f06;color:#fff;border:none;border-radius:8px;padding:8px 14px;cursor:pointer;font-weight:600;transition:.3s}.cart .cart-item .remove-btn:hover{background:#d0055e}.cart #clear-cart,.cart #checkout{margin:10px;background:#333;color:#fff;border:none;padding:12px 20px;border-radius:8px;cursor:pointer;font-weight:600;transition:.3s}.cart #clear-cart:hover,.cart #checkout:hover{background:#000}.burger{display:none;flex-direction:column;justify-content:center;cursor:pointer;width:30px;height:25px;gap:5px;z-index:20}.burger span{background:#333;height:3px;width:100%;border-radius:3px;transition:all .3s ease}.burger.active span:nth-child(1){transform:rotate(45deg) translate(5px, 5px)}.burger.active span:nth-child(2){opacity:0}.burger.active span:nth-child(3){transform:rotate(-45deg) translate(6px, -6px)}.nav{position:relative}.nav ul{display:flex;gap:25px;list-style:none;margin:0;padding:0}.nav ul li a{text-decoration:none;color:#333;font-weight:500;transition:color .3s ease}.nav ul li a:hover{color:#f06}.overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.5);opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease;z-index:9}.overlay.show{opacity:1;visibility:visible}@media(max-width: 992px){.burger{display:flex}.nav ul{position:absolute;right:10px;top:70px;background:#fff;flex-direction:column;align-items:flex-start;padding:15px 20px;border-radius:10px;box-shadow:0 6px 18px rgba(0,0,0,.15);opacity:0;transform:translateY(-10px);pointer-events:none;transition:all .4s ease}.nav.open ul{opacity:1;transform:translateY(0);pointer-events:auto}.nav ul li{margin:10px 0}.nav ul li a{color:#333;font-size:16px;display:block;width:100%}}.burger span{transition:all .4s ease}.burger.active span:nth-child(1){transform:rotate(45deg) translateY(8px)}.burger.active span:nth-child(2){opacity:0}.burger.active span:nth-child(3){transform:rotate(-45deg) translateY(-8px)}@keyframes menuSlide{0%{opacity:0;transform:translateY(-15px)}100%{opacity:1;transform:translateY(0)}}.nav.open ul{animation:menuSlide .4s ease forwards}nav a{color:#4a4a6a;transition:color .3s ease}nav a:hover{color:#7b5cff}body{background:linear-gradient(180deg, #f9f9ff 0%, #f3f6ff 100%);color:#222;font-family:"Poppins",sans-serif;transition:background .5s ease}.container{width:90%;max-width:1200px;margin:0 auto}.header{background:linear-gradient(90deg, rgba(255, 255, 255, 0.85), rgba(248, 249, 255, 0.85));backdrop-filter:blur(15px);border-bottom:1px solid rgba(160,180,255,.25);box-shadow:0 8px 20px rgba(120,100,255,.1);transition:all .4s ease}.header:hover{background:hsla(0,0%,100%,.95);box-shadow:0 10px 25px rgba(150,130,255,.15)}.header .container{display:flex;justify-content:space-between;align-items:center}.header .logo{font-size:22px;font-weight:700;background:linear-gradient(90deg, #7b5cff, #ff66b3);background-clip:text;-webkit-background-clip:text;color:rgba(0,0,0,0);-webkit-text-fill-color:rgba(0,0,0,0);letter-spacing:.5px}.header .nav ul{display:flex;gap:25px;list-style:none;margin:0;padding:0}.header .nav ul a{text-decoration:none;color:#333;font-weight:500;transition:color .3s ease}.header .nav ul a:hover{color:#7b5cff;text-shadow:0 0 8px rgba(123,92,255,.3)}.header .icons i{margin-left:20px;cursor:pointer;font-size:18px;color:#555;transition:color .3s ease}.header .icons i:hover{color:#7b5cff}section.slider{background:linear-gradient(145deg, #fafaff, #f2f5ff);border-radius:20px;box-shadow:0 15px 35px rgba(100,80,255,.08);transition:all .4s ease}section.slider:hover{box-shadow:0 20px 40px rgba(120,100,255,.12)}.slider{position:relative;display:flex;justify-content:center;align-items:center;background:#f7f7fb;border-radius:20px;padding:40px 60px;margin:40px auto;max-width:1200px;box-shadow:0 10px 25px rgba(150,130,255,.08)}.slider .slider__image img{display:block;width:100%;max-width:900px;border-radius:12px;transition:opacity .6s ease,transform .6s ease}.slider .slider__dots{display:flex;gap:8px;position:absolute;bottom:15px;left:50%;transform:translateX(-50%)}.slider .slider__dot{width:10px;height:10px;border-radius:50%;background:#ccc;cursor:pointer;transition:background .3s ease,transform .2s ease}.slider .slider__dot.active{background:#7b5cff;transform:scale(1.3)}.slider .slider__dot:hover{background:#ff66b3}.header{position:fixed;top:0;left:0;width:100%;z-index:1000}main{padding-top:100px}
