/* Keep the existing brand visible until the original image loads successfully. */
.site-header :is(.brand,.legal-brand),footer .brand{flex-shrink:0;min-height:44px}
.site-header .brand-image-ready,footer .brand-image-ready{display:inline-flex;align-items:center;justify-content:center;width:184px;gap:0!important}
.brand-wordmark{display:block!important;position:relative!important;width:184px!important;height:57px!important;overflow:hidden;flex-shrink:0;clip-path:polygon(0 18%,5% 4%,14% 4%,23% 18%,35% 23%,47% 26%,53% 26%,66% 23%,77% 18%,87% 4%,95% 4%,100% 18%,100% 100%,0 100%)}
.site-header .brand-wordmark img,footer .brand-wordmark img{display:block!important;position:absolute!important;bottom:0;left:0;width:100%!important;height:auto!important;max-width:none!important;max-height:none!important;object-fit:contain;clip-path:none!important}
.brand-image-ready:focus-visible{outline:3px solid #edc878;outline-offset:4px;border-radius:6px}
@media(max-width:650px){.site-header .brand-image-ready{width:140px}.site-header .brand-wordmark{width:140px!important;height:44px!important}.site-header{column-gap:8px}}
@media(max-width:360px){.site-header .brand-image-ready{width:124px}.site-header .brand-wordmark{width:124px!important;height:39px!important}.site-header .nav-toggle{padding:6px}}

/* DP-219: reuse the dragon above the Korean lockup as a shared leading emblem.
   CSS framing preserves the original PNG; no regenerated or duplicated artwork. */
.site-header .brand-image-ready,footer .brand-image-ready{width:240px;gap:0!important}
.brand-image-ready::before{content:"";display:block;flex:0 0 56px;width:56px;height:56px;background:url('/assets/dragonwars-logo-lockup.png') center top/84px auto no-repeat;clip-path:ellipse(49% 49% at 50% 50%)}
@media(max-width:650px){.site-header .brand-image-ready{width:188px;gap:0!important}.site-header .brand-image-ready::before{flex-basis:48px;width:48px;height:48px;background-size:72px auto}}
@media(max-width:360px){.site-header .brand-image-ready{width:148px;gap:0!important}.site-header .brand-wordmark{width:110px!important;height:35px!important}.site-header .brand-image-ready::before{flex-basis:38px;width:38px;height:38px;background-size:57px auto}.site-header .website-language select{max-width:82px;padding-inline:5px}}