/* ==========================================================================
   NeonLock — theme styles
   Colours, glow strength, blur and radius are injected as CSS variables
   from the Customizer (see inc/customizer.php).
   ========================================================================== */

:root{
  --nl-bg:#07040D;
  --nl-panel:rgba(28,16,48,.72);
  --nl-panel-2:rgba(13,7,22,.90);
  --nl-line:rgba(190,150,255,.14);
  --nl-text:#F4EEFF;
  --nl-muted:#A292C0;
  --nl-c1:#FF2E88;
  --nl-c2:#A24BFF;
  --nl-c3:#22E4FF;
  --nl-green:#2BFFA6;
  --nl-amber:#FFC24B;
  --nl-orange:#FF8A1F;
  --nl-red:#FF3355;
  --nl-radius:20px;
  --nl-radius-sm:10px;
  --nl-blur:22px;
  --nl-glow:1;
  --nl-logo-size:44px;
  --nl-display:'Sora',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --nl-body:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  --nl-max:1180px;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--nl-bg);color:var(--nl-text);
  font-family:var(--nl-body);font-size:16px;line-height:1.65;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
body::before{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(900px 520px at 12% -8%, color-mix(in srgb,var(--nl-c2) 26%,transparent), transparent 62%),
    radial-gradient(760px 460px at 92% 4%, color-mix(in srgb,var(--nl-c1) 20%,transparent), transparent 60%),
    radial-gradient(700px 700px at 50% 108%, color-mix(in srgb,var(--nl-c3) 12%,transparent), transparent 65%);
  opacity:var(--nl-glow);
}
img,video,iframe,svg{max-width:100%;height:auto;display:block}
a{color:var(--nl-c3);text-decoration:none}
a:hover{color:var(--nl-text)}
:focus-visible{outline:2px solid var(--nl-c3);outline-offset:3px;border-radius:4px}
h1,h2,h3,h4,h5{font-family:var(--nl-display);letter-spacing:-.02em;line-height:1.18;margin:0 0 .5em}
h1{font-size:clamp(28px,4.4vw,40px);font-weight:800;letter-spacing:-.03em}
h2{font-size:clamp(22px,3vw,28px);font-weight:700}
h3{font-size:19px;font-weight:600}
p{margin:0 0 1.1em}
blockquote{margin:1.4em 0;padding:.6em 1.2em;border-left:2px solid var(--nl-c1);color:#D6C8ED}
code,pre{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.92em}
pre{background:rgba(0,0,0,.4);padding:16px;border-radius:var(--nl-radius-sm);overflow:auto}
table{width:100%;border-collapse:collapse}
th,td{border:1px solid var(--nl-line);padding:8px 10px;text-align:left}

.nl-wrap{width:min(var(--nl-max),92vw);margin-inline:auto;position:relative;z-index:1}
.nl-section{padding:34px 0}
.screen-reader-text{
  border:0;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;width:1px;
  margin:-1px;overflow:hidden;padding:0;position:absolute;word-wrap:normal!important;
}
.skip-link:focus{
  position:fixed;left:12px;top:12px;z-index:9999;background:var(--nl-c1);color:#0A0512;
  padding:10px 16px;border-radius:8px;clip:auto;clip-path:none;width:auto;height:auto;
}

/* ---------- buttons ---------- */
.nl-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-family:var(--nl-display);font-weight:600;font-size:14px;
  padding:11px 20px;border-radius:999px;border:0;cursor:pointer;text-align:center;
  transition:transform .16s ease,box-shadow .22s ease,filter .2s ease,background .2s ease;
}
.nl-btn:active{transform:translateY(1px)}
.nl-btn--primary{
  color:#0A0512;
  background:linear-gradient(100deg,var(--nl-c1),var(--nl-c2) 55%,var(--nl-c3));
  box-shadow:0 6px calc(26px * var(--nl-glow)) color-mix(in srgb,var(--nl-c1) 36%,transparent);
}
.nl-btn--primary:hover{color:#0A0512;filter:brightness(1.08)}
.nl-btn--amber{color:#1A1000;background:linear-gradient(100deg,#FFD777,var(--nl-amber));
  box-shadow:0 6px calc(26px * var(--nl-glow)) rgba(255,194,75,.32)}
.nl-btn--amber:hover{color:#1A1000;filter:brightness(1.06)}
.nl-btn--ghost{color:var(--nl-text);background:rgba(255,255,255,.05);border:1px solid var(--nl-line)}
.nl-btn--ghost:hover{background:rgba(255,255,255,.1);color:var(--nl-text)}
.nl-btn--sm{padding:8px 15px;font-size:13px}
.nl-btn--block{width:100%}

/* ---------- header ---------- */
.nl-header{
  position:sticky;top:0;z-index:60;
  background:linear-gradient(180deg,color-mix(in srgb,var(--nl-bg) 94%,transparent),color-mix(in srgb,var(--nl-bg) 62%,transparent));
  backdrop-filter:blur(14px);border-bottom:1px solid var(--nl-line);
}
.nl-header__inner{display:flex;align-items:center;gap:14px;padding:13px 0}
.nl-brand{display:flex;align-items:center;gap:12px;min-width:0;color:var(--nl-text)}
.nl-brand:hover{color:var(--nl-text)}
.nl-brand__logo img{width:var(--nl-logo-size);height:auto;max-height:calc(var(--nl-logo-size) * 1.4);object-fit:contain}
.nl-brand__mark{
  width:var(--nl-logo-size);height:var(--nl-logo-size);flex:none;border-radius:calc(var(--nl-logo-size) / 3.4);
  background:conic-gradient(from 210deg,var(--nl-c1),var(--nl-c2),var(--nl-c3),var(--nl-c1));
  display:grid;place-items:center;font-family:var(--nl-display);font-weight:800;color:#0A0512;
  font-size:calc(var(--nl-logo-size) * .42);
  box-shadow:0 0 0 1px rgba(255,255,255,.12),0 0 calc(26px * var(--nl-glow)) color-mix(in srgb,var(--nl-c2) 55%,transparent);
}
.nl-brand__title{font-family:var(--nl-display);font-weight:700;font-size:19px;line-height:1.15;letter-spacing:-.02em;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:46vw}
.nl-brand__tag{display:block;font-size:12px;color:var(--nl-muted);line-height:1.25}
.nl-nav{margin-left:auto}
.nl-nav ul{list-style:none;display:flex;align-items:center;gap:4px;margin:0;padding:0}
.nl-nav li{position:relative}
.nl-nav a{padding:9px 14px;border-radius:999px;font-size:14px;font-weight:500;color:var(--nl-muted);display:block}
.nl-nav a:hover,.nl-nav .current-menu-item>a{color:var(--nl-text);background:rgba(255,255,255,.06)}
.nl-nav .sub-menu{
  display:none;position:absolute;top:100%;left:0;min-width:190px;padding:8px;margin:6px 0 0;
  background:#120A1E;border:1px solid var(--nl-line);border-radius:14px;box-shadow:0 20px 50px -20px #000;
}
.nl-nav li:hover>.sub-menu,.nl-nav li:focus-within>.sub-menu{display:block}
.nl-nav .sub-menu a{white-space:nowrap}
.nl-header__actions{display:flex;align-items:center;gap:8px;flex:none}
/* The buttons keep their natural width; the brand text gives up space first.
   Without this, flex squeezes the button and the light and label are crushed
   against its edges on a narrow screen. */
.nl-header__actions .nl-btn{flex:none}
.nl-brand{min-width:0}
.nl-brand__text{min-width:0;overflow:hidden}
.nl-burger{display:none;background:none;border:1px solid var(--nl-line);border-radius:10px;padding:9px;cursor:pointer}
.nl-burger span{display:block;width:18px;height:2px;background:var(--nl-text);border-radius:2px}
.nl-burger span+span{margin-top:4px}
@media(max-width:900px){
  .nl-burger{display:block}
  /* The panel hangs off the real header height, measured in theme.js, so it
     stays correct when the header shrinks or wraps on a narrow phone. */
  .nl-nav{position:fixed;inset:var(--nl-header-h,64px) 0 auto;background:#0C0616;
    border-bottom:1px solid var(--nl-line);padding:10px 4vw 18px;display:none;
    max-height:calc(100vh - var(--nl-header-h,64px));overflow:auto;z-index:59}
  .nl-nav.is-open{display:block}
  .nl-nav ul{flex-direction:column;align-items:stretch;gap:2px}
  .nl-nav .sub-menu{display:block;position:static;border:0;background:none;padding:0 0 0 14px;box-shadow:none}
  /* The nav becomes a fixed panel here, so it no longer pushes the buttons
     over. Without this they bunch up against the menu icon and leave a gap
     down the right-hand side of the header. */
  .nl-header__actions{margin-left:auto}
  .nl-header__actions .nl-btn{padding:8px 13px;font-size:12.5px}
}

/* ---------- the state light ----------
   A white-hot core inside a coloured bloom. A flat red dot sitting on the pink
   gradient button is almost the same hue as the button and reads as a smudge;
   a white centre punches through any background, and the colour is carried by
   the ring and the glow around it.
   Red, yellow and orange pulse because each is asking for an action. Green is
   steady: there is nothing for an active member to do, and a light blinking at
   someone who already paid is just nagging.                                   */
.nl-sig{
  --nl-sig:var(--nl-red);
  position:relative;flex:none;
  width:10px;height:10px;border-radius:50%;
  background:#fff;
  box-shadow:
    0 0 0 3px var(--nl-sig),
    0 0 calc(10px * var(--nl-glow)) 1px var(--nl-sig),
    0 0 calc(22px * var(--nl-glow)) 3px color-mix(in srgb,var(--nl-sig) 55%,transparent);
}
.nl-sig--red{--nl-sig:var(--nl-red)}
.nl-sig--amber{--nl-sig:var(--nl-amber)}
.nl-sig--orange{--nl-sig:var(--nl-orange)}
.nl-sig--green{--nl-sig:var(--nl-green)}

/* the expanding ring only exists while the light is asking for something */
.nl-sig.is-pulsing::after{
  content:"";position:absolute;inset:-3px;border-radius:50%;
  border:1px solid var(--nl-sig);
  animation:nl-sig-ring 2.6s cubic-bezier(.2,.6,.3,1) infinite;
  opacity:var(--nl-glow);
}
.nl-sig.is-pulsing{animation:nl-sig-breathe 2.6s ease-in-out infinite}
@keyframes nl-sig-breathe{
  0%,100%{box-shadow:
    0 0 0 3px var(--nl-sig),
    0 0 calc(8px * var(--nl-glow)) 1px var(--nl-sig),
    0 0 calc(18px * var(--nl-glow)) 2px color-mix(in srgb,var(--nl-sig) 45%,transparent)}
  50%{box-shadow:
    0 0 0 3px var(--nl-sig),
    0 0 calc(16px * var(--nl-glow)) 3px var(--nl-sig),
    0 0 calc(34px * var(--nl-glow)) 7px color-mix(in srgb,var(--nl-sig) 65%,transparent)}
}
@keyframes nl-sig-ring{
  0%{transform:scale(1);opacity:calc(.75 * var(--nl-glow))}
  70%,100%{transform:scale(2.1);opacity:0}
}
.nl-sig--lg{width:14px;height:14px;box-shadow:
    0 0 0 4px var(--nl-sig),
    0 0 calc(14px * var(--nl-glow)) 2px var(--nl-sig),
    0 0 calc(30px * var(--nl-glow)) 5px color-mix(in srgb,var(--nl-sig) 55%,transparent)}

/* ---------- header status button ---------- */
.nl-btn--status{gap:10px}
.nl-btn--status .nl-btn__label{line-height:1;max-width:14ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* the two money states keep the strongest colour; the finished state goes quiet */
.nl-btn--renew{
  color:#1A0E00;
  background:linear-gradient(100deg,#FFB23D,var(--nl-orange));
  box-shadow:0 6px calc(26px * var(--nl-glow)) color-mix(in srgb,var(--nl-orange) 40%,transparent);
}
.nl-btn--renew:hover{color:#1A0E00;filter:brightness(1.06)}
.nl-btn--quiet{
  color:var(--nl-text);
  background:transparent;
  border:1px solid color-mix(in srgb,var(--nl-green) 45%,transparent);
  box-shadow:0 0 calc(18px * var(--nl-glow)) -8px var(--nl-green);
}
.nl-btn--quiet:hover{color:var(--nl-text);background:color-mix(in srgb,var(--nl-green) 10%,transparent)}
/* ---------- header on small screens ----------
   Both controls stay reachable at every width. Log in is how an existing
   member gets back into the site, so it is never the thing that gets dropped;
   the brand text gives up its space first, then the labels shorten, because
   the logo still identifies the site on its own.                             */
.nl-btn__short{display:none}

@media(max-width:600px){
  .nl-brand__tag{display:none}
  .nl-brand__title{font-size:17px;max-width:32vw}
  .nl-header__inner{gap:10px}
  .nl-header__actions{gap:6px}
  .nl-header__actions .nl-btn{padding:8px 12px;font-size:12.5px}
  .nl-btn--status{gap:8px}
  .nl-btn--status .nl-btn__label{max-width:12ch}
  /* "My account" becomes "Account" rather than being cut off mid-word */
  .nl-btn__full{display:none}
  .nl-btn__short{display:inline}
}

@media(max-width:430px){
  :root{--nl-logo-size:36px}
  .nl-brand__title{display:none}
  .nl-header__inner{padding:10px 0;gap:8px}
  .nl-header__actions .nl-btn{padding:8px 11px;font-size:12px}
  .nl-btn--status{gap:7px}
  .nl-btn--status .nl-btn__label{max-width:11ch}
  .nl-sig{width:9px;height:9px}
  .nl-burger{padding:8px}
}

/* Very narrow phones. Everything tightens so the header still fits on one
   row, because a two-row sticky header eats scarce vertical space. Wrapping
   stays enabled as a last resort for a long plan name or translation, and
   only engages when the row genuinely cannot fit. */
@media(max-width:360px){
  :root{--nl-logo-size:32px}
  .nl-header__inner{flex-wrap:wrap;gap:6px;padding:9px 0}
  .nl-header__actions{gap:5px}
  .nl-header__actions .nl-btn{padding:7px 10px;font-size:11.5px}
  .nl-btn--status{gap:6px}
  .nl-btn--status .nl-btn__label{max-width:10ch}
  .nl-burger{padding:7px}
  .nl-burger span{width:16px}
}

/* ---------- membership status band ---------- */
.nl-status{
  --nl-sig:var(--nl-red);
  position:relative;overflow:hidden;
  border:1px solid var(--nl-line);border-radius:var(--nl-radius);
  background:linear-gradient(180deg,var(--nl-panel),var(--nl-panel-2));
  padding:18px 22px;display:flex;align-items:center;gap:18px;flex-wrap:wrap;
}
body.nl-state-free .nl-status{--nl-sig:var(--nl-amber)}
body.nl-state-expiring .nl-status{--nl-sig:var(--nl-orange)}
body.nl-state-paid .nl-status{--nl-sig:var(--nl-green)}
.nl-status::after{
  content:"";position:absolute;inset:-1px;border-radius:var(--nl-radius);pointer-events:none;
  box-shadow:inset 0 0 60px -18px var(--nl-sig);
  animation:nl-band-breathe 4.2s ease-in-out infinite;opacity:var(--nl-glow);
}
/* the band holds still for an active member, like the light does */
body.nl-state-paid .nl-status::after{animation:none;opacity:calc(.6 * var(--nl-glow))}
@keyframes nl-band-breathe{0%,100%{opacity:calc(.45 * var(--nl-glow))}50%{opacity:var(--nl-glow)}}
.nl-status__sig{display:flex;align-items:center;gap:14px;min-width:0}
.nl-status__copy strong{display:block;font-family:var(--nl-display);font-weight:700;font-size:17px;letter-spacing:-.01em}
.nl-status__copy small{display:block;color:var(--nl-muted);font-size:13px}
.nl-status__actions{margin-left:auto;display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.nl-status__note{font-size:12.5px;color:var(--nl-muted)}
@media(max-width:620px){
  .nl-status{padding:16px}
  .nl-status__actions{margin-left:0;width:100%}
  .nl-status__actions .nl-btn{flex:1}
}

/* ---------- creator profile ---------- */
.nl-creator{display:grid;grid-template-columns:auto 1fr;gap:22px;align-items:center;padding:30px 0 8px}
.nl-creator__ring{
  position:relative;width:126px;height:126px;border-radius:50%;padding:3px;flex:none;
  background:conic-gradient(from 140deg,var(--nl-c1),var(--nl-c2),var(--nl-c3),var(--nl-c1));
  animation:nl-ring 5s ease-in-out infinite;
}
@keyframes nl-ring{
  0%,100%{box-shadow:0 0 calc(22px * var(--nl-glow)) color-mix(in srgb,var(--nl-c2) 35%,transparent)}
  50%{box-shadow:0 0 calc(46px * var(--nl-glow)) color-mix(in srgb,var(--nl-c1) 55%,transparent)}
}
.nl-creator__ring img,.nl-creator__ph{
  width:100%;height:100%;border-radius:50%;object-fit:cover;background:#1C1030;
  display:grid;place-items:center;color:var(--nl-muted);font-size:12px;text-align:center
}
.nl-creator__name{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin:0 0 4px;font-weight:800}
.nl-verified{width:23px;height:23px;flex:none;filter:drop-shadow(0 0 calc(8px * var(--nl-glow)) color-mix(in srgb,var(--nl-c3) 75%,transparent))}
.nl-creator__bio{color:#CFC2E6;max-width:62ch;margin:0 0 12px;font-size:15.5px}
/* Three fixed columns. The old inline list wrapped on a narrow phone and left
   the third stat stranded on its own line, so the width is shared evenly and
   the label sits under its number instead of beside it. */
.nl-creator__meta{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  margin:16px 0 0;padding:14px 0 0;list-style:none;
  border-top:1px solid var(--nl-line);max-width:420px;
}
.nl-creator__meta[data-count="1"]{grid-template-columns:minmax(0,1fr);max-width:160px}
.nl-creator__meta[data-count="2"]{grid-template-columns:repeat(2,minmax(0,1fr));max-width:300px}
.nl-creator__meta li{text-align:center;position:relative;padding:0 6px;min-width:0}
.nl-creator__meta li + li::before{
  content:"";position:absolute;left:0;top:5px;bottom:5px;width:1px;background:var(--nl-line);
}
.nl-creator__meta b{
  display:block;font-family:var(--nl-display);font-weight:800;font-size:20px;
  color:var(--nl-text);letter-spacing:-.02em;line-height:1.15;
}
.nl-creator__meta span{
  display:block;font-size:12px;color:var(--nl-muted);margin-top:2px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
@media(max-width:680px){
  .nl-creator{grid-template-columns:1fr;justify-items:center;text-align:center;gap:16px}
  .nl-creator__ring{width:104px;height:104px}
  .nl-creator__bio{margin-inline:auto}
  .nl-creator__meta{margin-inline:auto}
  .nl-creator__name{justify-content:center}
}

/* ---------- feed ---------- */
.nl-feed__head{display:flex;align-items:baseline;gap:14px;margin:0 0 16px;flex-wrap:wrap}
.nl-feed__head h2{margin:0}
.nl-feed__head p{margin:0;color:var(--nl-muted);font-size:14px}
.nl-grid{display:grid;gap:20px;grid-template-columns:repeat(var(--nl-cols,3),minmax(0,1fr));margin:0;padding:0;list-style:none}
@media(max-width:980px){.nl-grid{grid-template-columns:repeat(min(var(--nl-cols,3),2),minmax(0,1fr))}}
@media(max-width:600px){.nl-grid{grid-template-columns:1fr;gap:16px}}

.nl-card{
  position:relative;border:1px solid var(--nl-line);border-radius:var(--nl-radius);overflow:hidden;
  background:linear-gradient(180deg,var(--nl-panel),var(--nl-panel-2));
  transition:transform .22s ease,box-shadow .28s ease,border-color .22s ease;
}
.nl-card:hover{
  transform:translateY(-4px);border-color:color-mix(in srgb,var(--nl-c1) 40%,transparent);
  box-shadow:0 16px 44px -20px color-mix(in srgb,var(--nl-c1) 70%,transparent);
}
.nl-card__thumb{position:relative;aspect-ratio:4/5;overflow:hidden;background:#160C26;display:block}
@media(max-width:600px){.nl-card__thumb{aspect-ratio:4/3}}
.nl-card__thumb img{width:100%;height:100%;object-fit:cover;transition:filter .35s ease,transform .5s ease}
.nl-card__fallback{position:absolute;inset:0;
  background:radial-gradient(120% 90% at 20% 20%,var(--nl-c1),transparent 60%),
             radial-gradient(100% 80% at 80% 70%,var(--nl-c2),transparent 62%),
             linear-gradient(160deg,#2A1040,#0C0616);opacity:.55}
.nl-card.is-locked .nl-card__thumb img,
.nl-card.is-locked .nl-card__fallback{filter:blur(var(--nl-blur)) saturate(1.35) brightness(.78);transform:scale(1.14)}
.nl-card__link{position:absolute;inset:0;z-index:4}
.nl-card.is-locked .nl-card__link{display:none}

.nl-lock{
  position:absolute;inset:0;z-index:5;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:14px;text-align:center;padding:18px;
  background:linear-gradient(180deg,rgba(7,4,13,.28),rgba(7,4,13,.72));
}
.nl-lock__note{font-size:12.5px;color:#D9CBF2;max-width:24ch;line-height:1.45}
.nl-unlock{
  color:#0A0512;background:linear-gradient(100deg,var(--nl-c1),var(--nl-c2) 60%,var(--nl-c3));
  padding:11px 22px;border-radius:999px;font-family:var(--nl-display);font-weight:700;font-size:14px;
  display:inline-flex;align-items:center;gap:8px;border:0;cursor:pointer;
  animation:nl-unlock-breathe 3.6s ease-in-out infinite;
}
.nl-unlock:hover{color:#0A0512;filter:brightness(1.08)}
.nl-unlock svg{width:15px;height:15px}
@keyframes nl-unlock-breathe{
  0%,100%{box-shadow:0 0 calc(14px * var(--nl-glow)) color-mix(in srgb,var(--nl-c1) 35%,transparent)}
  50%{box-shadow:0 0 calc(30px * var(--nl-glow)) 4px color-mix(in srgb,var(--nl-c1) 70%,transparent)}
}
.nl-badge18{
  position:absolute;top:12px;left:12px;z-index:6;display:inline-flex;align-items:center;gap:6px;
  padding:5px 11px 5px 8px;border-radius:8px 14px 8px 14px;
  background:rgba(10,5,18,.72);border:1px solid color-mix(in srgb,var(--nl-c1) 65%,transparent);
  backdrop-filter:blur(6px);font-family:var(--nl-display);font-weight:800;font-size:12px;
  color:color-mix(in srgb,var(--nl-c1) 60%,#fff);
  box-shadow:0 0 calc(18px * var(--nl-glow)) -4px var(--nl-c1);
}
.nl-badge18 i{width:6px;height:6px;border-radius:50%;background:var(--nl-c1);box-shadow:0 0 calc(8px * var(--nl-glow)) var(--nl-c1)}
.nl-tag{
  position:absolute;top:12px;right:12px;z-index:6;display:inline-flex;align-items:center;gap:6px;
  padding:5px 10px;border-radius:999px;background:rgba(10,5,18,.7);border:1px solid var(--nl-line);
  font-size:11.5px;color:#CDBDE8;backdrop-filter:blur(6px);
}
.nl-tag svg{width:12px;height:12px}
.nl-play{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:3;
  width:58px;height:58px;border-radius:50%;display:grid;place-items:center;
  background:rgba(10,5,18,.55);border:1px solid rgba(255,255,255,.28);backdrop-filter:blur(4px);
}
.nl-card.is-locked .nl-play{display:none}
.nl-card__body{padding:14px 16px 16px}
.nl-card__title{font-family:var(--nl-display);font-weight:600;font-size:15.5px;margin:0 0 5px;letter-spacing:-.01em}
.nl-card__title a{color:var(--nl-text)}
.nl-card__title a:hover{color:var(--nl-c3)}
.nl-card__meta{font-size:12.5px;color:var(--nl-muted);display:flex;gap:12px;margin:0;flex-wrap:wrap}

/* ---------- upsell ---------- */
.nl-upsell{
  margin:44px 0 0;padding:28px 26px;border-radius:var(--nl-radius);
  border:1px solid color-mix(in srgb,var(--nl-c1) 28%,transparent);
  background:linear-gradient(120deg,color-mix(in srgb,var(--nl-c1) 14%,transparent),
    color-mix(in srgb,var(--nl-c2) 12%,transparent) 50%,color-mix(in srgb,var(--nl-c3) 10%,transparent));
  display:flex;align-items:center;gap:20px;flex-wrap:wrap;
}
.nl-upsell h2{margin:0 0 4px}
.nl-upsell p{margin:0;color:#D3C5EA;font-size:14.5px;max-width:56ch}
.nl-upsell .nl-btn{margin-left:auto}
@media(max-width:680px){.nl-upsell .nl-btn{margin-left:0;width:100%}}

/* ---------- single / pages ---------- */
.nl-entry{padding:34px 0 10px}
.nl-entry__head{margin-bottom:20px}
.nl-entry__meta{color:var(--nl-muted);font-size:13.5px;display:flex;gap:14px;flex-wrap:wrap}
.nl-entry__thumb{border-radius:var(--nl-radius);overflow:hidden;margin-bottom:24px;position:relative}
.nl-content{max-width:74ch}
.nl-content img{border-radius:var(--nl-radius-sm)}
.nl-content ul,.nl-content ol{padding-left:1.3em}
.nl-locked-body{
  position:relative;border:1px solid var(--nl-line);border-radius:var(--nl-radius);
  padding:44px 26px;text-align:center;
  background:linear-gradient(180deg,var(--nl-panel),var(--nl-panel-2));
}
.nl-locked-body h2{margin-top:0}
.nl-locked-body p{color:#CFC2E6;max-width:52ch;margin-inline:auto}
.nl-pagination{display:flex;gap:8px;flex-wrap:wrap;padding:30px 0}
.nl-pagination .page-numbers{
  padding:9px 14px;border-radius:10px;border:1px solid var(--nl-line);color:var(--nl-muted);font-size:14px
}
.nl-pagination .page-numbers.current,.nl-pagination .page-numbers:hover{
  color:#0A0512;background:linear-gradient(100deg,var(--nl-c3),var(--nl-c2));border-color:transparent
}
.nl-search{display:flex;gap:8px;max-width:420px}
.nl-search input[type="search"],.nl-form-field{
  flex:1;padding:11px 14px;border-radius:999px;border:1px solid var(--nl-line);
  background:rgba(255,255,255,.04);color:var(--nl-text);font-family:inherit;font-size:14px
}

/* ---------- footer ---------- */
.nl-footer{margin-top:56px;border-top:1px solid var(--nl-line);background:color-mix(in srgb,var(--nl-bg) 72%,transparent);position:relative;z-index:1}
.nl-footer__inner{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:32px;padding:34px 0 26px}
@media(max-width:760px){.nl-footer__inner{grid-template-columns:1fr;gap:24px}}
.nl-footer h3{font-size:14px;margin:0 0 10px}
.nl-footer p,.nl-footer a,.nl-footer li{color:var(--nl-muted);font-size:14px}
.nl-footer a:hover{color:var(--nl-c3)}
.nl-footer ul{list-style:none;margin:0;padding:0;display:grid;gap:7px}
.nl-tg{
  display:inline-flex;align-items:center;gap:9px;padding:9px 15px;border-radius:999px;
  border:1px solid color-mix(in srgb,var(--nl-c3) 35%,transparent);
  background:color-mix(in srgb,var(--nl-c3) 8%,transparent);
  color:color-mix(in srgb,var(--nl-c3) 65%,#fff)!important;font-size:13.5px;font-weight:500
}
.nl-tg:hover{background:color-mix(in srgb,var(--nl-c3) 16%,transparent)}
.nl-tg svg{width:16px;height:16px}
.nl-legal{border-top:1px solid var(--nl-line);padding:16px 0;display:flex;gap:14px;flex-wrap:wrap;
  color:var(--nl-muted);font-size:13px}
.nl-legal__right{margin-left:auto}
@media(max-width:600px){.nl-legal__right{margin-left:0}}

/* ---------- age gate ---------- */
.nl-gate{
  position:fixed;inset:0;z-index:9998;display:grid;place-items:center;padding:22px;
  background:rgba(4,2,9,.88);backdrop-filter:blur(16px);
  background-size:cover;background-position:center;
}
html.nl-gate-passed .nl-gate{display:none}
html.nl-gate-open{overflow:hidden}
.nl-gate__card{
  width:min(520px,100%);border-radius:24px;padding:36px 32px;text-align:center;
  border:1px solid color-mix(in srgb,var(--nl-c1) 30%,transparent);
  background:linear-gradient(180deg,#1B1030,#0B0517);
  animation:nl-gate-breathe 5s ease-in-out infinite;
}
@keyframes nl-gate-breathe{
  0%,100%{box-shadow:0 0 calc(70px * var(--nl-glow)) -28px color-mix(in srgb,var(--nl-c2) 70%,transparent)}
  50%{box-shadow:0 0 calc(110px * var(--nl-glow)) -18px color-mix(in srgb,var(--nl-c1) 75%,transparent)}
}
.nl-gate__mark{
  width:62px;height:62px;margin:0 auto 18px;border-radius:18px;display:grid;place-items:center;overflow:hidden;
  background:conic-gradient(from 210deg,var(--nl-c1),var(--nl-c2),var(--nl-c3),var(--nl-c1));
  font-family:var(--nl-display);font-weight:800;color:#0A0512;font-size:20px
}
.nl-gate__mark img{width:100%;height:100%;object-fit:cover}
.nl-gate__card h1{font-size:27px;margin:0 0 10px}
.nl-gate__card p{color:#C9B9E4;font-size:14.5px;margin:0 auto 22px;max-width:44ch}
.nl-gate__actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.nl-gate__fine{margin-top:20px;font-size:11.5px;color:#7E6E9B;line-height:1.5}

/* ---------- editor / Elementor helpers ---------- */
.nl-placeholder{
  border:1px dashed var(--nl-line);border-radius:var(--nl-radius);padding:26px;text-align:center;color:var(--nl-muted)
}
.alignwide{width:min(1320px,96vw);margin-inline:auto}
.alignfull{width:100vw;margin-left:calc(50% - 50vw)}
.aligncenter{margin-inline:auto}
.wp-caption-text,.wp-block-image figcaption{color:var(--nl-muted);font-size:13px;text-align:center}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}

/* ---------- unlock button, upgrade variant ---------- */
.nl-unlock--upgrade{
  color:#1A1000;
  background:linear-gradient(100deg,#FFD777,var(--nl-amber));
}
.nl-unlock--upgrade:hover{color:#1A1000}
.nl-unlock--upgrade{animation-name:nl-unlock-breathe-amber}
@keyframes nl-unlock-breathe-amber{
  0%,100%{box-shadow:0 0 calc(14px * var(--nl-glow)) color-mix(in srgb,var(--nl-amber) 35%,transparent)}
  50%{box-shadow:0 0 calc(30px * var(--nl-glow)) 4px color-mix(in srgb,var(--nl-amber) 70%,transparent)}
}

/* ---------- pinned post ---------- */
.nl-pinned-block{margin:0 0 30px}
.nl-pinned{
  display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);
  border:1px solid transparent;border-radius:var(--nl-radius);overflow:hidden;position:relative;
  background:linear-gradient(180deg,#1B1030,#0C0617) padding-box,
    linear-gradient(120deg,var(--nl-c3),var(--nl-c2),var(--nl-c1)) border-box;
  box-shadow:0 0 calc(50px * var(--nl-glow)) -24px var(--nl-c2);
}
@media(max-width:760px){.nl-pinned{grid-template-columns:1fr}}
.nl-pinned__art{position:relative;min-height:240px;overflow:hidden}
@media(max-width:760px){.nl-pinned__art{min-height:0;aspect-ratio:16/10}}
.nl-pinned__art img{width:100%;height:100%;object-fit:cover;display:block}
.nl-pinned.is-locked .nl-pinned__art img,
.nl-pinned.is-locked .nl-card__fallback{
  filter:blur(var(--nl-blur)) saturate(1.35) brightness(.78);transform:scale(1.12);
}
.nl-pinned__flag{
  position:absolute;top:14px;left:14px;z-index:7;display:inline-flex;align-items:center;gap:6px;
  padding:5px 12px;border-radius:999px;font-family:var(--nl-display);font-size:11px;font-weight:700;
  color:#0A0512;background:linear-gradient(100deg,var(--nl-c3),var(--nl-c2));
  box-shadow:0 0 calc(20px * var(--nl-glow)) -4px var(--nl-c3);
}
.nl-pinned__flag svg{width:12px;height:12px}
.nl-pinned__flag--sm{top:12px;left:12px;font-size:10.5px;padding:4px 10px}
.nl-pinned__body{padding:28px 26px;display:flex;flex-direction:column;justify-content:center}
@media(max-width:760px){.nl-pinned__body{padding:22px 18px}}
.nl-pinned__eyebrow{
  font-family:var(--nl-display);font-size:11px;font-weight:700;letter-spacing:.1em;
  text-transform:uppercase;color:var(--nl-c3);
}
.nl-pinned__title{font-family:var(--nl-display);font-size:clamp(19px,2.6vw,23px);font-weight:700;
  letter-spacing:-.02em;margin:10px 0 8px}
.nl-pinned__title a{color:var(--nl-text)}
.nl-pinned__title a:hover{color:var(--nl-c3)}
.nl-pinned__text{color:#CFC2E6;font-size:14.5px;margin:0 0 18px}
.nl-pinned__actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.nl-pinned__note{font-size:12.5px;color:var(--nl-muted)}
.nl-pinned-rest{margin-top:18px}
.nl-card.is-pinned{border-color:color-mix(in srgb,var(--nl-c3) 45%,transparent)}