:root{--bg: #05090b;--bg-soft: #091014;--panel: #0c1113;--panel-warm: #17110b;--text: #e9e5dc;--muted: #b2a99b;--dim: #746d64;--gold: #c4912d;--gold-bright: #f0bf48;--blue: #071d44;--line: rgba(196, 145, 45, .42);--serif: "Cinzel", Georgia, serif;--sans: "Inter", Arial, sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 50% 0,rgba(59,74,80,.22),transparent 34rem),linear-gradient(180deg,#05080a 0,#071014 44%,#05090b);color:var(--text);font-family:var(--sans);overflow-x:hidden}body.gate-locked{overflow:hidden}body.gate-locked .site-header,body.gate-locked main,body.gate-locked footer{visibility:hidden}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}button,input{font:inherit}body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:20;opacity:.04;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}.gate-entry{position:fixed;inset:0;z-index:50;display:grid;place-items:center;overflow:hidden;background:#020405;opacity:1;transition:opacity 1.15s ease,visibility 1.15s ease}.gate-entry.hidden{visibility:hidden;opacity:0;pointer-events:none}.gate-approach{position:absolute;inset:0;z-index:0;background:linear-gradient(90deg,#000000b8,#00000024 48%,#000000ad),linear-gradient(180deg,#0000001a,#00000085),url(/assets/saffa-exterior-approach-BT30uQI7.jpg) center 48% / cover no-repeat;filter:contrast(1.03) saturate(.92) brightness(.86);transform:scale(1);opacity:1;transition:opacity 1.2s ease,transform 8s ease;animation:approachDrift 18s ease-out forwards}.gate-video{position:absolute;inset:0;z-index:1;width:100%;height:100%;object-fit:cover;object-position:center;filter:contrast(1.08) saturate(.82) brightness(.78);transform:scale(1.01);opacity:0;transition:opacity 1s ease}.gate-entry.opening .gate-approach{opacity:0;transform:scale(1.08)}.gate-entry.opening .gate-video{opacity:1}.gate-vignette{position:absolute;inset:0;z-index:1;background:radial-gradient(circle at 50% 40%,rgba(255,255,255,.08),transparent 25rem),linear-gradient(90deg,#000000b3,#0000002e 42%,#000000a8),linear-gradient(180deg,#00000038,#00000014 45%,#000000c7)}.gate-content{position:relative;z-index:2;width:min(92vw,560px);display:grid;justify-items:center;padding:24px;text-align:center;transform:translateY(0);transition:opacity .65s ease,transform .65s ease}.gate-entry.opening .gate-content{opacity:0;transform:translateY(20px);pointer-events:none}.gate-content img{width:clamp(86px,12vw,132px);margin-bottom:12px;filter:drop-shadow(0 16px 18px rgba(0,0,0,.72))}.gate-kicker{margin:0;color:var(--gold-bright);font-family:var(--serif);font-size:clamp(1.25rem,3vw,2.25rem);letter-spacing:.18em;text-transform:uppercase;text-shadow:0 2px 10px rgba(0,0,0,.9)}.gate-content h1{font-size:clamp(3rem,8.5vw,7.2rem);line-height:.9}.gate-button{min-height:54px;margin-top:22px;padding:0 34px;cursor:pointer;color:#f4ead9;border:1px solid var(--gold-bright);background:linear-gradient(180deg,#c4912d38,#02060aeb),linear-gradient(180deg,#0c2049eb,#050d1cf5);font-family:var(--serif);font-weight:700;letter-spacing:.09em;text-transform:uppercase;box-shadow:0 16px 34px #0000007a,inset 0 0 0 1px #ffffff14;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)}.gate-button:hover,.gate-button:focus-visible{color:#fff7e8;background:linear-gradient(180deg,#f0bf4857,#040a12f0),linear-gradient(180deg,#0d2756f5,#060f22fa)}.gate-button:disabled{cursor:wait;color:#f4ead9b3}@keyframes approachDrift{0%{transform:scale(1)}to{transform:scale(1.045)}}.site-header{height:86px;padding:0 clamp(18px,4vw,58px);display:grid;grid-template-columns:minmax(350px,.8fr) minmax(480px,1fr) minmax(285px,.8fr);align-items:center;gap:28px;position:sticky;top:0;z-index:10;background:#020507f0;border-bottom:1px solid rgba(255,255,255,.12);box-shadow:0 14px 45px #00000080}.brand{display:flex;align-items:center;gap:16px}.brand img{width:74px;height:96px;object-fit:contain;align-self:start;filter:drop-shadow(0 10px 13px rgba(0,0,0,.72))}.brand span{font-family:var(--serif);font-size:clamp(1.75rem,2.2vw,2.45rem);font-weight:700;letter-spacing:-.04em;text-transform:uppercase;white-space:nowrap;color:#ddd8ce;text-shadow:0 2px 0 #070707,0 0 22px rgba(255,255,255,.12)}.main-nav{display:flex;align-items:center;justify-content:center;gap:clamp(18px,2.3vw,40px)}.main-nav a{position:relative;padding:33px 0 27px;color:#d3c9ba;font-family:var(--serif);font-size:.9rem;letter-spacing:.04em;text-transform:uppercase}.main-nav a.active,.main-nav a:hover{color:var(--gold-bright)}.main-nav a.active:after,.main-nav a:hover:after{content:"";position:absolute;left:0;right:0;bottom:19px;height:2px;background:var(--gold-bright)}.discord-button,.button{min-height:48px;display:inline-flex;align-items:center;justify-content:center;gap:12px;padding:0 28px;color:#efe8dc;border:1px solid var(--gold);background:linear-gradient(180deg,#0b1f46e0,#040c20eb);font-family:var(--serif);letter-spacing:.06em;text-transform:uppercase;box-shadow:inset 0 0 0 1px #ffffff0a,0 8px 22px #00000047;clip-path:polygon(10px 0,calc(100% - 10px) 0,100% 10px,100% calc(100% - 10px),calc(100% - 10px) 100%,10px 100%,0 calc(100% - 10px),0 10px)}.discord-button{justify-self:end;min-width:250px;padding-inline:20px;white-space:nowrap}.discord-button span{width:23px;height:15px;overflow:hidden;color:transparent;background:#fff;border-radius:9px;position:relative}.discord-button span:before,.discord-button span:after{content:"";position:absolute;top:6px;width:4px;height:4px;border-radius:50%;background:#071d44}.discord-button span:before{left:6px}.discord-button span:after{right:6px}.nav-toggle{display:none;width:42px;height:42px;border:1px solid var(--line);background:transparent;padding:9px}.nav-toggle span{display:block;height:2px;margin:5px 0;background:#fff}.hero{min-height:475px;position:relative;display:grid;grid-template-columns:minmax(250px,335px) minmax(430px,1fr);align-items:center;gap:52px;padding:66px clamp(32px,6vw,96px) 78px;isolation:isolate;overflow:hidden;border-bottom:1px solid rgba(255,255,255,.12)}.hero-art{position:absolute;inset:0;z-index:-3;background:linear-gradient(90deg,#020607 0,#020607d1 31%,#0206073d 63%,#0206077a),linear-gradient(180deg,#ffffff0f,#0003),url(/assets/saffa-outpost-hero-CkVkXZ4l.png) center center / cover no-repeat,radial-gradient(circle at 18% 42%,rgba(65,76,78,.26),transparent 28rem),linear-gradient(180deg,#10191d,#020607),#071014}.hero-shade{position:absolute;inset:0;z-index:-2;background:radial-gradient(circle at 45% 35%,rgba(255,255,255,.13),transparent 24rem),linear-gradient(180deg,#ffffff0a,#00000026)}.hero-crest img{width:min(100%,300px);filter:drop-shadow(0 18px 22px rgba(0,0,0,.7))}.hero-copy{max-width:660px}h1,h2,h3{margin:0;font-family:var(--serif)}h1{font-size:clamp(4.2rem,7.2vw,7.8rem);line-height:.82;text-transform:uppercase;letter-spacing:-.045em;color:#d6d2c9;text-shadow:0 3px 0 #050505,0 18px 28px rgba(0,0,0,.85);-webkit-text-stroke:1px rgba(255,255,255,.18)}.hero-rule{height:1px;width:min(540px,100%);margin:18px 0 11px;background:linear-gradient(90deg,var(--gold-bright),transparent)}.hero-motto{margin:0 0 10px;color:var(--gold-bright);font-family:var(--serif);font-size:1.15rem;letter-spacing:.07em;text-transform:uppercase}.hero-description{max-width:510px;margin:0;color:#e0d7cb;font-family:Georgia,serif;font-size:1.05rem;line-height:1.55;text-shadow:0 2px 7px rgba(0,0,0,.8)}.hero-actions{display:flex;flex-wrap:wrap;gap:16px;margin-top:24px}.button.secondary{color:var(--gold-bright);background:#080c0fb8}.roster-section{padding:12px clamp(24px,4.5vw,66px) 22px;background:linear-gradient(180deg,#071014 0,#05090b)}.section-title{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:25px;margin-bottom:12px}.section-title span{height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent)}.section-title h2,.info-grid h2,.news-strip h2,.gallery-strip h2{color:#eee9df;font-size:clamp(1.65rem,3.2vw,2.55rem);letter-spacing:.08em;text-transform:uppercase;text-shadow:0 2px 0 #050505}.roster-toolbar{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:16px}.roster-tabs{display:flex;gap:32px;overflow-x:auto}.roster-tabs button{padding:10px 0 11px;border:0;border-bottom:1px solid transparent;background:none;color:#cbbfaa;cursor:pointer;font-family:var(--serif);letter-spacing:.06em;text-transform:uppercase}.roster-tabs button.active,.roster-tabs button:hover{color:var(--gold-bright);border-color:var(--gold-bright)}.search-box{width:min(270px,100%);height:36px;display:flex;align-items:center;gap:10px;padding:0 12px;border:1px solid rgba(196,145,45,.38);background:#00000047}.search-box span{width:14px;height:14px;border:2px solid #b2a99b;border-radius:50%;overflow:hidden;color:transparent;position:relative}.search-box span:after{content:"";position:absolute;width:7px;height:2px;right:-5px;bottom:-3px;background:#b2a99b;transform:rotate(45deg)}.search-box input{width:100%;border:0;outline:0;background:transparent;color:var(--text)}.member-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:19px}.member-card{min-height:230px;position:relative;overflow:hidden;border:1px solid rgba(196,145,45,.55);background:#070b0d;box-shadow:inset 0 0 0 1px #ffffff0d,0 12px 28px #00000061}.member-card[hidden]{display:none}.member-card img{width:100%;height:100%;min-height:230px;object-fit:cover;filter:saturate(.95) contrast(1.05)}.member-card:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 34%,rgba(0,0,0,.32) 60%,rgba(0,0,0,.88) 100%)}.ribbon{position:absolute;z-index:2;left:0;top:0;width:66px;height:66px;background:var(--blue);border-right:1px solid rgba(196,145,45,.65);clip-path:polygon(0 0,100% 0,100% 73%,50% 100%,0 73%)}.leader .ribbon{background:linear-gradient(135deg,var(--gold),#785111)}.muted .ribbon{background:linear-gradient(135deg,#5e6265,#222629)}.ribbon span{position:absolute;inset:0;overflow:hidden;color:transparent}.ribbon span:before{content:"";position:absolute;left:22px;top:18px;width:20px;height:18px;border:2px solid rgba(255,255,255,.82);border-top:0;clip-path:polygon(0 100%,100% 100%,82% 35%,55% 70%,50% 0,45% 70%,18% 35%)}.member-info{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:0 14px 13px;text-align:center}.member-info h3{font-size:clamp(1rem,1.35vw,1.22rem);color:#fff6e8;text-shadow:0 2px 8px rgba(0,0,0,.85)}.member-info p{margin:4px 0 14px;color:var(--gold-bright);font-family:var(--serif);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase}.member-card:not(.leader) .member-info p{color:#3387d9}.member-card.logistics .member-info p{color:#d0a94b}.member-card.undead .member-info p{color:#9fa8b0}.member-card.muted .member-info p{color:#8d8176}.member-info small{color:#8fdc5d;font-family:var(--serif);font-size:.74rem;letter-spacing:.12em;text-transform:uppercase}.member-info small:before{content:"";display:inline-block;width:7px;height:7px;margin-right:8px;border-radius:50%;background:#e8e4dc}.empty-state{margin:18px 0 0;padding:28px;text-align:center;color:var(--muted);border:1px dashed var(--line)}.info-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:0 clamp(24px,4.5vw,66px) 22px;background:#05090b}.info-grid article{min-height:152px;display:grid;grid-template-columns:120px 1fr;align-items:center;gap:24px;padding:28px;border:1px solid rgba(196,145,45,.38);background:linear-gradient(135deg,#ffffff09,#00000059),#080d10}.info-grid h2{margin-bottom:12px;font-size:clamp(1.25rem,2vw,1.75rem)}.info-grid p,.news-strip p,.gallery-strip p{margin:0;color:#c8beb0;line-height:1.6}.panel-icon{width:70px;height:70px;margin:auto;position:relative;color:var(--gold)}.tower:before{content:"";position:absolute;inset:10px 16px 0;background:linear-gradient(180deg,#b58535,#5e3d17);clip-path:polygon(0 100%,0 35%,15% 35%,15% 10%,32% 10%,32% 35%,50% 35%,50% 10%,68% 10%,68% 35%,85% 35%,85% 10%,100% 10%,100% 100%)}.swords:before,.swords:after{content:"";position:absolute;left:33px;top:5px;width:5px;height:65px;background:linear-gradient(#d5ac5e,#5c3a14);transform:rotate(45deg)}.swords:after{transform:rotate(-45deg)}.helm:before{content:"";position:absolute;inset:9px 11px 13px;border:5px solid #a9772d;border-bottom-width:12px;border-radius:48% 48% 20% 20%}.news-strip,.gallery-strip{padding:42px clamp(24px,4.5vw,66px);border-top:1px solid rgba(255,255,255,.08);background:#071014}.gallery-strip{background:#05090b}footer{padding:24px clamp(24px,4.5vw,66px);display:flex;justify-content:space-between;gap:18px;color:var(--dim);border-top:1px solid rgba(255,255,255,.08);background:#030607}footer span{color:var(--text);font-family:var(--serif);text-transform:uppercase}@media(max-width:1180px){.site-header{grid-template-columns:1fr auto}.main-nav{grid-column:1 / -1;grid-row:2;padding-bottom:12px}.site-header{height:auto;padding-top:12px}.discord-button{grid-column:2;grid-row:1}.member-grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:820px){.site-header{grid-template-columns:1fr auto;min-height:78px;padding-bottom:10px}.brand img{width:58px;height:74px}.brand span{font-size:1.45rem}.nav-toggle{display:block;justify-self:end}.main-nav{display:none;grid-column:1 / -1;flex-direction:column;align-items:stretch;gap:0;padding:14px 0}.main-nav.open{display:flex}.main-nav a{padding:12px 0}.discord-button{display:none}.hero{grid-template-columns:1fr;gap:22px;min-height:auto;padding-top:42px}.hero-crest img{width:min(255px,72vw)}.hero-copy{max-width:100%}.roster-toolbar{align-items:stretch;flex-direction:column}.member-grid{grid-template-columns:repeat(2,1fr)}.info-grid{grid-template-columns:1fr}}@media(max-width:560px){.hero{padding-inline:20px}h1{font-size:clamp(3.3rem,18vw,5.2rem)}.hero-actions{flex-direction:column}.button{width:100%}.member-grid{grid-template-columns:1fr}.info-grid article{grid-template-columns:1fr;text-align:center}footer{flex-direction:column}}
