@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Rajdhani:wght@400;500;600;700&display=swap');

* { box-sizing:border-box; margin:0; padding:0; }
a { text-decoration:none; color:inherit; }
html { zoom:1.1; }
body { font-family:'Rajdhani',sans-serif; background:#111110; color:#c8c8c8; }

.scanlines { position:fixed;top:0;left:0;right:0;bottom:0;pointer-events:none;z-index:0;
  background:repeating-linear-gradient(0deg,transparent,transparent 3px,rgba(0,0,0,0.04) 3px,rgba(0,0,0,0.04) 6px); }

.page { position:relative;z-index:1;width:100%;padding:0 40px 64px; }

/* NAV */
nav { background:#0d0d0c;border-bottom:2px solid #fb7d04;padding:0 40px;position:sticky;top:0;z-index:10;width:100%;position:relative; }
.nav-inner { width:100%;display:flex;align-items:center;overflow-x:auto;scrollbar-width:none; }
.nav-inner::-webkit-scrollbar { display:none; }

@media(max-width:768px) {
  nav { padding:0 0 0 12px; }
  nav::after { content:'›';position:absolute;right:0;top:0;bottom:2px;width:24px;background:none;pointer-events:none;z-index:1;display:flex;align-items:center;justify-content:center;color:#fb7d04;font-size:20px;line-height:1;transition:opacity .15s; }
  nav.nav-scrolled-end::after { opacity:0; }
  .nav-inner { padding-right:28px; }
}
.nav-item { font-size:13px;letter-spacing:2px;text-transform:uppercase;color:#606060;padding:14px 20px;cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-2px;transition:color .15s,border-color .15s;font-weight:600;white-space:nowrap;flex-shrink:0;text-decoration:none;display:inline-block; }
.nav-item:hover { color:#c8c8c8; }
.nav-item.active { color:#fb7d04;border-bottom-color:#fb7d04; }

/* HEADER */
header { border-bottom:1px solid #2a2a28;padding:22px 0 18px;display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%; }
.logo-area { display:flex;align-items:center;gap:14px;text-decoration:none; }
.logo-icon { width:44px;height:44px;flex-shrink:0;border:1.5px solid #fb7d04;overflow:hidden; }
.logo-icon img { width:100%;height:100%;object-fit:cover;display:block; }
.logo-text { font-family:'Bebas Neue',sans-serif;font-size:24px;letter-spacing:2px;color:#f0f0f0;line-height:1; }
.logo-sub { font-size:12px;letter-spacing:2px;color:#606060;text-transform:uppercase;line-height:1;margin-top:4px; }
.header-badge { font-size:12px;letter-spacing:2px;color:#808080;text-transform:uppercase;border:1px solid #303030;padding:5px 12px;background:#0d0d0c;white-space:nowrap; }

/* FOOTER */
footer { margin-top:48px;border-top:1px solid #2a2a28;padding-top:20px;display:flex;justify-content:space-between;align-items:center;gap:12px;width:100%; }
.footer-text { font-size:13px;color:#484845;letter-spacing:1px; }
.footer-link { font-size:13px;color:#787875;text-decoration:none;letter-spacing:1px;transition:color .15s; }
.footer-link:hover { color:#fb7d04; }

/* ── NAV ACCOUNT ─────────────────────────────────── */
.nav-right { margin-left:auto;flex-shrink:0;display:flex;align-items:center;padding-left:8px; }
#nav-signin-btn { font-size:11px;letter-spacing:1.5px;text-transform:uppercase;font-weight:700;font-family:'Rajdhani',sans-serif;padding:6px 14px;border:1px solid #5a2e00;background:#1a0e00;color:#fb7d04;cursor:pointer;transition:background .15s; }
#nav-signin-btn:hover { background:#2a1800; }
#nav-user-area { display:none;align-items:center;gap:8px; }
.nav-username { font-size:12px;letter-spacing:1px;text-transform:uppercase;color:#c0c0c0;font-weight:700;white-space:nowrap; }
#nav-signout-btn { font-size:11px;letter-spacing:1px;text-transform:uppercase;font-weight:700;font-family:'Rajdhani',sans-serif;padding:5px 10px;border:1px solid #2a2a28;background:transparent;color:#606060;cursor:pointer;transition:all .15s; }
#nav-signout-btn:hover { color:#c0c0c0;border-color:#606060; }

/* ── AUTH MODAL ──────────────────────────────────── */
#auth-overlay { position:fixed;inset:0;background:rgba(0,0,0,.82);z-index:1000;display:none;align-items:center;justify-content:center; }
#auth-modal { background:#141412;border:1px solid #2a2a28;border-top:2px solid #fb7d04;width:100%;max-width:380px;margin:16px; }
.auth-modal-head { display:flex;align-items:stretch;border-bottom:1px solid #1e1e1c; }
.auth-tabs { display:flex;flex:1; }
.auth-tab { flex:1;font-size:12px;letter-spacing:2px;text-transform:uppercase;font-weight:700;font-family:'Rajdhani',sans-serif;padding:12px;border:none;border-bottom:2px solid transparent;margin-bottom:-1px;background:transparent;color:#606060;cursor:pointer;transition:all .15s; }
.auth-tab:hover { color:#c0c0c0; }
.auth-tab.active { color:#fb7d04;border-bottom-color:#fb7d04; }
#auth-close { background:transparent;border:none;color:#505050;cursor:pointer;padding:10px 16px;font-size:16px;line-height:1;transition:color .15s; }
#auth-close:hover { color:#c0c0c0; }
.auth-panel { display:flex;flex-direction:column;gap:8px;padding:20px; }
.auth-panel input { background:#0f0f0e;border:1px solid #2a2a28;color:#e0e0e0;font-family:'Rajdhani',sans-serif;font-size:14px;font-weight:600;padding:9px 12px;outline:none;transition:border-color .15s;width:100%; }
.auth-panel input:focus { border-color:#fb7d04; }
.auth-submit { font-size:12px;letter-spacing:2px;text-transform:uppercase;font-weight:700;font-family:'Rajdhani',sans-serif;padding:10px;border:1px solid #fb7d04;background:#1a0e00;color:#fb7d04;cursor:pointer;transition:background .15s;margin-top:4px; }
.auth-submit:hover:not(:disabled) { background:#2a1800; }
.auth-submit:disabled { opacity:.5;cursor:not-allowed; }
.auth-error { color:#d06060;font-size:12px;letter-spacing:.5px;padding:0 20px 16px;min-height:16px;line-height:1.4; }

/* MOBILE */
@media(max-width:640px) {
  .page { padding:0 18px 48px; }
  nav { padding:0 0 0 12px; }
  header { padding:14px 0 12px; }
  .header-badge { display:none; }
  footer { flex-direction:column;align-items:flex-start;gap:8px; }
}