/* CRUX / graphite machined rail — single unified housing */
header{height:96px;padding:14px 2.5%;gap:0;background:transparent;border:0;isolation:isolate;box-shadow:none}
header::before{content:'';position:absolute;z-index:-1;inset:10px 14px;background:repeating-linear-gradient(0deg,#ffffff03 0 1px,transparent 1px 3px),linear-gradient(173deg,#70788b 0%,#2c3240 6%,#181e2b 43%,#202634 80%,#535d70 100%);clip-path:polygon(17px 0,calc(100% - 17px) 0,100% 17px,100% calc(100% - 17px),calc(100% - 17px) 100%,17px 100%,0 calc(100% - 17px),0 17px);box-shadow:inset 0 1px #c6d0e199,inset 0 -2px #050910;pointer-events:none}
header::after{content:'';position:absolute;z-index:-1;inset:15px 20px;border-top:1px solid #ffffff20;border-bottom:1px solid #0009;pointer-events:none;clip-path:polygon(12px 0,calc(100% - 12px) 0,100% 12px,100% calc(100% - 12px),calc(100% - 12px) 100%,12px 100%,0 calc(100% - 12px),0 12px)}
header .brand{width:176px;height:60px;flex-shrink:0;padding:4px 22px 4px 6px;margin-right:12px;border-right:1px solid #080d17;box-shadow:1px 0 #ffffff16;border-radius:0}
header nav{display:flex;flex:1;gap:0;padding:0;background:none;border:0;border-radius:0;box-shadow:none;perspective:1000px;align-self:stretch}
header nav a{--neon:#b8ff35!important;--nav-light:#b8ff35!important;flex:1;min-width:0;width:auto;height:100%;padding:0;border:0;border-radius:0;background:none!important;box-shadow:none!important;transform:none!important;transition:none;position:relative;perspective:800px}
header nav a::before,header nav a::after{display:none!important}
header .nav-flip{position:relative;display:block;width:100%;height:100%;transform-style:preserve-3d;transition:transform .5s cubic-bezier(.2,.75,.2,1)}
header .nav-front,header .nav-back{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;border:0;border-left:1px solid #ffffff14;border-right:1px solid #080d1790;border-radius:0;gap:0;background:linear-gradient(180deg,#ffffff04,transparent 38%,#00000016);box-shadow:inset 0 1px #ffffff0b;backface-visibility:hidden;overflow:hidden}
header .nav-front small,header .nav-back b{display:none!important}
header .nav-front>span,header .nav-back>span{font-size:clamp(14px,1.2vw,18px);font-weight:400;letter-spacing:.025em;white-space:nowrap;color:#e3e6ed;text-shadow:0 1px 1px #000}
header .nav-front:after,header .nav-back:after{display:none!important}
header .nav-back{transform:rotateX(180deg);background:linear-gradient(160deg,#424b54,#252d34 52%,#1b222c);box-shadow:inset 0 1px #e4ffb229,inset 0 -1px #b8ff3550}
header .nav-back>span{color:#d9ff9e}
header nav a:hover .nav-flip,header nav a:focus-visible .nav-flip{transform:rotateX(180deg)}
header nav a.active .nav-front{border-bottom:0;background:linear-gradient(90deg,#b8ff350c,transparent 60%)}
header nav a.active .nav-front::before{content:'';position:absolute;left:2px;top:22%;bottom:22%;width:3px;background:#b8ff35;box-shadow:0 0 9px #b8ff3566;border-radius:2px}
header .nav-actions{gap:4px;margin-left:14px;padding-left:12px;border-left:1px solid #080d17;box-shadow:inset 1px 0 #ffffff18;perspective:1000px;align-self:center}
header .nav-actions>[data-modal]{--control:#b8ff35;--neon:#b8ff35;position:relative;width:124px;height:56px;min-height:56px;padding:0;font-size:0;border:0;border-radius:0;background:none;box-shadow:none;overflow:visible;transform:none!important}
header .nav-actions>[data-modal]::before,header .nav-actions>[data-modal]::after,header .control-led,header .nav-actions>[data-modal]>.control-arrow,header .nav-actions>[data-modal]>.discord-mark{display:none!important;animation:none!important}
header .nav-actions>[data-modal]:hover{background:none;box-shadow:none;border:0}
header .action-flip{position:absolute;inset:0}
header .action-flip .nav-front,header .action-flip .nav-back{flex-direction:row;gap:7px;border:1px solid #0b101b;box-shadow:inset 0 1px #ffffff2b,inset 0 -1px #ffffff08;background:linear-gradient(165deg,#3c4453,#1d2533 65%,#2c3542);clip-path:polygon(7px 0,calc(100% - 7px) 0,100% 7px,100% calc(100% - 7px),calc(100% - 7px) 100%,7px 100%,0 calc(100% - 7px),0 7px)}
header .action-flip .nav-back{background:linear-gradient(165deg,#485544,#26322c 65%,#313f37)}
header .action-flip .nav-front>span,header .action-flip .nav-back>span{font-size:16px}
header .nav-actions>[data-modal]:hover .action-flip,header .nav-actions>[data-modal]:focus-visible .action-flip{transform:rotateX(180deg)}
header .nav-actions>[data-modal="discord"] .nav-front>span,header .nav-actions>[data-modal="discord"] .discord-mark{color:#c8f881}
header .nav-actions .discord-mark{width:17px;height:17px;fill:currentColor}
header :is(nav a,.nav-actions button):focus-visible{outline:2px solid #b8ff35;outline-offset:2px}
@media(min-width:1051px) and (max-width:1350px){header{padding:14px 2%}header .brand{width:145px;padding-right:14px;margin-right:5px}header .nav-actions{margin-left:7px;padding-left:7px}header .nav-actions>[data-modal]{width:106px}header .action-flip .nav-front>span,header .action-flip .nav-back>span{font-size:14px}}
@media(max-width:1050px){header{height:82px;padding:12px 24px}header::before{inset:7px 12px}header::after{inset:12px 18px}header .brand{width:160px;height:52px}header nav{display:none;position:absolute;top:77px;left:18px;right:18px;flex-direction:column;background:linear-gradient(140deg,#303847,#161e2c);padding:10px;border:1px solid #717a8c55;box-shadow:0 12px 25px #0008;gap:1px}header.menu-open nav{display:flex}header nav a{width:100%;height:52px;flex:none}header .menu-toggle{display:block;color:#d6ddcf;background:none}header .nav-actions{margin-left:auto;border:0;box-shadow:none;padding-left:0}header .nav-actions>[data-modal]{width:110px;height:48px;min-height:48px}header .nav-front>span,header .nav-back>span{font-size:16px}}
@media(max-width:600px){header{height:76px;padding:12px 18px}header .brand{width:100px;height:46px;padding:3px 9px 3px 0;margin-right:4px}header .nav-actions{gap:3px}header .nav-actions>[data-modal]{display:flex;width:80px;height:42px;min-height:42px}header .action-flip .nav-front>span,header .action-flip .nav-back>span{font-size:12px;letter-spacing:0}header .nav-actions .discord-mark{width:14px;height:14px}header .menu-toggle{padding:4px;font-size:20px}header nav{top:71px}.action-flip .nav-front,.action-flip .nav-back{gap:4px!important}}
@media(prefers-reduced-motion:reduce){header .nav-flip{transition:none;transform:none!important}header :is(nav a,.nav-actions button):hover .nav-front{background:#344135}}
header .nav-actions>[data-modal]{border:0!important;background:none!important;box-shadow:none!important;border-radius:0!important}
