/* Dark City Website V12 – ONE geometric layout override, no viewport offsets/hard-coded inset.
   Matches the 1748px reference at that viewport, fluid on smaller devices. */
:root { --topbar-height:82px; --dc-shell-left:max(16px,calc((100vw - 1488px)/2)); }
html,body {margin:0!important;padding:0!important;min-width:0;}
body { overflow-x:clip; }
/* Fixed header is flush with all edges; do not insert a top margin at any breakpoint. */
.hdr, .hdr.hdr-scrolled {
 position:fixed!important;inset:0 0 auto 0!important;top:0!important;left:0!important;right:0!important;
 width:100%!important;max-width:none!important; height:var(--topbar-height)!important;
 margin:0!important;padding:0!important;
 display:flex!important;justify-content:flex-start!important;align-items:center!important;
 background:rgba(31,11,37,.81)!important;
 border-top:0!important;border-bottom:1px solid rgba(193,114,245,.15)!important;
 backdrop-filter:blur(16px) saturate(140%);
 z-index:1000;
}
.hdr .hdr-inner, .hdr.hdr-open .hdr-inner {
 position:relative!important;box-sizing:border-box!important;display:flex!important;align-items:center!important;
 width:min(1437px,calc(100vw - var(--dc-shell-left) - 16px))!important;
 height:100%!important; min-height:0!important; max-width:none!important;
 margin:0 0 0 var(--dc-shell-left)!important; padding:0!important;
 flex-wrap:nowrap!important;gap:0!important;
}
/* Branding occupies 100 px, navigation begins 130 px after start (as reference). */
.hdr .hdr-brand {display:flex!important;align-items:center;flex:0 0 100px!important;min-width:100px!important;margin:0 30px 0 0!important;gap:5px!important;white-space:nowrap;}
.hdr .dc-brand-logo {width:29px!important;height:34px!important;object-fit:contain;flex:0 0 29px;}
.hdr .dc-brand-type {font-size:12px!important;letter-spacing:.025em!important;line-height:1.0!important;}
.hdr .dc-brand-type small {font-size:7px!important;letter-spacing:.22em!important;}
.hdr .hdr-nav {display:flex!important;align-items:center!important;min-width:0!important;width:auto!important;flex:1 1 auto!important;gap:2px!important;margin:0!important;}
.hdr .hdr-nav .hdr-link {box-sizing:border-box!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;flex:0 1 auto!important;min-width:0!important;height:42px!important;font-size:13px!important;letter-spacing:0!important;line-height:1.1!important;gap:6px!important;padding:0 4px!important;white-space:nowrap!important;}
.hdr .hdr-nav .hdr-link:nth-child(1){width:91px!important}
.hdr .hdr-nav .hdr-link:nth-child(2){width:138px!important}
.hdr .hdr-nav .hdr-link:nth-child(3){width:131px!important}
.hdr .hdr-nav .hdr-link:nth-child(4){width:137px!important}
.hdr .hdr-nav .hdr-link:nth-child(5){width:95px!important}
.hdr .hdr-nav .hdr-link:nth-child(6){width:123px!important}
.hdr .hdr-nav .hdr-sep{flex:0 0 1px!important;width:1px!important;height:27px!important;margin:0 16px 0 12px!important;}
.hdr .hdr-nav .hdr-wiki {flex:0 0 158px!important;box-sizing:border-box!important;width:158px!important;min-width:158px!important;height:42px!important;display:inline-flex!important;align-items:center;justify-content:center!important;gap:7px!important;font-size:13px!important;white-space:nowrap!important;padding:0 10px!important;}
.hdr .hdr-indicator{bottom:-13px!important;height:2px!important;background:linear-gradient(90deg,#955df6,#c480ff)!important;}
.hdr .hdr-right{display:flex!important;align-items:center!important;margin:0 0 0 auto!important;gap:13px!important;min-width:0!important;flex:0 0 auto!important;}
.hdr .hdr-right .hdr-discord {box-sizing:border-box!important;display:flex!important;align-items:center!important;height:57px!important;margin:0!important;gap:9px!important;padding:8px 12px!important;}
.hdr .hdr-right .hdr-discord:not(.hdr-unban) {width:205px!important;min-width:205px!important;background:rgba(81,50,135,.10);}
.hdr .hdr-right .hdr-discord.hdr-unban {width:157px!important;min-width:157px!important;background:rgba(147,44,148,.095);}
.hdr .hdr-discord-icon{width:35px!important;height:35px!important;flex:0 0 35px!important;border-radius:7px!important;}
.hdr .hdr-discord-info{display:flex!important;flex-direction:column!important;justify-content:center!important;min-width:0!important;gap:2px!important;}
.hdr .hdr-discord-online {font-size:9px!important;line-height:1.15!important;letter-spacing:.05em!important;color:rgba(223,207,236,.66);}
.hdr .hdr-discord-count,.hdr .hdr-unban-label {display:block!important;font-size:14px!important;line-height:1.24!important;font-weight:800!important;white-space:nowrap;}
.hdr .hdr-unban[aria-disabled='true']{opacity:.87!important;}
/* Hero and streamer areas share the original 1748px reference's column axis.
   Position is centered responsively using translate; no cumulative left offsets. */
@media(min-width:1500px){
 .container{padding-top:93px!important;}
 .container>.hero,.container>.dc-live-section{left:auto!important;right:auto!important;transform:none!important;translate:-84px 0!important;}
 .hero{margin-bottom:102px!important;}
 .hero .dc-hero-logo{width:580px!important;max-width:100%!important;height:186px!important;margin:0 auto 13px!important;gap:0!important;justify-content:flex-start!important;}
 .hero .dc-hero-logo img{width:110px!important;height:84px!important;}
 .hero .dc-hero-type{font-size:87px!important;line-height:1!important;letter-spacing:.09em!important;white-space:nowrap!important;}
 .hero .dc-hero-type small{font-size:.15em!important;margin-top:3px!important;}
 .hero .subtitle{font-size:20px!important;letter-spacing:.195em!important;margin:0 0 49px!important;}
 .hero .action-buttons{gap:30px!important;}
 .hero .action-buttons .btn{box-sizing:border-box!important;width:288px!important;min-width:288px!important;max-width:288px!important;height:62px!important;font-size:15px!important;letter-spacing:.04em!important;justify-content:center!important;padding:0 17px!important;white-space:nowrap!important;}
 .twitch-section.dc-live-section{margin-top:60px!important;}
 .dc-live-heading{margin-bottom:26px!important;}
}
/* On smaller desktop screens, keep layout within the available width. */
@media(min-width:1250px) and (max-width:1499px){
 .hdr .hdr-brand{flex-basis:93px!important;min-width:93px!important;margin-right:10px!important;}
 .hdr .hdr-nav{justify-content:space-between!important;}
 .hdr .hdr-nav .hdr-link{font-size:12px!important;padding:0 2px!important;}
 .hdr .hdr-nav .hdr-link:nth-child(n){width:auto!important;padding-inline:8px!important;}
 .hdr .hdr-nav .hdr-sep{margin:0 6px!important;}
 .hdr .hdr-nav .hdr-wiki{width:137px!important;min-width:137px!important;flex-basis:137px!important;font-size:12px!important;}
 .hdr .hdr-right{gap:8px!important;}
 .hdr .hdr-right .hdr-discord:not(.hdr-unban){width:168px!important;min-width:168px!important;padding:7px!important;}
 .hdr .hdr-right .hdr-discord.hdr-unban{width:134px!important;min-width:134px!important;padding:7px!important;}
 .hdr .hdr-discord-count,.hdr .hdr-unban-label{font-size:12px!important;}
 .container{padding-top:93px!important;}
 .container>.hero,.container>.dc-live-section{left:auto!important;transform:none!important;translate:clamp(-60px,-3.6vw,-20px) 0!important;}
}
@media(min-width:901px) and (max-width:1249px){
 .hdr .hdr-brand{flex-basis:86px!important;min-width:86px!important;margin-right:9px!important;}
 .hdr .hdr-nav .hdr-link:nth-child(n){width:auto!important;padding:0 6px!important;font-size:11px!important;}
 .hdr .hdr-nav .hdr-sep{margin:0 5px!important;}
 .hdr .hdr-nav .hdr-wiki{width:118px!important;min-width:118px!important;flex-basis:118px!important;padding:0 4px!important;font-size:11px!important;}
 .hdr .hdr-right{display:none!important;}
 .container>.hero,.container>.dc-live-section{left:auto!important;transform:none!important;translate:0 0!important;}
 .container{padding-top:90px!important;}
}
@media(max-width:900px){
 :root{--topbar-height:60px;}
 .hdr {height:60px!important;top:0!important;}
 .hdr .hdr-inner, .hdr.hdr-open .hdr-inner{width:calc(100vw - 28px)!important;height:60px!important;min-height:60px!important;margin:0 14px!important;justify-content:space-between!important;}
 .hdr .hdr-brand {margin:0!important;flex:0 0 auto!important;min-width:0!important;}
 .hdr .hdr-toggle{display:block!important;}
 .hdr .hdr-nav,.hdr .hdr-right,.hdr .hdr-indicator {display:none!important;}
 .container{padding-top:77px!important;}
 .container>.hero,.container>.dc-live-section{left:auto!important;transform:none!important;translate:0 0!important;}
}
