/* Production login (JR): dark, gold accents. Only this screen; the rest of the
 * app keeps the standard theme. */
:root { --black: #0b0b0d; --carbon: #141416; --border: #26262a; --gold: #c9a44c; --gold2: #e6c97a; --text: #f2efe8; --muted: #8a8a90; }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; display: grid; place-items: center; padding: 16px;
  background: radial-gradient(1200px 600px at 50% -10%, #1d1a12 0%, var(--black) 60%);
  font-family: Inter, system-ui, -apple-system, sans-serif; color: var(--text); }
.card { width: min(420px, 100%); background: var(--carbon); border: 1px solid var(--border); border-radius: 18px;
  padding: 44px 40px 32px; box-shadow: 0 30px 80px rgba(0,0,0,.6), inset 0 1px 0 rgba(255,255,255,.04); position: relative; }
.card::before { content: ""; position: absolute; inset: 0; border-radius: 18px; padding: 1px; pointer-events: none;
  background: linear-gradient(160deg, rgba(201,164,76,.55), transparent 45%, transparent 60%, rgba(201,164,76,.25));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; }
.logo { display: block; margin: 0 auto 14px; width: 84px; height: 84px; object-fit: contain; filter: drop-shadow(0 6px 18px rgba(201,164,76,.25)); }
h1 { font-family: "Cormorant Garamond", Georgia, serif; font-weight: 600; font-size: 30px; letter-spacing: .14em; text-align: center; margin: 0; color: var(--gold2); }
.sub { text-align: center; color: var(--muted); font-size: 12px; letter-spacing: .28em; text-transform: uppercase; margin: 6px 0 30px; }
.sep { height: 1px; background: linear-gradient(90deg, transparent, var(--gold), transparent); margin: 0 auto 28px; width: 70%; }
label { display: block; font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); margin: 0 0 8px; }
input { width: 100%; background: #0f0f11; border: 1px solid var(--border); border-radius: 10px; color: var(--text); padding: 13px 14px; font-size: 15px; outline: none; transition: border-color .2s, box-shadow .2s; }
input:focus { border-color: var(--gold); box-shadow: 0 0 0 3px rgba(201,164,76,.15); }
.f { margin-bottom: 18px; }
button { width: 100%; margin-top: 8px; padding: 14px; border: 0; border-radius: 10px; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; font-size: 13px;
  color: #141416; background: linear-gradient(180deg, var(--gold2), var(--gold)); cursor: pointer; box-shadow: 0 10px 24px rgba(201,164,76,.25); }
button:hover { filter: brightness(1.05); }
.foot { margin-top: 26px; display: flex; justify-content: space-between; font-size: 11px; color: var(--muted); letter-spacing: .08em; }
.env-badge { position: fixed; top: 18px; right: 18px; font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: var(--gold); border: 1px solid rgba(201,164,76,.4); border-radius: 999px; padding: 6px 12px; }
.alert { background: rgba(220,53,69,.12); border: 1px solid rgba(220,53,69,.45); color: #f5b5bb; border-radius: 10px; padding: 10px 12px; font-size: 13px; margin-bottom: 14px; }
.alert-ok { background: rgba(201,164,76,.12); border-color: rgba(201,164,76,.45); color: var(--gold2); }