.secondaryNavCont{margin-block-end:0}.hero{margin-block-end:6em;padding-block-start:3.5em;padding-inline:2vw;position:relative;overflow:hidden;& #heroBG{flex-direction:column;align-items:center;min-height:20vh;max-height:60vh;display:flex;position:relative}& #imageLightning{z-index:-1;filter:blur(2em);opacity:0;transition:opacity 3s;position:absolute;scale:1.1}& img{border:min(2vw,10px) solid #222;border-radius:1em;height:100%;margin:auto}& input{width:min(20ch,80%);margin-block-start:.5em}& #nameValidated{font-size:0;transition:all .5s}& #nameValidated.validated{font-size:1em}& #heroText{color:#fff;pointer-events:none;place-content:center;font-size:min(2.5em,8vw);display:grid;position:absolute;inset:0;& span{--border-width:2px;background-color:var(--main-transparent-semi);backdrop-filter:blur(5px)brightness(.5);box-shadow:0 0 0 var(--border-width) var(--main-color);padding-inline:.5ch}& span:first-child{justify-self:start;margin-inline-end:1ch;animation:1s forwards heroTextSlideRight}& span:nth-child(2){justify-self:end;margin-block-start:var(--border-width);margin-inline-start:1ch;animation:1s .5s both heroTextSlideLeft}}& .CTA{text-transform:uppercase;background-color:var(--main-color);color:#fff;box-shadow:0 .2em 1em var(--main-transparent-semi);transition:opacity .2s linear, scale 1s linear(0, .013 0.6%, .05 1.2%, .199 2.5%, .395 3.7%, .948 6.7%, 1.201 8.4%, 1.289 9.2%, 1.354 10%, 1.396 10.8%, 1.416 11.6%, 1.418 12.2%, 1.405 12.9%, 1.345 14.3%, 1.258 15.6%, 1.012 18.8%, .909 20.5%, .851 22%, .826 23.6%, .83 24.8%, .854 26.2%, .996 30.8%, 1.039 32.5%, 1.063 34%, 1.073 35.5%, 1.061 38.2%, .984 44.4%, .97 47.4%, .973 49.8%, 1.004 55.8%, 1.013 59.2%, .995 71%, 1.002 82.8%, 1);border-radius:10px;margin:1em;padding:.5em 1em;font-size:1.2em;text-decoration:none}& .CTA:hover{opacity:.8;scale:1.1}}@keyframes heroTextSlideRight{0%{opacity:0;translate:-2ch -.5em}}@keyframes heroTextSlideLeft{0%{opacity:0;translate:2ch .5em}}.hero:hover #imageLightning{opacity:.5}h2{text-align:center;& svg,& span{vertical-align:middle}}@media (prefers-reduced-motion:no-preference){#recentGamesOuterCont{scroll-behavior:smooth}}#recentGamesOuterCont{background-color:var(--main-transparent);border:2px var(--main-transparent-semi) ridge;text-align:start;scrollbar-width:thin;border-radius:10px;width:min(95%,40ch);max-height:20em;margin:auto;padding:.5em;overflow:auto;& #recentGamesContainer{width:100%}& td:first-child{border-inline-end:1px dashed;width:4ch;padding-inline-end:.5ch}& td:nth-child(2){padding-inline-start:.5ch}& .recentGameAppear{transform-origin:4.5ch 0;animation:recentAppear .4s calc(.1s * var(--animDelay)) both;animation-timing-function:linear(0, .013 1%, .051 2.2%, .404 9.8%, .51 12.6%, .602 15.5%, .683 18.7%, .754 22.2%, .813 26%, .861 30.2%, .9 34.8%, .931 40%, .972 52.7%, .992 70.2%, 1);transition:all .5s;& a{color:inherit;text-decoration:none}& .gameTypeIcon{margin-left:1ch}}& .recentGameAppear:hover{background-color:var(--main-transparent-really)}& #loadMoreHistory{width:100%;margin:0}}@keyframes recentAppear{0%{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)}}#errorGetLastGame{margin-inline:auto;width:min(95%,40ch);margin-top:2px;font-size:1.2rem}#statsContainer{text-align:center;background-image:linear-gradient(90deg,#8881,#8881),linear-gradient(#0000,#940c8922);border:2px ridge #8882;border-radius:2em;gap:1em;margin-block:4em;padding:1em;display:grid;& .numberFont{font-size:clamp(1rem,5vw,1.5em)}& .iiicons{font-size:1.5em}& .statsGroup{background-color:var(--main-transparent-semi);color:#fff;background-image:radial-gradient(at 100% 100%,#0002 40%,#0000);border-radius:10px;padding:1em}& #gamesStats{& #percentGameFound{text-align:end;color:var(--main-color);background-color:#fffc;border-radius:0 5px 5px 0;margin-block:.5em;padding-inline-end:1ch;font-size:.8em}& #nbGamesTotal{justify-content:center;align-items:center;gap:.6ch;margin-block-end:.5em;display:flex}& .gameRepartition{gap:.5em;margin-block:.5em;display:flex;overflow-x:auto;container:game-stat/inline-size;&>div{writing-mode:vertical-lr;border-radius:5px;justify-content:end;align-items:center;gap:.5ch;padding:.5em;display:flex;& a{color:inherit}& .numberFont{writing-mode:horizontal-tb}}& #partFlash{color:#000;background-color:#94bfff}& #partSimilarities{color:#000;background-color:#e6ff94}& #partClassic{background-color:#fff2;flex:1}}}& .partGreen{color:#000;background-color:#75ff75bf}& .partYellow{color:#000;background-color:#e6ff75bf}& .partOrange{color:#000;background-color:#ffcf75bf}& .partRed{color:#000;background-color:#ff8575bf}& #cluesStats{& .clueType{gap:.5em;margin:0;margin-block-start:.5em;padding:0;list-style-type:none;display:grid;&>li{background-color:#fff2;border-radius:5px;justify-content:center;align-items:center;gap:1ch;padding:.2em .5em;display:flex}& svg{height:1.5em}}}& #nbPlayerByDiffStats{container:diff-stat/inline-size;& .foundByPlayersRepartition{gap:.5em;margin-block:.5em;display:flex;overflow-x:auto;&>div{border-radius:5px;justify-content:center;align-items:center;gap:.5ch;padding:.5em;display:flex}& .numberFont{font-size:1em}}}& .indivStatCont{justify-content:center;align-items:center;gap:.6ch;display:flex}}#history,#rules,#suggestStarTitle,#stats,#about{scroll-margin-top:5em}.aboutCardCont{max-width:80ch;margin:auto;font-size:1.2rem}#rulesContainer{text-align:left;background-image:linear-gradient(90deg,#8881,#8881),linear-gradient(#0000,#92940c22);border:2px ridge #8882;border-radius:2em;gap:1em;margin-block:4em;padding:1em;display:grid;position:relative}#suggestStarTitle path{transition:all 1s;fill:gold!important;fill-opacity:0!important}#suggestStarTitle:hover path{animation:.5s starBlink;fill-opacity:1!important}@keyframes starBlink{0%,to{stroke-width:18.8976px}50%{stroke-width:30px}}#suggestFutureGameContainer{text-align:start;background-image:linear-gradient(90deg,#8881,#8881),linear-gradient(#0000,#0c946722);border:2px ridge #8882;border-radius:2em;gap:1em;margin-block:4em;padding:1em}#suggestFutureGameFormOuter{grid-template-rows:1fr;transition:all 1s;display:grid}#suggestFutureGameFormInner{overflow:hidden}#suggestFutureGameFormOuter.close{grid-template-rows:0fr}#suggestFutureGameContainer input{text-align:start}#searchResultCont{flex-wrap:wrap;justify-content:center;max-height:50vh;display:flex;overflow:auto}#searchLibraryDialog:popover-open{flex-direction:column;gap:.5em;padding-top:4em;display:flex}.searchResult{background-color:#8883;border-radius:5em;margin:.3em;padding:.3em 1em}#futureGameSuggestionFeedback{width:fit-content;margin-inline:auto}#aboutContainer{grid-template-columns:repeat(auto-fill,minmax(min(35ch,100%),1fr));align-items:start;gap:4em 2em;display:grid}.aboutCard{background-image:linear-gradient(to right, #8881, #8881), linear-gradient(to bottom, transparent, var(--main-transparent));animation:appear 1s calc(.1s * var(--anim-delay)) both;border:2px ridge #8882;border-radius:1em;flex-direction:column;padding:1em;transition:transform .5s;display:flex;position:relative;&:hover{transform:rotate(calc(var(--start-angle) * .1))}}@keyframes appear{0%{translate:-200px;rotate:var(--start-angle,10deg);opacity:0}to{opacity:1}}.aboutCard h3{text-align:center;text-transform:uppercase;letter-spacing:2px;margin-block-start:0}#aboutFlash h3,#aboutSimilarites h3{justify-content:center;align-items:center;gap:1ch;display:flex}.aboutCard .gameTypeIcon{height:1.5em}.aboutCardPic{flex-direction:column;justify-content:center;display:flex}.aboutCardText{text-align:justify}@media screen and (width<=900px){#statNbGames{flex-direction:column}}@media screen and (width<=1000px){.aboutCard{grid-template-columns:1fr}}@media print{.gameRepartition>div,.foundByPlayersRepartition>div{border:1px solid}}
