@import url('https://fonts.googleapis.com/css2?family=Cinzel+Decorative:wght@700&display=swap');
header.b2{position:sticky;top:0;z-index:5;overflow:hidden;padding:12px 16px!important;min-height:118px;display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;contain:paint}
header.b2 h1{font-family:"Cinzel Decorative",Cinzel,Georgia,serif!important;font-variant:normal!important;font-size:1.05rem!important;line-height:1.2;color:#f3dc8a!important;text-shadow:0 0 4px #000,0 2px 0 #000!important;position:relative;z-index:3;flex:1 1 60%;margin:0}
header.b2 select{position:relative;z-index:6;max-width:80%;box-shadow:0 0 0 3px #0008}
header.b2 .tag{font:600 .74rem/1.3 "Segoe UI",system-ui,sans-serif;color:#fff;background:#000c;padding:3px 9px;border-radius:4px;position:relative;z-index:3;order:3;flex-basis:100%;max-width:fit-content;min-height:1.3em}
header.b2 .art{position:absolute;inset:0;z-index:1;pointer-events:none;width:100%;height:100%}
header.b2 svg *{transform-box:fill-box}
@media(min-width:900px){header.b2{min-height:150px;padding:18px max(16px,calc((100vw - 1200px)/2))!important}header.b2 h1{font-size:1.9rem!important}header.b2 .tag{font-size:.95rem}}
@media(max-width:600px){header.b2{max-height:140px}}
/* D dragon */
header.bD{background:linear-gradient(#06060a,#1d1207)!important;border-bottom:4px solid #e0a526!important}
.dragon{filter:drop-shadow(0 0 6px #ffb34088);animation:swoop 8s cubic-bezier(.45,.05,.55,.95) infinite;will-change:transform}
@keyframes swoop{0%{transform:translate(-260px,40px) scale(.8)}45%{transform:translate(420px,-10px) scale(1)}100%{transform:translate(1250px,30px) scale(.8)}}
.wingU{animation:flap .5s ease-in-out infinite alternate;transform-origin:bottom center}
.wingL{animation:flap .5s ease-in-out infinite alternate-reverse;transform-origin:top center;opacity:.7}
@keyframes flap{from{transform:scaleY(1)}to{transform:scaleY(.25)}}
.fire{opacity:0;transform-origin:left center;animation:breathe 8s infinite}
@keyframes breathe{0%,36%{opacity:0;transform:scaleX(.2)}40%{opacity:1;transform:scaleX(1)}48%{opacity:0;transform:scaleX(1.3)}100%{opacity:0}}
header.bD h1::after{content:"";position:absolute;inset:-10px -20px;background:radial-gradient(ellipse,#ff7a1a88,transparent 70%);opacity:0;animation:glow 8s infinite;z-index:-1}
@keyframes glow{0%,38%{opacity:0}44%{opacity:1}65%{opacity:0}100%{opacity:0}}
.fball{animation:drop 8s cubic-bezier(.5,0,.8,.5) infinite;opacity:0}
@keyframes drop{0%,44%{opacity:0;transform:translateY(-60px)}47%{opacity:1}60%{opacity:1;transform:translateY(95px)}64%,100%{opacity:0;transform:translateY(120px)}}
.net{transform-origin:top center;animation:swish 8s infinite}
@keyframes swish{0%,55%{transform:scaleY(1)}58%{transform:scaleY(1.35) skewX(8deg)}62%{transform:scaleY(.9)}66%,100%{transform:scaleY(1)}}
.em{animation:rise 4.5s linear infinite;opacity:0}
@keyframes rise{0%{opacity:0;transform:translate(0,0)}15%{opacity:1}100%{opacity:0;transform:translate(12px,-130px)}}
@media(prefers-reduced-motion:reduce){header.b2 *,header.b2 *::after{animation:none!important}.fire,.fball{opacity:0}.raven{opacity:0}.em{opacity:.6}}
header.b2 .tagrow{flex-basis:100%;order:3;position:relative;z-index:3;min-height:1.6em}
header.b2 .tagrow .tag{display:inline-block}