:root{--color-primary: #e76f51;--color-secondary: #fff0c0;--color-tertiary: #00268f;--color-alternate: #89898b;--color-text-primary: #14181b;--color-text-secondary: #ffffff;--color-bg-primary: #fff8f8;--color-bg-secondary: #fdf6ec;--color-accent-1: #d6d843;--color-accent-2: #fb3200;--color-success: #00b8cb;--color-error: #d20000;--color-warning: #f9cf58;--color-info: #ffffff}*,*:before,*:after{box-sizing:border-box}html{overflow-x:hidden}body{margin:0;font-family:Montserrat,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#fdf6ec;color:var(--color-text-primary);overflow-x:hidden;width:100%}h1,h2,h3,h4,h5,h6{font-family:Rubik,sans-serif}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.game-styled-title{display:inline-block;background-color:var(--color-secondary);color:var(--color-text-primary);padding:.8rem 2rem;border:2px solid var(--color-text-primary);border-radius:12px;box-shadow:4px 4px 0 var(--color-primary);font-family:Rubik,sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:1px;margin-bottom:2rem;font-size:1.8rem;position:relative;transition:transform .2s ease,box-shadow .2s ease}.game-styled-title:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--color-primary)}@media(max-width:768px){.game-styled-title{font-size:1.3rem;padding:.6rem 1.2rem;box-shadow:3px 3px 0 var(--color-primary)}}.App{padding-top:80px;min-height:100vh;display:flex;flex-direction:column}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.site-header{background-color:var(--color-bg-primary);border-bottom:1px solid var(--color-secondary);padding:.5rem 0;position:fixed;top:0;left:0;z-index:1000;box-shadow:0 2px 4px #0000000d;width:100%;max-width:100vw}.header-container{max-width:1200px;margin:0 auto;padding:0 1rem;display:flex;align-items:center;justify-content:space-between}.header-left{display:flex;align-items:center;gap:.75rem}.mobile-menu-toggle{display:none;background:none;border:none;cursor:pointer;color:var(--color-text-primary);padding:.5rem}.logo{font-size:1.5rem;font-weight:800;color:var(--color-primary);text-decoration:none;letter-spacing:-1px;text-shadow:2px 2px 4px rgba(0,0,0,.2)}.main-nav{display:flex;gap:1.5rem;align-items:center;flex-wrap:nowrap}.mobile-user-menu{display:none}@media(min-width:769px)and (max-width:1024px){.main-nav{gap:.8rem}.nav-link{font-size:.85rem;gap:.2rem}}.nav-link{display:flex;align-items:center;gap:.4rem;text-decoration:none;color:var(--color-text-primary);font-weight:500;font-size:.95rem;transition:color .2s}.nav-link:hover{color:var(--color-primary)}.nav-link.active{color:var(--color-primary);font-weight:700}.header-actions,.user-actions{display:flex;align-items:center;gap:1rem}.user-avatar{width:32px;height:32px;border-radius:50%;background-color:var(--color-primary);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px}.icon-btn{background:none;border:none;cursor:pointer;color:var(--color-text-primary);padding:.5rem;border-radius:50%;transition:background-color .2s,color .2s;display:flex;align-items:center;justify-content:center}.icon-btn:hover{background-color:var(--color-secondary);color:var(--color-primary)}.cart-btn{position:relative;overflow:visible}.cart-badge{position:absolute;top:-2px;right:-2px;background-color:#ef4444;color:#fff;font-size:.7rem;font-weight:700;width:18px;height:18px;border-radius:50%;display:flex;align-items:center;justify-content:center;border:2px solid white;z-index:10;box-shadow:0 2px 4px #0003;animation:badge-pop .3s cubic-bezier(.175,.885,.32,1.275)}@keyframes bump{0%{transform:scale(1)}10%{transform:scale(.9)}30%{transform:scale(1.1)}50%{transform:scale(1.15)}to{transform:scale(1)}}.bump{animation:bump .3s ease-out}@keyframes badge-pop{0%{transform:scale(0)}80%{transform:scale(1.2)}to{transform:scale(1)}}.search-wrapper{position:relative;display:flex;align-items:center;width:40px;height:40px;justify-content:center}.search-form{display:flex;align-items:center;background:transparent;border:1px solid transparent;border-radius:20px;padding:0;box-shadow:none;width:100%;height:100%;transition:all .2s;justify-content:center;cursor:pointer}.search-wrapper.active .search-form{position:absolute;right:0;width:300px;background:#fff;border:1px solid #ddd;box-shadow:0 4px 12px #0000001a;padding:4px 8px;justify-content:flex-start;z-index:100}.search-input-header{border:none;outline:none;padding:6px 8px;font-size:.9rem;flex-grow:1;background:transparent;min-width:0;display:none}.search-wrapper.active .search-input-header{display:block}.search-submit-btn{padding:8px;color:var(--color-text-primary);background:transparent;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center}.search-submit-btn:hover{color:var(--color-primary)}.search-suggestions{position:absolute;top:100%;right:0;width:300px;background:#fff;border-radius:8px;box-shadow:0 4px 12px #0000001a;margin-top:8px;overflow:hidden;z-index:1000;border:1px solid #eee}.suggestion-item{display:flex;align-items:center;gap:10px;padding:8px 12px;cursor:pointer;transition:background-color .2s;border-bottom:1px solid #f5f5f5}.suggestion-item:last-child{border-bottom:none}.suggestion-item:hover{background-color:#f8f9fa}.suggestion-image{width:32px;height:32px;object-fit:cover;border-radius:4px;background-color:#eee}.suggestion-name{font-size:.9rem;color:var(--color-text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.logo-img{height:32px;width:auto}@media(max-width:768px){.mobile-menu-toggle{display:block}.header-smiley,.logo{display:none}.logo-img{height:24px}.header-actions{gap:.5rem}.main-nav{position:fixed;top:73px;left:0;width:100%;height:calc(100vh - 73px);background-color:var(--color-bg-primary);flex-direction:column;align-items:flex-start;padding:2rem;gap:1.5rem;transform:translate(-100%);transition:transform .3s ease-in-out,visibility .3s;border-top:1px solid var(--color-secondary);z-index:99;visibility:hidden}.main-nav.mobile-open{transform:translate(0);visibility:visible;box-shadow:0 4px 6px #0000001a}.nav-link{font-size:1.2rem;width:100%;padding:.5rem 0;border-bottom:1px solid rgba(0,0,0,.1)}.mobile-user-menu{display:flex;flex-direction:column;width:100%;gap:1.5rem;margin-top:1rem;padding-top:1rem;border-top:2px solid var(--color-secondary)}.logout-link,.login-link{background:none;border:none;font-family:inherit;cursor:pointer;text-align:left;padding:.5rem 0;width:100%;border-bottom:1px solid rgba(0,0,0,.1)}.header-actions .user-actions,.header-actions .icon-btn[aria-label=Connexion],.header-actions .search-btn{display:none}.user-actions{gap:.5rem}.search-wrapper{position:relative}.search-form{width:36px;height:36px;padding:0;border:none;background:transparent;box-shadow:none;justify-content:center;cursor:pointer;transition:all .3s ease}.search-input-header{display:none;width:0;padding:0}.search-submit-btn{padding:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:var(--color-text-primary)}.search-wrapper.active .search-form{width:220px;background:#fff;border:1px solid var(--color-secondary);padding:4px 8px;box-shadow:0 4px 12px #00000026;position:absolute;right:0;top:-2px;z-index:100;justify-content:flex-start}.search-wrapper.active .search-input-header{display:block;width:100%;padding:6px 8px}.search-wrapper.active .search-submit-btn{width:auto;height:auto}.search-suggestions{width:220px}}.header-smiley{margin-left:12px;display:flex;align-items:center;cursor:pointer;padding:5px}.smiley-eyes{display:flex;gap:6px;position:relative}.smiley-eye{width:22px;height:22px;background-color:#fff;border-radius:50%;border:2px solid var(--color-text-primary);position:relative;overflow:hidden;transition:height .1s ease-in-out,border-width .1s;box-shadow:inset 1px 1px 3px #0000001a}.smiley-iris{width:12px;height:12px;background:radial-gradient(circle at 30% 30%,#4f46e5,#312e81);border-radius:50%;position:absolute;top:50%;left:50%;margin-top:-6px;margin-left:-6px;transition:transform .05s linear;display:flex;align-items:center;justify-content:center}.smiley-pupil{width:5px;height:5px;background-color:#000;border-radius:50%}.smiley-glint{position:absolute;top:2px;right:2px;width:3px;height:3px;background-color:#fff;border-radius:50%;opacity:.9;box-shadow:0 0 2px #fffc}.smiley-eyelid{position:absolute;top:0;left:0;width:100%;height:0%;background-color:var(--color-text-primary);transition:height .2s ease-in-out;z-index:2}.smiley-eyes.closed .smiley-eyelid{height:100%}.smiley-eyes.closed .smiley-eye{height:4px;border-radius:2px;background-color:var(--color-text-primary);border:none;margin-top:9px}.smiley-eyes.closed .smiley-iris{display:none}.loading-dots{animation:pulse 1.5s infinite;font-size:12px;letter-spacing:1px}@keyframes pulse{0%{opacity:.3}50%{opacity:1}to{opacity:.3}}.game-banner-container{width:100%;height:150px;background:linear-gradient(to right,var(--color-secondary),var(--color-bg-secondary));position:relative;overflow:hidden;box-shadow:0 4px 10px #0000001a;margin-bottom:2rem;border-bottom:3px solid var(--color-primary)}.game-banner-track{display:flex;width:max-content;animation:scrollMarquee 60s linear infinite;align-items:center;height:100%}.banner-game-item{position:relative;width:90px;height:90px;border-radius:50%;overflow:hidden;border:3px solid white;box-shadow:0 4px 8px #0003;margin:0 20px;flex-shrink:0;cursor:pointer;transition:all .3s ease;background-color:#fff}.banner-game-item:hover{transform:scale(1.1);border-color:var(--color-primary);box-shadow:0 0 15px #e76f5199;z-index:10}.banner-game-item img{width:100%;height:100%;object-fit:contain;padding:5px;transition:transform .3s ease}@keyframes scrollMarquee{0%{transform:translate(0)}to{transform:translate(-50%)}}.simple-loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%;min-height:300px;color:var(--color-primary)}.simple-spinner{width:50px;height:50px;border:5px solid var(--color-secondary);border-top:5px solid var(--color-primary);border-radius:50%;animation:spin 1s linear infinite;margin-bottom:1rem}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.simple-loading-text{font-family:Rubik,sans-serif;font-weight:500;color:var(--color-text-primary);animation:pulse 1.5s infinite}.route-placeholder{padding:2rem}.auth-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.auth-modal-content{background-color:#fff;padding:2rem;border-radius:12px;width:100%;max-width:450px;position:relative;box-shadow:0 10px 25px #0000001a;max-height:90vh;overflow-y:auto}.auth-modal-close{position:absolute;top:1rem;right:1rem;background:none;border:none;cursor:pointer;color:var(--color-alternate)}.auth-tabs{display:flex;margin-bottom:2rem;border-bottom:2px solid var(--color-bg-secondary)}.auth-tab{flex:1;padding:1rem;background:none;border:none;font-size:1.1rem;font-weight:600;color:var(--color-alternate);cursor:pointer;transition:all .3s}.auth-tab.active{color:var(--color-primary);border-bottom:2px solid var(--color-primary);margin-bottom:-2px}.auth-form{display:flex;flex-direction:column;gap:1rem}.form-group{display:flex;flex-direction:column;gap:.5rem}.form-group label{font-size:.9rem;font-weight:500;color:var(--color-text-primary)}.form-group input{padding:.75rem;border:1px solid #ddd;border-radius:6px;font-size:1rem}.form-group input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 2px #e76f511a}.auth-submit-btn{background-color:var(--color-primary);color:#fff;padding:.75rem;border:none;border-radius:6px;font-size:1rem;font-weight:600;cursor:pointer;margin-top:1rem;transition:background-color .2s}.auth-submit-btn:hover{background-color:#d65f41}.auth-divider{display:flex;align-items:center;text-align:center;margin:1.5rem 0;color:var(--color-alternate)}.auth-divider:before,.auth-divider:after{content:"";flex:1;border-bottom:1px solid #ddd}.auth-divider span{padding:0 10px;font-size:.9rem}.social-login{display:flex;flex-direction:column;gap:.75rem}.social-btn{display:flex;align-items:center;justify-content:center;gap:.75rem;padding:.75rem;border:1px solid #ddd;border-radius:6px;background-color:#fff;font-weight:500;cursor:pointer;transition:background-color .2s}.social-btn:hover{background-color:var(--color-bg-primary)}.forgot-password{text-align:right;font-size:.9rem}.forgot-password a{color:var(--color-primary);text-decoration:none}.checkbox-group{flex-direction:row;align-items:flex-start;gap:.75rem}.checkbox-group input{margin-top:.25rem}.checkbox-group label{font-size:.85rem;line-height:1.4}.site-footer{background-color:#2d3436;color:#dfe6e9;padding:3rem 2rem;margin-top:4rem}.footer-content{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:2rem}.footer-section h3{color:#fab1a0;margin-bottom:1.5rem;font-size:1.2rem}.footer-section ul{list-style:none;padding:0}.footer-section ul li{margin-bottom:.8rem}.footer-section a{color:#dfe6e9;text-decoration:none;transition:color .2s}.footer-section a:hover{color:#fab1a0}.social-links{display:flex;flex-direction:column;gap:.8rem}.payment-info p{margin-bottom:.5rem;font-size:.9rem;opacity:.8}.footer-bottom{text-align:center;margin-top:3rem;padding-top:2rem;border-top:1px solid rgba(255,255,255,.1);font-size:.8rem;opacity:.6}.cart-notification{position:fixed;top:100px;right:20px;background-color:#fff;border:3px solid var(--color-text-primary);border-radius:16px;padding:1rem;box-shadow:6px 6px 0 var(--color-primary);z-index:1000;display:flex;align-items:center;gap:1rem;max-width:350px;pointer-events:none;pointer-events:auto}.cart-notification-image{width:60px;height:60px;object-fit:contain;border-radius:8px;background-color:#f3f4f6;border:2px solid var(--color-text-primary)}.cart-notification-content{flex:1}.cart-notification-title{font-family:Rubik,sans-serif;font-weight:700;font-size:.9rem;margin:0 0 .25rem;color:var(--color-text-primary)}.cart-notification-message{font-size:.8rem;color:var(--color-alternate);margin:0;display:flex;align-items:center;gap:.5rem}.cart-notification-check{color:var(--color-success);background-color:#00b8cb1a;padding:2px;border-radius:50%}@media(max-width:768px){.cart-notification{top:auto;bottom:20px;right:20px;left:20px;max-width:none}}.leaves-animation-container{position:fixed;top:0;left:0;width:100vw;height:100vh;pointer-events:none;z-index:9999;overflow:hidden}.leaf-particle{position:absolute;left:-100px;opacity:0;animation:wind-blow linear forwards}@keyframes wind-blow{0%{transform:translate(0) translateY(0) rotate(0);opacity:0}10%{opacity:1}90%{opacity:1}to{transform:translate(120vw) translateY(20vh) rotate(720deg);opacity:0}}.smash-animation-container{position:fixed;top:0;left:0;width:100vw;height:100vh;pointer-events:none;z-index:9999;overflow:hidden}.trumpet-left,.trumpet-right{position:absolute;bottom:0;font-size:8rem;animation:trumpet-pop .5s cubic-bezier(.175,.885,.32,1.275) forwards}.trumpet-left{left:-100px;animation-name:trumpet-enter-left}.trumpet-right{right:-100px;animation-name:trumpet-enter-right}.trumpet-icon{display:block}.trumpet-icon.flipped{transform:scaleX(-1)}@keyframes trumpet-enter-left{0%{left:-150px;transform:rotate(-45deg)}to{left:20px;transform:rotate(-15deg)}}@keyframes trumpet-enter-right{0%{right:-150px;transform:rotate(45deg)}to{right:20px;transform:rotate(15deg)}}.confetti-particle{position:absolute;top:-20px;width:10px;height:10px;animation:confetti-fall 2.5s linear forwards}@keyframes confetti-fall{0%{transform:translateY(0) rotate(0);opacity:1}to{transform:translateY(100vh) rotate(720deg);opacity:0}}.dragon-animation-container{position:fixed;top:0;left:0;width:100vw;height:100vh;pointer-events:none;z-index:9999;overflow:hidden}.fire-overlay{position:absolute;bottom:0;left:0;width:100%;height:100%}.fire-bottom{position:absolute;bottom:-50px;left:0;width:100%;height:40%;display:flex;justify-content:center}.flame-particle{position:absolute;bottom:0;width:100px;height:100px;background:radial-gradient(circle,#ffc800,#ff5000cc 40%,#f000 70%);border-radius:50% 0 50% 50%;transform:rotate(-45deg);filter:blur(10px);opacity:0;animation:riseFire 1s ease-in forwards}.fire-glow{position:absolute;bottom:0;left:0;width:100%;height:30%;background:linear-gradient(to top,rgba(255,69,0,.4),transparent);animation:glowPulse 2s infinite alternate}@keyframes riseFire{0%{transform:translateY(0) scale(1) rotate(-45deg);opacity:0}20%{opacity:.8}to{transform:translateY(-100vh) scale(2) rotate(-45deg);opacity:0}}@keyframes glowPulse{0%{opacity:.3;height:30%}to{opacity:.6;height:40%}}
