@font-face{font-family:Vazirmatn;src:local('Vazirmatn'),url(fonts/Vazirmatn.woff2) format('woff2');font-weight:100 900;font-display:swap}
:root{--bg:#fff;--soft:#f4f5f8;--card:#fff;--ink:#111318;--mute:#5f6777;--line:#e4e7ee;--acc:#ff2d6f;--acc2:#5b3df5;--r:10px}
:root[data-theme=dark]{--bg:#0a0c12;--soft:#171a26;--card:#121520;--ink:#eef0f6;--mute:#98a2b5;--line:#232839}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#0a0c12;--soft:#171a26;--card:#121520;--ink:#eef0f6;--mute:#98a2b5;--line:#232839}}
*{box-sizing:border-box}body{margin:0;font-family:Vazirmatn,Tahoma,"Segoe UI",sans-serif;color:var(--ink);background:var(--bg);line-height:1.9}
a{color:inherit;text-decoration:none}.wrap{max-width:1200px;margin:auto;padding:0 18px}:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.top{position:sticky;top:0;z-index:9;background:var(--bg);border-bottom:1px solid var(--line)}
.bar{display:flex;align-items:center;gap:14px;height:60px}
.logo{display:flex;align-items:center;gap:8px;font-weight:900;font-size:1.5rem}
.logo i{width:13px;height:13px;border-radius:4px;background:linear-gradient(135deg,var(--acc),var(--acc2));transform:rotate(45deg)}
nav{display:flex;align-items:center;gap:2px;flex:1;overflow-x:auto;scrollbar-width:none}
nav a{padding:3px 11px;white-space:nowrap;font-weight:500;font-size:.92rem;color:var(--mute);border-radius:8px}
nav a:hover{color:var(--ink);background:var(--soft)}nav a.on{color:var(--acc);font-weight:700}
.sep{width:1px;height:18px;background:var(--line);margin:0 8px;flex:none}
.bar input{font:inherit;font-size:.9rem;color:inherit;border:1px solid var(--line);background:var(--soft);border-radius:99px;padding:3px 16px;width:150px}
.mode{width:36px;height:36px;border-radius:50%;border:1px solid var(--line);background:var(--card);cursor:pointer;padding:0;position:relative;flex:none}
.mode:before{content:"";position:absolute;inset:10px;border-radius:50%;background:linear-gradient(90deg,var(--ink) 50%,transparent 50%);border:2px solid var(--ink)}
.chip{display:inline-block;border-radius:99px;padding:0 12px;font-size:.78rem;font-weight:500;background:color-mix(in srgb,var(--acc) 12%,transparent);color:var(--acc)}
.chip.glass{background:rgba(255,255,255,.2);color:#fff}
.cover,.hcover,.thumb{position:relative;overflow:hidden}.hcover{position:absolute;inset:0}.cover{aspect-ratio:16/10}
.img{position:absolute;inset:0;background-size:cover;background-position:center;transition:transform .6s}
a:hover>.cover .img,a:hover>.hcover .img,a:hover>.thumb .img{transform:scale(1.05)}
.art-bg{background:linear-gradient(135deg,hsl(var(--h) 75% 55%),hsl(calc(var(--h) + 70) 70% 26%))}
.art-bg svg{position:absolute;top:50%;left:50%;height:78%;transform:translate(-50%,-50%);color:rgba(255,255,255,.28)}
.shade{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;gap:8px;padding:22px;color:#fff;background:linear-gradient(transparent 35%,rgba(5,6,12,.88))}
.shade small{opacity:.85}
/* hero */
.band{background:#0b0c10;color:#fff}
.hero3{display:grid;grid-template-columns:1fr 1.8fr 1fr;gap:22px;padding-block:22px}
.hl{display:flex;flex-direction:column;justify-content:space-between;gap:16px}
.hi{display:flex;gap:12px;align-items:flex-start}.hi .thumb{width:96px;border-radius:8px;flex:none;aspect-ratio:4/3}
.hi h3{margin:0;font-size:.92rem;line-height:1.75;font-weight:700}.hi small{color:#9aa0ad;font-size:.78rem}.hi:hover h3{color:var(--acc)}
.hbig{position:relative;min-height:390px;border-radius:var(--r);overflow:hidden;display:block;isolation:isolate}
.hbig h2{margin:0;font-size:clamp(1.3rem,2.4vw,1.9rem);line-height:1.6;font-weight:900}
/* icons + stories */
.icons{display:flex;gap:26px;overflow-x:auto;padding:20px 0 8px;justify-content:center}
.ic{display:flex;flex-direction:column;align-items:center;gap:6px;font-size:.82rem;color:var(--mute);min-width:64px}
.ic span{width:54px;height:54px;border-radius:50%;background:var(--soft);display:grid;place-items:center}.ic svg{width:28px;height:28px}.ic:hover{color:var(--acc)}
.snap{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:10px}
.st{flex:none;width:150px;height:230px;position:relative;border-radius:var(--r);overflow:hidden;scroll-snap-align:start;isolation:isolate;display:block}
.st .shade{padding:12px}.st h3{margin:0;font-size:.82rem;line-height:1.7;font-weight:700;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
/* sections */
.sech{display:flex;justify-content:space-between;align-items:center;margin-top:8px}.sech a{color:var(--acc);font-size:.88rem;font-weight:500}
.sec{font-size:1.1rem;font-weight:900;margin:22px 0 12px;display:flex;align-items:center;gap:10px}
.sec:before{content:"";width:5px;height:20px;border-radius:3px;background:var(--acc)}
.dual{display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:start}
.ov{position:relative;display:block;border-radius:var(--r);overflow:hidden;isolation:isolate;aspect-ratio:16/10}
.ov.bigov{aspect-ratio:16/9;margin-bottom:12px}.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.ov .shade{padding:12px 14px;gap:4px}.ov h3{margin:0;font-size:.88rem;line-height:1.7;font-weight:700}.ov.bigov h3{font-size:1.15rem;font-weight:900}
.ov small{display:flex;gap:12px;font-size:.75rem}
.blk{margin-bottom:12px}
/* feed rows */
.rows{display:flex;flex-direction:column}
.row{display:flex;gap:14px;padding:13px 0;border-bottom:1px solid var(--line);align-items:flex-start}
.thumb{width:104px;border-radius:8px;flex:none;aspect-ratio:4/3}
.row h3{margin:3px 0;font-size:.97rem;line-height:1.75;font-weight:700}.row:hover h3{color:var(--acc)}
.row .m{display:flex;gap:14px;color:var(--mute);font-size:.8rem}.row p{margin:0 0 4px;color:var(--mute);font-size:.88rem;line-height:1.8}
.row.lg .thumb{width:150px;order:2}.row.lg h3{font-size:1.05rem}
.tabs{display:flex;gap:8px;margin-bottom:6px;overflow-x:auto}.tabs a{border:1px solid var(--line);border-radius:99px;padding:1px 16px;font-size:.88rem;white-space:nowrap}
.tabs a.on{background:var(--acc);border-color:var(--acc);color:#fff}
.feedonly{max-width:860px;margin:auto}
/* cards */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}
.three{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.four{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.card{display:flex;flex-direction:column;background:var(--bg);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.card:hover{border-color:var(--acc)}.card-b{padding:12px 14px 14px;display:flex;flex-direction:column;gap:6px;align-items:flex-start}
.card h3{margin:0;font-size:.98rem;line-height:1.7;font-weight:700}
.card p{margin:0;color:var(--mute);font-size:.86rem;line-height:1.8;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.card small{display:flex;gap:14px;color:var(--mute);font-size:.8rem}
.pager{display:flex;gap:6px;justify-content:center;margin:26px 0}.pager a{min-width:40px;text-align:center;border:1px solid var(--line);border-radius:10px}
.pager a.on{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.pt{margin:26px 0 0;font-weight:900}.empty{color:var(--mute);padding:30px 0}
/* post */
.art{max-width:760px;margin:30px auto}.art h1{font-size:clamp(1.6rem,4vw,2.3rem);line-height:1.6;font-weight:900;margin:12px 0 4px}.meta{color:var(--mute);font-size:.9rem}
.acover{aspect-ratio:16/9;border-radius:var(--r);margin:18px 0;position:relative;overflow:hidden}
.art p{font-size:1.05rem;line-height:2.2}.lead{font-weight:500;color:var(--mute);font-size:1.15rem!important}
/* admin + forms */
.box{max-width:420px;margin:40px auto;display:flex;flex-direction:column;gap:14px}.box.wide{max-width:760px;margin:10px auto}
.box label{display:flex;flex-direction:column;gap:4px;font-weight:500}.chk{flex-direction:row!important;align-items:center;gap:8px!important}
.box input,.box textarea,.box select{font:inherit;color:inherit;background:var(--card);padding:9px 14px;border:1px solid var(--line);border-radius:12px}
button,.btn{font:inherit;background:var(--ink);color:var(--bg);border:0;border-radius:99px;padding:8px 20px;cursor:pointer;display:inline-block}
.err{background:#fde8e8;color:#a31616;padding:8px 12px;border-radius:10px;margin:0}
.adm-h{display:flex;justify-content:space-between;align-items:center;margin-top:22px;flex-wrap:wrap;gap:8px}
.tbl{width:100%;border-collapse:collapse;margin:16px 0}.tbl th,.tbl td{text-align:right;padding:10px 14px;border-bottom:1px solid var(--line)}
.tbl form{display:inline}.lnk{background:none;color:#e0364a;padding:0}
/* footer */
footer{background:#0b0c10;color:#c3c8d4;margin-top:50px;padding:34px 0 16px}
.fgrid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:24px}footer h4{color:#fff;margin:0 0 8px}footer p{color:#9aa0ad;margin:6px 0}
footer a{display:block;color:#9aa0ad;font-size:.9rem}footer a:hover{color:#fff}
.copy{margin-top:22px;padding-top:14px;border-top:1px solid #23262f;font-size:.82rem;color:#7d8493}
@counter-style persian{system:numeric;symbols:'۰' '۱' '۲' '۳' '۴' '۵' '۶' '۷' '۸' '۹'}
@media(max-width:900px){.hero3{grid-template-columns:1fr}.hbig{order:-1;min-height:300px}.dual{grid-template-columns:1fr}.three,.four{grid-template-columns:1fr 1fr}.fgrid{grid-template-columns:1fr 1fr}.icons{justify-content:flex-start}}
@media(max-width:560px){.three,.four{grid-template-columns:1fr}.row.lg .thumb{width:110px}.row.lg p{display:none}.bar input{display:none}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
