/* ── LOGIN SCREEN ────────────────────────────── */
#login-screen{display:flex;min-height:100vh;width:100%;position:relative;z-index:10}
#login-screen.hidden{display:none}

/* LEFT PANEL */
.login-left{flex:1;display:flex;align-items:center;justify-content:center;background:#0d0d0d;padding:40px 20px}
.login-form-wrapper{width:100%;max-width:400px}

.login-logo-area{display:flex;align-items:center;gap:12px;margin-bottom:32px;justify-content:center}
.login-logo-text{font-family:'Syne',sans-serif;font-size:22px;font-weight:800;letter-spacing:.18em;color:#fff}

.login-greeting{font-family:'Syne',sans-serif;font-size:26px;font-weight:800;color:#fff;text-align:center;margin-bottom:6px}
.login-subtitle{font-family:'DM Mono',monospace;font-size:12px;color:#888;text-align:center;margin-bottom:36px}

.login-field{margin-bottom:20px}
.login-label{display:block;font-family:'DM Mono',monospace;font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:#888;margin-bottom:8px}
.login-input-wrap{display:flex;align-items:center;background:#141414;border:1px solid #2a2a2a;border-radius:8px;padding:0 14px;transition:border-color .2s}
.login-input-wrap:focus-within{border-color:#FB0544}
.login-input-icon{color:#555;flex-shrink:0;margin-right:10px;pointer-events:none}
.login-input{flex:1;background:transparent;border:none;color:#f0ede8;font-family:'DM Mono',monospace;font-size:13px;padding:14px 0;outline:none;width:100%;position:relative;z-index:1}
.login-input::placeholder{color:#444}
.login-eye{background:none;border:none;color:#555;cursor:pointer;padding:4px;display:flex;align-items:center;transition:color .15s}
.login-eye:hover{color:#aaa}

.login-forgot{text-align:right;margin-bottom:24px}
.login-forgot a{font-family:'DM Mono',monospace;font-size:11px;color:#FB0544;text-decoration:none;transition:opacity .15s}
.login-forgot a:hover{opacity:.7}

.login-btn{width:100%;display:flex;align-items:center;justify-content:center;gap:10px;padding:14px;background:#FB0544;color:#fff;font-family:'Syne',sans-serif;font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;border:none;border-radius:8px;cursor:pointer;transition:background .2s,transform .1s}
.login-btn:hover{background:#d9043a}
.login-btn:active{transform:scale(.98)}

.login-error{text-align:center;color:#FB0544;font-size:11px;margin-top:14px;min-height:18px;font-family:'DM Mono',monospace}

.login-badges{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:30px;font-family:'DM Mono',monospace;font-size:10px;color:#555}

/* RIGHT PANEL */
.login-right{flex:1;background:#111;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;padding:40px}
.login-right::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 70% 40%,#FB054415 0%,transparent 70%)}
.login-right-content{position:relative;z-index:1;text-align:center;max-width:400px}

.login-hero-logo{margin-bottom:16px;opacity:.9}
.login-hero-brand{font-family:'Syne',sans-serif;font-size:32px;font-weight:800;letter-spacing:.2em;color:#fff;margin-bottom:4px}
.login-hero-tag{font-family:'DM Mono',monospace;font-size:9px;letter-spacing:.3em;color:#FB0544;background:#FB054420;display:inline-block;padding:5px 16px;border-radius:4px;margin-bottom:32px}

.login-hero-title{font-family:'Syne',sans-serif;font-size:24px;font-weight:800;color:#fff;margin-bottom:28px}

.login-stats{display:flex;gap:24px;justify-content:center;background:#1a1a1a;border:1px solid #2a2a2a;border-radius:10px;padding:18px 24px;margin-bottom:28px}
.login-stat{display:flex;flex-direction:column;align-items:center;gap:4px}
.login-stat-num{font-family:'Syne',sans-serif;font-size:18px;font-weight:800;color:#FB0544}
.login-stat-label{font-family:'DM Mono',monospace;font-size:7px;letter-spacing:.16em;text-transform:uppercase;color:#666}

.login-features{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.login-feat{font-family:'DM Mono',monospace;font-size:10px;color:#aaa;background:#1a1a1a;border:1px solid #2a2a2a;padding:6px 14px;border-radius:20px;white-space:nowrap}

/* RESPONSIVE LOGIN */
@media(max-width:800px){
  #login-screen{flex-direction:column}
  .login-right{display:none}
  .login-left{min-height:100vh}
}