/* نوافذ النشرة البريدية وبطاقة آخر المقال، بمتغيرات الهوية */
.tz-nlf{display:flex;gap:6px}
.tz-nlf input{flex:1;min-width:0;width:100%;font:inherit;font-size:14.5px;border:1px solid var(--x-line);border-radius:99px;padding:9px 14px;background:color-mix(in srgb,var(--x-ink) 3%,var(--x-bg));color:var(--x-ink)}
.tz-nlf input.bad,.xfm-nl input.bad{border-color:#c0392b;box-shadow:0 0 0 3px #c0392b22}
.sx .tz-nlf button{border-radius:99px;background:var(--x-ac);color:var(--x-on-ac);font-weight:700;padding:9px 18px;font-size:14.5px;flex:none}
.tz-nlf button:disabled{opacity:.6}
.tz-nl-ok{display:flex;align-items:center;gap:10px;color:var(--x-ac);font-weight:700;font-size:14.5px;animation:tz-nlpop .4s both;line-height:1.6}
.tz-nl-ok svg{width:28px;height:28px;flex:none}
.tz-nl-ok svg path{stroke-dasharray:30;stroke-dashoffset:30;animation:tz-chk .6s .15s forwards}
.tz-nl-ok.sm{font-size:13.5px}
.xt-footer .tz-nl-ok{color:var(--x-lime,#9bd94f)}
@keyframes tz-chk{to{stroke-dashoffset:0}}
@keyframes tz-nlpop{from{transform:scale(.9);opacity:0}}
.sx .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* بطاقة آخر المقال */
.tz-nlc{position:relative;overflow:hidden;margin-top:18px;background:var(--x-deep);color:#eaf4e4;border-radius:22px;padding:18px 20px;display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:center;isolation:isolate}
.tz-nlc::before{content:"";position:absolute;inset:-60%;z-index:-1;background:conic-gradient(from 0deg,transparent 0 75%,color-mix(in srgb,var(--x-ac2B) 30%,transparent) 85%,transparent 95%);animation:xw-spin 9s linear infinite}
.tz-nlc-ic{width:56px;height:56px;border-radius:18px;background:#ffffff14;display:grid;place-items:center;color:var(--x-lime,#9bd94f)}
.tz-nlc-ic svg{width:30px;height:30px;animation:tz-float 3s ease-in-out infinite}
@keyframes tz-float{50%{transform:translateY(-4px) rotate(-4deg)}}
.tz-nlc b{color:#fff;font-size:16px;display:block}
.tz-nlc small{color:#cfe3c8;font-size:13px}
.tz-nlc .tz-nlf,.tz-nlc .tz-nl-ok{grid-column:1/-1}
.tz-nlc .tz-nlf input{background:#ffffff14;border-color:#ffffff2e;color:#fff}
.tz-nlc .tz-nlf input::placeholder{color:#cfe3c8}
.sx .tz-nlc .tz-nlf button{background:var(--x-ac2B);color:var(--x-on-ac2)}
.tz-nlc .tz-nl-ok{color:var(--x-lime,#9bd94f)}

/* المنزلقة */
.tz-nl-slide{position:fixed;z-index:85;bottom:calc(18px + env(safe-area-inset-bottom,0px));left:18px;width:min(330px,calc(100vw - 36px));background:var(--x-surfaceB);color:var(--x-ink);border-radius:20px;box-shadow:0 24px 54px -18px color-mix(in srgb,var(--x-deep) 60%,transparent);padding:16px;display:grid;gap:10px;animation:tz-slin .6s cubic-bezier(.2,1.3,.4,1) both}
.tz-nl-slide>*{min-width:0}
.tz-nl-slide.out,.tz-nl-back.out{opacity:0;transition:opacity .3s}
@keyframes tz-slin{from{transform:translateY(40px);opacity:0}}
.tz-nl-hd{display:flex;gap:10px;align-items:center}
.tz-nl-ic{width:42px;height:42px;border-radius:14px;background:color-mix(in srgb,var(--x-ac2B) 16%,transparent);display:grid;place-items:center;color:var(--x-ac);flex:none}
.tz-nl-ic svg{width:22px;height:22px}
.tz-nl-hd b{font-size:15px}
.tz-nl-hd small{color:var(--x-muted);font-size:12.5px;display:block;line-height:1.5}
.tz-nl-ints{display:flex;gap:6px;flex-wrap:wrap}
.tz-nl-ints label{font-size:12.5px;border:1px solid var(--x-line);border-radius:99px;padding:2px 10px;cursor:pointer;color:var(--x-muted);display:inline-flex;gap:4px;align-items:center}
.tz-nl-ints input{accent-color:var(--x-ac);margin:0}
.sx .tz-nl-x{position:absolute;top:10px;left:10px;width:26px;height:26px;border-radius:50%;background:color-mix(in srgb,var(--x-ink) 6%,transparent);color:var(--x-muted);font-size:13px;z-index:2}
/* نافذة المغادرة */
.tz-nl-back{position:fixed;inset:0;z-index:95;background:color-mix(in srgb,var(--x-deep) 40%,transparent);display:grid;place-items:center;padding:16px;animation:tz-fade .3s both}
@keyframes tz-fade{from{opacity:0}}
.tz-nl-modal{position:relative;width:min(380px,100%);background:var(--x-surfaceB);color:var(--x-ink);border-radius:24px;overflow:hidden;animation:tz-nlpop .45s cubic-bezier(.2,1.3,.4,1) both}
.tz-nl-art{height:110px;background:linear-gradient(135deg,var(--x-deep),var(--x-ac));display:grid;place-items:center}
.tz-nl-art i{width:58px;height:58px;border-radius:18px;background:#ffffff1f;position:relative;animation:tz-float 3s ease-in-out infinite}
.tz-nl-art i::after{content:"";position:absolute;inset:14px 10px;border:2.5px solid var(--x-lime,#9bd94f);border-radius:6px;background:linear-gradient(160deg,transparent 46%,var(--x-lime,#9bd94f) 47% 53%,transparent 54%),linear-gradient(20deg,transparent 46%,var(--x-lime,#9bd94f) 47% 53%,transparent 54%)}
.tz-nl-bd{padding:18px;display:grid;gap:8px;text-align:center}
.tz-nl-bd>*{min-width:0}
.tz-nl-bd b{font-size:17px}
.tz-nl-bd small{color:var(--x-muted);font-size:13.5px}
@media (prefers-reduced-motion:reduce){.tz-nlc::before,.tz-nlc-ic svg,.tz-nl-art i,.tz-nl-slide,.tz-nl-modal{animation:none!important}}
