/* PSXI header-only theme (safe: doesn't touch the rest of the site) */

/* Modern font just for the header */
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@500;600;700;800&display=swap");

:root{
  --psxi-brand:#1f5fb8;        /* primary blue */
  --psxi-brand-ink:#ffffff;
  --psxi-brand-soft:#3b82f6;
  --psxi-header-bg:#0b1324;
  --psxi-header-ink:#ffffff;
  --psxi-logo-url:url("/assets/psxi-logo.png"); /* optional */
}

/* Header wrapper (injected by psxi-header.js) */
.psxi-site-header{
  position:sticky; top:0; z-index:1000;
  color:var(--psxi-header-ink);
  background:
    radial-gradient(700px 180px at 20% -40%, rgba(77,163,255,.18), transparent 60%),
    var(--psxi-header-bg);
  box-shadow:0 1px 0 rgba(255,255,255,.04), 0 8px 24px rgba(0,0,0,.18);
  backdrop-filter:saturate(120%) blur(6px);
  font-family:"Inter", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; /* scoped */
}

.psxi-site-inner{
  max-width:1100px; margin:0 auto; padding:10px 12px;
  display:flex; align-items:center; justify-content:space-between; gap:12px;
}

.psxi-brand a{
  color:var(--psxi-header-ink); text-decoration:none; display:inline-flex; align-items:center; gap:10px;
  font-weight:800; letter-spacing:.2px; line-height:1;
}

/* Logo (optional) */
.psxi-brand a::before{
  content:"";
  width:26px; height:26px; border-radius:6px;
  background-image:var(--psxi-logo-url);
  background-size:cover; background-position:center;
  box-shadow:0 0 18px rgba(77,163,255,.45);
}

/* Nav */
.psxi-nav{ display:flex; gap:8px; flex-wrap:wrap; }
.psxi-link{
  color:#d6e2ff; text-decoration:none; line-height:1;
  padding:8px 12px; border-radius:10px; border:1px solid transparent;
  font-weight:600; letter-spacing:.1px;
  transition:transform .12s ease, background .12s ease, border-color .12s ease;
}
.psxi-link:hover{ background:rgba(255,255,255,.08); transform:translateY(-1px); }
.psxi-link.active{
  background:rgba(255,255,255,.14);
  border-color:rgba(77,163,255,.35);
}

/* Optional header buttons (if you add later) */
.psxi-btn{
  background:var(--psxi-brand); color:var(--psxi-brand-ink);
  border:0; border-radius:10px; padding:9px 12px; font-weight:700; cursor:pointer;
  box-shadow:0 8px 16px rgba(31,95,184,.23);
}
.psxi-btn.secondary{
  background:#182036; color:#d6e2ff; border:1px solid #2b3759;
}

/* Username text in header (right side) */
.psxi-username{
  font-size:13px;
  color:#c9d6ff;
  max-width:240px;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}