/* Crisp live lettering next to the native DOFUS mark. */
#brand{isolation:isolate;filter:drop-shadow(0 5px 1px #30264665)}
#brand .logo-word>b{display:flex;align-items:center;gap:0;color:#ffd45a;text-shadow:none;-webkit-text-stroke:5px #302b49;paint-order:stroke fill;filter:drop-shadow(0 4px 0 #302b49);padding-right:7px}
#brand .logo-word>b>span{display:inline-block;transform-origin:50% 85%;animation:bonk-letter 6.4s ease-in-out infinite;text-shadow:0 2px 0 #ffec98}
#brand .logo-word>b>span:nth-child(2){animation-delay:.13s;transform:rotate(3deg)}
#brand .logo-word>b>span:nth-child(3){animation-delay:.26s;transform:rotate(-4deg)}
#brand .logo-word>b>span:nth-child(4){animation-delay:.39s;transform:rotate(4deg)}
#brand .logo-word>img{filter:drop-shadow(0 2px 0 #302d3835);animation:dofus-breathe 7s ease-in-out infinite;transform-origin:55% 80%}
#brand>small{display:block!important;font-weight:1000;text-shadow:0 2px 2px #274b42;letter-spacing:2.4px}
#brand>small i{display:inline-block;box-shadow:0 2px 0 #b95e46,0 0 0 2px #fff4;transform:rotate(-3deg)}
#brand:before,#brand:after{content:'✦';position:absolute;z-index:2;color:#fff4b1;-webkit-text-stroke:0;text-shadow:0 0 7px #ffe57c;font-size:20px;pointer-events:none;animation:brand-sparkle 5s ease-in-out infinite}
#brand:before{top:12%;left:32%}#brand:after{top:36%;right:-1%;font-size:12px;animation-delay:2.1s}
#brand:hover .logo-word>b>span{animation-duration:1.4s}
.browsing #brand .logo-word>b{gap:0;-webkit-text-stroke:2px #302b49;filter:drop-shadow(0 1px 0 #302b49)}
.browsing #brand>small,.browsing #brand:before,.browsing #brand:after{display:none!important}
.nav{position:relative}.nav:after{content:'';pointer-events:none;position:absolute;inset:2px;border-radius:10px;border-top:1px solid #fff9}
.play-main:after,.play-endless:after{inset:3px;border-top:2px solid #fffa;border-bottom:1px solid #302c431c}
@keyframes bonk-letter{0%,8%,24%,100%{translate:0 0}13%{translate:0 -7px;rotate:-4deg}18%{translate:0 1px;rotate:2deg}}
@keyframes dofus-breathe{0%,100%{transform:rotate(0) scale(1)}50%{transform:rotate(-1.3deg) scale(1.018)}}
@keyframes brand-sparkle{0%,38%,70%,100%{opacity:0;transform:scale(.25) rotate(-20deg)}48%,57%{opacity:1;transform:scale(1) rotate(10deg)}}
@media(max-width:600px){#brand .logo-word>b{-webkit-text-stroke:4px #302b49}#brand>small{letter-spacing:1.4px}}
@media(prefers-reduced-motion:reduce){#brand .logo-word>img,#brand .logo-word>b>span,#brand:before,#brand:after{animation:none!important}#brand:before,#brand:after{display:none}}