/* ZORIEL, powered by Koscode: ngjyrat, fontet dhe stili i header/footer, ne nje vend te vetem.
   Per me ndryshu brendin mjafton me i ndryshu variablat me poshte. */
:root{
  --z-blue:#00AEEF;          /* Sky Blue, ngjyra kryesore */
  --z-blue-strong:#0093CC;   /* blu me kontrast me te larte per sfond te bardhe */
  --z-black:#111111;         /* Deep Black, sfondi i header */
  --z-white:#FFFFFF;
  --z-on-blue:#06121A;       /* teksti mbi butonat blu */
  --z-soft:#CFD6E4;          /* teksti dytesor mbi sfond te zi */
  --z-muted:#8D93BA;         /* teksti i zbehte */
  --z-ok:#2FBF71;
  --z-bad:#FF6B6B;
  --z-font:"Onest", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --z-font-size-brand:18px;
  --z-font-size-small:12px;
  --z-header-h:56px;
}

/* ---------- Header ---------- */
.zb-h{background:var(--z-black);color:var(--z-white);display:flex;align-items:center;gap:18px;padding:10px 20px;min-height:var(--z-header-h);border-bottom:2px solid var(--z-blue);font-family:var(--z-font)}
.zb-h.int{position:sticky;top:env(safe-area-inset-top,0px);z-index:20}
.zb-brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--z-white)}
.zb-logo{height:30px;width:auto;display:block}
.zb-word{font-weight:800;letter-spacing:.14em;font-size:var(--z-font-size-brand);color:var(--z-white)}
.zb-app{font-size:13px;color:var(--z-soft);border-left:1px solid #ffffff2e;padding-left:12px}
.zb-nav{display:flex;gap:4px;margin-left:auto}
.zb-nav a{color:var(--z-soft);text-decoration:none;font-weight:600;font-size:14px;padding:8px 12px;border-radius:8px}
.zb-nav a:hover{background:#ffffff14;color:var(--z-white)}
.zb-nav a.on{background:var(--z-blue);color:var(--z-on-blue)}

/* ---------- Footer i brendshem ---------- */
.zb-f{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 18px;padding:16px 20px;font:13px/1.5 var(--z-font);color:var(--z-muted);border-top:1px solid #8D93BA33;margin-top:24px}
.zb-f .zb-name{font-weight:700;letter-spacing:.08em;color:inherit}
.zb-f .zb-pw{font-size:var(--z-font-size-small);opacity:.85}
.zb-f .zb-pw b{color:var(--z-blue);font-weight:700}
.zb-st{display:flex;align-items:center;gap:8px;font-variant-numeric:tabular-nums}
.zb-st i{width:8px;height:8px;border-radius:50%;background:var(--z-bad);display:inline-block}
.zb-st.ok i{background:var(--z-ok)}

/* ---------- Faqja e publikut: vetem para Bashkohu ---------- */
.zb-pub-h{position:fixed;top:0;left:0;right:0;justify-content:center;border-bottom:0;background:transparent;padding-top:calc(12px + env(safe-area-inset-top,0px))}
.zb-pub-f{position:static;flex-direction:column;align-items:center;text-align:center;border-top:0;margin:22px 0 0;padding:0 0 calc(12px + env(safe-area-inset-bottom,0px));font-size:var(--z-font-size-small)}
.zb-pub-f .zb-org{font-size:13px;color:var(--z-soft);font-weight:600}
.zb-pub-f .zb-note{max-width:360px;opacity:.85}
body.joined .zb-pub-h, body.joined .zb-pub-f{display:none !important}
body[data-page=join]:not(.joined){padding-top:calc(64px + env(safe-area-inset-top,0px)) !important;padding-bottom:0 !important;min-height:100%;height:auto}

@media (max-width:640px){.zb-app{display:none}.zb-h{gap:10px;padding:8px 12px}.zb-nav a{padding:7px 9px}}