/* ==========================================
   JEUXENFLASH.FR - NEW DESIGN
   ========================================== */

/* RESET & BASE */
html,body,span,object,iframe,h1,h2,h3,h4,p,a,img,b,i,ol,ul,li,input,form,label,embed,audio,video,button{margin:0;padding:0;border:0}
html{font-family:Roboto,Arial,sans-serif;font-weight:400;font-size:13px;color:#555;background:#222}
body{position:relative;background:#222}
ol,ul,li{list-style:none}
img{vertical-align:middle}
button{cursor:pointer;user-select:none;outline:none;border:none;font-family:inherit;font-size:100%;text-transform:none;background:none}
a{color:#49b;text-decoration:none}
a:hover,a:active{color:#333;text-decoration:none}
a:focus{outline:none}
h1{font-size:20px}
h2{font-size:19px}

/* COLORS */
.color0{background-color:#393939}
.color1{background-color:#49c}
.color2{background-color:#7a3}
.color3{background-color:#b33}
.color4{background-color:#d73}
.color5{background-color:#76b}
.color6{background-color:#f59}
.color7{background-color:#3b9}
.color8{background-color:#e95}
.color9{background-color:#5ac}
.color-new{background-color:#43a047}
.color-hot{background-color:#e53935}
.color-top{background-color:#f59e0b}
.border0{border-color:#777}
.border1{border-color:#49b}
.border2{border-color:#7a3}
.border3{border-color:#b33}
.border4{border-color:#d73}
.border5{border-color:#76b}
.border6{border-color:#f59}
.border7{border-color:#3b9}
.border8{border-color:#e95}
.border9{border-color:#5ac}
.link0,.link0:hover{color:#49b}
.link1,.link1:hover{color:#49b}
.link2,.link2:hover{color:#7a3}
.link3,.link3:hover{color:#c55}
.link4,.link4:hover{color:#d73}
.link5,.link5:hover{color:#96b}
.link6,.link6:hover{color:#f59}
.link7,.link7:hover{color:#3b9}
.link8,.link8:hover{color:#e95}
.link9,.link9:hover{color:#5ac}

/* HEADER */
#header{position:fixed;z-index:11000;top:0;width:100%;display:flex;flex-wrap:wrap;align-items:stretch;background:linear-gradient(135deg,#1e5799 0%,#2989d8 50%,#1e5799 100%);box-shadow:0 2px 15px rgba(0,0,0,0.25);border-bottom:3px solid rgba(255,255,255,0.15)}
.headwrap{flex:1;display:flex;flex-direction:column}
nav{width:100%}
.headtop{position:relative;display:flex;justify-content:flex-end;align-items:center;height:45px;padding-right:15px}
.logo{position:relative;display:flex;align-items:center;padding:8px 20px;gap:8px;text-decoration:none;overflow:hidden;border-radius:8px;transition:background 0.3s ease}
.logo:hover{background:rgba(255,255,255,0.08)}
.logo-play{display:flex;align-items:center;justify-content:center;width:30px;height:30px;background:linear-gradient(135deg,#ffd700,#ff8c00);border-radius:50%;flex-shrink:0;position:relative;box-shadow:0 2px 8px rgba(255,140,0,0.4);transition:transform 0.3s ease,box-shadow 0.3s ease}
.logo-play::after{content:'';display:block;width:0;height:0;border-style:solid;border-width:6px 0 6px 10px;border-color:transparent transparent transparent #fff;margin-left:2px}
.logo:hover .logo-play{transform:scale(1.12);box-shadow:0 2px 14px rgba(255,140,0,0.7)}
.logo-text{font-size:28px;font-weight:800;color:#fff;letter-spacing:-0.5px;line-height:1;text-shadow:0 1px 4px rgba(0,0,0,0.25)}
.logo-en{font-weight:400;font-size:22px;color:rgba(255,255,255,0.6);margin:0 1px}
.logo-flash{background:linear-gradient(135deg,#ffd700,#ffaa00,#ff6b00);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;font-weight:900;letter-spacing:0.5px}
.logo-fr{font-size:12px;font-weight:800;color:#fff;background:rgba(255,255,255,0.15);padding:2px 7px;border-radius:5px;line-height:1.3;align-self:flex-start;margin-top:3px;border:1px solid rgba(255,255,255,0.2);transition:background 0.3s ease,color 0.3s ease}
.logo:hover .logo-fr{background:#ffd700;color:#1e5799;border-color:#ffd700}
.logo-bar{position:absolute;bottom:0;left:0;width:100%;height:2px;background:linear-gradient(90deg,transparent,#ffd700,#ff8c00,#ffd700,transparent);transform:scaleX(0);transition:transform 0.4s cubic-bezier(0.4,0,0.2,1)}
.logo:hover .logo-bar{transform:scaleX(1)}

/* HEADER STATS */
.head-stats{display:flex;align-items:center;gap:8px;margin-right:auto;padding-left:5px}
.stat-badge{display:flex;align-items:center;gap:5px;font-size:12px;color:rgba(255,255,255,0.85);background:rgba(0,0,0,0.2);padding:5px 12px;border-radius:20px;border:1px solid rgba(255,255,255,0.1)}
.stat-badge strong{color:#fff;font-size:13px}
.stat-badge span{font-size:14px}

/* SEARCH */
.search{position:relative;margin-right:10px}
.search-form-header{position:relative;display:flex;align-items:center}
.search-icon{position:absolute;left:13px;width:14px;height:14px;border:2.5px solid rgba(255,255,255,0.45);border-radius:50%;pointer-events:none;transition:border-color 0.2s ease;z-index:1}
.search-icon::after{content:'';position:absolute;bottom:-6px;right:-6px;width:2.5px;height:8px;background:rgba(255,255,255,0.45);border-radius:2px;transform:rotate(-45deg);transition:background 0.2s ease}
#search{width:300px;padding:10px 16px 10px 40px;border:2px solid transparent;background:rgba(255,255,255,0.12);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);font-size:14px;color:#fff;border-radius:50px;transition:all 0.3s cubic-bezier(0.4,0,0.2,1);outline:none}
#search:hover{background:rgba(255,255,255,0.2);border-color:rgba(255,255,255,0.15)}
#search:focus{background:rgba(255,255,255,0.95);color:#1e293b;border-color:#49b;box-shadow:0 0 0 4px rgba(68,153,187,0.25),0 4px 16px rgba(0,0,0,0.15)}
.search-form-header:focus-within .search-icon{border-color:#49b}
.search-form-header:focus-within .search-icon::after{background:#49b}
#search::placeholder{color:rgba(255,255,255,0.5);font-weight:400}
#search:focus::placeholder{color:#94a3b8}
#search::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none}

/* NAVIGATION */
#menu{display:flex;justify-content:center;align-items:center;gap:6px;padding:6px 10px;background:rgba(0,0,0,0.15)}
#menu li{text-align:center;flex:1;display:flex}
.navover a{flex:1;display:flex;align-items:center;justify-content:center;gap:4px;font-weight:600;font-size:13px;color:#444;padding:5px 8px;border-radius:6px;border-left:5px solid transparent;background:rgba(255,255,255,0.9);box-shadow:0 1px 3px rgba(0,0,0,0.15);transition:all 0.2s ease}
.navover a span{font-size:14px}
.navover a:hover{transform:translateY(-2px);box-shadow:0 3px 8px rgba(0,0,0,0.25);color:#fff}
.navover a.nav-action{border-left-color:#49b}
.navover a.nav-action:hover{background:#49b}
.navover a.nav-aventure{border-left-color:#7a3}
.navover a.nav-aventure:hover{background:#7a3}
.navover a.nav-arcade{border-left-color:#d73}
.navover a.nav-arcade:hover{background:#d73}
.navover a.nav-reflexion{border-left-color:#b33}
.navover a.nav-reflexion:hover{background:#b33}
.navover a.nav-shoot{border-left-color:#76b}
.navover a.nav-shoot:hover{background:#76b}
.navover a.nav-sport{border-left-color:#3b9}
.navover a.nav-sport:hover{background:#3b9}
.navover a.nav-strategie{border-left-color:#777}
.navover a.nav-strategie:hover{background:#666}
.navover a.nav-filles{border-left-color:#f59}
.navover a.nav-filles:hover{background:#f59}
.navover a.nav-3d{border-left-color:#5ac}
.navover a.nav-3d:hover{background:#5ac}
.navover a.nav-autres{border-left-color:#e95}
.navover a.nav-autres:hover{background:#e95}

/* BURGER MENU */
.burger-btn{display:none;flex-direction:column;justify-content:center;gap:5px;width:36px;height:36px;padding:6px;cursor:pointer;border-radius:6px;transition:background 0.2s}
.burger-btn:hover{background:rgba(255,255,255,0.15)}
.burger-btn span{display:block;width:100%;height:2px;background:#fff;border-radius:2px;transition:all 0.3s ease}
.burger-btn.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger-btn.open span:nth-child(2){opacity:0}
.burger-btn.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* MAIN */
#main{overflow:hidden;display:block;min-height:calc(100vh - 150px);margin-top:82px;padding-bottom:15px;
  background-color:#1a1a2e;
  background-image:
    linear-gradient(rgba(255,255,255,0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.03) 1px, transparent 1px),
    linear-gradient(rgba(255,255,255,0.015) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.015) 1px, transparent 1px);
  background-size: 60px 60px, 60px 60px, 15px 15px, 15px 15px}
.main{display:flex;justify-content:center}
.Hside{width:1390px;max-width:100%}
.hero-banner{margin:15px 7px 0 8px;border-radius:12px;background:linear-gradient(135deg,#1e5799 0%,#2989d8 40%,#207cca 70%,#1e5799 100%);position:relative;overflow:hidden;box-shadow:0 2px 12px rgba(30,87,153,0.3)}
.hero-banner::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 20% 50%,rgba(255,255,255,0.12) 0%,transparent 70%);pointer-events:none}
.hero-banner::after{content:'';position:absolute;top:-50%;right:-10%;width:200px;height:200px;background:radial-gradient(circle,rgba(255,215,0,0.15) 0%,transparent 70%);pointer-events:none}
.hero-content{position:relative;padding:22px 28px;text-align:center}
.hero-content h1{font-size:22px;font-weight:800;color:#fff;margin:0;line-height:1.3;text-shadow:0 1px 3px rgba(0,0,0,0.2)}
.hero-site{letter-spacing:-0.5px}
.hero-fr{color:#ffd700;font-weight:900}
.hero-sep{color:rgba(255,255,255,0.3);font-weight:300;margin:0 2px}
.hero-sub{font-weight:400;color:rgba(255,255,255,0.9);font-size:20px}
.hero-desc{margin:6px 0 0;font-size:13px;color:rgba(255,255,255,0.6);font-weight:400}
.section-block{overflow:hidden;background:#eee;border-radius:10px;margin:15px 7px 0 8px;box-shadow:0 0 12px rgba(0,0,0,0.3)}

/* HOME CATEGORIES */
.homecat{overflow:hidden;display:flex;align-items:center;justify-content:space-between;font-size:15px;border-radius:8px 8px 0 0;margin:0}
.hometitle{flex:1;color:#fff;padding:0 20px;font-size:17px;font-weight:700;line-height:44px;white-space:nowrap;letter-spacing:0.3px;margin:0}
.homesub,.homecat{display:flex;align-items:center}
.homesub a{display:flex;align-items:center;height:44px;font-weight:500;border-left:solid 1px rgba(255,255,255,0.15);color:rgba(255,255,255,0.8);padding:0 18px;transition:all 0.2s ease}
.homesub a:first-child{border:0}
.homesub a:hover{background:rgba(255,255,255,0.1);color:#fff}
.homesub span{margin-right:8px}
.morelink{display:flex;align-items:center;height:44px;font-weight:500;padding:0 15px;color:rgba(255,255,255,0.8);transition:all 0.2s ease}
.morelink:hover{color:#fff;background:rgba(255,255,255,0.1)}
.morelink .icon-arrow{opacity:0;margin-right:-1px}
.ar1{transition:all 0.2s ease}
.ar2{transition:all 0.4s ease}
.morecat{margin-left:5px;transition:all 0.2s ease}
.morelink:hover .morecat{margin-right:8px}
.morelink:hover .icon-arrow{opacity:1}
.subtop{color:rgba(255,255,255,0.9)}
.subhot{color:rgba(255,255,255,0.9)}
.subnew{color:rgba(255,255,255,0.9)}
.subhit{color:rgba(255,255,255,0.9)}

/* ICONS */
.icon-new:before{content:"⭐"}
.icon-hot:before{content:"🔥"}
.icon-top:before{content:"👍"}
.icon-pop:before{content:"📈"}
.icon-arrow:before{content:"➜"}
.icon-game:before{content:"🎮"}
.icon-action:before{content:"⚔️"}
.icon-aventure:before{content:"🗺️"}
.icon-arcade:before{content:"👾"}
.icon-reflexion:before{content:"🧩"}
.icon-shoot:before{content:"🎯"}
.icon-sport:before{content:"⚽"}
.icon-strategie:before{content:"♟️"}
.icon-autres:before{content:"🎬"}
.icon-3d:before{content:"🎲"}
.icon-filles:before{content:"💄"}

/* GAME CARDS */
.captions{display:flex;flex-wrap:wrap;justify-content:center;padding:15px 5px 0 5px;margin-bottom:15px}
.caption{overflow:hidden;position:relative;width:171px;margin:0 0 12px 12px;border-radius:12px;background:#fff;border-left:4px solid #49b;border-top:1px solid #e0e0e0;border-right:1px solid #e0e0e0;border-bottom:1px solid #d5d5d5;box-shadow:0 2px 8px rgba(0,0,0,0.1);transition:all 0.35s cubic-bezier(0.4,0,0.2,1);box-sizing:border-box}
.caption a{display:block;height:100%}
.caption .capimg{position:relative;overflow:hidden;height:100px}
.caption .capimg:after{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(to top,rgba(0,0,0,0.6) 0%,transparent 60%);opacity:1}
.caption img{transition:all 0.4s ease;width:100%;height:100px;object-fit:cover}
.caption .captag-overlay{position:absolute;bottom:8px;left:8px;z-index:2;font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:0.5px;color:#fff;background:rgba(0,0,0,0.5);padding:3px 8px;border-radius:4px;backdrop-filter:blur(4px)}
.capplays{position:absolute;bottom:8px;right:8px;z-index:2;font-size:10px;font-weight:600;color:#fff;background:rgba(0,0,0,0.5);padding:3px 8px;border-radius:4px;backdrop-filter:blur(4px)}
.capinfos{padding:10px 12px 12px 12px;background:#fff}
.captitle{font-size:13px;font-weight:700;color:#333;margin-bottom:6px;line-height:1.3;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.capdesc{font-size:11px;color:#777;line-height:1.4;margin-bottom:8px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:30px}

/* RATING BAR */
.rating-bar{display:flex;align-items:center;gap:6px}
.rating-note{font-size:12px;font-weight:700;color:#333;min-width:22px}
.bar-track{flex:1;height:6px;background:#e8e8e8;border-radius:3px;overflow:hidden}
.bar-fill{height:100%;border-radius:3px;transition:width 0.4s ease}
.bar-good{background:linear-gradient(90deg,#4caf50,#66bb6a)}
.bar-mid{background:linear-gradient(90deg,#ff9800,#ffb74d)}
.bar-low{background:linear-gradient(90deg,#f44336,#e57373)}
.caption:hover{transform:translateY(-8px);box-shadow:0 20px 40px rgba(0,0,0,0.2)}
.caption:hover img{transform:scale(1.1);filter:brightness(1.25)}
.caption:hover .captitle{color:#000}
.caphome{padding-top:10px}
.caphome .caption{margin:0 0 10px 10px}

/* CAPTION COLOR ACCENTS */
.caption.cap-action{border-left-color:#49b}
.caption.cap-action .captag-overlay{background:rgba(68,153,187,0.85)}
.caption.cap-aventure{border-left-color:#7a3}
.caption.cap-aventure .captag-overlay{background:rgba(119,170,51,0.85)}
.caption.cap-reflexion{border-left-color:#c44}
.caption.cap-reflexion .captag-overlay{background:rgba(187,51,51,0.85)}
.caption.cap-arcade{border-left-color:#e83}
.caption.cap-arcade .captag-overlay{background:rgba(221,119,51,0.85)}
.caption.cap-shoot{border-left-color:#76b}
.caption.cap-shoot .captag-overlay{background:rgba(119,102,187,0.85)}
.caption.cap-filles{border-left-color:#f59}
.caption.cap-filles .captag-overlay{background:rgba(255,85,153,0.85)}
.caption.cap-sport{border-left-color:#3b9}
.caption.cap-sport .captag-overlay{background:rgba(51,187,153,0.85)}
.caption.cap-strategie{border-left-color:#555}
.caption.cap-strategie .captag-overlay{background:rgba(57,57,57,0.85)}
.caption.cap-autres{border-left-color:#e95}
.caption.cap-autres .captag-overlay{background:rgba(238,153,85,0.85)}
.caption.cap-3d{border-left-color:#5ac}
.caption.cap-3d .captag-overlay{background:rgba(85,170,204,0.85)}

/* GAME THUMB */
.gamethumb{border-radius:6px;box-shadow:0 2px 5px rgba(0,0,0,0.1)}


/* RECENT SEARCHES */
.recent-searches{display:flex;flex-wrap:wrap;gap:8px;padding:15px;background:#fff;margin:0 15px 15px 15px;border-radius:0 0 8px 8px}
.search-tag{display:inline-flex;align-items:center;gap:4px;padding:6px 14px;font-size:12px;font-weight:500;color:#555;background:#f5f5f5;border:1px solid #e0e0e0;border-radius:20px;transition:all 0.2s ease}
.search-tag:hover{background:#49b;color:#fff;border-color:#49b}

/* CATEGORY MENU */
.cat-menu{list-style:none}
.cat-menu li{margin-bottom:3px}
.cat-menu a{display:flex;align-items:center;padding:8px 12px;border-radius:5px;color:#555;font-size:13px;font-weight:500;transition:0.2s ease}
.cat-menu a:hover{background:#f5f5f5;color:#333;padding-left:18px}
.cat-menu .cat-icon{margin-right:8px;font-size:14px}

/* SEO FOOTER DESCRIPTION */
.footdesc{text-align:justify;line-height:22px;padding:20px 25px;font-size:13px}
.footdesc h2{font-size:17px;color:#333;margin-bottom:12px;text-align:left}
.footdesc p{margin-bottom:8px;color:#666}
.footdesc a{color:#49b;font-weight:500}
.footdesc a:hover{color:#27a;text-decoration:underline}
.seo-cols{display:flex;gap:25px}
.seo-col{flex:1}

/* GAME PAGE */
.game-page{background:#fff;padding:20px}
.game-header{display:flex;gap:20px;margin-bottom:20px;align-items:flex-start}
.game-header-ad{flex-shrink:0;display:flex;align-items:center}
.game-thumb{position:relative;flex-shrink:0;width:112px;height:84px;border-radius:12px;overflow:hidden;border:3px solid #2989d8;box-shadow:0 0 0 2px rgba(41,137,216,0.15),0 4px 15px rgba(0,0,0,0.12);cursor:pointer;display:block;transition:transform 0.25s ease,box-shadow 0.25s ease,border-color 0.25s ease}
.game-thumb:hover{transform:scale(1.05);border-color:#1e5799;box-shadow:0 0 0 3px rgba(30,87,153,0.2),0 8px 25px rgba(30,87,153,0.3)}
.game-thumb img{width:100%;height:100%;object-fit:cover;transition:filter 0.25s ease}
.game-thumb:hover img{filter:brightness(0.7)}
.play-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity 0.25s ease}
.game-thumb:hover .play-overlay{opacity:1}
.play-icon{width:50px;height:50px;background:rgba(255,255,255,0.95);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:22px;color:#1e5799;box-shadow:0 4px 15px rgba(0,0,0,0.3);transition:transform 0.2s ease}
.game-thumb:hover .play-icon{transform:scale(1.1)}
.game-details{flex:1}
.game-title{font-size:22px;font-weight:700;color:#222;margin:0 0 10px 0}
.game-meta{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:12px}
.game-meta-item{display:inline-flex;align-items:center;gap:4px;font-size:13px;color:#666;background:#f5f5f5;padding:5px 12px;border-radius:20px;border:1px solid #e8e8e8}

/* GAME STATS CARDS */
.game-stats{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}
.game-stat-card{display:flex;flex-direction:column;align-items:center;gap:2px;padding:10px 16px;border-radius:10px;background:#f8f9fa;border:1px solid #e8e8e8;min-width:70px;transition:transform 0.2s,box-shadow 0.2s}
.game-stat-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,0.08)}
.stat-icon{font-size:20px;line-height:1}
.stat-label{font-size:10px;font-weight:600;color:#999;text-transform:uppercase;letter-spacing:0.5px}
.stat-value{font-size:14px;font-weight:700;color:#333}
.stat-genre{border-left:3px solid #49b}
.stat-plays{border-left:3px solid #4caf50}
.stat-plays .stat-icon{color:#4caf50}
.stat-votes{border-left:3px solid #ff9800}
.stat-votes .stat-icon{color:#ff9800}
.stat-size{border-left:3px solid #76b}
.stat-size .stat-icon{color:#76b}

/* GAME THUMB COLUMN */
.game-thumb-col{display:flex;flex-direction:column;align-items:center;flex-shrink:0;gap:8px}

/* SOCIAL SHARE */
.game-share{display:flex;align-items:center;justify-content:center;gap:6px}
.share-btn{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;color:#fff;transition:transform 0.2s,box-shadow 0.2s;cursor:pointer;text-decoration:none}
.share-btn:hover{transform:scale(1.15);box-shadow:0 3px 10px rgba(0,0,0,0.2)}
.share-btn:active{transform:scale(0.95)}
.share-facebook{background:#1877f2}
.share-twitter{background:#000}
.share-whatsapp{background:#25d366}
.share-copy{background:#666;border:none;padding:0}
.share-copy.copied{background:#4caf50}
.game-rating-big{max-width:250px;margin-bottom:12px}
.game-rating-big .rating-bar{gap:10px}
.game-rating-big .rating-note{font-size:16px;font-weight:700}
.game-rating-big .bar-track{height:10px;border-radius:5px}
.game-vote{font-size:13px;color:#555}

/* STAR RATING INTERACTIVE */
.star-rating{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.star-rating-stars{display:inline-flex;gap:4px;cursor:pointer}
.star-rating-stars .star{position:relative;width:32px;height:32px;cursor:pointer;transition:transform 0.15s ease}
.star-rating-stars .star:hover{transform:scale(1.2)}
.star-rating-stars .star svg{width:100%;height:100%;filter:drop-shadow(0 1px 2px rgba(0,0,0,0.1))}
.star-rating-stars .star svg .star-bg{fill:#ddd;transition:fill 0.2s ease}
.star-rating-stars .star.active svg .star-bg{fill:#ffc107}
.star-rating-stars .star.hovered svg .star-bg{fill:#ffdb4d}
.star-rating-stars[data-locked] .star{cursor:default}
.star-rating-stars[data-locked] .star:hover{transform:none}
.star-rating-stars[data-locked] .star.voted svg .star-bg{fill:#ff9800}
.star-rating-info{display:flex;flex-direction:column;gap:2px}
.star-rating-avg{font-size:22px;font-weight:700;line-height:1}
.star-rating-avg .avg-value{background:linear-gradient(135deg,#ff9800,#f57c00);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.star-rating-avg .avg-max{font-size:14px;font-weight:400;color:#999}
.star-rating-votes{font-size:12px;color:#888}
.star-rating-label{font-size:13px;font-weight:600;color:#666;margin-bottom:6px}
.star-rating-feedback{margin-top:6px;padding:8px 14px;border-radius:8px;font-size:13px;font-weight:500;animation:fadeSlideIn 0.3s ease}
.star-rating-feedback.success{background:#e8f5e9;color:#2e7d32;border:1px solid #c8e6c9}
.star-rating-feedback.error{background:#fff3e0;color:#e65100;border:1px solid #ffe0b2}
.star-rating-feedback.info{background:#e3f2fd;color:#1565c0;border:1px solid #bbdefb}
@keyframes fadeSlideIn{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}
.star-hover-label{font-size:12px;font-weight:600;color:#ff9800;min-width:60px;text-align:center;transition:opacity 0.15s}

/* GAME STATS BAR */
.game-stats-bar{display:flex;align-items:center;gap:12px;padding:12px 16px;background:linear-gradient(135deg,#f8f9fa,#fff);border-radius:10px;border:1px solid #eee;margin-bottom:15px;flex-wrap:wrap}
.game-stat{display:flex;align-items:center;gap:6px;font-size:13px;color:#555}
.game-stat-icon{font-size:16px}
.game-stat-value{font-weight:700;color:#333}
.game-ad-zone{background:#f0f0f0;border-radius:10px;padding:10px;margin-bottom:20px;display:flex;flex-direction:column;align-items:center}
.game-ad-zone .ad-leaderboard{margin:0;padding:8px;background:transparent;border-radius:0;min-height:auto}
.game-ad-zone .ad-game-wrapper{margin:0}
.game-container{display:flex;justify-content:center;align-items:center;background:transparent;padding:0;margin:0;min-height:0;max-width:100%;overflow:hidden}
.game-container object,.game-container embed,.game-container ruffle-player{max-width:100%}
.game-description{background:#f9f9f9;border-radius:8px;padding:18px 22px;border:1px solid #eee}
.game-description h2{font-size:16px;font-weight:700;color:#333;margin:0 0 8px 0}
.game-description p{font-size:14px;line-height:1.7;color:#555;margin:0}

/* BREADCRUMB */
.breadcrumb{display:flex;align-items:center;gap:8px;padding:12px 20px;background:#fff;font-size:13px;color:#888}
.breadcrumb a{color:#49b;font-weight:500;transition:color 0.2s}
.breadcrumb a:hover{color:#27a;text-decoration:underline}
.breadcrumb strong{color:#333;font-weight:600}
.breadcrumb-title{display:inline;font-size:13px;font-weight:600;color:#333;margin:0}
.breadcrumb span{color:#ccc}

/* PAGINATION */
.pagination{display:flex;justify-content:center;align-items:center;gap:6px;padding:15px;background:#fff}
.page-link{display:inline-flex;align-items:center;justify-content:center;min-width:36px;height:36px;padding:0 10px;font-size:13px;font-weight:600;color:#555;background:#f5f5f5;border:1px solid #e0e0e0;border-radius:8px;transition:all 0.2s ease}
.page-link:hover{background:#49b;color:#fff;border-color:#49b;transform:translateY(-1px);box-shadow:0 2px 6px rgba(68,153,187,0.3)}
.page-active{background:#49b;color:#fff;border-color:#49b;box-shadow:0 2px 8px rgba(68,153,187,0.3)}
.page-dots{color:#999;font-size:14px;padding:0 4px;user-select:none}

/* SEARCH PAGE */
.search-box{background:#fff;padding:20px}
.search-form{display:flex;gap:10px}
.search-input{flex:1;padding:12px 18px;font-size:15px;border:2px solid #e0e0e0;border-radius:8px;outline:none;transition:border-color 0.2s}
.search-input:focus{border-color:#49b;box-shadow:0 0 0 3px rgba(68,153,187,0.15)}
.search-btn{padding:12px 28px;font-size:14px;font-weight:600;color:#fff;background:#49b;border:none;border-radius:8px;cursor:pointer;transition:all 0.2s}
.search-btn:hover{background:#27a;box-shadow:0 2px 8px rgba(68,153,187,0.3)}
.search-noresult{padding:30px 25px;background:#fff;text-align:center;color:#666;font-size:14px;line-height:1.8}
.search-noresult ul{list-style:none;padding:0;margin:10px 0}
.search-noresult li{padding:3px 0}
.search-noresult li:before{content:'•';color:#49b;margin-right:8px}
.search-suggestions{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:12px}

/* CONTACT FORM */
.contact-form-wrap{background:#fff;padding:25px 30px}
.contact-form{display:flex;flex-direction:column;gap:18px}
.form-row{display:flex;gap:18px}
.form-row .form-group{flex:1}
.form-group{display:flex;flex-direction:column;gap:5px}
.form-group label{font-size:13px;font-weight:600;color:#444}
.form-group input,.form-group textarea{padding:10px 14px;font-size:14px;font-family:'Roboto',sans-serif;border:2px solid #e0e0e0;border-radius:8px;outline:none;transition:border-color 0.2s;resize:vertical}
.form-group input:focus,.form-group textarea:focus{border-color:#49b;box-shadow:0 0 0 3px rgba(68,153,187,0.12)}
.captcha-group{max-width:350px}
.captcha-group label{font-size:14px}
.captcha-input{max-width:100px;text-align:center;font-size:18px;font-weight:700;letter-spacing:2px}
.contact-submit{align-self:flex-start;padding:12px 35px;font-size:14px;font-weight:600;color:#fff;background:#49b;border:none;border-radius:8px;cursor:pointer;transition:all 0.2s}
.contact-submit:hover{background:#27a;box-shadow:0 3px 10px rgba(68,153,187,0.3);transform:translateY(-1px)}
.contact-msg{padding:15px 20px;border-radius:8px;font-size:14px;margin-bottom:15px;line-height:1.6}
.contact-msg-success{background:#e8f5e9;color:#2e7d32;border:1px solid #c8e6c9}
.contact-msg-error{background:#fce4ec;color:#c62828;border:1px solid #f8bbd0}

/* FOOTER */
#footer{display:flex;flex-direction:column;color:#aaa;border-top:solid 1px #111;background-color:#222}
#footer a,#footer span,#footer button{color:#aaa}
#footer a:hover,#footer button:hover{color:#fff}
.footer-partners{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px;padding:12px 20px;border-bottom:1px solid #333;font-size:12px}
.footer-partners a{color:#777;transition:color 0.2s}
.footer-partners a:hover{color:#49b;background:none}
.footer-partners span{color:#444;font-size:10px}
.footer-bottom{display:flex;align-items:center;min-height:47px;white-space:nowrap}
.contact,.cgu,.privacy{padding:0 30px;line-height:46px;text-align:center;border-left:solid 1px #333;transition:background 0.2s}
.contact:hover,.cgu:hover,.privacy:hover{background-color:#111}
.flag{padding:0 20px;border-left:solid 1px #333;display:flex;align-items:center;gap:10px}
.flag a{padding:5px 10px;border-radius:4px}
.flag a:hover{background:#333}
.flag a.active{background:#49b;color:#fff}
#copyright{flex-grow:1;display:flex;flex-direction:column;justify-content:center;padding:8px 40px;white-space:normal}
.footer-legal{display:block;font-size:11px;color:#555;margin-top:2px}

/* AD CONTAINERS */
.ad-container{display:flex;justify-content:center;align-items:center;overflow:hidden}
.ad-leaderboard{margin:8px 0;padding:8px;background:#f0f0f0;border-radius:8px;min-height:90px}
.ad-rectangle{padding:10px;background:#f0f0f0;border-radius:8px}
.ad-between{margin:15px 7px 0 8px;padding:12px;background:#f0f0f0;border-radius:10px}
.ad-game-wrapper{display:flex;justify-content:center;align-items:center;gap:0;margin-bottom:15px}
.ad-game-wrapper .game-container{flex:0 0 auto}
.ad-sky,.ad-vertical,.ad-button{flex-shrink:0}
.ad-inline{display:flex;justify-content:center;gap:15px;margin:15px 7px 0 8px;padding:12px;background:#f0f0f0;border-radius:10px}

/* PRESENTATION BOX */
.presentation{background:#fff;padding:20px;border-radius:10px;margin:15px;box-shadow:0 2px 8px rgba(0,0,0,0.1)}
.presentation h2{color:#333;margin-bottom:15px;font-size:18px}
.presentation p{color:#666;line-height:1.6;font-size:14px}

/* RESPONSIVE - LARGE DESKTOP */
@media only screen and (max-width:1500px){
  .Hside{width:1165px}
}

/* RESPONSIVE - DESKTOP */
@media only screen and (max-width:1200px){
  .Hside{width:940px}
}

/* RESPONSIVE - TABLET */
@media only screen and (max-width:992px){
  .Hside{width:100%;padding:0 10px;box-sizing:border-box}
  #main{padding-bottom:0;min-height:calc(100vh - 140px)}
  .section-block{margin:10px 5px 0 5px;border-radius:8px}
  .captions{justify-content:center;padding:10px 0}
  .caphome{padding-top:5px}
  .caption{width:152px;margin:6px}
  .caption .capimg{height:90px}
  .caption img{height:90px}
  .homecat{margin:10px 10px 0 10px}
  .hometitle{padding:0 15px;font-size:17px}
  .homesub a{padding:0 12px}
  .homesub span{display:none}
  #header{position:relative;height:auto;flex-direction:row;align-items:center;background:linear-gradient(180deg,#1e5799 0%,#2989d8 100%);flex-wrap:wrap}
  #main{margin-top:0}
  .logo{padding:8px 15px;gap:6px}
  .logo-play{width:26px;height:26px}
  .logo-play::after{border-width:5px 0 5px 9px}
  .logo-text{font-size:22px}
  .logo-en{font-size:18px}
  .logo-fr{font-size:10px;padding:1px 5px}
  .headwrap{flex:1;min-width:0}
  .headtop{height:auto;padding:10px 15px;justify-content:flex-end;align-items:center;gap:8px}
  .head-stats{margin-right:auto;padding-left:0}
  #search{width:200px;padding:9px 10px 9px 36px}
  .burger-btn{display:flex}
  nav{width:100%;max-height:0;overflow:hidden;transition:max-height 0.3s ease}
  nav.menu-open{max-height:500px}
  #menu{flex-wrap:wrap;justify-content:center;gap:6px;padding:10px 12px;background:rgba(0,0,0,0.2)}
  .navover a{font-size:13px;padding:10px 14px}
  .navover a span{font-size:15px}
  .ad-leaderboard{margin:10px 5px 0 5px}
  .ad-between{margin:10px 5px 0 5px}
  .ad-inline{margin:10px 5px 0 5px}
  .ad-game-wrapper{flex-direction:column}
  .ad-sky,.ad-vertical,.ad-button{display:none}
  .game-header-ad{display:none}
  #footer{padding:0}
  .footer-partners{padding:10px 15px;gap:4px;font-size:11px}
  .footer-bottom{flex-wrap:wrap;height:auto;padding:10px 0}
  #copyright{width:100%;text-align:center;padding:5px 10px;order:3}
  .contact,.cgu,.privacy{padding:0 15px;line-height:36px;border:none}
  .flag{border:none;width:100%;justify-content:center;padding:5px 0}
}

/* RESPONSIVE - MOBILE LARGE */
@media only screen and (max-width:768px){
  .caption{width:138px;margin:5px}
  .caption .capimg{height:80px}
  .caption img{height:80px}
  .captitle{font-size:12px}
  .capdesc{font-size:10px;-webkit-line-clamp:2;min-height:28px}
  .capinfos{padding:8px 10px 10px 10px}
  .rating-note{font-size:11px}
  .bar-track{height:5px}
  .capplays{font-size:9px;padding:2px 6px}
  .homesub{display:none}
  .homecat{justify-content:center;margin:8px 5px 0 5px}
  .hometitle{padding:0 10px;font-size:16px}
  .morelink{display:none}
  #search{width:160px;font-size:13px;padding:8px 10px 8px 34px}
  .search-icon{left:10px;width:12px;height:12px}
  .search-icon::after{height:6px}
  .logo-play{width:22px;height:22px}
  .logo-play::after{border-width:4px 0 4px 7px}
  .logo-text{font-size:20px}
  .logo-en{font-size:16px}
  .logo-fr{font-size:10px;padding:1px 4px}
  .navover a{font-size:13px;padding:9px 12px}
  .navover a span{font-size:14px}
  #menu{gap:5px;padding:8px 10px}
  .presentation{margin:10px;padding:15px}
  .presentation h2{font-size:16px}
  .presentation p{font-size:13px}
  .seo-cols{flex-direction:column;gap:10px}
  .form-row{flex-direction:column;gap:12px}
  .contact-form-wrap{padding:20px 15px}
  .contact-submit{width:100%}
  .game-header{flex-direction:column;gap:15px;align-items:center}
  .game-thumb-col{width:auto}
  .game-thumb{width:150px;height:112px}
  .game-container{padding:0}
  .game-page{padding:15px}
  .star-rating-stars .star{width:28px;height:28px}
  .star-rating-avg{font-size:18px}
}

/* RESPONSIVE - MOBILE */
@media only screen and (max-width:576px){
  .caption{width:calc(50% - 20px);margin:5px;border-radius:10px}
  .caption .capimg{height:70px}
  .caption img{height:70px}
  .captitle{font-size:11px}
  .capdesc{display:none}
  .capinfos{padding:8px}
  .captag-overlay{font-size:9px;padding:2px 6px}
  .capplays{font-size:8px;padding:2px 5px}
  .rating-note{font-size:10px}
  .bar-track{height:4px}
  .hometitle{font-size:14px;line-height:36px}
  .game-title{font-size:18px}
  .game-meta{gap:6px}
  .game-meta-item{font-size:11px;padding:4px 10px}
  .game-stats{gap:5px}
  .game-stat-card{padding:7px 10px;min-width:auto}
  .stat-icon{font-size:15px}
  .stat-label{font-size:9.5px}
  .stat-value{font-size:11.5px}
  .share-btn{width:30px;height:30px}
  .share-btn svg{width:14px;height:14px}
  .game-page{padding:12px}
  .game-description{padding:14px 16px}
  .star-rating{gap:10px}
  .star-rating-stars .star{width:26px;height:26px}
  .star-rating-stars{gap:2px}
  .star-rating-avg{font-size:16px}
  .star-rating-info{gap:0}
  .logo{padding:6px 10px;gap:5px}
  .logo-play{width:20px;height:20px}
  .logo-play::after{border-width:4px 0 4px 7px}
  .logo-text{font-size:18px}
  .logo-en{font-size:15px}
  .logo-fr{font-size:9px;padding:1px 4px}
  .headtop{padding:8px 10px;gap:6px}
  .head-stats{display:none}
  .search{margin:0;flex:1;max-width:200px}
  #search{width:100%;padding:8px 10px 8px 32px;font-size:12px}
  .search-icon{left:9px;width:11px;height:11px}
  .search-icon::after{height:5px}
  .footer-partners{padding:8px 10px;gap:3px;font-size:10px}
  #footer{text-align:center}
  .contact,.cgu,.privacy{padding:0 10px;font-size:12px}
  .flag a{font-size:12px;padding:4px 8px}
  #copyright{font-size:11px}
  .footer-legal{font-size:10px}
  #menu{gap:4px;padding:6px 8px}
  .navover a{font-size:12px;padding:8px 10px}
  .navover a span{font-size:13px}
}

/* RESPONSIVE - MOBILE SMALL */
@media only screen and (max-width:400px){
  .caption{width:calc(50% - 14px);margin:3px;padding:3px}
  .caption img{height:50px}
  .captitle{font-size:10px}
  .logo-play{width:18px;height:18px}
  .logo-play::after{border-width:3px 0 3px 6px}
  .logo-text{font-size:16px}
  .logo-en{font-size:13px}
  .logo-fr{font-size:9px;padding:0 3px}
  .navover a{font-size:11px;padding:7px 8px}
  .navover a span{font-size:12px}
  #menu{gap:3px;padding:5px}
}
