@font-face{font-family:'Vazirmatn';font-style:normal;font-weight:100 900;font-display:swap;src:url(../fonts/vazirmatn-arabic.woff2) format('woff2');unicode-range:U+0600-06FF, U+0750-077F, U+0870-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC7, U+10EC9-10EEE, U+10EF0-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1}
@font-face{font-family:'Vazirmatn';font-style:normal;font-weight:100 900;font-display:swap;src:url(../fonts/vazirmatn-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Vazirmatn';font-style:normal;font-weight:100 900;font-display:swap;src:url(../fonts/vazirmatn-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}

/* Layout: Fidibo-style shelf. Warm paper ground, one violet primary, flat surfaces, 4px controls, 12px cards. Home = hero + a 90-tile map of the book; Book = cover + pay-what-you-want panel; Reader = TOC rail + 680px column + comment drawer. */
:root{
  --bg:#F8F5F1; --card:#FDFDFD; --surface:#F2EDE6; --line:#E5DCCF; --line-strong:#C9BAA7;
  --fg:#23211F; --muted:#7A6F62; --faint:#A89C8D;
  --primary:#594EF2; --on-primary:#FFFFFF; --primary-hover:#473EC2; --primary-ink:#594EF2;
  --tint:#DBD3EC; --tint-fg:#332352; --plum:#553A89;
  --ok:#1F7A4D; --ok-bg:#DDEFE4; --bad:#B3261E; --bad-bg:#F6DAD7; --mark:#E7DEF7;
  --font:'Vazirmatn',Tahoma,'Segoe UI',system-ui,sans-serif;
  --r1:4px; --r2:8px; --r3:12px; --r4:16px;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#1A1816; --card:#242120; --surface:#2B2724; --line:#38332E; --line-strong:#4D463F;
  --fg:#F3EEE7; --muted:#A99F92; --faint:#7A7066;
  --primary:#6A60F5; --on-primary:#FFFFFF; --primary-hover:#8379FF; --primary-ink:#A59DFF;
  --tint:#3A3158; --tint-fg:#E4DEFA; --plum:#B8A6DA;
  --ok:#6FCF9B; --ok-bg:#1E3A2B; --bad:#FF8E85; --bad-bg:#43211E; --mark:#40376A; color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#1A1816; --card:#242120; --surface:#2B2724; --line:#38332E; --line-strong:#4D463F;
  --fg:#F3EEE7; --muted:#A99F92; --faint:#7A7066;
  --primary:#6A60F5; --on-primary:#FFFFFF; --primary-hover:#8379FF; --primary-ink:#A59DFF;
  --tint:#3A3158; --tint-fg:#E4DEFA; --plum:#B8A6DA;
  --ok:#6FCF9B; --ok-bg:#1E3A2B; --bad:#FF8E85; --bad-bg:#43211E; --mark:#40376A; color-scheme:dark}

*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--font);font-size:15px;line-height:1.8;direction:rtl;-webkit-text-size-adjust:100%}
button,input,textarea{font:inherit;color:inherit}
button{cursor:pointer}
a{color:var(--primary-ink)}
:focus-visible{outline:2px solid var(--primary);outline-offset:2px}
.wrap{width:100%;max-width:1120px;margin-inline:auto;padding-inline:16px}
.en{font-family:var(--font);unicode-bidi:isolate}
.num{font-variant-numeric:tabular-nums}
svg.i{width:1.15em;height:1.15em;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:8px 20px;border:1.25px solid transparent;border-radius:var(--r1);background:var(--primary);color:var(--on-primary);font-weight:700;font-size:15px;text-decoration:none;transition:background .15s}
.btn:hover{background:var(--primary-hover)}
.btn.ghost{background:transparent;color:var(--fg);border-color:var(--line-strong)}
.btn.ghost:hover{background:var(--surface)}
.btn.soft{background:var(--tint);color:var(--tint-fg)}
.btn.soft:hover{background:var(--tint);filter:brightness(.96)}
.btn.sm{min-height:36px;padding:4px 12px;font-size:13px}
.btn.block{width:100%}
.btn[disabled]{opacity:.6;cursor:progress}
.chip{display:inline-flex;align-items:center;gap:6px;padding:2px 10px;border-radius:99px;background:var(--surface);color:var(--muted);font-size:13px;white-space:nowrap}
.chip.ok{background:var(--ok-bg);color:var(--ok)}
.chip.pri{background:var(--tint);color:var(--tint-fg)}

/* top bar */
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:var(--bg);border-bottom:1px solid var(--line)}
.top .wrap{display:flex;align-items:center;gap:16px;min-height:60px}
a.logo{text-decoration:none}
.logo{display:flex;align-items:center;gap:8px;font-weight:800;font-size:24px;color:var(--fg);background:none;border:0;padding:0}
.logo b{display:grid;place-items:center;width:32px;height:32px;border-radius:var(--r2);background:var(--primary);color:#fff;font-size:18px;line-height:1}
.search{flex:1;max-width:420px;position:relative;margin-inline-start:8px}
.search input{width:100%;height:40px;padding-inline:40px 12px;background:var(--card);border:1.25px solid var(--line);border-radius:var(--r1);font-size:14px}
.search svg{position:absolute;inset-inline-start:12px;top:50%;translate:0 -50%;color:var(--muted)}
.top .sp{flex:1}
.me{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted)}
.me i{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--tint);color:var(--tint-fg);font-style:normal;font-weight:700}
@media(max-width:640px){.search,.me span{display:none}}

/* home */
.hero{padding-block:40px 24px}
.hero .wrap{display:grid;grid-template-columns:1.25fr 1fr;gap:40px;align-items:center}
.eyebrow{display:inline-flex;gap:8px;align-items:center;color:var(--plum);font-weight:700;font-size:13px;letter-spacing:.02em}
h1{margin:8px 0 12px;font-size:clamp(28px,4.4vw,44px);line-height:1.35;font-weight:800;text-wrap:balance}
.lead{margin:0 0 24px;color:var(--muted);font-size:17px;max-width:34em}
.ctas{display:flex;flex-wrap:wrap;gap:12px}
.cover{position:relative;aspect-ratio:3/4;width:100%;max-width:300px;margin-inline:auto;border-radius:var(--r3);background:var(--primary);color:#fff;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;padding:20px;cursor:pointer;border:0;text-align:start;direction:ltr}
.cover svg.bg{position:absolute;inset:0;width:100%;height:100%}
.cover .n{position:relative;font-size:96px;font-weight:800;line-height:1;letter-spacing:-.03em}
.cover .t{position:relative;font-size:22px;font-weight:700;line-height:1.25}
.cover .s{position:relative;font-size:12px;opacity:.85;margin-top:6px;letter-spacing:.04em;text-transform:uppercase}
.cover.sm{max-width:220px;margin:0}
.cover.sm .n{font-size:72px}.cover.sm .t{font-size:17px}
@media(max-width:820px){.hero .wrap{grid-template-columns:1fr}.hero .cover{max-width:240px}}

.sec{padding-block:32px}
.sec h2{margin:0 0 4px;font-size:24px;font-weight:800}
.sec .sub{margin:0 0 20px;color:var(--muted)}
.map{display:grid;grid-template-columns:repeat(15,minmax(0,1fr));gap:6px}
.tile{aspect-ratio:1;display:grid;place-items:center;border-radius:var(--r1);background:var(--surface);color:var(--faint);font-size:13px;border:0;font-weight:500}
.tile.on{background:var(--primary);color:#fff;font-weight:800;cursor:pointer;outline:3px solid var(--tint);outline-offset:2px}
.tile.on:hover{background:var(--primary-hover)}
.legend{display:flex;flex-wrap:wrap;gap:16px;margin-top:16px;font-size:13px;color:var(--muted)}
.legend span{display:inline-flex;gap:8px;align-items:center}
.legend i{width:14px;height:14px;border-radius:3px;background:var(--surface);display:inline-block}
.legend i.on{background:var(--primary)}
@media(max-width:820px){.map{grid-template-columns:repeat(10,minmax(0,1fr))}}
@media(max-width:480px){.map{grid-template-columns:repeat(9,minmax(0,1fr));gap:4px}.tile{font-size:11px}}
.how{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.how>div{background:var(--card);border:1px solid var(--line);border-radius:var(--r3);padding:20px}
.how svg.i{width:28px;height:28px;color:var(--primary-ink);margin-bottom:12px}
.how h3{margin:0 0 4px;font-size:18px}
.how p{margin:0;color:var(--muted);font-size:14px}
@media(max-width:760px){.how{grid-template-columns:1fr}}
.foot{padding-block:32px;color:var(--muted);font-size:13px;border-top:1px solid var(--line);margin-top:24px}

/* book page */
.crumb{display:flex;gap:8px;align-items:center;padding-block:16px;font-size:13px;color:var(--muted)}
.crumb button{background:none;border:0;padding:0;color:var(--primary-ink);font-size:13px}
.book{display:grid;grid-template-columns:220px minmax(0,1fr) 360px;gap:32px;align-items:start;padding-bottom:32px}
.book h1{font-size:clamp(24px,3.4vw,34px);margin:0 0 8px}
.book .facts{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 20px}
.book .about{color:var(--muted);margin:0 0 20px;max-width:38em}
.parts{list-style:none;margin:0;padding:0;border:1px solid var(--line);border-radius:var(--r3);background:var(--card);overflow:hidden}
.parts li{display:flex;gap:12px;align-items:center;padding:12px 16px;border-top:1px solid var(--line)}
.parts li:first-child{border-top:0}
.parts b{flex:1;font-weight:700}
.parts small{color:var(--muted)}
.parts svg.i{color:var(--muted)}
.parts .free svg.i{color:var(--ok)}
.buy{position:sticky;top:76px;background:var(--card);border:1px solid var(--line);border-radius:var(--r3);padding:20px}
.buy h3{margin:0 0 4px;font-size:18px}
.buy .amt{display:flex;align-items:baseline;gap:8px;margin:12px 0 4px}
.buy .amt strong{font-size:40px;font-weight:800;line-height:1.1;letter-spacing:-.01em}
.buy .amt span{color:var(--muted)}
.buy input[type=range]{width:100%;height:32px;accent-color:var(--primary);margin:0;direction:rtl}
.scale{display:flex;justify-content:space-between;font-size:12px;color:var(--muted)}
.presets{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}
.presets button{min-height:36px;padding:2px 12px;border:1.25px solid var(--line-strong);border-radius:var(--r1);background:transparent;font-size:13px}
.presets button[aria-pressed=true]{background:var(--tint);border-color:var(--primary);color:var(--tint-fg);font-weight:700}
.hint{font-size:13px;color:var(--muted);margin:0 0 16px;min-height:2.6em}
.refund{display:flex;gap:12px;margin-top:16px;padding:12px;background:var(--surface);border-radius:var(--r2);font-size:13px;color:var(--muted)}
.refund svg.i{color:var(--ok);width:22px;height:22px}
.refund strong{color:var(--fg)}
.owned-box .row{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}
.ask{background:var(--bad-bg);border-radius:var(--r2);padding:12px;margin-top:12px;font-size:14px}
.ask .row{margin-top:12px}
.contrib{margin-top:32px}
.contrib h2{font-size:20px;margin:0 0 4px}
.contrib p{margin:0 0 12px;color:var(--muted)}
.names{display:flex;flex-wrap:wrap;gap:8px}
@media(max-width:1000px){.book{grid-template-columns:200px minmax(0,1fr)}.buy{grid-column:1/-1;position:static}}
@media(max-width:620px){.book{grid-template-columns:1fr}.book .cover{margin:0}}

/* reader */
.rtop{position:sticky;top:env(safe-area-inset-top,0px);z-index:30;background:var(--bg);border-bottom:1px solid var(--line)}
.rtop .row{display:flex;align-items:center;gap:8px;min-height:52px}
.rtop .ttl{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;flex:1}
.ibtn{display:inline-flex;align-items:center;gap:6px;height:40px;min-width:40px;padding-inline:10px;background:transparent;border:0;border-radius:var(--r1);color:var(--fg);font-size:13px;justify-content:center}
.ibtn:hover{background:var(--surface)}
.ibtn .badge{min-width:20px;height:20px;border-radius:99px;background:var(--primary);color:#fff;font-size:11px;display:grid;place-items:center;padding-inline:5px}
.tabs{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;border-top:1px solid var(--line)}
.tabs::-webkit-scrollbar{display:none}
.tabs button{flex:none;display:inline-flex;gap:6px;align-items:center;min-height:44px;padding:0 14px;background:none;border:0;border-bottom:3px solid transparent;color:var(--muted);font-weight:500;font-size:14px;white-space:nowrap}
.tabs button[aria-selected=true]{color:var(--fg);border-bottom-color:var(--primary);font-weight:700}
.tabs svg.i{width:14px;height:14px}
.prog{position:absolute;inset-inline:0;bottom:-1px;height:3px;background:transparent}
.prog i{display:block;height:100%;width:0;background:var(--primary);transform-origin:right}
.rbody{display:grid;grid-template-columns:260px minmax(0,680px);gap:48px;justify-content:center;padding-block:32px 80px}
.toc{position:sticky;top:130px;align-self:start;max-height:calc(100vh - 150px);overflow:auto;font-size:13px;padding-inline-end:8px}
.toc h4{margin:0 0 8px;font-size:12px;color:var(--muted);letter-spacing:.04em;font-weight:700}
.toc a{display:block;padding:4px 12px;border-inline-start:2px solid var(--line);color:var(--muted);text-decoration:none;line-height:1.6}
.toc a.l2{font-weight:700;color:var(--fg);margin-top:8px}
.toc a.on{border-inline-start-color:var(--primary);color:var(--primary-ink)}
.toc a:hover{color:var(--primary-ink)}
@media(max-width:960px){.rbody{grid-template-columns:minmax(0,1fr)}.toc{display:none}}
.toc-sheet .toc{display:block;position:static;max-height:none}

.art{font-size:var(--fs,17px);line-height:2.05;-webkit-touch-callout:none;min-width:0}
.art .part{display:none}.art .part.active{display:block}
.art h2.hd{font-size:1.7em;line-height:1.5;margin:2.2em 0 .5em;font-weight:800;padding-top:.6em;border-top:1px solid var(--line)}
.art h2.hd:first-child{border-top:0;margin-top:0;padding-top:0}
.art h3.hd{font-size:1.25em;line-height:1.6;margin:1.8em 0 .4em;font-weight:700;color:var(--plum)}
.art p{margin:0 0 .9em}
.art p.note{color:var(--muted);font-size:.9em}
.art p.ref{border-inline-start:3px solid var(--tint);padding-inline-start:14px;color:var(--muted);font-weight:400}
.art p.ref strong{font-weight:400}
.art p.ans{margin-bottom:.6em}
.art p.ans.first{font-weight:700}
.art p.li{padding-inline-start:1.4em;position:relative}
.art strong{font-weight:700}
.reflabel{margin:1em 0 .4em;font-size:.82em;font-weight:700;color:var(--plum);letter-spacing:.02em}
.call{display:flex;gap:14px;align-items:flex-start;margin:1.2em 0;padding:14px 16px;background:var(--tint);color:var(--tint-fg);border-radius:var(--r2)}
.call p{margin:0;font-size:.95em;line-height:1.95}
.calllabel{flex:none;margin-top:.35em;padding:0 8px;border-radius:var(--r1);background:var(--primary);color:#fff;font-size:12px;line-height:22px;font-weight:700}
.qh{display:flex;gap:12px;align-items:flex-start;margin:2em 0 .6em;font-size:1.08em;line-height:1.8}
.qmark{flex:none;display:grid;place-items:center;width:32px;height:32px;margin-top:.1em;border-radius:50%;background:var(--primary);color:#fff;font-weight:800}
.fig{margin:1.6em 0 .4em}
.fig img{display:block;width:100%;height:auto;border-radius:var(--r2);border:1px solid var(--line);background:#fff}
.cap{font-size:.86em;color:var(--muted);margin-bottom:1.6em}
.art [data-b]{position:relative;scroll-margin-top:140px}
mark.cm{background:var(--mark);color:inherit;border-radius:2px;padding:0 1px}
.cbadge{position:absolute;inset-inline-end:-44px;top:.4em;display:inline-flex;gap:4px;align-items:center;height:26px;padding:0 8px;border:0;border-radius:99px;background:var(--tint);color:var(--tint-fg);font-size:12px;user-select:none;-webkit-user-select:none}
@media(max-width:820px){.cbadge{inset-inline-end:0;top:-14px}}
.paywall{position:relative;margin-top:-1px;padding-top:64px}
.paywall::before{content:"";position:absolute;inset-inline:0;top:-8px;height:120px;background:linear-gradient(to bottom,transparent,var(--bg));pointer-events:none}
.owned .paywall{display:none}
.pwcard{position:relative;border:1px solid var(--line);background:var(--card);border-radius:var(--r3);padding:24px;text-align:center;font-size:15px;line-height:1.8}
.pwcard svg.i{width:32px;height:32px;color:var(--primary-ink)}
.pwcard h3{margin:8px 0 4px;font-size:20px}
.pwcard p{margin:0 0 16px;color:var(--muted)}
.wm{position:fixed;inset:0;z-index:15;pointer-events:none;display:none;overflow:hidden;opacity:.09;color:var(--fg)}
.reading .wm{display:block}
.wm div{position:absolute;inset:-50%;display:flex;flex-wrap:wrap;gap:80px 70px;align-content:flex-start;transform:rotate(-24deg);font-size:13px;line-height:1.4;white-space:nowrap;direction:rtl;font-weight:500}
.fsctl{display:flex;gap:2px}

/* sheets */
.scrim{position:fixed;inset:0;z-index:40;background:rgba(20,16,12,.45);display:none}
.scrim.show{display:block}
.drawer{position:fixed;z-index:50;inset-block:0;inset-inline-start:0;width:min(400px,100%);background:var(--bg);border-inline-end:1px solid var(--line);display:none;flex-direction:column;padding-block:env(safe-area-inset-top,0px) env(safe-area-inset-bottom,0px)}
.drawer.show{display:flex}
.drawer header{display:flex;align-items:center;gap:8px;padding:12px 16px;border-bottom:1px solid var(--line)}
.drawer header h3{margin:0;flex:1;font-size:18px}
.drawer .tabs button{flex:1;justify-content:center}
.dbody{flex:1;overflow:auto;padding:16px;display:flex;flex-direction:column;gap:12px}
.cmt{background:var(--card);border:1px solid var(--line);border-radius:var(--r2);padding:12px 14px;font-size:14px;line-height:1.8}
.cmt .q{margin:0 0 8px;padding-inline-start:10px;border-inline-start:3px solid var(--tint);color:var(--muted);font-size:13px}
.cmt .meta{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:6px;font-size:13px}
.cmt .meta b{font-weight:700}
.cmt .go{background:none;border:0;padding:0;color:var(--primary-ink);font-size:13px}
.empty{color:var(--muted);text-align:center;padding:32px 8px;font-size:14px}
.sel{position:fixed;z-index:35;display:none;translate:-50% -100%}
.sel.show{display:block}
.sel button{box-shadow:0 2px 0 rgba(0,0,0,.15)}
.composer{position:fixed;z-index:60;inset-inline:0;bottom:0;margin-inline:auto;width:min(520px,100%);background:var(--card);border:1px solid var(--line);border-radius:var(--r4) var(--r4) 0 0;padding:20px 16px calc(16px + env(safe-area-inset-bottom,0px));display:none}
.composer.show{display:block}
.composer h3{margin:0 0 12px;font-size:18px}
.composer .qt{margin:0 0 12px;padding-inline-start:10px;border-inline-start:3px solid var(--primary);color:var(--muted);font-size:13px;max-height:4.8em;overflow:hidden}
.seg{display:flex;gap:8px;margin-bottom:12px}
.seg label{flex:1}
.seg input{position:absolute;opacity:0}
.seg span{display:block;text-align:center;padding:8px;border:1.25px solid var(--line-strong);border-radius:var(--r1);font-size:14px}
.seg input:checked+span{background:var(--tint);border-color:var(--primary);color:var(--tint-fg);font-weight:700}
.seg input:focus-visible+span{outline:2px solid var(--primary);outline-offset:2px}
.field{width:100%;padding:10px 12px;background:var(--bg);border:1.25px solid var(--line);border-radius:var(--r1);font-size:15px;margin-bottom:12px}
textarea.field{min-height:96px;resize:vertical}
.composer .fine{font-size:12px;color:var(--muted);margin:-4px 0 12px}
.toast{position:fixed;z-index:80;inset-inline:16px;bottom:calc(24px + env(safe-area-inset-bottom,0px));margin-inline:auto;width:fit-content;max-width:100%;background:var(--fg);color:var(--bg);padding:10px 18px;border-radius:var(--r2);font-size:14px;opacity:0;translate:0 12px;transition:.2s;pointer-events:none}
.toast.show{opacity:1;translate:0 0}
.pay{position:fixed;z-index:70;inset:0;display:none;place-items:center;padding:16px;background:rgba(20,16,12,.55)}
.pay.show{display:grid}
.pay .box{width:min(380px,100%);background:var(--card);border-radius:var(--r3);padding:24px;text-align:center}
.pay h3{margin:0 0 4px}.pay p{margin:0 0 16px;color:var(--muted);font-size:14px}
.spin{width:28px;height:28px;border-radius:50%;border:3px solid var(--tint);border-top-color:var(--primary);margin:0 auto 16px;animation:sp .8s linear infinite}
@keyframes sp{to{rotate:360deg}}
[hidden]{display:none!important}
@media print{body *{display:none!important}body::after{content:"چاپ این محتوا غیرفعال است.";display:block;padding:40px;font-size:20px}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ===== Laravel app additions ===== */
.top .nav{display:flex;align-items:center;gap:4px;margin-inline-start:8px}
.top .nav a,.top .nav button.lnk{display:inline-flex;align-items:center;min-height:40px;padding:0 12px;border-radius:var(--r1);color:var(--fg);text-decoration:none;font-size:14px;background:none;border:0}
.top .nav a:hover,.top .nav button.lnk:hover{background:var(--surface)}
.top form{margin:0}
.flash{margin-block:16px 0;padding:12px 16px;border-radius:var(--r2);background:var(--ok-bg);color:var(--ok);font-size:14px}
.flash.err{background:var(--bad-bg);color:var(--bad)}
.flash ul{margin:0;padding-inline-start:18px}
a.cover{text-decoration:none}
a.tile{text-decoration:none}
.page{padding-block:32px 48px}
.narrow{max-width:420px;margin-inline:auto}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r3);padding:24px}
.card h1{font-size:26px;margin:0 0 16px}
label.f{display:block;margin-bottom:12px;font-size:14px;font-weight:500}
label.f span.l{display:block;margin-bottom:4px;color:var(--muted)}
.in{width:100%;padding:10px 12px;background:var(--bg);border:1.25px solid var(--line);border-radius:var(--r1);font-size:15px;color:var(--fg)}
textarea.in{min-height:90px;resize:vertical}
.in:focus{outline:2px solid var(--primary);outline-offset:0;border-color:var(--primary)}
.help{font-size:12px;color:var(--muted);margin-top:4px}
.muted{color:var(--muted)}
.row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
details.confirm summary{list-style:none;cursor:pointer}
details.confirm summary::-webkit-details-marker{display:none}
details.confirm[open] summary{display:none}
details.confirm .ask{margin-top:0}
.tbl{width:100%;border-collapse:collapse;font-size:14px;background:var(--card);border:1px solid var(--line);border-radius:var(--r2);overflow:hidden}
.tbl th,.tbl td{padding:10px 12px;text-align:start;border-bottom:1px solid var(--line);vertical-align:top}
.tbl th{background:var(--surface);font-weight:700;font-size:13px;color:var(--muted)}
.tblwrap{overflow-x:auto}
.pill{display:inline-block;padding:0 10px;border-radius:99px;font-size:12px;background:var(--surface);color:var(--muted)}
.pill.ok{background:var(--ok-bg);color:var(--ok)}.pill.bad{background:var(--bad-bg);color:var(--bad)}.pill.pri{background:var(--tint);color:var(--tint-fg)}
.adm{display:flex;gap:4px;flex-wrap:wrap;padding-bottom:16px;margin-bottom:24px;border-bottom:1px solid var(--line)}
.adm a{padding:6px 14px;border-radius:var(--r1);text-decoration:none;color:var(--fg);font-size:14px}
.adm a.on{background:var(--tint);color:var(--tint-fg);font-weight:700}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin-bottom:24px}
.stat{background:var(--card);border:1px solid var(--line);border-radius:var(--r3);padding:16px}
.stat b{display:block;font-size:26px;font-weight:800;line-height:1.3}
.stat span{color:var(--muted);font-size:13px}
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
@media(max-width:560px){.grid2{grid-template-columns:1fr}}
.blockrow{border:1px solid var(--line);border-radius:var(--r2);background:var(--card);padding:12px;margin-bottom:8px}
.blockrow textarea{min-height:60px;font-family:monospace;font-size:13px;direction:rtl}
.pager nav{margin-top:16px}.pager svg{width:16px}
.pager a,.pager span{padding:4px 8px}
.snippet{color:var(--muted);font-size:13px;max-width:60ch}
.orders .o{display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:16px;background:var(--card);border:1px solid var(--line);border-radius:var(--r3);margin-bottom:12px}

/* ---- reader (server-fed) ---- */
.art{user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
.art i.w{font-style:normal}
.art i.w::after{content:attr(data-w)}
.art img{pointer-events:none;-webkit-user-drag:none;user-select:none}
.chunk{min-height:var(--est,0)}
.chunk.loading::after{content:"در حال بارگذاری…";display:block;padding:24px;color:var(--muted);text-align:center;font-size:14px}
.chunk.wait::after{content:"برای محافظت از متن، بارگذاری کمی کند شد. چند ثانیه صبر کن…";display:block;padding:24px;color:var(--muted);text-align:center;font-size:14px}
.art .cbtn{position:absolute;inset-inline-end:-48px;top:.45em;display:inline-flex;gap:4px;align-items:center;justify-content:center;min-width:32px;height:28px;padding:0 8px;border:1px solid var(--line-strong);border-radius:99px;background:var(--card);color:var(--muted);font-size:12px;opacity:.7;transition:opacity .15s}
.art .cbtn:hover{opacity:1;color:var(--primary-ink);border-color:var(--primary)}
.art [data-id]:hover>.cbtn,.art .cbtn:focus-visible,.art .cbtn.has{opacity:1}
.art .cbtn.has{background:var(--tint);color:var(--tint-fg);border-color:var(--tint)}
.art [data-id]{position:relative}
.tip{display:flex;gap:10px;align-items:center;margin-bottom:24px;padding:10px 14px;border-radius:var(--r2);background:var(--surface);color:var(--muted);font-size:13px;line-height:1.7}
.tip svg.i{color:var(--primary-ink)}
@media(max-width:1100px){.art .cbtn{inset-inline-end:0;top:-16px}}
@media (hover:none){.art .cbtn{opacity:.9}}
.wm div{display:flex;flex-wrap:wrap}
.wm span{display:block}
.drawer{inset-inline-start:auto;inset-inline-end:0;border-inline-end:0;border-inline-start:1px solid var(--line)}
.lockbar{margin-block:24px;padding:16px;border:1px dashed var(--line-strong);border-radius:var(--r3);text-align:center;color:var(--muted)}

.nojs{display:none;position:fixed;inset:0;z-index:999;place-items:center;padding:24px;background:var(--bg);color:var(--fg);text-align:center}
.nojs h1{font-size:26px;margin:0 0 8px}.nojs p{margin:0;color:var(--muted)}
