/* ================================================================
   ایوانِ ادب — Design System
   Refined literary/editorial aesthetic. Tuned Nastaliq sizing.
   ================================================================ */
:root{
  /* palette — light (clean white editorial) */
  --paper:#FFFFFF;
  --paper-2:#F7F5F1;
  --card:#FFFFFF;
  --card-2:#FAF8F4;
  --ink:#191510;
  --ink-soft:#4C453A;
  --ink-faint:#948A78;
  --line:#EAE4D8;
  --line-soft:#F3EFE7;
  --accent:#0E5C4C;
  --accent-deep:#0A3E34;
  --gold:#A97C3C;
  --gold-soft:#C6A15C;
  --oxblood:#7A2E2E;

  --shadow-sm:0 1px 2px rgba(25,21,16,.04);
  --shadow:0 1px 3px rgba(25,21,16,.05),0 10px 24px rgba(25,21,16,.06);
  --shadow-lg:0 22px 54px rgba(25,21,16,.13);

  --r:14px;
  --r-lg:22px;
  --maxw:1180px;

  --nastaliq:'Jameel Noori Nastaleeq','AhleQalam Nastaliq','Noto Nastaliq Urdu','Gulzar',serif;
  --latin:'Cormorant Garamond',Georgia,serif;

  --read:1.16rem;
}
html[data-theme="dark"]{
  --paper:#12110D;
  --paper-2:#181611;
  --card:#1C1A14;
  --card-2:#211E17;
  --ink:#ECE3D1;
  --ink-soft:#C0B399;
  --ink-faint:#877B65;
  --line:#302B21;
  --line-soft:#262117;
  --accent:#41A992;
  --accent-deep:#2C7C6C;
  --gold:#CDA25A;
  --gold-soft:#E0BE7E;
  --shadow-sm:0 1px 2px rgba(0,0,0,.4);
  --shadow:0 2px 4px rgba(0,0,0,.3),0 12px 30px rgba(0,0,0,.45);
  --shadow-lg:0 26px 70px rgba(0,0,0,.6);
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  font-family:var(--nastaliq);
  background:var(--paper);
  color:var(--ink);
  font-size:16px;
  line-height:2.05;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
  transition:background .45s ease,color .45s ease;
}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
img,video{max-width:100%;display:block}
.latin{font-family:var(--latin);letter-spacing:.01em}
.num{font-family:var(--latin)}
::selection{background:var(--accent);color:#fff}

/* subtle paper grain */
body::before{content:none}
html[data-theme="dark"] body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:1;opacity:.5;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.03'/%3E%3C/svg%3E");
  mix-blend-mode:screen}

/* reading progress */
#progress{position:fixed;top:0;right:0;height:3px;width:0;z-index:200;
  background:linear-gradient(90deg,var(--gold),var(--accent));box-shadow:0 0 10px rgba(176,134,63,.45);transition:width .1s linear}

.wrap{max-width:var(--maxw);margin:0 auto;padding:0 1.5rem}
main{position:relative;z-index:2}

/* ================= HEADER ================= */
header{
  position:sticky;top:0;z-index:100;
  background:color-mix(in srgb,var(--paper) 84%,transparent);
  backdrop-filter:saturate(180%) blur(16px);
  border-bottom:1px solid var(--line);
}
.nav{max-width:var(--maxw);margin:0 auto;padding:.5rem 1.5rem;display:flex;align-items:center;gap:1.2rem}
.brand{display:flex;align-items:center;gap:.7rem;cursor:pointer;flex-shrink:0}
.brand .mark{
  width:42px;height:42px;border-radius:11px;flex-shrink:0;display:grid;place-items:center;color:#fff;
  font-size:1.35rem;line-height:1;
  background:linear-gradient(150deg,var(--accent),var(--accent-deep));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.14),0 6px 15px color-mix(in srgb,var(--accent) 30%,transparent);
}
.brand .mark span{transform:translateY(-3px)}
.brand h1{font-size:1.42rem;font-weight:600;line-height:1.3;letter-spacing:.01em}
.brand small{display:block;font-family:var(--latin);font-size:.6rem;letter-spacing:.24em;text-transform:uppercase;color:var(--ink-faint);margin-top:-3px}

nav.menu{display:flex;gap:.1rem;margin-inline-start:auto;align-items:center}
nav.menu a{padding:.4rem .8rem;border-radius:9px;font-size:1.06rem;color:var(--ink-soft);transition:.2s;position:relative}
nav.menu a:hover{color:var(--accent);background:var(--line-soft)}
nav.menu a.active{color:var(--accent)}
nav.menu a.active::after{content:"";position:absolute;bottom:1px;right:50%;transform:translateX(50%);width:16px;height:2px;border-radius:2px;background:var(--gold)}

.nav-tools{display:flex;align-items:center;gap:.4rem;flex-shrink:0}
.icon-btn{width:38px;height:38px;border-radius:10px;display:grid;place-items:center;border:1px solid var(--line);background:var(--card);transition:.2s;color:var(--ink-soft)}
.icon-btn:hover{border-color:var(--accent);color:var(--accent);transform:translateY(-1px)}
.icon-btn svg{width:18px;height:18px}
.admin-link{padding:.46rem .95rem;border-radius:10px;font-size:.98rem;color:#fff;background:linear-gradient(135deg,var(--accent),var(--accent-deep));box-shadow:0 5px 13px color-mix(in srgb,var(--accent) 28%,transparent);transition:transform .2s}
.admin-link:hover{transform:translateY(-1px)}
.hamburger{display:none}

/* search */
#searchWrap{position:fixed;inset:0;z-index:150;display:none;background:color-mix(in srgb,var(--ink) 42%,transparent);backdrop-filter:blur(4px)}
#searchWrap.open{display:block;animation:fade .25s}
.search-box{max-width:620px;margin:9vh auto 0;background:var(--card);border-radius:16px;padding:1rem 1.2rem;box-shadow:var(--shadow-lg);border:1px solid var(--line)}
.search-box input{width:100%;border:none;background:none;font-family:var(--nastaliq);font-size:1.35rem;color:var(--ink);padding:.3rem 0;outline:none}
.search-box input::placeholder{color:var(--ink-faint)}
#searchResults{margin-top:.5rem;max-height:52vh;overflow:auto}
.sr-item{display:flex;gap:.8rem;align-items:center;padding:.55rem .4rem;border-radius:9px;cursor:pointer}
.sr-item:hover{background:var(--line-soft)}
.sr-item .t{font-size:1.1rem}
.sr-item .m{font-size:.8rem;color:var(--ink-faint);font-family:var(--latin);margin-inline-start:auto}

/* mobile drawer */
#drawer{position:fixed;inset:0;z-index:160;display:none;background:color-mix(in srgb,var(--ink) 45%,transparent)}
#drawer.open{display:block;animation:fade .25s}
#drawer .dw{position:absolute;right:0;top:0;bottom:0;width:80%;max-width:320px;background:var(--card);padding:1.4rem;box-shadow:var(--shadow-lg);overflow:auto}
#drawer .dw a{display:block;padding:.75rem .4rem;font-size:1.25rem;border-bottom:1px solid var(--line-soft);color:var(--ink)}
#drawer .dw a:hover{color:var(--accent)}

/* ================= SECTION HEADS ================= */
.section{margin:4rem auto}
.sec-head{display:flex;align-items:center;gap:1rem;margin-bottom:1.5rem}
.sec-head .kicker{font-family:var(--latin);font-size:.68rem;letter-spacing:.28em;text-transform:uppercase;color:var(--gold);font-weight:600;padding-top:3px}
.sec-head h2{font-size:1.62rem;font-weight:600;line-height:1.7}
.sec-head .rule{flex:1;height:1px;background:linear-gradient(90deg,var(--line),transparent)}
.sec-head .more{font-size:.98rem;color:var(--accent);white-space:nowrap;transition:opacity .2s}
.sec-head .more:hover{opacity:.65}

.chip{display:inline-flex;align-items:center;gap:.3rem;font-size:.86rem;padding:.16rem .65rem;border-radius:999px;background:var(--line-soft);color:var(--ink-soft)}
.chip.accent{background:color-mix(in srgb,var(--accent) 13%,transparent);color:var(--accent)}
.byline{color:var(--ink-faint)}
.dot{opacity:.4;margin:0 .3rem}

.reveal{opacity:0;transform:translateY(20px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}

/* ================= HERO ================= */
.hero{margin-top:2.4rem;display:grid;grid-template-columns:1.4fr .95fr;gap:1.6rem;align-items:stretch}
.hero-main{
  position:relative;border-radius:var(--r-lg);overflow:hidden;min-height:430px;
  padding:2.4rem;display:flex;flex-direction:column;justify-content:flex-end;color:#F2EBDC;
  box-shadow:var(--shadow-lg);cursor:pointer;isolation:isolate;
  background:linear-gradient(180deg,rgba(8,30,26,.05),rgba(8,30,26,.88)),radial-gradient(120% 100% at 100% 0,#1a6b5c,#0a2b25 72%);
}
.hero-main.has-img{background:linear-gradient(180deg,rgba(8,20,18,.15),rgba(8,20,18,.85))}
.hero-main .bg{position:absolute;inset:0;z-index:-2;object-fit:cover;width:100%;height:100%}
.hero-main::after{content:"";position:absolute;inset:0;z-index:-1;opacity:.14;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='54' height='54'%3E%3Cg fill='none' stroke='%23d2a65b' stroke-width='.6'%3E%3Cpath d='M27 0 54 27 27 54 0 27z'/%3E%3Ccircle cx='27' cy='27' r='12'/%3E%3C/g%3E%3C/svg%3E")}
.hero-main .tag{align-self:flex-start;background:var(--gold);color:#241a08;font-size:.86rem;padding:.24rem .8rem;border-radius:999px;font-weight:600;margin-bottom:1rem}
.hero-main h2{font-size:2.15rem;line-height:1.75;font-weight:700;text-shadow:0 2px 16px rgba(0,0,0,.4)}
.hero-main p{margin-top:.7rem;font-size:1.1rem;color:#E4DCC9;max-width:46ch;opacity:.94;
  display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.hero-main .meta{margin-top:1.2rem;display:flex;align-items:center;gap:.5rem;font-size:.98rem;color:#d6ccb5}
.hero-side{display:flex;flex-direction:column;gap:1rem}
.mini{flex:1;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:1.05rem 1.2rem;display:flex;flex-direction:column;justify-content:center;box-shadow:var(--shadow);transition:.25s;cursor:pointer;position:relative;overflow:hidden}
.mini::after{content:"";position:absolute;top:0;right:0;width:3px;height:100%;background:var(--gold);opacity:0;transition:.25s}
.mini:hover{transform:translateX(-4px)}
.mini:hover::after{opacity:1}
.mini .k{font-family:var(--latin);font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);font-weight:600}
.mini h3{font-size:1.24rem;font-weight:600;margin-top:.1rem;line-height:1.75;
  display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.mini .by{font-size:.9rem;color:var(--ink-faint);margin-top:.25rem}

/* ================= CARD GRID ================= */
.grid{display:grid;gap:1.4rem}
.g2{grid-template-columns:repeat(2,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
.card{position:relative;background:var(--card);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow-sm);transition:transform .3s,box-shadow .3s,border-color .3s;cursor:pointer;display:flex;flex-direction:column}
.card::before{content:"";position:absolute;top:0;right:0;left:0;height:3px;background:linear-gradient(90deg,var(--accent),var(--gold-soft));transform:scaleX(0);transform-origin:right;transition:transform .4s cubic-bezier(.2,.7,.2,1)}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:color-mix(in srgb,var(--accent) 24%,var(--line))}
.card:hover::before{transform:scaleX(1)}
.card .body{padding:1.5rem 1.5rem 1.3rem;flex:1;display:flex;flex-direction:column;position:relative}
.card .ckick{font-family:var(--latin);font-size:.64rem;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);font-weight:600;margin-bottom:.6rem;display:flex;align-items:center;gap:.55rem}
.card .ckick::after{content:"";flex:1;height:1px;background:var(--line)}
.card .glyph{position:absolute;top:1.35rem;left:1.4rem;font-size:1.35rem;color:color-mix(in srgb,var(--gold) 40%,var(--line));pointer-events:none;line-height:1}
.card h3{font-size:1.42rem;font-weight:600;line-height:1.85;margin-bottom:.45rem;transition:color .2s;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.card:hover h3{color:var(--accent)}
.card p{font-size:1rem;color:var(--ink-soft);line-height:2;flex:1;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.card .foot{display:flex;align-items:center;justify-content:space-between;margin-top:1rem;padding-top:.85rem;border-top:1px solid var(--line-soft);font-size:.9rem;color:var(--ink-faint)}
.card .foot .reads{display:flex;align-items:center;gap:.35rem;font-family:var(--latin)}
.card.poem{text-align:center}
.card.poem .body{padding-top:2rem}
.card.poem .glyph{position:static;display:block;text-align:center;margin-bottom:.4rem;color:var(--gold-soft)}
.card.poem h3{font-size:1.55rem;-webkit-line-clamp:3;line-clamp:3}

/* list rows */
.list-row{display:flex;gap:1rem;padding:1rem 0;border-bottom:1px solid var(--line-soft);cursor:pointer;align-items:flex-start}
.list-row:hover .lr-t{color:var(--accent)}
.list-row .n{font-family:var(--latin);font-size:1.5rem;color:var(--line);font-weight:600;width:2ch;flex-shrink:0;text-align:center;transition:color .2s;line-height:1.8}
.list-row:hover .n{color:var(--gold)}
.lr-t{font-size:1.22rem;font-weight:600;line-height:1.8;transition:color .2s}
.lr-m{font-size:.9rem;color:var(--ink-faint);margin-top:.2rem}

/* ================= POETRY ================= */
.poetry-feature{background:linear-gradient(165deg,color-mix(in srgb,var(--accent) 8%,var(--card)),var(--card));border:1px solid var(--line);border-radius:var(--r-lg);padding:2.6rem 2rem;text-align:center;position:relative;overflow:hidden;box-shadow:var(--shadow);cursor:pointer}
.poetry-feature::before,.poetry-feature::after{content:"❃";position:absolute;font-size:1.4rem;color:var(--gold);opacity:.45}
.poetry-feature::before{top:1.1rem;right:1.4rem}.poetry-feature::after{bottom:1.1rem;left:1.4rem}
.sher{font-size:1.7rem;line-height:2.4;color:var(--ink);font-weight:500}
.sher .misra{display:block}
.poetry-feature .poet{margin-top:1.2rem;font-size:1.05rem;color:var(--accent);font-weight:600}
.poetry-feature .poet::before{content:"— ";color:var(--gold)}
.poem-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}
.poem-card{border:1px solid var(--line);border-radius:14px;padding:1.7rem 1.3rem;text-align:center;background:var(--card);box-shadow:var(--shadow);cursor:pointer;transition:transform .28s,border-color .28s;display:flex;flex-direction:column;justify-content:center;min-height:180px;position:relative}
.poem-card:hover{transform:translateY(-4px);border-color:color-mix(in srgb,var(--gold) 5%,var(--line))}
.poem-card .badge{position:absolute;top:.85rem;right:1rem;font-size:.78rem;color:var(--gold)}
.poem-card .sh{font-size:1.28rem;line-height:2.1;color:var(--ink)}
.poem-card .poet{margin-top:.9rem;font-size:.94rem;color:var(--ink-faint)}

/* ================= NOVELS ================= */
.novel-row{display:grid;grid-template-columns:repeat(4,1fr);gap:1.4rem}
.novel-card{background:var(--card);border:1px solid var(--line);border-radius:14px;overflow:hidden;box-shadow:var(--shadow);cursor:pointer;transition:transform .28s,box-shadow .28s}
.novel-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.novel-cover{height:200px;display:grid;place-items:center;color:#f2ebdc;position:relative;padding:1.1rem;text-align:center;overflow:hidden}
.novel-cover img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.novel-cover .ov{position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,20,18,.1),rgba(8,20,18,.55))}
.novel-cover h4{font-size:1.35rem;line-height:1.8;font-weight:700;text-shadow:0 2px 10px rgba(0,0,0,.4);position:relative;z-index:1}
.novel-cover .spine{position:absolute;top:0;right:0;width:7px;height:100%;background:rgba(0,0,0,.22);z-index:2}
.novel-card .nb{padding:.85rem 1rem 1rem}
.novel-card .nb .by{font-size:.92rem;color:var(--ink-faint)}
.novel-card .nb .status{display:inline-flex;gap:.3rem;align-items:center;font-size:.82rem;margin-top:.45rem;color:var(--accent)}
.novel-card .nb .status.done{color:var(--gold)}
.novel-card .prog{height:5px;background:var(--line-soft);border-radius:999px;margin-top:.65rem;overflow:hidden}
.novel-card .prog i{display:block;height:100%;background:linear-gradient(90deg,var(--accent),var(--gold))}

/* ================= AUTHORS ================= */
.author-row{display:grid;grid-template-columns:repeat(5,1fr);gap:1rem}
.author-card{text-align:center;cursor:pointer;padding:1.2rem .8rem;border-radius:14px;transition:background .25s}
.author-card:hover{background:var(--card)}
.avatar{width:76px;height:76px;border-radius:50%;margin:0 auto .7rem;display:grid;place-items:center;font-size:1.7rem;color:#fff;overflow:hidden;background:linear-gradient(140deg,var(--accent),var(--accent-deep));box-shadow:0 8px 18px color-mix(in srgb,var(--accent) 28%,transparent),inset 0 0 0 3px rgba(255,255,255,.15);transition:transform .28s}
.avatar img{width:100%;height:100%;object-fit:cover}
.author-card:hover .avatar{transform:scale(1.06)}
.author-card .an{font-size:1.15rem;font-weight:600}
.author-card .ar{font-size:.86rem;color:var(--ink-faint)}

/* editor pick */
.epick{display:grid;grid-template-columns:1fr 1fr;border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow)}
.epick .left{padding:2.6rem 2.3rem;background:var(--card);display:flex;flex-direction:column;justify-content:center}
.epick .left .k{font-family:var(--latin);letter-spacing:.24em;font-size:.68rem;text-transform:uppercase;color:var(--gold);font-weight:600}
.epick .left h3{font-size:1.8rem;line-height:1.8;font-weight:700;margin:.4rem 0 .6rem}
.epick .left p{color:var(--ink-soft);font-size:1.02rem;max-width:44ch;display:-webkit-box;-webkit-line-clamp:3;line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.epick .left .cta{margin-top:1.2rem;align-self:flex-start;padding:.55rem 1.4rem;border-radius:10px;color:#fff;background:linear-gradient(135deg,var(--accent),var(--accent-deep));transition:transform .2s}
.epick .left .cta:hover{transform:translateY(-2px)}
.epick .right{background:linear-gradient(180deg,rgba(8,20,18,.1),rgba(8,20,18,.65)),radial-gradient(120% 120% at 0 0,#1a6b5c,#0a2b25);min-height:260px;display:grid;place-items:center;color:#f2ebdc;font-size:4rem;position:relative;overflow:hidden}
.epick .right img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

/* ================= READER ================= */
.reader{max-width:700px;margin:2.2rem auto 0;padding:0 1.5rem}
.reader.wide{max-width:760px}
.back-btn{display:inline-flex;align-items:center;gap:.4rem;color:var(--ink-faint);font-size:.98rem;margin-bottom:1.4rem;transition:color .2s}
.back-btn:hover{color:var(--accent)}
.r-type{font-family:var(--latin);letter-spacing:.22em;text-transform:uppercase;font-size:.7rem;color:var(--gold);font-weight:600}
.reader h1{font-size:2rem;line-height:1.85;font-weight:700;margin:.5rem 0 .9rem}
.r-hero{margin:1.4rem 0;border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow)}
.r-hero img{width:100%;max-height:440px;object-fit:cover}
.r-video{margin:1.4rem 0;border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow);aspect-ratio:16/9;background:#000}
.r-video iframe,.r-video video{width:100%;height:100%;border:0;display:block}
.r-meta{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;color:var(--ink-faint);font-size:.98rem;padding-bottom:1.2rem;border-bottom:1px solid var(--line);margin-bottom:1.8rem}
.r-author{display:flex;align-items:center;gap:.5rem}
.r-author .a-av{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:1rem;overflow:hidden;background:linear-gradient(140deg,var(--accent),var(--accent-deep))}
.r-author .a-av img{width:100%;height:100%;object-fit:cover}
.r-author b{color:var(--ink);font-weight:600}

.article-body{font-size:var(--read);line-height:2.5;color:var(--ink)}
.article-body p{margin-bottom:1.4rem;text-align:justify}
.article-body p:first-of-type::first-letter{font-size:inherit;font-weight:inherit;color:inherit;float:none;margin:0}
.pullquote{border-inline-start:3px solid var(--gold);padding:.3rem 1.2rem;margin:1.8rem 0;font-size:1.35rem;color:var(--accent-deep);line-height:2.1}
html[data-theme="dark"] .pullquote{color:var(--gold-soft)}

/* reader toolbar */
.r-toolbar{display:flex;gap:.5rem;align-items:center;justify-content:space-between;margin:1.4rem 0;padding:.5rem .7rem;border:1px solid var(--line-soft);border-radius:14px;background:color-mix(in srgb,var(--paper) 78%,transparent);backdrop-filter:saturate(150%) blur(12px);position:sticky;top:64px;z-index:40;box-shadow:0 4px 18px rgba(25,21,16,.05)}
.r-toolbar .grp{display:flex;gap:.4rem;align-items:center}
.r-toolbar button{width:36px;height:36px;border-radius:9px;border:1px solid var(--line);display:grid;place-items:center;transition:.2s;color:var(--ink-soft)}
.r-toolbar button:hover{border-color:var(--accent);color:var(--accent)}
.r-toolbar button.on{background:var(--accent);color:#fff;border-color:var(--accent)}
.r-toolbar button svg{width:17px;height:17px}
.r-toolbar .fs{font-family:var(--latin);font-size:.82rem;color:var(--ink-faint);min-width:3ch;text-align:center}

/* poem reader */
.poem-reader{max-width:600px;margin:2.2rem auto 0;padding:0 1.5rem;text-align:center}
.poem-reader h1{font-size:1.95rem;font-weight:700;line-height:1.8}
.pr-poet{color:var(--accent);font-size:1.1rem;margin:.4rem 0 1.8rem}
.pr-poet::before{content:"— "}
.couplet{margin:1.7rem 0;font-size:1.5rem;line-height:2.7;color:var(--ink)}
.couplet .misra{display:block}
.divider-orn{color:var(--gold);font-size:1.15rem;margin:1.8rem 0;opacity:.55}

/* author box */
.author-box{margin:2.6rem 0;padding:1.5rem;border:1px solid var(--line);border-radius:14px;background:var(--card);display:flex;gap:1.1rem;align-items:flex-start;box-shadow:var(--shadow)}
.author-box .a-av{width:60px;height:60px;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:1.5rem;flex-shrink:0;overflow:hidden;background:linear-gradient(140deg,var(--accent),var(--accent-deep))}
.author-box .a-av img{width:100%;height:100%;object-fit:cover}
.author-box .ab-name{font-size:1.35rem;font-weight:600}
.author-box .ab-role{color:var(--gold);font-size:.94rem;margin-bottom:.35rem}
.author-box p{color:var(--ink-soft);font-size:1rem;line-height:2.05}

/* prev/next + related */
.pn-nav{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:2.2rem 0}
.pn-nav a{border:1px solid var(--line);border-radius:12px;padding:1rem 1.2rem;background:var(--card);transition:.25s;box-shadow:var(--shadow)}
.pn-nav a:hover{border-color:var(--accent);transform:translateY(-3px)}
.pn-nav .k{font-size:.82rem;color:var(--ink-faint)}
.pn-nav .t{font-size:1.12rem;font-weight:600;margin-top:.25rem;color:var(--accent);display:-webkit-box;-webkit-line-clamp:1;line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.pn-nav .next{text-align:left}

/* comments (public) */
.comments{max-width:700px;margin:2.6rem auto;padding:0 1.5rem}
.comment{border:1px solid var(--line);border-radius:12px;padding:1rem 1.2rem;margin-bottom:.8rem;background:var(--card)}
.comment .cn{font-weight:600;color:var(--accent)}
.comment .ct{color:var(--ink-soft);font-size:1rem}
.cform{margin-top:1.2rem;display:grid;gap:.8rem}
.cform input,.cform textarea{border:1px solid var(--line);border-radius:10px;padding:.6rem .85rem;background:var(--paper-2);font-family:var(--nastaliq);font-size:1.05rem;color:var(--ink);outline:none}
.cform input:focus,.cform textarea:focus{border-color:var(--accent)}
.cform textarea{min-height:90px;line-height:2;resize:vertical}

/* novel reader */
.novel-head{display:grid;grid-template-columns:190px 1fr;gap:1.8rem;margin:2.2rem auto 0;max-width:880px;padding:0 1.5rem;align-items:center}
.novel-head .cover{height:260px;border-radius:12px;display:grid;place-items:center;color:#f2ebdc;text-align:center;padding:1rem;box-shadow:var(--shadow-lg);position:relative;overflow:hidden}
.novel-head .cover img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.novel-head .cover .ov{position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,20,18,.1),rgba(8,20,18,.5))}
.novel-head .cover .spine{position:absolute;top:0;right:0;width:8px;height:100%;background:rgba(0,0,0,.25);z-index:2}
.novel-head .cover h4{font-size:1.3rem;line-height:1.75;font-weight:700;position:relative;z-index:1;text-shadow:0 2px 10px rgba(0,0,0,.4)}
.novel-head h1{font-size:1.95rem;font-weight:700;line-height:1.8}
.novel-head .nh-by{color:var(--accent);font-size:1.1rem;margin:.3rem 0 .7rem}
.novel-head p{color:var(--ink-soft);line-height:2.05}
.chapter-list{max-width:880px;margin:2.2rem auto;padding:0 1.5rem}
.ch-item{display:flex;align-items:center;gap:1rem;padding:.95rem 1.1rem;border:1px solid var(--line);border-radius:12px;background:var(--card);margin-bottom:.65rem;cursor:pointer;transition:.22s;box-shadow:var(--shadow)}
.ch-item:hover{border-color:var(--accent);transform:translateX(-4px)}
.ch-item .cn{width:42px;height:42px;border-radius:10px;display:grid;place-items:center;font-family:var(--latin);font-weight:600;font-size:1.15rem;background:var(--line-soft);color:var(--accent);flex-shrink:0}
.ch-item .ct{font-size:1.18rem;font-weight:600}
.ch-item .cm{font-size:.85rem;color:var(--ink-faint);margin-inline-start:auto;font-family:var(--latin)}
.chap-topbar{max-width:700px;margin:1.8rem auto 0;padding:0 1.5rem;display:flex;justify-content:space-between;align-items:center;gap:1rem}
.chap-topbar .sel{border:1px solid var(--line);border-radius:10px;padding:.45rem .85rem;background:var(--card);font-family:var(--nastaliq);font-size:1rem;color:var(--ink);cursor:pointer;box-shadow:var(--shadow);max-width:60%}

/* archive head */
.arch-head{text-align:center;margin:2.6rem auto 2rem;max-width:620px}
.arch-head .k{font-family:var(--latin);letter-spacing:.26em;text-transform:uppercase;font-size:.7rem;color:var(--gold);font-weight:600}
.arch-head h1{font-size:2.3rem;font-weight:700;margin-top:.3rem;line-height:1.7}
.arch-head p{color:var(--ink-soft);margin-top:.5rem;font-size:1.05rem}
.arch-head .orn{color:var(--gold);font-size:1.3rem;margin-top:.7rem;opacity:.55;letter-spacing:.5rem}

/* ================= FOOTER ================= */
footer{margin-top:4.5rem;border-top:1px solid var(--line);background:var(--paper-2);position:relative;z-index:2}
.footer-in{max-width:var(--maxw);margin:0 auto;padding:3.2rem 1.5rem 2rem;display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:2rem}
.fbrand h3{font-size:1.7rem;font-weight:600}
.fbrand p{color:var(--ink-soft);margin-top:.6rem;line-height:2.05;max-width:38ch;font-size:1rem}
.footer-col h4{font-size:1.15rem;margin-bottom:.8rem;font-weight:600;color:var(--accent)}
.footer-col a{display:block;color:var(--ink-soft);padding:.24rem 0;font-size:1rem;transition:color .2s}
.footer-col a:hover{color:var(--accent)}
.socials{display:flex;gap:.5rem;margin-top:.9rem}
.socials a{width:38px;height:38px;border-radius:10px;border:1px solid var(--line);display:grid;place-items:center;transition:.2s;color:var(--ink-soft)}
.socials a:hover{background:var(--accent);color:#fff;border-color:var(--accent);transform:translateY(-2px)}
.socials svg{width:17px;height:17px}
.footer-bottom{border-top:1px solid var(--line);text-align:center;padding:1.3rem 1rem;color:var(--ink-faint);display:flex;flex-direction:column;gap:.35rem}
.footer-bottom .fb-main{font-size:.98rem;color:var(--ink-soft)}
.footer-bottom .fb-copy{font-size:.82rem;opacity:.75}
.footer-bottom .fb-craft{font-size:.92rem;color:var(--gold)}

.empty{text-align:center;padding:3rem;color:var(--ink-faint)}
.empty .e-ico{font-size:2.4rem;opacity:.4;margin-bottom:.5rem}

.toast{position:fixed;bottom:1.4rem;left:50%;transform:translateX(-50%) translateY(20px);background:var(--ink);color:var(--paper);padding:.75rem 1.4rem;border-radius:11px;font-size:1rem;z-index:300;opacity:0;pointer-events:none;transition:.3s;box-shadow:var(--shadow-lg)}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

@keyframes fade{from{opacity:0}to{opacity:1}}

/* ================= RESPONSIVE ================= */
@media(max-width:1000px){
  .g4,.novel-row{grid-template-columns:repeat(2,1fr)}
  .author-row{grid-template-columns:repeat(3,1fr)}
  .hero{grid-template-columns:1fr}
  .hero-side{flex-direction:row}
  .poem-cards{grid-template-columns:1fr}
  .epick{grid-template-columns:1fr}
  .epick .right{min-height:170px}
  .footer-in{grid-template-columns:1fr 1fr}
  .home-split{grid-template-columns:1fr!important}
}
@media(max-width:720px){
  .g2,.g3,.g4,.novel-row,.poem-cards,.author-row{grid-template-columns:1fr}
  nav.menu{display:none}
  .hamburger{display:grid}
  .hero-side{flex-direction:column}
  .hero-main h2{font-size:1.7rem}
  .reader h1,.poem-reader h1,.novel-head h1{font-size:1.6rem}
  .sec-head h2{font-size:1.35rem}
  .brand h1{font-size:1.2rem}
  .footer-in{grid-template-columns:1fr}
  .novel-head{grid-template-columns:1fr;justify-items:center;text-align:center}
  .arch-head h1{font-size:1.8rem}
}

/* ================= v2: branding, reading modes, new features ================= */

/* logo image in header */
.brand-logo{max-height:46px;width:auto;display:block}
@media(max-width:720px){.brand-logo{max-height:38px}}

/* reading font switch (applies in readers) */
html[data-rfont="naskh"]{--read-font:'Noto Naskh Arabic','Noto Nastaliq Urdu',serif}
html[data-rfont="gulzar"]{--read-font:'Gulzar','Noto Nastaliq Urdu',serif}
html[data-rfont="nastaliq"]{--read-font:var(--nastaliq)}
.article-body,.couplet,.poem-reader .couplet,.sher,.poem-card .sh{font-family:var(--read-font,var(--nastaliq))}
.article-body{line-height:var(--read-lh,2.5)}
.couplet{line-height:calc(var(--read-lh,2.5) + .2)}

/* sepia paper mode */
html[data-paper="sepia"]{
  --paper:#EDE3CC;--paper-2:#F3EBD6;--card:#FAF3E1;--card-2:#F3EAD4;
  --ink:#3A2E1C;--ink-soft:#5E4E36;--ink-faint:#907B57;
  --line:#DFD0AE;--line-soft:#EADFC4;
}
html[data-paper="sepia"] body{background-image:radial-gradient(1100px 560px at 100% -8%,rgba(176,134,63,.12),transparent 60%)}

/* reader settings panel */
.rs-back{position:fixed;inset:0;background:rgba(20,17,12,.45);backdrop-filter:blur(3px);z-index:180;opacity:0;pointer-events:none;transition:.25s}
.rs-back.open{opacity:1;pointer-events:auto}
.rs-panel{position:fixed;z-index:181;left:50%;bottom:0;transform:translate(-50%,110%);width:min(460px,94vw);background:var(--card);border:1px solid var(--line);border-radius:20px 20px 0 0;box-shadow:var(--shadow-lg);padding:1.2rem 1.3rem 1.6rem;transition:transform .32s cubic-bezier(.2,.8,.2,1)}
.rs-panel.open{transform:translate(-50%,0)}
@media(min-width:720px){.rs-panel{bottom:1.5rem;border-radius:18px;border:1px solid var(--line)}}
.rs-head{display:flex;align-items:center;justify-content:space-between;font-size:1.2rem;margin-bottom:1rem}
.rs-x{width:32px;height:32px;border-radius:9px;font-size:1.4rem;color:var(--ink-faint);border:1px solid var(--line)}
.rs-sec{margin-bottom:1.1rem}
.rs-sec>span{display:block;font-size:.9rem;color:var(--ink-faint);margin-bottom:.5rem}
.rs-row{display:flex;gap:.5rem;align-items:center}
.rs-chip{flex:1;padding:.55rem;border:1px solid var(--line);border-radius:11px;background:var(--paper-2);color:var(--ink-soft);font-size:1.02rem;transition:.2s}
.rs-chip:hover{border-color:var(--accent)}
.rs-chip.on{background:var(--accent);color:#fff;border-color:var(--accent)}
.rs-row .fs{font-family:var(--latin);min-width:3ch;text-align:center;color:var(--ink-faint)}
.rs-range{width:100%;accent-color:var(--accent)}

/* reader toolbar extra buttons */
.r-toolbar .tts-btn,.r-toolbar .txt-btn{width:auto;padding:0 .7rem;gap:.35rem;font-size:.92rem;display:inline-flex;align-items:center}
.r-toolbar .tts-btn .tts-l{font-size:.92rem}
.like-btn{width:auto!important;padding:0 .7rem!important;gap:.35rem;display:inline-flex;align-items:center;position:relative}
.like-btn.on{color:var(--oxblood);border-color:var(--oxblood)}
html[data-theme="dark"] .like-btn.on{color:#e88;border-color:#e88}
.like-btn .lc{font-family:var(--latin);font-size:.9rem}
.heart-fly{position:absolute;left:50%;top:0;transform:translateX(-50%);pointer-events:none;animation:heartUp .8s ease-out forwards;color:var(--oxblood)}
@keyframes heartUp{0%{opacity:1;transform:translate(-50%,0) scale(.6)}100%{opacity:0;transform:translate(-50%,-40px) scale(1.4)}}

/* quote card modal */
.qc-modal{position:fixed;inset:0;z-index:190;background:rgba(20,17,12,.6);backdrop-filter:blur(5px);display:none;padding:3vh 1rem;overflow:auto}
.qc-modal.open{display:block;animation:fade .25s}
.qc-box{max-width:880px;margin:0 auto;background:var(--card);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow-lg);padding:1.3rem 1.4rem}
.qc-head{display:flex;align-items:center;justify-content:space-between;font-size:1.25rem;margin-bottom:1rem}
.qc-grid{display:grid;grid-template-columns:1fr 300px;gap:1.4rem}
.qc-canvas{width:100%;aspect-ratio:1;border-radius:14px;border:1px solid var(--line);box-shadow:var(--shadow)}
.qc-controls{display:flex;flex-direction:column;gap:.5rem}
.qc-controls label{font-size:.9rem;color:var(--ink-faint);margin-top:.3rem}
.qc-controls textarea{min-height:110px;border:1px solid var(--line);border-radius:11px;padding:.6rem .8rem;background:var(--paper-2);color:var(--ink);font-family:var(--nastaliq);font-size:1.15rem;line-height:2;resize:vertical;outline:none}
.qc-controls input{border:1px solid var(--line);border-radius:11px;padding:.55rem .8rem;background:var(--paper-2);color:var(--ink);font-family:var(--nastaliq);font-size:1.05rem;outline:none}
.qc-controls textarea:focus,.qc-controls input:focus{border-color:var(--accent)}
.qc-styles{display:flex;gap:.5rem}
.qc-style{width:40px;height:40px;border-radius:10px;border:3px solid transparent;cursor:pointer;box-shadow:var(--shadow-sm)}
.qc-style.on{border-color:var(--ink)}
.qc-dl{justify-content:center;margin-top:.6rem}
.qc-share{justify-content:center}
@media(max-width:720px){.qc-grid{grid-template-columns:1fr}}

/* poem couplet quote action */
.couplet-wrap{position:relative}
.couplet-wrap .qc-mini{position:absolute;left:0;top:50%;transform:translateY(-50%);opacity:0;transition:.2s;border:1px solid var(--line);border-radius:9px;padding:.25rem .6rem;font-size:.85rem;color:var(--accent);background:var(--card)}
.couplet-wrap:hover .qc-mini{opacity:1}

/* library */
.lib-tabs{display:flex;gap:.5rem;justify-content:center;margin:1.5rem 0}
.lib-tab{padding:.5rem 1.2rem;border:1px solid var(--line);border-radius:999px;background:var(--card);color:var(--ink-soft);font-size:1.02rem;transition:.2s}
.lib-tab:hover{border-color:var(--accent)}
.lib-tab.on{background:var(--accent);color:#fff;border-color:var(--accent)}

/* app-install button */
#pwaBtn{display:none}

/* sher of the day */
.sotd{margin-top:2.4rem;border:1px solid var(--line);border-radius:var(--r-lg);background:linear-gradient(135deg,color-mix(in srgb,var(--gold) 10%,var(--card)),var(--card));padding:1.6rem 1.8rem;display:flex;align-items:center;gap:1.4rem;box-shadow:var(--shadow);position:relative;overflow:hidden}
.sotd .badge-d{font-family:var(--latin);writing-mode:vertical-rl;text-orientation:mixed;letter-spacing:.2em;font-size:.7rem;text-transform:uppercase;color:var(--gold);font-weight:600}
.sotd .sotd-body{flex:1;text-align:center}
.sotd .sotd-sher{font-size:1.35rem;line-height:2.2;color:var(--ink)}
.sotd .sotd-sher .misra{display:block}
.sotd .sotd-poet{margin-top:.6rem;color:var(--accent);font-size:.98rem}
.sotd .sotd-act{display:flex;flex-direction:column;gap:.4rem}
@media(max-width:720px){.sotd{flex-direction:column}.sotd .badge-d{writing-mode:horizontal-tb}}

/* ================= v3: masthead strip + magazine polish ================= */
.masthead-strip{border-bottom:1px solid var(--line-soft);background:color-mix(in srgb,var(--paper) 60%,transparent)}
.ms-in{max-width:var(--maxw);margin:0 auto;padding:.35rem 1.5rem;display:flex;align-items:center;justify-content:space-between;gap:1rem}
.ms-date{font-size:.86rem;color:var(--ink-faint)}
.ms-tag{font-size:.86rem;color:var(--accent)}
@media(max-width:640px){.ms-tag{display:none}.ms-in{justify-content:center}}

/* refined section head: gold rule flourish */
.sec-head .kicker{position:relative}
.sec-head h2{letter-spacing:.005em}
.sec-head .rule{background:linear-gradient(90deg,var(--gold-soft),var(--line) 40%,transparent)}

/* cards: warmer image treatment + gentle zoom */

/* hero: richer imagery + refined type */
.hero-main{min-height:460px}
.hero-main h2{font-size:2.35rem}
.hero-main .tag{box-shadow:0 4px 14px rgba(176,134,63,.35)}

/* poetry feature: paper texture depth */
.poetry-feature{background:
  radial-gradient(120% 130% at 50% -20%, color-mix(in srgb,var(--gold) 8%,transparent), transparent 60%),
  linear-gradient(165deg,color-mix(in srgb,var(--accent) 7%,var(--card)),var(--card))}
.sher{font-size:1.85rem}

/* novel covers taller, book-like */
.novel-cover{height:230px}
.novel-cover h4{font-size:1.4rem}

/* footer refinement (if present) */
footer .foot-grid{gap:2.4rem}

/* headings global weight tune for Nastaliq */
.card h3,.mini h3,.lr-t,.sec-head h2,.hero-main h2,.novel-cover h4{font-weight:600}

/* ================= v4: white theme polish + layout fixes ================= */
.home-split{display:grid;grid-template-columns:1.5fr 1fr;gap:3rem;align-items:start}
@media(max-width:820px){.home-split{grid-template-columns:1fr;gap:1.5rem}}
.section{margin:3.4rem auto}
.hero{margin-top:2rem}

/* list rows a touch more refined on white */
.list-row{padding:.95rem 0}
.list-row .n{color:var(--line)}
.lr-t{font-size:1.24rem}

/* poetry feature + poem cards crisp on white */
.poetry-feature{border-radius:var(--r-lg)}
.poem-card{border-radius:var(--r);min-height:170px}

/* novels: cleaner frame on white */
.novel-card{border-radius:var(--r)}
.novel-cover{height:225px}

/* author chips on white */
.author-card:hover{background:var(--paper-2)}

/* editor pick contrast on white */
.epick{border-radius:var(--r-lg)}
.epick .right{background:linear-gradient(150deg,var(--accent),var(--accent-deep));display:grid;place-items:center;color:var(--gold-soft);font-size:3rem;min-height:220px;overflow:hidden}
.epick .right img{width:100%;height:100%;object-fit:cover}

/* sotd on white: soften */
.sotd{border-radius:var(--r-lg);background:linear-gradient(135deg,color-mix(in srgb,var(--gold) 8%,var(--card)),var(--card))}

/* header crisp on white */
header{background:color-mix(in srgb,#fff 86%,transparent)}
html[data-theme="dark"] header{background:color-mix(in srgb,var(--paper) 84%,transparent)}

/* section head headings slightly larger, editorial */
.sec-head h2{font-size:1.75rem}
.hero-main h2{font-size:2.4rem}

/* ================= v5: contributor area, pages, forms, mobile ================= */

/* buttons */
.btn-primary{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;padding:.7rem 1.5rem;border-radius:12px;font-size:1.06rem;color:#fff;background:linear-gradient(135deg,var(--accent),var(--accent-deep));box-shadow:0 8px 20px color-mix(in srgb,var(--accent) 24%,transparent);transition:transform .2s,box-shadow .2s;border:none;cursor:pointer}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 12px 26px color-mix(in srgb,var(--accent) 30%,transparent)}
.btn-ghost{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;padding:.66rem 1.3rem;border-radius:12px;font-size:1.02rem;color:var(--ink-soft);background:var(--card);border:1px solid var(--line);transition:.2s;cursor:pointer}
.btn-ghost:hover{border-color:var(--accent);color:var(--accent)}
.btn-ghost.sm{padding:.4rem .9rem;font-size:.92rem}
.btn-ghost.dis{opacity:.6;pointer-events:none}

/* notes */
.note{padding:.8rem 1.1rem;border-radius:12px;margin-bottom:1rem;font-size:1rem}
.note.ok{background:color-mix(in srgb,var(--accent) 12%,var(--card));border:1px solid color-mix(in srgb,var(--accent) 30%,var(--line));color:var(--accent)}
.note.err{background:#fbeaea;border:1px solid #e6c3c3;color:#8a2b2b}
html[data-theme="dark"] .note.err{background:#3a1e1e;border-color:#5a2e2e;color:#f0b8b8}

/* form fields */
.ff label,.submit-card label,.contact-form label{display:block;font-size:.95rem;color:var(--ink-soft);margin:1rem 0 .4rem}
.ff label:first-child,.submit-card label:first-of-type{margin-top:0}
.ff input,.ff textarea,.ff select,
.submit-card input,.submit-card textarea,.submit-card select,
.contact-form input,.contact-form textarea{
  width:100%;padding:.72rem .9rem;border:1px solid var(--line);border-radius:12px;background:var(--paper-2);
  color:var(--ink);font-family:var(--nastaliq);font-size:1.1rem;outline:none;transition:.2s}
.ff input:focus,.ff textarea:focus,.ff select:focus,
.submit-card input:focus,.submit-card textarea:focus,.submit-card select:focus,
.contact-form input:focus,.contact-form textarea:focus{border-color:var(--accent);background:var(--card);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 12%,transparent)}
.ff textarea,.submit-card textarea,.contact-form textarea{line-height:2;resize:vertical}
.ff .btn-primary{margin-top:1.3rem;width:100%}
.hint{color:var(--ink-faint);font-size:.85rem}
input[type=file]{font-family:var(--latin);font-size:.95rem;padding:.5rem!important}

/* auth */
.auth-wrap{display:grid;grid-template-columns:1fr 1fr;gap:0;max-width:940px;margin:2.4rem auto;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-lg);background:var(--card)}
.auth-aside{padding:2.6rem 2.2rem;background:linear-gradient(160deg,var(--accent),var(--accent-deep));color:#EFE8D8}
.auth-aside .k{font-family:var(--latin);font-size:.68rem;letter-spacing:.26em;text-transform:uppercase;color:var(--gold-soft);font-weight:600}
.auth-aside h2{font-size:2rem;margin:.5rem 0 1rem;color:#fff}
.auth-aside p{opacity:.9;line-height:2.1}
.auth-points{list-style:none;margin-top:1.4rem;display:flex;flex-direction:column;gap:.7rem}
.auth-points li{font-size:1rem;opacity:.92}
.auth-form{padding:2.4rem 2.2rem}
.auth-form h3{font-size:1.5rem;margin-bottom:1.2rem}
.auth-alt{margin-top:1.2rem;color:var(--ink-faint);font-size:.98rem;text-align:center}
.auth-alt a{color:var(--accent);font-weight:600}

/* submit */
.submit-head{text-align:center;max-width:720px;margin:2.4rem auto 1.6rem}
.submit-head .k{font-family:var(--latin);font-size:.68rem;letter-spacing:.26em;text-transform:uppercase;color:var(--gold);font-weight:600}
.submit-head h1{font-size:2.3rem;margin:.4rem 0 .6rem}
.submit-head p{color:var(--ink-soft)}
.submit-card{max-width:820px;margin:0 auto 3rem;background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);padding:2rem 2.1rem;box-shadow:var(--shadow)}
.ff-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.submit-card label{margin-top:1.1rem}

/* account */
.acct-head{display:flex;align-items:center;gap:1.4rem;max-width:900px;margin:2.4rem auto 0;padding:1.8rem;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--card);box-shadow:var(--shadow)}
.acct-av{width:88px;height:88px;border-radius:50%;flex-shrink:0;overflow:hidden;display:grid;place-items:center;font-size:2rem;color:#fff;background:linear-gradient(140deg,var(--accent),var(--accent-deep));box-shadow:inset 0 0 0 3px rgba(255,255,255,.15)}
.acct-av img{width:100%;height:100%;object-fit:cover}
.acct-info h1{font-size:1.8rem}
.acct-role{color:var(--ink-faint);margin-bottom:.7rem}
.acct-actions{display:flex;gap:.6rem;flex-wrap:wrap}
.acct-list{display:flex;flex-direction:column;gap:.7rem;max-width:900px;margin:0 auto}
.acct-row{display:flex;align-items:center;gap:1rem;padding:1rem 1.3rem;border:1px solid var(--line);border-radius:14px;background:var(--card);transition:.2s}
.acct-row:hover{border-color:color-mix(in srgb,var(--accent) 24%,var(--line))}
.ar-main{flex:1;min-width:0}
.ar-t{font-size:1.2rem;font-weight:600}
.ar-m{font-size:.9rem;color:var(--ink-faint)}
.tag{display:inline-block;padding:.16rem .7rem;border-radius:999px;font-size:.85rem}
.tag.ok{background:color-mix(in srgb,var(--accent) 14%,var(--card));color:var(--accent)}
.tag.pend{background:#f6ecd8;color:#8a6528}
.tag.draft{background:var(--line-soft);color:var(--ink-soft)}
html[data-theme="dark"] .tag.pend{background:#3a3016;color:#e0c07a}

/* pages */
.page-head{text-align:center;max-width:760px;margin:2.6rem auto 1.6rem}
.page-head .k{font-family:var(--latin);font-size:.68rem;letter-spacing:.26em;text-transform:uppercase;color:var(--gold);font-weight:600}
.page-head h1{font-size:2.5rem;margin:.4rem 0}
.page-head .orn{color:var(--gold-soft);letter-spacing:.5em;margin-top:.6rem}
.page-body{max-width:760px;margin:0 auto 3rem;font-size:1.12rem;line-height:2.4;color:var(--ink-soft)}
.page-body h2{font-size:1.5rem;color:var(--ink);margin:1.8rem 0 .6rem}
.page-body a{color:var(--accent);font-weight:600}
.page-cta{display:flex;gap:.7rem;justify-content:center;margin-top:2rem;flex-wrap:wrap}
.contact-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:2rem;max-width:940px;margin:0 auto 3rem;align-items:start}
.contact-info{padding:2rem;border:1px solid var(--line);border-radius:var(--r-lg);background:linear-gradient(160deg,color-mix(in srgb,var(--accent) 6%,var(--card)),var(--card))}
.contact-info h2{font-size:1.5rem;margin-bottom:.6rem}
.contact-info p{color:var(--ink-soft);line-height:2.1}
.ci-row{display:flex;justify-content:space-between;padding:.7rem 0;border-top:1px solid var(--line-soft);margin-top:1rem}
.ci-socials{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:1rem}
.ci-socials a{padding:.4rem 1rem;border:1px solid var(--line);border-radius:999px;color:var(--accent);font-size:.95rem}
.contact-form{padding:2rem;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--card);box-shadow:var(--shadow)}
.contact-form .btn-primary{margin-top:1.3rem;width:100%}

/* ---------- mobile polish ---------- */
@media(max-width:820px){
  .auth-wrap{grid-template-columns:1fr}
  .auth-aside{padding:1.8rem}
  .contact-grid{grid-template-columns:1fr}
  .ff-grid{grid-template-columns:1fr}
}
@media(max-width:720px){
  .nav{padding:.5rem .9rem;gap:.5rem}
  .nav-tools{gap:.3rem}
  .admin-link{padding:.44rem .8rem;font-size:.9rem}
  .r-toolbar{flex-wrap:wrap;justify-content:center;gap:.4rem;top:56px;padding:.5rem}
  .r-toolbar .grp{flex-wrap:wrap;justify-content:center}
  .r-toolbar .tts-btn,.r-toolbar .txt-btn{font-size:.86rem;padding:0 .55rem}
  .page-head h1{font-size:1.9rem}
  .submit-head h1{font-size:1.8rem}
  .submit-card,.contact-form,.contact-info{padding:1.3rem}
  .acct-head{flex-direction:column;text-align:center}
  .acct-actions{justify-content:center}
  .masthead-strip{display:none}
}
@media(max-width:400px){
  .brand h1{font-size:1.1rem}
  .admin-link{padding:.4rem .6rem;font-size:.82rem}
}

/* ================= v6: correct Urdu rendering in accent labels ================= */
/* Urdu text must use Nastaliq and no letter-spacing (Latin kickers stay as-is) */
.mini .k{font-family:var(--nastaliq);letter-spacing:normal;text-transform:none;font-size:.86rem;color:var(--gold)}
.epick .left .k{font-family:var(--nastaliq);letter-spacing:normal;text-transform:none;font-size:.9rem;color:var(--gold)}
.sotd .badge-d{font-family:var(--nastaliq);letter-spacing:normal;text-transform:none;writing-mode:horizontal-tb;font-size:1rem;font-weight:600;color:var(--gold);white-space:nowrap}
@media(max-width:720px){.sotd .badge-d{writing-mode:horizontal-tb}}

/* ================= v7: authoritative mobile typography (must stay last) ================= */
@media(max-width:720px){
  html{font-size:15px}
  body{line-height:1.95}
  .hero-main h2{font-size:1.55rem}
  .hero-main p{font-size:1rem}
  .sec-head h2{font-size:1.4rem}
  .sec-head .kicker{font-size:.6rem}
  .card h3{font-size:1.24rem}
  .card p{font-size:.98rem}
  .lr-t{font-size:1.14rem}
  .mini h3{font-size:1.14rem}
  .reader h1,.poem-reader h1,.novel-head h1{font-size:1.55rem}
  .article-body{line-height:2.2}
  .sher,.poetry-feature .sher{font-size:1.35rem;line-height:2.2}
  .poem-card .sh{font-size:1.15rem}
  .sotd .sotd-sher{font-size:1.15rem}
  .page-head h1{font-size:1.7rem}
  .submit-head h1{font-size:1.6rem}
  .acct-info h1{font-size:1.5rem}
  .auth-aside h2{font-size:1.6rem}
  .brand h1{font-size:1.15rem}
  .novel-cover h4{font-size:1.2rem}
}
@media(max-width:400px){
  html{font-size:14px}
  .hero-main h2{font-size:1.4rem}
  .sec-head h2{font-size:1.3rem}
}

/* ================= v8: honeypot, newsletter, account note ================= */
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;opacity:0;pointer-events:none}
.ar-note{margin-top:.5rem;font-size:.92rem;color:var(--oxblood);background:color-mix(in srgb,var(--oxblood) 8%,var(--card));border:1px solid color-mix(in srgb,var(--oxblood) 20%,var(--line));border-radius:9px;padding:.5rem .8rem}
html[data-theme="dark"] .ar-note{color:#e8a8a8}

.newsletter{border-top:1px solid var(--line);background:linear-gradient(160deg,color-mix(in srgb,var(--accent) 5%,var(--card)),var(--card))}
.nl-in{max-width:var(--maxw);margin:0 auto;padding:2rem 1.5rem;display:flex;align-items:center;gap:1.6rem;flex-wrap:wrap}
.nl-text{flex:1;min-width:220px}
.nl-text h3{font-size:1.4rem;margin-bottom:.3rem}
.nl-text p{color:var(--ink-soft)}
.nl-form{display:flex;gap:.6rem;flex-wrap:wrap}
.nl-form input{padding:.7rem 1rem;border:1px solid var(--line);border-radius:12px;background:var(--paper-2);color:var(--ink);font-family:var(--nastaliq);min-width:220px;outline:none}
.nl-form input:focus{border-color:var(--accent)}
.nl-note{width:100%;color:var(--accent);font-size:.95rem}
@media(max-width:640px){.nl-in{flex-direction:column;align-items:stretch;text-align:center}.nl-form{justify-content:center}}

/* ================= v9: tags, comment replies ================= */
.tag-chips{display:flex;flex-wrap:wrap;gap:.5rem;max-width:760px;margin:1.6rem auto 0;justify-content:center}
.tag-chip{padding:.3rem .9rem;border:1px solid var(--line);border-radius:999px;font-size:.95rem;color:var(--accent);background:var(--card);transition:.2s}
.tag-chip:hover{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,var(--card))}
.tag-chip::before{content:"#";color:var(--gold);margin-inline-end:.15rem}

.comment .c-reply{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center;margin-top:.3rem}
.comment .reply-btn{font-size:.85rem;color:var(--accent);background:none;border:none;cursor:pointer;padding:0}
.comment .reply-btn:hover{text-decoration:underline}
.comment.is-reply{margin-inline-start:2rem;border-inline-start:2px solid var(--line);padding-inline-start:1rem}
#replyBanner{display:none;align-items:center;justify-content:space-between;gap:1rem;background:color-mix(in srgb,var(--accent) 8%,var(--card));border:1px solid var(--line);border-radius:10px;padding:.5rem .9rem;margin-bottom:.8rem;font-size:.95rem}
#replyBanner.on{display:flex}
#replyBanner button{color:var(--oxblood);background:none;border:none;cursor:pointer}
