/* Facade theme overlay (reference: E:\CLAUDE\x-connect-landing dark theme).
 * Styling only; loaded after portal.css. Auth logic untouched. */
:root{
  --fx-bg:#080B10;--fx-bg-2:#0F151E;--fx-bg-3:#151D28;
  --fx-ink:#E7EEF6;--fx-ink-2:#8B98A8;--fx-ink-3:#64707F;
  --fx-line:#1C2532;--fx-line-2:#2A3547;--fx-accent:#34D3EB;--fx-accent-2:#7BE4F5;
  --fx-body:"Figtree","PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,sans-serif;
  --fx-display:"Archivo","PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,sans-serif;
  --fx-mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
  font-family:var(--fx-body);color:var(--fx-ink);
}
h1,h2,.entry-heading,.brand{font-family:var(--fx-display)}
h1,h2{color:var(--fx-ink)}
.tagline{color:var(--fx-ink-2)}
.entry-description{color:var(--fx-ink-2)}
.eyebrow,.auth-divider{font-family:var(--fx-mono)}
/* lighter X marks (brand + Chat + Code jewels) */
.jewel.silver::before{filter:brightness(1.55) contrast(1.05) saturate(.6) drop-shadow(0 0 7px rgba(225,245,255,.55))}
.jewel.blue::before{filter:brightness(1.5) saturate(1.35) drop-shadow(0 0 7px rgba(90,170,255,.55))}
.jewel.rose::before{filter:brightness(1.45) saturate(1.15) hue-rotate(-6deg) drop-shadow(0 0 7px rgba(255,190,170,.5))}

/* 1. top-bar Sign in: understated */
#session{color:var(--fx-ink-2);font-family:var(--fx-body);letter-spacing:.04em;padding:6px 12px;border:1px solid var(--fx-line-2);border-radius:999px;background:transparent;transition:color .2s,border-color .2s}
#session:hover{color:var(--fx-ink);border-color:var(--fx-ink-3)}
#sound{color:var(--fx-ink-3)}

/* 2. login: dark small fields + icon button in one row */
.auth .login-row{display:flex;gap:6px;align-items:stretch}
.auth input::placeholder,.signup-form input::placeholder{color:var(--fx-ink-3)}
.auth-submit.auth-icon{flex:none;margin:0;width:38px;height:38px;border-radius:10px;background:var(--fx-bg-3);border:1px solid var(--fx-line-2);color:var(--fx-accent-2);display:grid;place-items:center;padding:0}
.auth-submit.auth-icon:hover{background:#1b2533;color:var(--fx-ink);border-color:var(--fx-accent)}
.auth-submit.auth-icon svg{width:17px;height:17px}
/* 4. forgot beside fields, sign up at bottom */
.auth-forgot{display:block;margin:7px 0 0 auto;font-size:10.5px;color:var(--fx-ink-3)}
.auth-bottom{margin-top:14px;font-size:11px;color:var(--fx-ink-3)}
.auth-link{color:var(--fx-ink-2)}.auth-link:hover{color:var(--fx-ink)}
/* 3. social logo row */
.auth-social{display:flex;justify-content:center;gap:10px}
.social{width:38px;height:38px;padding:0;display:grid;place-items:center;border:1px solid var(--fx-line-2);border-radius:10px;background:var(--fx-bg-2);color:var(--fx-ink-2)}
.social:hover{border-color:var(--fx-ink-3);color:var(--fx-ink);background:var(--fx-bg-3)}
.social svg{width:18px;height:18px}

/* soften pure-white text */
.auth-signed,.auth-signed strong,.auth input,.signup-form input{color:var(--fx-ink)}
.auth-msg,.signup-copy,.signup-terms{color:var(--fx-ink-2)}
/* signup section in facade style */
/* footer */
.site-foot{display:flex;flex-direction:column;align-items:center;gap:10px;padding:8px 24px 56px;text-align:center}
.join-us{font-family:var(--fx-display);font-size:15px;color:var(--fx-ink);text-decoration:none;letter-spacing:.01em}
.join-us:hover{color:var(--fx-accent-2)}
.start-commission{font-family:var(--fx-body);font-size:12px;color:var(--fx-ink-3);letter-spacing:.04em;background:none;border:0;padding:4px 0;cursor:pointer}
.start-commission:hover{color:var(--fx-ink)}
/* shared dark input style: login row + create-account form */
.fx-field{flex:1;min-width:0;border:1px solid var(--fx-line-2)!important;border-radius:10px;background:var(--fx-bg-2);margin:0!important;transition:border-color .2s,background .2s}
.signup-form .fx-field+.fx-field{margin-top:6px!important}
.fx-field:focus-within{border-color:var(--fx-accent)!important;background:var(--fx-bg-3)}
.fx-field input[type=email],.fx-field input[type=password]{height:36px!important;font-size:12.5px;color:var(--fx-ink);text-align:left!important;padding:0 11px!important;font-family:var(--fx-body)}
