:root{--void:#05070d;--panel:#0c1322;--panel-2:#101a2e;--line:#1b2a44;--line-soft:#121c30;--ion:#4c8dff;--ion-dim:#2d5faf;--star:#8fd3ff;--ember:#c9e6ff;--text:#edf2fa;--text-dim:#7c8aa6;--text-dimmer:#4d5a75;--display:'Space Grotesk',sans-serif;--body:'Inter',sans-serif;--mono:'Space Mono',monospace;}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;scrollbar-width:thin;scrollbar-color:var(--line) var(--void);}
::-webkit-scrollbar{width:10px;}
::-webkit-scrollbar-track{background:var(--void);}
::-webkit-scrollbar-thumb{background:var(--line);border-radius:6px;border:2px solid var(--void);}
::-webkit-scrollbar-thumb:hover{background:var(--ion-dim);}
body{background:var(--void);color:var(--text);font-family:var(--body);line-height:1.6;overflow-x:hidden;position:relative;min-height:100vh;display:flex;flex-direction:column;}
a{color:inherit;text-decoration:none;}
::selection{background:var(--ion);color:var(--void);}
body::before{content:'';position:fixed;inset:0;background-image:linear-gradient(var(--line-soft) 1px,transparent 1px),linear-gradient(90deg,var(--line-soft) 1px,transparent 1px);background-size:64px 64px;opacity:.28;pointer-events:none;z-index:0;mask-image:radial-gradient(ellipse 80% 60% at 50% 0%,black 40%,transparent 90%);}
.grain{position:fixed;inset:0;z-index:999;pointer-events:none;opacity:.045;mix-blend-mode:overlay;background-image:url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}
#stars{position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.6;}
.wrap{max-width:1120px;margin:0 auto;padding:0 24px;position:relative;z-index:1;}
header{position:fixed;top:0;left:0;right:0;z-index:100;background:rgba(5,7,13,.72);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--line);}
nav{max-width:1120px;margin:0 auto;padding:18px 24px;display:flex;align-items:center;justify-content:space-between;}
.brand{display:flex;align-items:center;gap:10px;font-family:var(--display);font-weight:600;font-size:14.5px;letter-spacing:.05em;text-shadow:0 0 15px rgba(143,211,255,.5);white-space:nowrap;}
.brand .mark{width:20px;height:20px;flex-shrink:0;}
.brand .mark svg{width:100%;height:100%;display:block;}
.nav-links{display:flex;gap:36px;font-size:14px;color:var(--text-dim);}
.nav-links a{transition:color .25s ease;}
.nav-links a:hover{color:var(--text);}
.nav-links a.active-link{color:var(--star);}
.nav-cta{display:flex;align-items:center;gap:20px;}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 20px;border-radius:6px;font-family:var(--body);font-weight:600;font-size:13.5px;cursor:pointer;border:1px solid transparent;transition:all .25s ease;white-space:nowrap;}
.btn-primary{background:linear-gradient(135deg,var(--ion),#6ea6ff);color:#03060d;}
.btn-primary:hover{box-shadow:0 6px 24px rgba(76,141,255,.35);transform:translateY(-1px);}
.btn-ghost{border-color:var(--line);color:var(--text);background:rgba(255,255,255,.02);}
.btn-ghost:hover{border-color:var(--ion);background:rgba(76,141,255,.08);}
.btn-lg{padding:13px 26px;font-size:14.5px;}
.btn-block{width:100%;}
.nav-link-login{font-size:14px;color:var(--text-dim);padding:8px 4px;transition:color .25s ease;}
.nav-link-login:hover{color:var(--star);}
.btn-join{display:inline-flex;align-items:center;justify-content:center;padding:9px 20px;border-radius:999px;background:linear-gradient(135deg,var(--ion),var(--star));color:#03060d;font-family:var(--body);font-weight:700;font-size:13.5px;white-space:nowrap;transition:all .25s ease;animation:join-pulse 3s ease-in-out infinite;}
.btn-join:hover{box-shadow:0 6px 24px rgba(76,141,255,.5);transform:translateY(-1px) scale(1.03);animation-play-state:paused;}
@keyframes join-pulse{0%,100%{box-shadow:0 0 10px rgba(76,141,255,.3);}50%{box-shadow:0 0 20px rgba(76,141,255,.55);}}
.user-menu{position:relative;display:flex;align-items:center;}
.user-avatar-btn{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,var(--ion),#6ea6ff);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease;}
.user-avatar-btn:hover{box-shadow:0 0 0 3px rgba(76,141,255,.3);transform:scale(1.05);}
.user-avatar-icon{width:19px;height:19px;color:#03060d;}
.user-dropdown{position:absolute;top:calc(100% + 10px);right:0;min-width:160px;background:var(--panel-2);border:1px solid var(--line);border-radius:10px;padding:8px;box-shadow:0 16px 40px rgba(0,0,0,.55);opacity:0;visibility:hidden;transform:translateY(-6px);transition:all .2s ease;z-index:200;}
.user-dropdown.open{opacity:1;visibility:visible;transform:translateY(0);}
.user-dropdown-header{display:block;padding:10px 12px 12px;border-radius:6px;transition:background .15s ease;}
.user-dropdown-header:hover{background:rgba(76,141,255,.1);}
.user-dropdown-label{display:block;font-family:var(--mono);font-size:.62rem;letter-spacing:.08em;text-transform:uppercase;color:var(--text-dimmer);margin-bottom:3px;}
.user-dropdown-name{display:block;font-family:var(--body);font-weight:600;font-size:.95rem;color:var(--star);}
.user-dropdown-divider{height:1px;background:var(--line);margin:2px 0 6px;}
.user-dropdown a{display:block;padding:9px 12px;border-radius:6px;font-size:.9rem;color:var(--text-dim);transition:all .15s ease;}
.user-dropdown a:hover{background:rgba(76,141,255,.1);color:var(--text);}
.logout-link{color:var(--text) !important;margin-top:4px;border-top:1px solid var(--line);border-radius:0 0 6px 6px !important;}
.logout-link:hover{color:#ff9baa !important;background:rgba(138,45,59,.15) !important;}
.menu-toggle{display:none;background:none;border:1px solid var(--line);border-radius:6px;width:38px;height:38px;color:var(--text);font-size:18px;cursor:pointer;align-items:center;justify-content:center;}
footer{padding:48px 0 32px;border-top:1px solid var(--line);position:relative;z-index:1;}
.footer-grid{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:32px;}
.footer-brand{display:flex;align-items:center;gap:10px;font-family:var(--display);font-weight:600;font-size:14px;margin-bottom:10px;}
.footer-brand .mark{width:18px;height:18px;}
footer p.tag{color:var(--text-dimmer);font-size:.85rem;max-width:300px;}
.footer-links{display:flex;gap:48px;flex-wrap:wrap;}
.footer-col h5{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-dimmer);margin-bottom:14px;}
.footer-col a{display:block;color:var(--text-dim);font-size:.9rem;margin-bottom:10px;transition:color .2s ease;}
.footer-col a:hover{color:var(--star);}
.footer-bottom{margin-top:48px;padding-top:24px;border-top:1px solid var(--line-soft);display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-family:var(--mono);font-size:11px;color:var(--text-dimmer);}
.form-shell{width:100%;max-width:420px;margin:0 auto;}
.form-shell .section-eyebrow{font-family:var(--mono);font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-dimmer);display:block;text-align:center;margin-bottom:14px;}
.form-shell h1{font-family:var(--display);font-weight:600;font-size:clamp(1.6rem,3.4vw,2.1rem);letter-spacing:-.01em;text-align:center;margin-bottom:14px;}
.form-shell .subtitle{text-align:center;color:var(--text-dim);font-size:.95rem;max-width:380px;margin:0 auto 32px;}
.form-panel{background:radial-gradient(ellipse 120% 100% at 50% 0%,var(--panel-2),var(--panel));border:1px solid var(--line);border-radius:16px;padding:44px 40px;position:relative;overflow:hidden;box-shadow:0 8px 32px rgba(0,0,0,.5);}
.feedback{text-align:center;margin-bottom:24px;padding:12px 16px;border-radius:10px;font-family:var(--mono);font-size:.82rem;border:1px solid;}
.feedback.error{border-color:#8a2d3b;color:#ff9baa;background:rgba(60,15,22,.35);}
.feedback.success{border-color:#1f8f4f;color:#5fe39a;background:rgba(31,143,79,.12);}
.group{margin-bottom:20px;}
.group label{display:block;font-family:var(--mono);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--star);margin-bottom:10px;}
.required-mark{color:#ff9baa;}
.hint{display:block;font-family:var(--mono);font-size:.7rem;color:var(--text-dimmer);margin-top:6px;}
.group input{width:100%;padding:13px 14px;background:rgba(5,7,13,.5);border:1px solid var(--line);color:var(--text);border-radius:8px;font-family:var(--body);font-size:.95rem;transition:border-color .2s,box-shadow .2s;}
.group input:focus{outline:none;border-color:var(--ion);box-shadow:0 0 0 3px rgba(76,141,255,.15);}
.group input::placeholder{color:var(--text-dimmer);}
.form-footer{text-align:center;margin-top:24px;font-size:.88rem;color:var(--text-dim);}
.form-footer a{color:var(--star);transition:color .2s;}
.form-footer a:hover{color:var(--text);}
main.auth-main{flex:1;display:flex;align-items:center;justify-content:center;padding:140px 24px 60px;position:relative;z-index:1;}
@media(max-width:720px){.nav-links{display:none;}.menu-toggle{display:flex;}.nav-cta .nav-link-login,.nav-cta .btn-join{display:none;}main.auth-main{padding:120px 20px 50px;}.form-panel{padding:32px 20px;}}
@media(prefers-reduced-motion:reduce){*{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;}html{scroll-behavior:auto;}}

/* Mobile dropdown — pattern refined by Gemini for the forums page,
   adopted site-wide. Anchored to the toggle button with a hard z-index
   so it can never render behind other page content, unlike the earlier
   fixed-position full-width version this replaces. */
.mobile-dropdown-menu{
  display:none;
  position:absolute;
  top:100%;
  right:24px;
  background-color:var(--panel-2);
  border:1px solid var(--line);
  border-radius:8px;
  box-shadow:0 8px 24px rgba(0,0,0,0.7);
  padding:10px 0;
  z-index:9999;
  flex-direction:column;
  min-width:200px;
}
.mobile-dropdown-menu.open{display:flex;}
.mobile-dropdown-menu a{
  padding:12px 24px;
  color:var(--text);
  text-decoration:none;
  font-family:var(--body);
  font-size:14px;
  font-weight:500;
  border-bottom:1px solid var(--line-soft);
}
.mobile-dropdown-menu a:hover{background-color:rgba(76,141,255,0.1);color:var(--ion);}
.mobile-dropdown-menu a.active-link{color:var(--star) !important;}
.mobile-dropdown-menu a:last-child{border-bottom:none;}
