*{box-sizing:border-box}body{padding:0;background-color:gray}#root{height:100%;width:100%;padding:0}ul{margin:1rem;padding:0}.login-modal{position:fixed;z-index:999;top:0;left:0;width:100%;min-height:100vh;background-color:#00000080;display:none;justify-content:center;align-items:center}.login-modal.open{display:flex;flex-direction:column}.modal-close-button{position:absolute;top:1rem;right:1rem}.login-container{position:relative;background-color:#f0f8ff;border-radius:1rem;min-width:20rem}.login-form-title{display:flex;justify-content:center}.login-form{display:flex;flex-direction:column;gap:.5rem;padding:1rem}.login-input{height:2rem}.log-button{background-color:#6495ed}.errors{padding:0;margin:0;font-weight:700;color:red}.header{display:flex;justify-content:center;align-items:center;flex-direction:row;gap:1rem}.app-title{display:flex;justify-content:center;font-size:2rem}.login-button{padding:1.3em 3em;font-size:12px;text-transform:uppercase;letter-spacing:2.5px;font-weight:500;color:#000;background-color:#fff;border:none;border-radius:1rem;box-shadow:0 8px 15px #0000001a;transition:all .3s ease 0s;cursor:pointer;outline:none}.login-button:hover{background-color:#09f;box-shadow:0 15px 20px #6daaff66;color:#fff;transform:translateY(-7px)}.login-button:active{transform:translateY(-1px)}.product-list-container{display:flex;justify-content:center;align-items:center}.product-list{margin:1rem;list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(20rem,1fr));gap:1rem}.card{border-radius:1rem;overflow:hidden;background-color:#fff;padding:1rem;height:35rem}.product-header{height:4rem;overflow:hidden}.product-title{font-size:1rem}.img-container{width:100%;height:50%;overflow:hidden;display:flex;justify-content:center;align-items:center}.product-img{width:100%;display:flex;align-items:center;justify-content:center}.product-price{color:green;font-size:2rem;display:flex;justify-content:space-between}.cart-button-add{border-radius:100%;border:none}.cart-button-add:hover{box-shadow:#2d23424d 0 4px 8px,#2d234233 0 7px 13px -3px,#09f 0 -3px inset;transform:translateY(-2px)}.cart-button-add:active{-webkit-animation:squeeze3124 .9s both;animation:squeeze3124 .9s both}@-webkit-keyframes squeeze3124{0%{-webkit-transform:scale3d(1,1,1);transform:scaleZ(1)}30%{-webkit-transform:scale3d(1.25,.75,1);transform:scale3d(1.25,.75,1)}40%{-webkit-transform:scale3d(.75,1.25,1);transform:scale3d(.75,1.25,1)}50%{-webkit-transform:scale3d(1.15,.85,1);transform:scale3d(1.15,.85,1)}65%{-webkit-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}75%{-webkit-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}to{-webkit-transform:scale3d(1,1,1);transform:scaleZ(1)}}@keyframes squeeze3124{0%{-webkit-transform:scale3d(1,1,1);transform:scaleZ(1)}30%{-webkit-transform:scale3d(1.25,.75,1);transform:scale3d(1.25,.75,1)}40%{-webkit-transform:scale3d(.75,1.25,1);transform:scale3d(.75,1.25,1)}50%{-webkit-transform:scale3d(1.15,.85,1);transform:scale3d(1.15,.85,1)}65%{-webkit-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}75%{-webkit-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}to{-webkit-transform:scale3d(1,1,1);transform:scaleZ(1)}}.footer{position:fixed;left:16px;bottom:16px;text-align:left;background:rgba(0,0,0,.7);color:#f0f8ff;padding:8px 24px;border-radius:32px;opacity:.95;backdrop-filter:blur(8px)}.footer span{font-size:14px;color:#09f;opacity:.8}.footer h4,.footer h5{margin:0;display:flex}.cart{background:#000;display:none;padding:32px;position:fixed;right:0px;top:0px;width:300px;overflow-y:scroll;z-index:99}.cart-title{padding:.5rem;width:100%}.cart img{aspect-ratio:16/9;width:100%}.cart li{border-bottom:1px solid #444;padding-bottom:16px}.cart footer{display:flex;gap:8px;justify-content:center;align-items:center}.cart footer button{padding:8px}.cart-button{align-items:center;background:#09f;border-radius:100%;cursor:pointer;display:flex;justify-content:center;padding:4px;position:fixed;right:8px;top:8px;transition:all .3s ease;width:4rem;z-index:9999}.cart-button:hover{scale:1.1}.cart-button~input:checked~.cart{height:100%;display:block}.filters{display:flex;justify-content:space-between;align-items:center;margin:2rem}.filter{font-size:1.5rem}.modal{position:fixed;z-index:999;top:0;left:0;width:100%;min-height:100vh;background-color:#00000080;display:none;justify-content:center;align-items:center}.modal.open{display:flex}.modal-container{position:relative;background-color:#f0f8ff;min-width:25rem;overflow-y:auto}.modal-close-button{position:absolute;top:1rem;right:1rem;background:transparent}:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}