:root{
  /* Brand */
  --ab-blue: #2c84e4;              /* primary */
  --ab-ink:  #0b1b33;              /* deep navy ink */
  --ab-soft:#eaf2ff;               /* soft blue wash */
  --ab-line: rgba(15,23,42,.10);
  --ab-card: rgba(255,255,255,.86);
  --ab-glass: rgba(255,255,255,.72);
  --ab-muted: rgba(15,23,42,.62);

  /* Lux accents */
  --ab-gold: #caa24d;              /* restrained gold */
  --ab-shadow: 0 22px 55px rgba(2, 10, 24, .18);
  --ab-shadow2: 0 10px 26px rgba(2, 10, 24, .12);

  /* Layout */
  --r: 22px;
}

/* Base */
html, body{ height:100%; }
body{
  margin:0;
  color: var(--ab-ink);
  background:
    radial-gradient(1100px 700px at 18% 18%, rgba(44,132,228,.24), transparent 55%),
    radial-gradient(900px 600px at 70% 20%, rgba(202,162,77,.16), transparent 58%),
    radial-gradient(700px 520px at 80% 80%, rgba(44,132,228,.12), transparent 58%),
    linear-gradient(180deg, #f7fbff 0%, #f3f7ff 60%, #f6f8ff 100%);
  overflow-x:hidden;
}

/* Shell */
.pz-shell{
  min-height:100%;
  display:flex;
  flex-direction:column;
  position:relative;
  overflow:hidden;
}

/* ===== jn.premium.rightAura.020626 ===== */
.pz-shell::after{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:0;

  background:
    radial-gradient(900px 600px at 86% 26%, rgba(44,132,228,.18), transparent 62%),
    radial-gradient(700px 520px at 92% 74%, rgba(202,162,77,.12), transparent 60%),
    radial-gradient(520px 420px at 70% 55%, rgba(44,132,228,.10), transparent 62%),
    linear-gradient(90deg,
      transparent 0%,
      transparent 58%,
      rgba(255,255,255,.55) 72%,
      rgba(255,255,255,.35) 100%),
    repeating-linear-gradient(
      90deg,
      transparent 0,
      transparent 26px,
      rgba(15,23,42,.028) 26px,
      rgba(15,23,42,.028) 27px
    );
  mix-blend-mode: normal;
  opacity: 1;
}

/* Keep content above aura */
.pz-topbar, .pz-main, .pz-footer{ position:relative; z-index:1; }

/* Header */
.pz-topbar{
  position:sticky; top:0; z-index:5;
  display:flex; align-items:center; justify-content:space-between;
  padding:16px 18px;
  background: rgba(255,255,255,.55);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--ab-line);
	padding: 16px clamp(16px, 2.2vw, 28px);
}

.pz-topbar .left{
  display:flex; align-items:center; gap:10px;
  font-weight:650;
  letter-spacing:.02em;
}

.pz-topbar-righttag{
  border-color:rgba(202,162,77,.22) !important;
}

.pz-dot{
  width:10px; height:10px; border-radius:999px;
  background: var(--ab-blue);
  box-shadow: 0 0 0 4px rgba(44,132,228,.14);
}

.pz-topbar .tag{
  font-size:12px;
  color: var(--ab-muted);
  font-weight:550;
  padding:6px 10px;
  border-radius:999px;
  border: 1px solid rgba(44,132,228,.18);
  background: rgba(255,255,255,.65);
}

/* Main grid */
/* Main grid — FORCE full width (jn.premium.fullBleed.020626) */
.pz-main{
  flex:1;
  display:grid;

  /* 3 panels */
  grid-template-columns:
    minmax(520px, 1.2fr)   /* Left marketing */
    minmax(420px, 520px)   /* Login */
    1fr;                   /* Resources expands */

  gap:18px;

  /* FULL BLEED */
  width: 100%;
  max-width: none;
  margin: 0;

  /* Keep it premium on edges */
  padding: clamp(16px, 2.2vw, 28px);

  align-items: stretch;
}



/* Left pane (marketing) */
.pz-left{
  position:relative;
  border-radius: var(--r);
  overflow:hidden;
  border:1px solid rgba(44,132,228,.14);
  background:
    radial-gradient(900px 500px at 20% 30%, rgba(44,132,228,.18), transparent 55%),
    radial-gradient(700px 420px at 80% 35%, rgba(202,162,77,.14), transparent 56%),
    linear-gradient(180deg, rgba(255,255,255,.72), rgba(255,255,255,.56));
  box-shadow: var(--ab-shadow2);
}

.pz-left-inner{
  padding:34px 34px 28px;
  display:flex;
  flex-direction:column;
  height:100%;
  gap:18px;
}

.pz-kicker{
  display:flex; align-items:center; gap:10px;
  color: rgba(44,132,228,.95);
  font-weight:750;
  letter-spacing:.10em;
  text-transform:uppercase;
  font-size:12px;
}
.pz-kicker .bar{
  width:34px; height:2px;
  background: linear-gradient(90deg, var(--ab-blue), rgba(44,132,228,.25));
  border-radius:999px;
}

.pz-hero-title{
  margin: 0;
  font-size: clamp(30px, 3.2vw, 44px);
  line-height: 1.05;
  letter-spacing: -0.02em;
}
.pz-hero-title .accent{
  background: linear-gradient(90deg, var(--ab-blue), rgba(44,132,228,.65));
  -webkit-background-clip:text;
  background-clip:text;
  color: transparent;
}

.pz-hero-desc{
  margin: 6px 0 0;
  max-width: 52ch;
  color: rgba(15,23,42,.72);
  font-size: 15px;
  line-height: 1.55;
}

.pz-feature-grid{
  display:grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap:12px;
  margin-top: 6px;
}

.pz-feature{
  border:1px solid rgba(15,23,42,.08);
  background: rgba(255,255,255,.62);
  border-radius: 16px;
  padding:12px 12px;
  box-shadow: 0 10px 22px rgba(2,10,24,.06);
}
.pz-feature .t{
  display:flex; align-items:center; gap:10px;
  font-weight:700;
  color: rgba(11,27,51,.92);
  font-size: 13px;
}
.pz-feature .t .ico{
  width:30px; height:30px; border-radius:12px;
  display:grid; place-items:center;
  background: rgba(44,132,228,.12);
  border:1px solid rgba(44,132,228,.18);
  color: rgba(44,132,228,.95);
  font-size: 15px;
}
.pz-feature .d{
  margin-top:6px;
  color: rgba(15,23,42,.62);
  font-size: 13px;
  line-height: 1.45;
}

.pz-left-footer{
  margin-top:auto;
  padding-top: 14px;
  border-top:1px solid rgba(15,23,42,.08);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  color: rgba(15,23,42,.55);
  font-size: 12px;
}

.pz-trust{
  display:flex; gap:8px; flex-wrap:wrap; justify-content:flex-end;
}
.pz-badge{
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(15,23,42,.10);
  background: rgba(255,255,255,.55);
  color: rgba(15,23,42,.62);
  font-weight:600;
}
.pz-badge strong{ color: rgba(11,27,51,.85); font-weight:750; }

/* Right pane (login) */
.pz-right{
  display:flex;
  align-items:center;
  justify-content:center;
}

.pz-login-wrap{
  width: min(460px, 92vw);
  display:flex;
  flex-direction:column;
  gap:12px;
}

.pz-logo-slot{
  display:flex;
  align-items:center;
  justify-content:center;
  padding: 16px 14px;
  border-radius: 18px;
  border: 1px dashed rgba(44,132,228,.28);
  background: rgba(255,255,255,.55);
  backdrop-filter: blur(10px);
  color: rgba(15,23,42,.60);
  font-size: 12px;
}
.pz-logo-slot img{
  max-height: 44px;
  max-width: 100%;
  object-fit: contain;
  display:block;
}

.pz-card{
  background: var(--ab-card);
  border:1px solid rgba(15,23,42,.10);
  border-radius: var(--r);
  padding: 22px;
  box-shadow: var(--ab-shadow);
  backdrop-filter: blur(10px);
  position:relative;
  overflow:hidden;
}

.pz-card::before{
  content:"";
  position:absolute;
  inset:-2px;
  background:
    radial-gradient(320px 160px at 15% 0%, rgba(44,132,228,.18), transparent 55%),
    radial-gradient(240px 150px at 85% 0%, rgba(202,162,77,.14), transparent 60%);
  pointer-events:none;
}
.pz-card > *{ position:relative; }

.pz-brand{
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  font-size: 12px;
  color: rgba(44,132,228,.95);
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom: 8px;
}
.pz-brand .slash{
  width:26px; height:2px;
  background: linear-gradient(90deg, var(--ab-blue), rgba(202,162,77,.42));
  border-radius:999px;
}

.pz-title{
  margin:0 0 6px;
  color: rgba(11,27,51,.95);
  font-size: 22px;
  letter-spacing: -0.02em;
}
.pz-sub{
  margin:0 0 14px;
  color: rgba(15,23,42,.62);
  font-size: 13px;
  line-height:1.5;
}

.pz-hr{
  height:1px;
  background: rgba(15,23,42,.10);
  margin: 14px 0;
}

.pz-muted{
  color: rgba(15,23,42,.55);
  font-size: 12px;
  font-weight:650;
  letter-spacing:.02em;
}

.pz-field{ display:grid; gap:6px; margin:10px 0 0; }
.pz-field label{
  font-size: 12px;
  color: rgba(15,23,42,.72);
  font-weight:650;
}
.pz-field input{
  padding: 11px 12px;
  border-radius: 12px;
  border: 1px solid rgba(15,23,42,.12);
  background: rgba(255,255,255,.80);
  outline:none;
  transition: box-shadow .15s ease, border-color .15s ease, transform .05s ease;
}
.pz-field input:focus{
  border-color: rgba(44,132,228,.40);
  box-shadow: 0 0 0 4px rgba(44,132,228,.14);
}

.pz-btn{
  display:flex; align-items:center; gap:10px;
  width:100%;
  justify-content:center;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid rgba(15,23,42,.12);
  background: rgba(255,255,255,.78);
  cursor:pointer;
  font-weight:750;
  color: rgba(11,27,51,.92);
  transition: transform .06s ease, box-shadow .15s ease, background .15s ease;
}
.pz-btn:hover{ background: rgba(255,255,255,.92); box-shadow: 0 10px 20px rgba(2,10,24,.10); }
.pz-btn:active{ transform: translateY(1px); }
.pz-btn.primary{
  background: linear-gradient(135deg, rgba(44,132,228,.98), rgba(44,132,228,.82));
  color: #fff;
  border-color: transparent;
  box-shadow: 0 16px 28px rgba(44,132,228,.26);
}
.pz-row{ display:flex; gap:10px; margin-top:12px; }
.pz-row > *{ flex:1; }

.pz-link{
  display:inline-block;
  margin-top: 10px;
  padding: 2px 0;
  background: none;
  border: 0;
  cursor: pointer;
  color: var(--ab-blue);
  font-size: 12px;
  font-weight: 650;
  letter-spacing: .02em;
}
.pz-link:hover{ text-decoration: underline; }

.pz-msg{
  margin-top: 14px;
  text-align:center;
  color: rgba(15,23,42,.62);
  font-size: 13px;
  min-height: 18px;
}
.pz-msg.is-error{
  color:#b91c1c;
  font-weight:700;
  background: rgba(220,38,38,.08);
  border:1px solid rgba(220,38,38,.20);
  border-radius:12px;
  padding:10px 12px;
}

/* Dev flag polish (hidden by default but nice when enabled) */
.pz-devflag{
  margin-top:10px;
  align-items:center;
  gap:8px;
  font-size:12px;
  color:rgba(15,23,42,.65);
}
.pz-devtiny{
  font-size:12px;
  color:rgba(15,23,42,.55);
}

/* Footer */
.pz-footer{
  padding: 14px 18px 18px;
  border-top: 1px solid rgba(15,23,42,.08);
  background: rgba(255,255,255,.45);
  backdrop-filter: blur(10px);
}
.pz-footer-inner{
  max-width: none;
  width: 100%;
  margin: 0;
  padding: 0 clamp(16px, 2.2vw, 28px);

  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  color: rgba(15,23,42,.55);
  font-size: 12px;
  flex-wrap: wrap;
}

.pz-footer-links{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.pz-footer-built{ margin-right:10px; }
.pz-dotsep{ opacity:.5; margin:0 2px; }

.pz-footer a{
  color: rgba(44,132,228,.90);
  text-decoration:none;
  font-weight:650;
}
.pz-footer a:hover{ text-decoration:underline; }

/* Responsive */
/* Responsive */
@media (max-width: 980px){
  .pz-main{
    grid-template-columns: 1fr;
    padding: 16px;
  }
  .pz-left-inner{ padding: 26px 22px 20px; }
  .pz-feature-grid{ grid-template-columns: 1fr; }
  .pz-right{ padding-bottom: 6px; }
  .pz-res-inner{ padding: 22px 20px 18px; }
}

/* On very wide screens, give more air */
@media (min-width: 1600px){
  .pz-main{
    max-width: 1680px;
  }
}





/* =========================================================
   Right Resources panel — jn.premium.resources.020626
   ========================================================= */

.pz-resources{
  position:relative;
  border-radius: var(--r);
  overflow:hidden;
  border:1px solid rgba(15,23,42,.08);
  background:
    radial-gradient(900px 520px at 75% 20%, rgba(44,132,228,.14), transparent 60%),
    radial-gradient(680px 480px at 35% 85%, rgba(202,162,77,.10), transparent 62%),
    linear-gradient(180deg, rgba(255,255,255,.70), rgba(255,255,255,.55));
  box-shadow: var(--ab-shadow2);
}

.pz-res-inner{
  padding: 28px 26px 22px;
  display:flex;
  flex-direction:column;
  height:100%;
  gap:12px;
}

.pz-kicker.pz-kicker-muted{
  color: rgba(44,132,228,.90);
}

.pz-res-title{
  margin: 0;
  font-size: 18px;
  letter-spacing: -0.01em;
  color: rgba(11,27,51,.95);
}

.pz-res-desc{
  margin: 0 0 6px;
  color: rgba(15,23,42,.66);
  font-size: 13px;
  line-height: 1.55;
  max-width: 55ch;
}

.pz-res-grid{
  display:grid;
  grid-template-columns: 1fr; /* feels premium; single column */
  gap:12px;
  margin-top: 6px;
}

.pz-res-card{
  text-decoration:none;
  color: inherit;
  border-radius: 16px;
  border: 1px solid rgba(15,23,42,.08);
  background: rgba(255,255,255,.62);
  box-shadow: 0 10px 22px rgba(2,10,24,.06);
  padding: 14px 14px;
  transition: transform .08s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease;
  position:relative;
  overflow:hidden;
}

.pz-res-card::before{
  content:"";
  position:absolute;
  inset:-2px;
  background:
    radial-gradient(340px 160px at 15% 0%, rgba(44,132,228,.12), transparent 58%),
    radial-gradient(260px 150px at 85% 0%, rgba(202,162,77,.10), transparent 62%);
  pointer-events:none;
  opacity:.9;
}

.pz-res-card > *{ position:relative; }

.pz-res-card:hover{
  background: rgba(255,255,255,.72);
  border-color: rgba(44,132,228,.18);
  box-shadow: 0 16px 34px rgba(2,10,24,.10);
  transform: translateY(-1px);
}

.pz-res-head{
  display:flex;
  align-items:center;
  gap:10px;
  font-weight:750;
  color: rgba(11,27,51,.92);
}

.pz-res-ico{
  width:34px; height:34px;
  border-radius: 14px;
  display:grid; place-items:center;
  background: rgba(44,132,228,.12);
  border: 1px solid rgba(44,132,228,.18);
  color: rgba(44,132,228,.95);
  font-size: 16px;
  flex: 0 0 auto;
}

.pz-res-name{
  font-size: 13px;
}

.pz-res-sub{
  margin-top: 8px;
  color: rgba(15,23,42,.62);
  font-size: 12.5px;
  line-height: 1.45;
}

.pz-res-meta{
  margin-top: 10px;
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size: 12px;
  color: rgba(15,23,42,.55);
  font-weight:650;
}

.pz-res-meta::before{
  content:"";
  width:28px; height:2px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(44,132,228,.70), rgba(202,162,77,.28));
}

.pz-res-footer{
  margin-top:auto;
  padding-top: 14px;
  border-top:1px solid rgba(15,23,42,.08);
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  justify-content:flex-start;
}



/* =========================================================
   FULL BLEED OVERRIDES — jn.login.fullBleedHard.020626
   Forces header/main/footer to use full viewport width
   even if admin/admin.css applies a centered max-width.
   Paste at VERY BOTTOM of login.css
   ========================================================= */

*{ box-sizing:border-box; }
html, body{ width:100%; max-width:none !important; }
body{ margin:0; }

/* If any upstream "container" rule is constraining things, kill it here */
.pz-shell{
  width:100%;
  max-width:none !important;
}

/* FULL BLEED helper: break out of centered containers */
.pz-topbar,
.pz-main,
.pz-footer{
  width:100vw !important;
  max-width:none !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
}

/* Keep internal padding consistent */
.pz-topbar{
  padding-left:  clamp(16px, 2.2vw, 28px) !important;
  padding-right: clamp(16px, 2.2vw, 28px) !important;
}

.pz-main{
  padding-left:  clamp(16px, 2.2vw, 28px) !important;
  padding-right: clamp(16px, 2.2vw, 28px) !important;
}

.pz-footer{
  padding-left:  clamp(16px, 2.2vw, 28px) !important;
  padding-right: clamp(16px, 2.2vw, 28px) !important;
}

/* Make sure grid children can actually shrink/expand properly */
.pz-main > *{ min-width:0; }

/* Footer inner should never re-center itself */
.pz-footer-inner{
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  padding:0 !important; /* footer padding is now on .pz-footer */
}


/* ===== jn.login.swapPanels.020626 ===== */
/* Swap center (login) and right (resources) panels without touching HTML */

.pz-right{ grid-column: 3 !important; }
.pz-resources{ grid-column: 2 !important; }

/* Mobile stays stacked naturally */
@media (max-width: 980px){
  .pz-right,
  .pz-resources{ grid-column: auto !important; }
}


/* ===== jn.login.swapPanels.fixRow.020626 ===== */
/* Hard-pin all three panels to the same row so nothing drops */

.pz-main{
  grid-auto-flow: row dense; /* optional but helps backfill */
}

.pz-left{
  grid-column: 1 !important;
  grid-row: 1 !important;
}

.pz-resources{
  grid-column: 2 !important;
  grid-row: 1 !important;
}

.pz-right{
  grid-column: 3 !important;
  grid-row: 1 !important;
}

/* Mobile stays stacked naturally */
@media (max-width: 980px){
  .pz-left, .pz-resources, .pz-right{
    grid-column: auto !important;
    grid-row: auto !important;
  }
}

.pz-res-footer{ display:none !important; }





/* =========================================================
   SCROLL FIX (laptops) — jn.login.scrollFix.020626
   Fix: footer not reachable + panels cut off w/ no scroll
   Root cause: .pz-shell overflow:hidden prevents page scroll
   ========================================================= */

/* Allow the page to scroll vertically (keep horizontal hidden) */
html, body{
  height: auto !important;
  min-height: 100% !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}

/* Let the app shell grow taller than the viewport */
.pz-shell{
  min-height: 100vh !important;
  height: auto !important;
  overflow: visible !important;   /* overrides overflow:hidden */
}

/* Make sure the main area can shrink without forcing overflow clipping */
.pz-main{
  min-height: 0 !important;
  align-content: start !important;
}

/* Let panels keep their nice height but never trap overflow */
.pz-left,
.pz-resources,
.pz-right{
  min-height: 0 !important;
}

/* Sticky header should stay, but not block scroll layout on small heights */
.pz-topbar{
  top: 0;
}

/* Optional: on short-height laptop screens, reduce vertical padding a bit */
@media (max-height: 780px){
  .pz-main{ padding-top: 14px !important; padding-bottom: 14px !important; }
  .pz-left-inner{ padding: 28px 28px 22px !important; }
  .pz-res-inner{ padding: 22px 22px 18px !important; }
}






/* =========================================================
   Quick Resources — file list + preview modal
   jn.login.quickResources.files.clean.021126
   Single-source styles (removes duplicate/competing pz-res-file rules)
   ========================================================= */

/* Keep resources card from “floating” on hover (causes stacked shadow artifacts) */
.pz-res-card:hover{
  transform: none !important;
  box-shadow: 0 14px 30px rgba(2,10,24,.09) !important;
}

/* File list */
.pz-res-files{
  margin-top:10px;
  display:flex;
  flex-direction:column;
  gap:8px;
}

/* ONE canonical file row rule (supports <a> or <div>) */
.pz-res-file{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;

  padding:10px 10px;
  border-radius:12px;
  border:1px solid rgba(15,23,42,.08);

  /* OPAQUE so the gradient aura doesn’t bleed through */
  background: rgba(255,255,255,.86);

  cursor:pointer;
  text-decoration:none;
  color: inherit;

  /* No translate = no weird overlap “ghost” */
  transform: none;

  transition: background .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.pz-res-file:hover{
  background: rgba(255,255,255,.92);
  border-color: rgba(44,132,228,.18);
  box-shadow: 0 10px 22px rgba(2,10,24,.08);
}

/* Click focus: keep it clean, no “mystery shadow” */
.pz-res-file:focus,
.pz-res-file:focus-visible{
  outline: none;
  box-shadow: 0 0 0 4px rgba(44,132,228,.14);
}

/* Disabled rows */
.pz-res-file.is-disabled{
  opacity:.55;
  cursor:not-allowed;
  pointer-events:none;
  box-shadow:none;
}

/* Row internals */
.pz-res-file-left{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
}

.pz-res-file-icoimg{
  width: 22px;
  height: 22px;
  object-fit: contain;
  flex: 0 0 auto;
  display:block;
}

.pz-res-file-name{
  font-size: 12.5px;
  color: rgba(11,27,51,.92);
  font-weight:500;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  max-width: 34ch;
}

.pz-res-file-sub{
  font-size: 12px;
  color: rgba(15,23,42,.55);
  font-weight:650;
  flex:0 0 auto;
}

/* View all link */
.pz-res-viewall{
  margin-top:8px;
  font-size:12px;
  font-weight:700;
  color: rgba(44,132,228,.95);
  text-decoration:none;
  display:inline-flex;
  gap:6px;
  align-items:center;
}
.pz-res-viewall:hover{ text-decoration: underline; }


/* =========================================================
   Login top alignment (kept, but clean)
   jn.login.alignTopsOnly.021126
   ========================================================= */
@media (min-width: 981px){
  .pz-right{
    align-items: flex-start !important;    /* top align */
    justify-content: center !important;    /* horizontal center */
  }
  .pz-login-wrap{ margin-top: 0 !important; }
}


/* =========================================================
   Modal (unchanged; kept here for completeness)
   ========================================================= */
.pz-filemodal.hidden{ display:none; }
.pz-filemodal{
  position:fixed;
  inset:0;
  z-index: 99999;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:14px;
}

.pz-filemodal-backdrop{
  position:absolute;
  inset:0;
  background: rgba(15,23,42,.42);
  backdrop-filter: blur(6px);
}

.pz-filemodal-card{
  position:relative;
  width: min(980px, 96vw);
  height: min(78vh, 740px);
  border-radius: 18px;
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(15,23,42,.10);
  box-shadow: 0 30px 70px rgba(2,10,24,.26);
  overflow:hidden;
  display:flex;
  flex-direction:column;
}

.pz-filemodal-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding: 14px 16px;
  border-bottom: 1px solid rgba(15,23,42,.10);
  background: rgba(255,255,255,.72);
  backdrop-filter: blur(10px);
}

.pz-filemodal-title{
  font-weight:800;
  color: rgba(11,27,51,.95);
  font-size: 13px;
  letter-spacing: .01em;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.pz-filemodal-x{
  border:1px solid rgba(15,23,42,.12);
  background: rgba(255,255,255,.78);
  border-radius: 12px;
  padding: 8px 10px;
  cursor:pointer;
  font-weight:800;
}

.pz-filemodal-body{
  flex:1;
  padding: 14px;
  overflow:auto;
}

.pz-filemodal-body iframe{
  width:100%;
  height:100%;
  border:0;
  border-radius: 14px;
  background: #fff;
}

.pz-filemodal-body img{
  max-width:100%;
  height:auto;
  display:block;
  border-radius: 14px;
  border: 1px solid rgba(15,23,42,.10);
  background:#fff;
}

.pz-filemodal-actions{
  margin-top:12px;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

.pz-filemodal-actions a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:10px 12px;
  border-radius: 14px;
  border: 1px solid rgba(15,23,42,.12);
  background: rgba(255,255,255,.82);
  font-weight:750;
  color: rgba(11,27,51,.92);
  text-decoration:none;
}
.pz-filemodal-actions a:hover{ background: rgba(255,255,255,.95); }

/* =========================================================
   Confirm modal (password reset)
   ========================================================= */
.pz-confirm.hidden{ display:none; }
.pz-confirm{
  position:fixed;
  inset:0;
  z-index: 100000;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:14px;
}
.pz-confirm-backdrop{
  position:absolute;
  inset:0;
  background: rgba(15,23,42,.42);
  backdrop-filter: blur(6px);
}
.pz-confirm-card{
  position:relative;
  width: min(380px, 94vw);
  border-radius: 18px;
  background: rgba(255,255,255,.96);
  border: 1px solid rgba(15,23,42,.10);
  box-shadow: 0 30px 70px rgba(2,10,24,.26);
  padding: 22px 22px 18px;
  text-align:center;
}
.pz-confirm-title{
  margin:0 0 8px;
  font-size:16px;
  font-weight:800;
  color: rgba(11,27,51,.95);
}
.pz-confirm-text{
  margin:0 0 4px;
  font-size:13px;
  color: rgba(15,23,42,.62);
}
.pz-confirm-email{
  margin:0 0 10px;
  font-size:14px;
  font-weight:750;
  color: var(--ab-blue);
  word-break:break-all;
}
.pz-confirm-hint{
  margin:0 0 16px;
  font-size:12px;
  color: rgba(15,23,42,.52);
}
.pz-confirm-actions{
  display:flex;
  gap:10px;
}
.pz-confirm-actions > *{ flex:1; }
.pz-confirm-icon{
  width:48px;
  height:48px;
  margin:0 auto 14px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  background: rgba(16,185,129,.12);
  color:#10b981;
  font-size:24px;
  font-weight:900;
  line-height:1;
}