*{box-sizing:border-box}
:root{--ember:#ff4b18;--gold:#e7bd82;--gold2:#a96a39;--ink:#120807;--panel:rgba(22,12,10,.91);--line:rgba(193,111,61,.72)}
html,body{margin:0;min-height:100%;background:#100706;color:#f8ead5;font-family:Inter,Arial,sans-serif}
body{min-height:100vh;overflow-x:hidden;background-image:linear-gradient(90deg,rgba(10,5,5,.48),rgba(10,5,5,.18)),var(--desktop-bg, url("assets/horde-desktop.jpg"));background-size:cover;background-position:center;background-attachment:fixed}
body:before{content:"";position:fixed;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(10,4,5,.25),transparent 35%,rgba(9,4,4,.55));z-index:0}
.ambient{position:fixed;inset:0;pointer-events:none;z-index:0;background:radial-gradient(ellipse at 18% 74%,rgba(183,49,17,.18),transparent 38%),radial-gradient(ellipse at 84% 80%,rgba(220,66,18,.12),transparent 32%)}
.site-shell{position:relative;z-index:1;min-height:100vh;width:min(1440px,100%);margin:auto;display:grid;grid-template-columns:minmax(380px, .88fr) minmax(480px,1.12fr);align-items:stretch;padding:5vh clamp(28px,5vw,84px) 3vh;isolation:isolate}
.content{position:relative;z-index:3;align-self:center;width:min(100%,610px);padding:clamp(18px,3vw,44px) 0}
.brand{text-align:center;margin:0 auto 28px;max-width:560px}
.crest{width:68px;height:76px;margin:0 auto 8px;filter:drop-shadow(0 0 10px rgba(255,44,12,.42))}
.crest svg{width:100%;height:100%;fill:#d71912;stroke:#70110e;stroke-width:2.5}
.crest .cut{fill:#170807;stroke:none}
.eyebrow{font-size:10px;letter-spacing:.32em;color:#e7b98a;margin:0 0 5px;font-weight:700}
h1{font-family:Cinzel,Georgia,serif;font-size:clamp(48px,6vw,82px);line-height:1;margin:0;font-weight:700;letter-spacing:.075em;color:#f4d6a6;background:linear-gradient(180deg,#fff1d1 8%,#d99b5e 52%,#7d3e22 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 3px 0 #2b0e08) drop-shadow(0 0 13px rgba(255,72,20,.32))}
.title-rule{display:flex;align-items:center;justify-content:center;gap:12px;margin:13px auto 14px;width:min(82%,360px)}
.title-rule span{height:1px;flex:1;background:linear-gradient(90deg,transparent,#c77b3d)}
.title-rule span:last-child{transform:scaleX(-1)}
.title-rule i{width:9px;height:9px;transform:rotate(45deg);background:#ed4b19;border:1px solid #ffb05b;box-shadow:0 0 9px rgba(255,69,20,.5)}
.intro{max-width:430px;margin:0 auto;color:#e3cdb1;font-size:13px;line-height:1.65;text-shadow:0 2px 8px #000}
.social-links{display:grid;gap:12px;width:min(100%,510px);margin:26px auto 0}
.social-link{position:relative;min-height:66px;display:flex;align-items:center;gap:18px;padding:13px 22px;text-decoration:none;color:#f8e8ce;background:linear-gradient(180deg,rgba(54,31,24,.96),rgba(18,10,9,.97));border:1px solid #a85c31;outline:1px solid rgba(48,19,13,.9);outline-offset:3px;clip-path:polygon(0 17%,3% 17%,6% 0,94% 0,97% 17%,100% 17%,100% 83%,97% 83%,94% 100%,6% 100%,3% 83%,0 83%);box-shadow:inset 0 0 0 1px rgba(255,185,112,.12),0 8px 22px rgba(0,0,0,.34);transition:transform .2s ease,filter .2s ease,background .2s ease}
.social-link:before{content:"";position:absolute;inset:4px 8px;border-top:1px solid rgba(239,174,107,.22);border-bottom:1px solid rgba(239,174,107,.14);pointer-events:none}
.social-link:not(.is-disabled):hover{transform:translateY(-2px);filter:brightness(1.18) drop-shadow(0 0 8px rgba(219,61,20,.25));background:linear-gradient(180deg,rgba(75,37,25,.98),rgba(28,12,10,.98))}
.social-link:focus-visible{outline:2px solid #ffd69b;outline-offset:6px}
.social-link.is-disabled{opacity:.78;cursor:default}
.link-icon{width:30px;height:30px;display:grid;place-items:center;flex:none;color:#f1bd7c}
.link-icon svg{width:26px;height:26px;display:block;fill:currentColor}
.link-label{font-family:Cinzel,Georgia,serif;font-weight:700;letter-spacing:.045em;font-size:15px;text-transform:uppercase;flex:1;text-shadow:0 2px 3px #000}
.link-arrow{color:#f0a45e;font-size:26px;line-height:1;font-family:Georgia,serif;text-shadow:0 0 8px rgba(255,79,23,.35)}
.link-hint{font-size:9px;letter-spacing:.13em;color:#d5a77e;margin-left:auto}
.footer-mark{text-align:center;margin:30px 0 0;font-family:Cinzel,Georgia,serif;font-size:10px;letter-spacing:.3em;color:#d49a64;text-shadow:0 2px 5px #000}
.character{position:relative;min-height:84vh;align-self:end;display:flex;align-items:flex-end;justify-content:center;overflow:visible;z-index:2;pointer-events:none}
.character img{position:relative;z-index:2;display:block;width:min(128%,850px);max-height:96vh;object-fit:contain;object-position:bottom center;filter:brightness(1.12) contrast(1.06) drop-shadow(0 5px 22px rgba(0,0,0,.55))}
.character-vignette{position:absolute;inset:15% 0 0;z-index:1;background:linear-gradient(90deg,rgba(16,7,6,.48),transparent 22%),linear-gradient(0deg,rgba(10,5,5,.12),transparent 35%);pointer-events:none}
.character-glow{position:absolute;z-index:0;bottom:5%;right:10%;width:60%;height:35%;background:radial-gradient(ellipse,rgba(213,57,17,.17),transparent 70%);filter:blur(20px)}
.bottom-fade{position:fixed;z-index:4;left:0;right:0;bottom:0;height:34px;background:linear-gradient(0deg,rgba(9,4,4,.72),transparent);pointer-events:none}
.loading-state,.empty-state{padding:20px;text-align:center;color:#d5b28c;border:1px solid rgba(193,111,61,.4);background:rgba(20,10,9,.82);font-size:13px}
@media(min-width:1500px){.site-shell{padding-top:7vh;padding-bottom:5vh}.character{min-height:88vh}}
@media(max-width:900px){.character{display:none}body{background-image:linear-gradient(180deg,rgba(10,5,5,.18),rgba(10,5,5,.4)),var(--mobile-bg, url("assets/horde-mobile.jpg"));background-position:center top;background-attachment:scroll}.site-shell{display:flex;flex-direction:column;min-height:100svh;padding:24px 20px 0;gap:0}.content{order:1;width:min(100%,560px);align-self:center;padding:12px 0 0}.brand{margin-bottom:20px}.crest{width:52px;height:59px}.eyebrow{font-size:9px;letter-spacing:.24em}h1{font-size:clamp(48px,13vw,68px)}.intro{font-size:12px;max-width:340px}.social-links{gap:10px;margin-top:20px;width:min(100%,440px)}.social-link{min-height:58px;padding:10px 18px}.link-label{font-size:13px}.footer-mark{margin:22px 0 0;font-size:9px}.character{order:2;min-height:0;height:47svh;max-height:500px;width:100%;margin-top:4px;overflow:hidden}.character img{width:min(132%,650px);height:100%;max-height:none;object-fit:contain;object-position:center bottom;filter:brightness(1.16) contrast(1.07) drop-shadow(0 4px 18px rgba(0,0,0,.48))}.character-vignette{inset:0;background:linear-gradient(180deg,rgba(18,7,6,.08),transparent 24%)}.character-glow{bottom:0;width:90%;right:5%;height:35%}}
@media(max-width:420px){.site-shell{padding-left:15px;padding-right:15px}.brand{margin-bottom:16px}.social-link{min-height:55px}.character{height:43svh}.footer-mark{margin-top:17px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important}}