/* ══════════════════════════════════════════════════════════════
   LOGIN OVERLAY — Email + password, centered single-column
   Uses tokens from styles.css/linear.css. NO new design vars.
   PR #61 ships login + forgot-password + reset-password.
   ══════════════════════════════════════════════════════════════ */

.login-overlay{
  position:fixed;inset:0;z-index:9100;
  display:none;align-items:center;justify-content:center;
  padding:24px;
  background:var(--bg-base);
  font-family:var(--mono);
  overflow-y:auto;
}
.login-overlay.open{display:flex;}

/* faint diagonal stripe — matches body texture */
.login-overlay::before{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:repeating-linear-gradient(45deg,transparent,transparent 10px,rgba(255,255,255,0.015) 10px,rgba(255,255,255,0.015) 20px);
}

.login-stack{
  position:relative;
  display:flex;flex-direction:column;align-items:center;
  gap:24px;
  width:100%;max-width:480px;
}

.login-logo{
  width:360px;height:auto;
  display:flex;justify-content:center;
}
.login-logo svg{width:100%;height:auto;display:block;}

.login-tagline{
  font-size:11px;
  letter-spacing:0.32em;
  color:var(--text-3);
  text-transform:uppercase;
  text-align:center;
}

/* ── Card ─────────────────────────────────────────────────── */
.login-card{
  position:relative;
  width:100%;
  padding:36px 32px 28px;
  background:var(--bg-panel);
  border:1px solid var(--border);
}
.login-card::before,
.login-card::after,
.login-card>.login-corner-bl,
.login-card>.login-corner-br{
  content:'';position:absolute;width:10px;height:10px;
  border:1px solid var(--amber);
}
.login-card::before{top:-1px;left:-1px;border-right:none;border-bottom:none;}
.login-card::after{top:-1px;right:-1px;border-left:none;border-bottom:none;}
.login-card>.login-corner-bl{bottom:-1px;left:-1px;border-right:none;border-top:none;}
.login-card>.login-corner-br{bottom:-1px;right:-1px;border-left:none;border-top:none;}

.login-row{margin-bottom:18px;}
.login-row:last-of-type{margin-bottom:0;}

.login-label{
  display:block;
  font-size:10px;letter-spacing:0.18em;
  color:var(--text-3);
  margin-bottom:8px;
  text-transform:uppercase;
}

.login-input{
  width:100%;
  background:var(--bg-panel-body);
  border:1px solid var(--border);
  color:var(--text-2);
  font-family:var(--mono);
  font-size:14px;letter-spacing:0.04em;
  padding:12px 14px;
  outline:none;
  transition:border-color 0.15s,box-shadow 0.15s;
}
.login-input:focus{
  border-color:var(--amber);
  box-shadow:0 0 0 1px var(--amber-glow);
}
.login-input:disabled{opacity:0.5;cursor:not-allowed;}
.login-input::placeholder{color:var(--gray-200);}

/* normalize email — never uppercase the user's typed value */
input.login-input[type=email]{text-transform:none;}
input.login-input[type=password]{letter-spacing:0.18em;}

.login-forgot{
  display:block;margin-top:8px;
  background:none;border:none;
  color:var(--text-3);
  font-family:var(--mono);font-size:10px;letter-spacing:0.18em;
  text-transform:uppercase;
  cursor:pointer;
  padding:4px 0;
  margin-left:auto;
  text-align:right;
  width:fit-content;
}
.login-forgot:hover{color:var(--amber);}
.login-forgot:focus-visible{outline:2px solid var(--amber);outline-offset:2px;}

.login-row-actions{
  display:flex;justify-content:flex-end;
  margin-top:6px;margin-bottom:18px;
}

.login-error{
  min-height:1.2em;
  font-size:11px;letter-spacing:0.12em;
  color:#ef4444;
  margin:8px 0 14px;
  text-transform:uppercase;
}
.login-error:empty{margin:0;min-height:0;}

.login-hint{
  font-size:10px;letter-spacing:0.14em;
  color:var(--text-3);
  margin-top:10px;
  text-transform:uppercase;
}

.login-submit{
  width:100%;
  background:var(--amber);
  color:var(--bg-base);
  border:1px solid var(--amber);
  font-family:var(--mono);
  font-size:13px;letter-spacing:0.18em;
  font-weight:700;
  padding:14px 20px;
  cursor:pointer;
  text-transform:uppercase;
  transition:background 0.15s,box-shadow 0.15s;
  margin-top:6px;
}
.login-submit:hover:not(:disabled){background:var(--amber-bright);box-shadow:0 0 18px var(--amber-glow);}
.login-submit:disabled{opacity:0.45;cursor:not-allowed;}
.login-submit:focus-visible{outline:2px solid var(--text-1);outline-offset:2px;}

.login-below{
  display:flex;flex-direction:column;align-items:center;
  gap:6px;
  margin-top:6px;
}
.login-link{
  background:none;border:none;
  color:var(--text-3);
  font-family:var(--mono);font-size:11px;letter-spacing:0.16em;
  text-transform:uppercase;
  cursor:pointer;padding:6px 8px;
}
.login-link:hover{color:var(--amber);}
.login-link:focus-visible{outline:2px solid var(--amber);outline-offset:2px;}

/* ── Forgot-password sub-modal ──────────────────────────── */
.login-modal{
  position:fixed;inset:0;z-index:9200;
  display:none;align-items:center;justify-content:center;
  padding:24px;
  background:rgba(8,8,8,0.85);
  backdrop-filter:blur(2px);
}
.login-modal.open{display:flex;}
.login-modal-card{
  position:relative;
  width:100%;max-width:440px;
  background:var(--bg-panel);
  border:1px solid var(--border);
  padding:32px 28px;
}
.login-modal-card::before,
.login-modal-card::after{
  content:'';position:absolute;width:10px;height:10px;
  border:1px solid var(--amber);
}
.login-modal-card::before{top:-1px;left:-1px;border-right:none;border-bottom:none;}
.login-modal-card::after{top:-1px;right:-1px;border-left:none;border-bottom:none;}
.login-modal-close{
  position:absolute;top:8px;right:8px;
  background:none;border:none;
  color:var(--text-3);font-size:18px;
  cursor:pointer;line-height:1;padding:6px 10px;
}
.login-modal-close:hover{color:var(--amber);}
.login-modal-title{
  font-size:14px;letter-spacing:0.2em;
  color:var(--text-1);
  margin-bottom:8px;
  text-transform:uppercase;
}
.login-modal-copy{
  font-size:11px;letter-spacing:0.12em;
  color:var(--text-3);
  margin-bottom:20px;
  text-transform:uppercase;
  line-height:1.6;
}
.login-modal-success{
  font-size:11px;letter-spacing:0.12em;
  color:#22c55e;
  margin:8px 0 14px;
  text-transform:uppercase;
}

/* ── Signup-specific (PR #62) ─────────────────────────── */
.signup-input--code{
  text-transform:uppercase;
  letter-spacing:0.22em;
  font-size:16px;
}
.signup-input--code::placeholder{
  letter-spacing:0.18em;
}

/* ── Welcome modal (PR #62) ───────────────────────────── */
.welcome-modal{
  position:fixed;inset:0;z-index:9300;
  display:none;align-items:center;justify-content:center;
  padding:24px;
  background:rgba(8,8,8,0.88);
  backdrop-filter:blur(3px);
  font-family:var(--mono);
}
.welcome-modal.open{display:flex;}
.welcome-modal-card{
  position:relative;
  width:100%;max-width:520px;
  background:var(--bg-panel);
  border:1px solid var(--border);
  padding:36px 32px 28px;
}
.welcome-modal-card::before,
.welcome-modal-card::after,
.welcome-modal-card>.welcome-corner-bl,
.welcome-modal-card>.welcome-corner-br{
  content:'';position:absolute;width:10px;height:10px;
  border:1px solid var(--amber);
}
.welcome-modal-card::before{top:-1px;left:-1px;border-right:none;border-bottom:none;}
.welcome-modal-card::after{top:-1px;right:-1px;border-left:none;border-bottom:none;}
.welcome-modal-card>.welcome-corner-bl{bottom:-1px;left:-1px;border-right:none;border-top:none;}
.welcome-modal-card>.welcome-corner-br{bottom:-1px;right:-1px;border-left:none;border-top:none;}
.welcome-title{
  font-size:14px;letter-spacing:0.24em;
  color:var(--text-1);
  text-transform:uppercase;
  margin-bottom:16px;
}
.welcome-row{
  display:flex;justify-content:space-between;align-items:baseline;
  padding:10px 0;
  border-top:1px dashed var(--border);
  font-size:11px;letter-spacing:0.14em;
  text-transform:uppercase;
}
.welcome-row:last-of-type{border-bottom:1px dashed var(--border);margin-bottom:18px;}
.welcome-row-label{color:var(--text-3);}
.welcome-row-value{color:var(--amber);font-weight:700;}
.welcome-copy{
  font-size:11px;letter-spacing:0.12em;
  color:var(--text-3);
  margin:18px 0 22px;
  line-height:1.7;
  text-transform:uppercase;
}
.welcome-dismiss{
  width:100%;
  background:var(--amber);
  color:var(--bg-base);
  border:1px solid var(--amber);
  font-family:var(--mono);
  font-size:13px;letter-spacing:0.18em;
  font-weight:700;
  padding:12px 18px;
  cursor:pointer;
  text-transform:uppercase;
  transition:background 0.15s,box-shadow 0.15s;
}
.welcome-dismiss:hover{background:var(--amber-bright);box-shadow:0 0 18px var(--amber-glow);}
.welcome-dismiss:focus-visible{outline:2px solid var(--text-1);outline-offset:2px;}

/* ── Reset-password page (standalone) ─────────────────── */
body.login-page{
  display:flex;align-items:center;justify-content:center;
  min-height:100vh;height:auto;overflow:auto;
  margin:0;padding:24px;
}

/* ── Reduced motion ───────────────────────────────────── */
@media (prefers-reduced-motion: reduce){
  .login-input,.login-submit{transition:none;}
}

/* ── High-contrast mode ───────────────────────────────── */
@media (prefers-contrast: more){
  .login-card,.login-input,.login-modal-card{border-color:var(--text-1);}
  .login-tagline,.login-label,.login-link,.login-modal-copy{color:var(--text-1);}
}

/* ── Mobile ───────────────────────────────────────────── */
@media (max-width: 520px){
  .login-stack{max-width:100%;gap:20px;}
  .login-logo{width:280px;}
  .login-card{padding:28px 22px 22px;}
  .login-modal-card{padding:24px 20px;}
}