/* ──────────────────────────────────────────────
   ANNOUNCE BAR
──────────────────────────────────────────────── */
.announce{
  background:var(--nv-dark);color:var(--nv-gold-light);
  text-align:center;padding:9px 20px;
  font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;
  position:relative;overflow:hidden;
  border-bottom:1px solid rgba(201,168,76,.1);
}
.announce::before{
  content:'';position:absolute;top:0;left:-100%;width:60%;height:100%;
  background:linear-gradient(90deg,transparent,rgba(232,201,122,.12),transparent);
  animation:shimmer 3.2s ease-in-out infinite;
}
@keyframes shimmer{to{left:160%;}}

/* ──────────────────────────────────────────────
   NAV
──────────────────────────────────────────────── */
.nav{
  position:sticky;top:0;z-index:200;
  background:rgba(26,18,8,.92);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border-bottom:1px solid rgba(201,168,76,.15);
  padding:0 24px;height:56px;
  display:flex;align-items:center;justify-content:space-between;
}
.nav-logo{
  font-family:'Playfair Display',serif;font-size:1.3rem;font-weight:900;
  color:#fff;letter-spacing:-.01em;
}
.nav-logo span{color:var(--nv-gold);}
.nav-tag{
  font-size:.68rem;color:rgba(255,255,255,.22);
  font-family:'DM Sans',sans-serif;font-weight:400;
  margin-left:8px;letter-spacing:.06em;
}
.nav-right{display:flex;align-items:center;gap:12px;}

.nav-balance{
  display:flex;align-items:center;gap:6px;
  background:rgba(201,168,76,.1);border:1px solid rgba(201,168,76,.25);
  border-radius:50px;padding:5px 12px;
  font-size:.78rem;font-weight:600;color:var(--nv-gold-light);
}
.nav-dot{width:5px;height:5px;border-radius:50%;background:var(--nv-gold);}
.nav-topup{
  background:var(--nv-gold);color:var(--nv-dark);
  border:none;border-radius:var(--r);
  padding:7px 14px;font-size:.78rem;font-weight:700;
  letter-spacing:.04em;cursor:pointer;
  font-family:'DM Sans',sans-serif;
  transition:opacity .2s;
}
.nav-topup:hover{opacity:.88;}

.nav-avatar{
  width:32px;height:32px;border-radius:50%;
  background:linear-gradient(135deg,var(--nv-gold),var(--nv-gold-amber));
  display:flex;align-items:center;justify-content:center;
  font-size:.72rem;font-weight:700;color:var(--nv-dark);
  border:2px solid rgba(201,168,76,.3);flex-shrink:0;
}
.nav-logout{
  font-size:.75rem;color:rgba(255,255,255,.28);background:none;
  border:none;cursor:pointer;letter-spacing:.03em;transition:color .2s;
}
.nav-logout:hover{color:var(--nv-gold);}
.nav-signin-btn{
  padding:7px 16px;border:1px solid rgba(201,168,76,.3);
  background:transparent;color:var(--nv-gold-light);
  border-radius:var(--r);font-size:.78rem;font-weight:600;cursor:pointer;
  transition:all .2s;
}
.nav-signin-btn:hover{background:rgba(201,168,76,.08);border-color:rgba(201,168,76,.5);}

/* ──────────────────────────────────────────────
   TRUST BAR
──────────────────────────────────────────────── */
.trust-bar{
  background:var(--nv-dark-mid);padding:9px 16px;
  display:flex;justify-content:center;gap:0;
  overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;
  border-bottom:1px solid rgba(201,168,76,.1);
}
.trust-bar::-webkit-scrollbar{display:none;}
.trust-pill{
  display:flex;align-items:center;gap:5px;
  color:var(--nv-gold-light);font-size:11px;
  white-space:nowrap;font-weight:500;padding:0 14px 0 0;flex-shrink:0;
}
.trust-pill+.trust-pill{border-left:1px solid rgba(201,168,76,.2);padding-left:14px;}

/* ──────────────────────────────────────────────
   BUTTON SYSTEM
──────────────────────────────────────────────── */
.btn-primary{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  background:linear-gradient(90deg,var(--nv-gold),var(--nv-gold-amber));
  color:var(--nv-dark);border:none;border-radius:var(--r);
  padding:13px 24px;font-size:.85rem;font-weight:700;
  letter-spacing:.08em;text-transform:uppercase;cursor:pointer;
  transition:opacity .2s,transform .15s;width:100%;
}
.btn-primary:hover{opacity:.9;transform:translateY(-1px);}
.btn-primary:active{transform:translateY(0);}
.btn-primary:disabled{opacity:.35;cursor:not-allowed;transform:none;}

.btn-secondary{
  display:inline-flex;align-items:center;justify-content:center;
  background:transparent;color:rgba(255,255,255,.38);
  border:1px solid rgba(255,255,255,.12);border-radius:var(--r);
  padding:11px 20px;font-size:.82rem;font-weight:500;cursor:pointer;
  transition:all .2s;width:100%;
}
.btn-secondary:hover{color:var(--nv-gold-light);border-color:rgba(201,168,76,.3);}

.btn-ghost{
  background:none;border:none;cursor:pointer;
  font-size:.78rem;color:rgba(255,255,255,.3);
  letter-spacing:.03em;transition:color .2s;
}
.btn-ghost:hover{color:var(--nv-gold);}

/* ──────────────────────────────────────────────
   FORMS
──────────────────────────────────────────────── */
.form-field{display:flex;flex-direction:column;gap:5px;margin-bottom:12px;}
.form-label{
  font-size:9.5px;font-weight:700;text-transform:uppercase;
  letter-spacing:.1em;color:rgba(255,255,255,.32);
}
.form-input,.form-select{
  background:rgba(255,255,255,.05);
  border:1px solid rgba(201,168,76,.2);border-radius:var(--r);
  padding:11px 13px;font-family:'DM Sans',sans-serif;
  font-size:.88rem;color:#fff;outline:none;
  transition:border-color .2s,background .2s;width:100%;
}
.form-input:focus,.form-select:focus{
  border-color:var(--nv-gold);background:rgba(255,255,255,.07);
}
.form-input::placeholder{color:rgba(255,255,255,.18);}
.form-select{appearance:none;cursor:pointer;}
.form-select option{background:var(--nv-dark);color:#fff;}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.form-grid .full{grid-column:1/-1;}
.form-error{
  font-size:.75rem;color:var(--nv-red);
  margin-top:6px;line-height:1.4;
}
.form-hint{font-size:.7rem;color:rgba(255,255,255,.2);margin-top:3px;display:block;}

/* ──────────────────────────────────────────────
   EYEBROW
──────────────────────────────────────────────── */
.eyebrow{
  font-size:9.5px;font-weight:700;letter-spacing:.22em;
  text-transform:uppercase;color:var(--nv-gold);
  display:block;margin-bottom:8px;
}
.eyebrow--light{color:var(--nv-gold-light);}

/* ══════════════════════════════════════════════
   SCREEN SYSTEM
══════════════════════════════════════════════ */
.screen{display:none;}
.screen.active{display:block;}


/* ──────────────────────────────────────────────
   MOBILE NAV OVERRIDES
   Target: numiVeda Reports | X tokens | Top Up | Sign Out
──────────────────────────────────────────────── */
@media(max-width:768px){

  /* Compress the nav to fit mobile */
  .nav{
    padding:0 12px;
    height:52px;
  }

  /* Hide nav-tag "Reports" text on mobile - save space */
  .nav-tag{display:none;}

  /* Smaller logo */
  .nav-logo{font-size:1.1rem;}

  /* Compact token balance pill */
  .nav-balance{
    padding:4px 8px;
    font-size:.72rem;
    gap:4px;
  }

  /* Smaller Top Up button */
  .nav-topup{
    padding:5px 10px;
    font-size:.7rem;
  }

  /* Hide Sign Out text on mobile - show as X or keep short */
  .nav-logout{
    font-size:.7rem;
    padding:0;
  }

  /* Hide avatar on mobile to save space */
  .nav-avatar{
    width:28px;height:28px;
    font-size:.65rem;
  }

  /* Tighten right side gap */
  .nav-right{gap:6px;}

  /* Hide the trust bar on mobile when logged in */
  .trust-bar{
    overflow-x:auto;
    scrollbar-width:none;
    white-space:nowrap;
    justify-content:flex-start;
    padding:6px 12px;
  }
  .trust-bar::-webkit-scrollbar{display:none;}

  /* Announce bar smaller on mobile */
  .announce{
    font-size:9px;
    padding:7px 12px;
    letter-spacing:.1em;
  }
}
