@import url('https://fonts.googleapis.com/css2?family=Black+Ops+One&family=Rajdhani:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500&display=swap');

:root{color-scheme:dark;--bg:#0c0d0f;--text:#deded9;--muted:#9b9fa5;--accent:#cf494d;--silver:#b8bcc2;--gold:#b59a62;--signal:#b59a62;--mono:'IBM Plex Mono',monospace}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:'Rajdhani',sans-serif;min-height:100svh;display:flex;flex-direction:column}body::after{content:'';position:fixed;inset:0;pointer-events:none;z-index:5;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23n)' opacity='.6' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}
.terrain{position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 40%,#17191c 0%,#0c0d0f 58%,#08090a 100%)}
.masthead,footer{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;margin:0 4.5%;font-family:var(--mono);font-size:10px;letter-spacing:1.4px}.masthead{height:124px;border-bottom:1px solid #b8bcc226;flex-shrink:0}.wordmark{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--text);font-family:'Black Ops One',Impact,sans-serif;font-size:23px;font-weight:400;letter-spacing:1px}.brand-logo{width:96px;height:96px;object-fit:contain;flex-shrink:0;filter:drop-shadow(0 3px 10px #0006)}.header-note{color:#9b9fa5;font-size:9px;letter-spacing:2px}.status{display:flex;align-items:center;gap:9px;color:var(--signal)}.status i,.footer-end i{height:5px;width:5px;background:var(--signal);border-radius:50%;box-shadow:0 0 10px #b59a6238;display:inline-block}
main{position:relative;isolation:isolate;flex:1;min-height:660px;display:grid;place-items:center;overflow:hidden}.radar{position:absolute;width:min(740px,90vw);aspect-ratio:1;left:50%;top:50%;transform:translate(-50%,-50%);z-index:-1;mask-image:radial-gradient(circle,#000 61%,#0009 72%,transparent 75%)}canvas{display:block;width:100%;height:100%}.bearing{position:absolute;font:9px var(--mono);color:#63936d;letter-spacing:2px}.north{top:2%;left:50%;transform:translateX(-50%)}.south{bottom:2%;left:50%;transform:translateX(-50%)}.east{right:1%;top:50%}.west{left:1%;top:50%}.hero{text-align:center;position:relative;width:100%;padding:64px 24px 80px;background:radial-gradient(ellipse at center,#0c0d0fe0 0%,#0c0d0f99 36%,transparent 70%)}.eyebrow{display:flex;justify-content:center;align-items:center;gap:10px;font:24px var(--mono);letter-spacing:2.7px;color:var(--gold);margin:0 0 22px}.eyebrow span{width:19px;height:1px;background:var(--gold)}h1{font-family:'Black Ops One',Impact,sans-serif;font-weight:400;font-size:clamp(48px,9.2vw,130px);letter-spacing:-.035em;line-height:.92;margin:0;text-shadow:0 3px 35px #0005}.period{color:var(--accent)}.intro{font-size:22px;letter-spacing:.4px;color:#b8bcc2;margin:26px 0 38px}.join{position:relative;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;gap:16px;min-height:70px;min-width:304px;padding:20px 28px;background:linear-gradient(115deg,#702529,#aa3538 55%,#7d272c);color:#e9e9e4;text-decoration:none;font-weight:700;font-size:16px;letter-spacing:2.2px;border:0;clip-path:polygon(14px 0,100% 0,100% calc(100% - 14px),calc(100% - 14px) 100%,0 100%,0 14px);box-shadow:inset 0 0 0 1px #b59a62;transition:transform .2s,filter .2s;animation:comms-glow 4.8s ease-in-out infinite}
.join::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(110deg,transparent 35%,#b8bcc225 48%,#e0e1de45 50%,transparent 63%);transform:translateX(-130%);animation:comms-sweep 6s ease-in-out infinite}
.join::after{content:'';position:absolute;inset:5px;z-index:-1;pointer-events:none;border-top:1px solid #b59a6265;border-bottom:1px solid #b8bcc245;background:repeating-linear-gradient(90deg,#c0a56cbb 0 3px,transparent 3px 7px) left bottom / 28px 3px no-repeat}
.join .discord{padding-right:12px;box-sizing:content-box;border-right:1px solid #b8bcc252}.join .arrow{margin-left:10px;transition:transform .2s}.join:hover{transform:translateY(-2px);filter:brightness(1.15)}.join:hover .arrow{transform:translate(2px,-2px)}.join:active{transform:translateY(1px)}
@keyframes comms-glow{0%,100%{box-shadow:inset 0 0 0 1px #a68d5b,inset 0 0 14px #cf494d08}50%{box-shadow:inset 0 0 0 1px #d0b983,inset 0 0 24px #cf494d30}}
@keyframes comms-sweep{0%,65%{transform:translateX(-130%)}90%,100%{transform:translateX(130%)}}
.wordmark:focus-visible{outline:3px solid #fff;outline-offset:6px}.join:focus-visible{outline:3px solid #fff;outline-offset:-5px;animation:none;box-shadow:inset 0 0 0 4px #fff}.discord{width:23px;height:23px}.arrow{font-size:25px;font-weight:400;margin-left:22px;line-height:1}.button-note{font-size:16pt;color:#9b9fa5;letter-spacing:.3px;margin:16px 0 0}.side-label{position:absolute;top:50%;font:9px var(--mono);letter-spacing:2px;color:#8b9097;writing-mode:vertical-rl}.left-label{left:4.5%;transform:translateY(-50%) rotate(180deg)}.right-label{right:4.5%;transform:translateY(-50%)}.field-note,.radar-note{position:absolute;bottom:36px;display:flex;align-items:center;gap:15px;font:9px/1.9 var(--mono);letter-spacing:1.2px;color:#b8bcc2}.field-note{left:4.5%}.radar-note{right:4.5%}.field-note div span,.radar-note div span{color:#8b9097}.tiny-cross{font-size:30px;font-weight:400;color:#b59a62}.mini-signal{font-size:12px;color:#b59a62}.radar-note b{font-weight:400;font-variant-numeric:tabular-nums}footer{min-height:72px;gap:20px;border-top:1px solid #b8bcc226;color:#90959c;font-size:9px;letter-spacing:1.3px}.footer-slash{margin:0 12px;color:#b59a6280}.footer-end{display:flex;align-items:center;gap:9px}.footer-end i{width:4px;height:4px;background:#b59a62;box-shadow:none}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(min-height:1000px){main{min-height:780px}.radar{width:850px}}
@media(max-width:700px){.masthead{height:100px;margin:0 6%}.brand-logo{width:70px;height:78px}.wordmark{gap:8px}.header-note{display:none}.wordmark{font-size:17px}.status{font-size:8px;letter-spacing:1px}main{min-height:620px}.radar{width:650px;max-width:none}.hero{padding:70px 16px 100px}.eyebrow{font-size:20px;letter-spacing:1px;gap:8px}h1{font-size:clamp(36px,11vw,76px)}.intro{font-size:18px;margin:22px 0 32px}.join{min-width:270px}.side-label{display:none}.field-note{left:6%;font-size:7px;gap:8px}.radar-note{right:6%;font-size:7px;gap:8px}.mini-signal{font-size:9px}footer{margin:0 6%;min-height:68px;font-size:8px}footer>span:nth-child(2){display:none}.footer-end{font-size:7px;letter-spacing:.8px}}
@media(prefers-reduced-motion:reduce){.join,.join::before,.join .arrow{animation:none;transition:none}.join:hover,.join:hover .arrow,.join:active{transform:none}}

/* The complete creed remains available without JavaScript or animation. */
.masthead{display:grid;grid-template-columns:1fr minmax(360px,520px) 1fr;gap:24px}
.status{justify-self:end;white-space:nowrap}
.creed-terminal{position:relative;min-width:0;width:100%;font-family:var(--mono);letter-spacing:.4px}
.creed-terminal summary{list-style:none;cursor:pointer;padding:12px 14px;border-left:2px solid #b59a62;background:linear-gradient(90deg,#25272b80,transparent);border-radius:2px}
.creed-terminal summary::-webkit-details-marker{display:none}
.creed-terminal summary:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.creed-heading{display:flex;justify-content:space-between;gap:16px;color:var(--gold);font-size:9px;letter-spacing:1.5px;margin-bottom:9px}
.creed-hint{color:#b8bcc2;font-size:8px;letter-spacing:.5px}
.creed-line{display:block;min-height:46px;font-size:13px;line-height:1.7;color:#deded9}
.terminal-prompt{color:var(--signal)}
.terminal-cursor{color:var(--signal);animation:terminal-blink 1.2s steps(1) infinite}
.creed-full{position:absolute;top:calc(100% + 8px);left:0;right:0;z-index:10;padding:16px 20px;background:#15171a;border:1px solid #b59a6266;box-shadow:0 16px 36px #0008;color:#c8cbd0;font-size:14px;line-height:1.8;letter-spacing:0}
.creed-full p{margin:0 0 10px}.creed-full p:last-child{margin-bottom:0;color:var(--signal)}
.creed-terminal[open] .terminal-cursor{animation:none}
@keyframes terminal-blink{0%,55%{opacity:1}56%,100%{opacity:0}}
@media(max-width:1000px){.masthead{height:auto;min-height:100px;grid-template-columns:1fr auto;gap:0 16px;padding-bottom:12px}.creed-terminal{grid-column:1 / -1;grid-row:2;justify-self:center;max-width:560px}.masthead .status{grid-column:2;grid-row:1}.creed-line{min-height:66px}.creed-full{position:static;margin-top:8px}.creed-terminal summary{padding:10px 12px}}
@media(prefers-reduced-motion:reduce){.terminal-cursor{animation:none}}

/* Glow sits outside the clipped button so its edges can diffuse naturally. */
.join-glow{position:relative;display:inline-block;isolation:isolate}
.join-glow::before{content:'';position:absolute;inset:-18px -32px;z-index:-1;pointer-events:none;background:radial-gradient(ellipse,#d72e3f66 0%,#b81d2b30 38%,transparent 72%);filter:blur(16px);transition:opacity .25s;opacity:.85}
.join-glow:hover::before,.join-glow:focus-within::before{opacity:1}
@media(prefers-reduced-motion:reduce){.join-glow::before{transition:none}}

.brand-text{display:flex;flex-direction:column;gap:5px;line-height:1.1}.brand-subtitle{font-family:var(--mono);font-size:10px;font-weight:400;letter-spacing:2px;color:var(--muted)}
@media(max-width:700px){.brand-subtitle{font-size:8px;letter-spacing:1.5px}}
