/* پیدا · لایه‌ی طراحی نسخه‌ی ۱٫۲ — الگوی ناوبری Google News + زبان بصری مینیمال و بی‌حاشیه.
   قواعد: سیاه/خاکستری برای متن، آبی فقط برای کنش و پیوند، خطوط مو (hairline)، فاصله‌ها روی شبکه‌ی ۴px،
   تیتر ۷۰۰ با ارتفاع خط ۱٫۷، متن پایه ۴۰۰/۲، حرکت ≤ ۳۲۰ms با منحنی نرم. */
:root{
  --hair:1px solid var(--line);
  --ease-o:cubic-bezier(.22,.9,.25,1);
  --shadow-pop:0 12px 36px rgba(10,10,20,.14);
}
html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
body{font-kerning:normal;line-height:1.8}
::selection{background:color-mix(in srgb,var(--blue) 22%,transparent)}
:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
a,button{touch-action:manipulation}

/* ───── نوار پیشرفت (آبی، بالای صفحه) ───── */
#progress{position:fixed;inset:0 0 auto 0;height:3px;z-index:300;pointer-events:none;opacity:0;transition:opacity .3s}
#progress.is-on{opacity:1}#progress.is-done{opacity:0}
#progress i{display:block;height:100%;background:linear-gradient(90deg,var(--blue),#4d8dff);transform-origin:100% 50%;transform:scaleX(0);transition:transform .26s var(--ease-o);border-radius:0 0 3px 3px;box-shadow:0 0 10px rgba(0,122,255,.45)}

/* ───── قاب بالا ───── */
.appbar{border-bottom:0;background:var(--glass)}
.appbar--feed,.appbar--sources,.appbar--saved,.appbar--settings{border-bottom:0}
.brand__word{letter-spacing:-.03em}
.iconbtn{color:var(--ink-2)}
.iconbtn:active{background:var(--surface-2);transform:scale(.9)}
.iconbtn.is-on{color:var(--blue)}
.iconbtn.is-on .ic{fill:currentColor}
.iconbtn .ic{width:21px;height:21px}
.btn--blue{background:var(--blue);border-color:var(--blue);color:#fff}
.btn--blue:hover{background:var(--blue-ink);border-color:var(--blue-ink)}
.btn--block{width:100%}
.btn{transition:background .18s,transform .18s var(--ease-o),border-color .18s}
.btn:active{transform:scale(.97)}

/* ───── تب‌ها ───── */
.tabs{position:sticky;top:calc(var(--bar) + var(--safe-t));z-index:30;display:flex;gap:2px;overflow-x:auto;scrollbar-width:none;margin-inline:calc(var(--gut)*-1);padding-inline:calc(var(--gut) - 6px);background:var(--glass);-webkit-backdrop-filter:saturate(1.8) blur(20px);backdrop-filter:saturate(1.8) blur(20px);border-bottom:var(--hair);overscroll-behavior-x:contain;scroll-snap-type:x proximity}
.tabs::-webkit-scrollbar{display:none}
.tab{position:relative;flex:none;display:flex;align-items:center;min-height:48px;padding:0 14px;font-size:calc(15px*var(--fs));font-weight:600;color:var(--muted);scroll-snap-align:center;transition:color .2s}
.tab::after{content:"";position:absolute;inset-inline:12px;bottom:-1px;height:3px;border-radius:3px 3px 0 0;background:var(--blue);transform:scaleX(0);transition:transform .28s var(--ease-o)}
.tab:hover{color:var(--ink-2)}
.tab.is-on{color:var(--ink);font-weight:700}
.tab.is-on::after{transform:scaleX(1)}
.pane{min-height:60vh}

/* جست‌وجوی خبرها */
.search-intro,.search-results{padding-top:12px}
.search-intro .page-h,.search-results .page-h{margin-top:10px}
.searchform{display:flex;align-items:center;gap:10px;margin:18px 0 22px;padding:6px;background:var(--bg);border:1px solid var(--line-2);border-radius:var(--r-pill);box-shadow:0 2px 10px rgba(10,10,20,.06)}
.searchform input{flex:1;min-width:0;height:48px;padding:0 16px;border:0;outline:0;background:transparent;color:var(--ink);font:inherit;font-size:15px}
.searchform input::placeholder{color:var(--muted)}
.searchform .btn{min-height:42px;padding-inline:20px}
.feed-tools{position:relative;z-index:30;display:block}
.searchform--feed{display:none}
.searchform--mobile{display:none}
.feed-search-panel,.feed-search-backdrop{display:none}
@media(min-width:720px){
  .feed-tools{position:sticky;top:0;z-index:30;display:flex;flex-direction:row;align-items:center;justify-content:center;gap:12px;margin:0;padding-block:6px;background:var(--glass);-webkit-backdrop-filter:saturate(1.8) blur(20px);backdrop-filter:saturate(1.8) blur(20px)}
  .feed-tools.is-search-open{z-index:60;-webkit-backdrop-filter:none;backdrop-filter:none}
  .feed-tools .tabs{position:static;order:0;flex:0 1 auto;min-width:0;width:max-content;max-width:calc(100% - 56px);margin:0;background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}
  .feed-tools .feed-search-toggle{position:relative;z-index:3;order:1;flex:none;margin-inline-start:0}
  .feed-search-backdrop{position:fixed;inset-block-start:60px;inset-block-end:0;inset-inline-start:var(--rail);inset-inline-end:0;z-index:0;width:auto;height:auto;background:rgba(14,20,32,.22);border:0}
  .feed-tools.is-search-open .feed-search-backdrop{display:block}
  .feed-search-panel{position:absolute;inset-block-start:100%;inset-inline:0;z-index:2;display:none;padding:18px 20px 22px;background:var(--bg);box-shadow:0 16px 24px rgba(10,10,20,.12);direction:rtl}
  .feed-tools.is-search-open .feed-search-panel{display:block;animation:search-panel-in .2s ease-out both}
  .feed-search-panel .searchform--feed{display:flex;align-items:center;gap:10px;width:min(760px,100%);max-width:760px;height:58px;margin:0 auto;padding:6px 10px;overflow:visible;background:var(--bg);border:1px solid var(--line-2);border-radius:var(--r-pill);box-shadow:0 2px 10px rgba(10,10,20,.06)}
  .feed-search-panel .searchform--feed input{height:44px;padding-inline:14px;font-size:16px;text-align:right;direction:rtl}
}
@media(max-width:719px){
  .feed-tools{position:sticky;top:calc(var(--bar) + var(--safe-t));z-index:30;margin-inline:calc(var(--gut)*-1);padding-inline:var(--gut);background:var(--glass);-webkit-backdrop-filter:saturate(1.8) blur(20px);backdrop-filter:saturate(1.8) blur(20px)}
  .feed-tools.is-search-open{z-index:60;-webkit-backdrop-filter:none;backdrop-filter:none}
  .feed-tools .tabs{position:static;max-width:none;margin:0;padding-inline:0}
  .feed-search-toggle{display:none}
  .appbar--feed .searchform--mobile{display:none!important}
  .appbar--feed .iconbtn[data-act=search-toggle]{position:absolute;left:calc(var(--gut) + 44px);top:50%;transform:translateY(-50%);z-index:2;margin:0}
  .appbar--feed .iconbtn[data-act=refresh]{position:absolute;left:var(--gut);top:50%;transform:translateY(-50%);z-index:2;margin:0}
  .feed-search-backdrop{position:fixed;inset-block-start:calc(var(--bar) + var(--safe-t) + 48px);inset-block-end:0;inset-inline:0;z-index:0;width:auto;height:auto;background:rgba(14,20,32,.22);border:0}
  .feed-tools.is-search-open .feed-search-backdrop{display:block}
  .feed-search-panel{position:absolute;inset-block-start:100%;inset-inline:0;z-index:2;display:none;padding:12px var(--gut) 16px;background:var(--bg);box-shadow:0 16px 24px rgba(10,10,20,.12);direction:rtl}
  .feed-tools.is-search-open .feed-search-panel{display:block;animation:search-panel-in .2s ease-out both}
  .feed-search-panel .searchform--feed{display:flex;align-items:center;width:100%;height:52px;margin:0;padding:4px 8px;border-radius:var(--r-pill)}
  .feed-search-panel .searchform--feed input{height:42px;padding-inline:10px;font-size:15px;text-align:right;direction:rtl}
}
@media(max-width:360px){
  .appbar--feed .brand__logo{width:100px}
}
@media(min-width:720px){.appbar--feed .searchform--mobile{display:none!important}}
@keyframes search-open{from{clip-path:inset(0 0 0 100%)}to{clip-path:inset(0)}}
.search-hints{display:grid;gap:8px;margin-top:30px}
.search-hints>b,.search-count{font-size:13px;color:var(--muted)}
.search-count{margin:0 0 8px}
.search-results .feed{margin-inline:calc(var(--gut)*-1);padding-inline:var(--gut);background:var(--bg)}
@media(min-width:720px){.search-intro,.search-results{max-width:900px;margin-inline:auto}.searchform{max-width:900px;width:100%}.search-results .feed{margin-inline:0;padding:4px 22px;border-radius:20px}}

/* ───── تصویر و جای‌خالی ───── */
.ph{position:relative;overflow:hidden;background:var(--ph);border-radius:12px;flex:none}
.ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.015);transition:opacity .4s ease,transform .6s var(--ease-o)}
.ph.is-ok img{opacity:1;transform:none}
.ph.is-err img{display:none}
.ph:not(.is-ok):not(.is-err):not(.is-empty)::before{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.65) 50%,transparent 70%);background-size:220% 100%;animation:shim-l 1.5s infinite linear}
.ph.is-err::after,.ph.is-empty::after{content:"";position:absolute;inset:0;margin:auto;width:26px;height:26px;opacity:.28;background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='3'/%3E%3Ccircle cx='9' cy='9' r='1.6'/%3E%3Cpath d='m21 15-4.5-4.5L6 21'/%3E%3C/svg%3E")}
@keyframes shim-l{from{background-position:120% 0}to{background-position:-120% 0}}

/* ───── اسکلت خاکستری مینیمال ───── */
.sk{display:block;background:var(--ph);border-radius:8px;animation:pulse 1.5s ease-in-out infinite}
@keyframes pulse{50%{opacity:.55}}
.sk--m{height:11px;width:34%;margin-bottom:14px}.sk--t{height:15px;margin-bottom:10px}.sk--s{width:64%}
.sk-lead{padding:14px 0 18px;border-bottom:var(--hair)}
.sk-cover{aspect-ratio:16/9;border-radius:18px;margin-bottom:16px}
.sk-row{pointer-events:none}.sk-row .sc__th{border-radius:12px}

/* ───── کارت خبر ───── */
.feed{display:grid;gap:0}
.sc{position:relative;direction:ltr;display:grid;grid-template-columns:minmax(0,1fr) 88px;grid-template-areas:"main th";column-gap:14px;align-items:center;padding:16px 0 10px;border-bottom:var(--hair);transition:background-color .15s}
.sc:not(:has(.sc__th)){grid-template-columns:minmax(0,1fr);grid-template-areas:"main"}
.sc__main{grid-area:main;direction:rtl;min-width:0}
.sc__th{grid-area:th;width:88px;aspect-ratio:1;border-radius:12px;margin:0;align-self:center}
.sc__t{margin:6px 0 2px;font-size:calc(16.5px*var(--fs));font-weight:700;line-height:1.75;color:var(--ink);display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;text-wrap:pretty}
.sc__a{color:inherit}
.sc__a::after{content:"";position:absolute;inset:0 0 40px 0;z-index:1}
.sc__a:focus-visible{outline:none}
.sc:has(.sc__a:focus-visible){outline:2px solid var(--blue);outline-offset:2px;border-radius:12px}
@media (hover:hover){.sc:hover .sc__t{color:var(--blue-ink)}}
.sc:active{background:var(--surface)}
.sc__foot{direction:rtl;display:flex;align-items:center;gap:2px;min-height:36px;margin:5px -8px -5px 0;position:relative;z-index:2}
.sc__foot .iconbtn{width:36px;height:36px;color:var(--muted)}
.sc__foot .iconbtn.is-on{color:var(--blue)}
.sc__foot .sc__related{color:var(--muted)}
.sc__foot .iconbtn:hover{background:var(--surface);color:var(--ink-2)}
.sc__foot [data-act=menu]{opacity:0;visibility:hidden;transform:translateY(2px);transition:opacity .16s ease,transform .16s ease,visibility .16s}
@media (hover:hover) and (pointer:fine){.sc:hover .sc__foot [data-act=menu],.sc:focus-within .sc__foot [data-act=menu]{opacity:1;visibility:visible;transform:none}}
@media (hover:none),(pointer:coarse){.sc__foot [data-act=menu]{opacity:1;visibility:visible;transform:none}}
.sc__ex{margin:6px 0 2px;font-size:calc(14.5px*var(--fs));line-height:2;color:var(--ink-2);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.src{display:flex;align-items:center;gap:7px;min-width:0;font-size:calc(12.5px*var(--fs));line-height:1.6;color:var(--muted)}
.src__n{color:var(--ink-2);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.src__author{color:var(--muted);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}.src__author:hover{text-decoration:underline}
.src time{white-space:nowrap}
.sep{width:3px;height:3px;border-radius:50%;background:var(--line-2);flex:none}
.tag-demo{padding:0 8px;border-radius:99px;border:1px dashed var(--line-2);font-size:11.5px}

.smark{--s:20px;position:relative;flex:none;width:calc(var(--s) + 3px);height:calc(var(--s) + 3px);border-radius:50%;overflow:hidden;background:var(--surface-2);color:var(--ink-2);display:inline-grid;place-items:center;box-shadow:inset 0 0 0 1px rgba(10,10,20,.07)}
.smark b{font:700 calc(var(--s)*.46)/1 var(--font)}
.smark img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:transparent;padding:0;opacity:0;transition:opacity .3s}
.smark img.is-ok{opacity:1}
.smark:has(img.is-ok) b{display:none}
.stack{display:inline-flex;flex-direction:row}
.stack .smark{box-shadow:0 0 0 2px var(--bg)}
.stack .smark+.smark{margin-inline-start:-8px}
.smark:has(img.is-ok){background:transparent;box-shadow:none}
.covlink{display:inline-flex;align-items:center;gap:9px;min-height:44px;font-size:calc(13px*var(--fs));font-weight:600;color:var(--blue-ink);position:relative;z-index:2}
.covlink:hover{color:var(--blue)}

/* کارت اصلی (Lead) */
.blk--lead{padding-top:14px}
.sc--lead{display:block;padding:0 0 4px;border-bottom:0}
.sc--lead .sc__cover{display:block;width:100%;border-radius:18px;margin-bottom:14px}
.sc--lead .sc__t{font-size:calc(22px*var(--fs));font-weight:800;line-height:1.6;margin:8px 0 4px;-webkit-line-clamp:4;text-wrap:balance}
.sc--lead .sc__a::after{inset:0 0 44px 0}
/* موبایل: تصویر شاخص بزرگ و بالای تیتر؛ اندازهٔ کم thumbnail روی وضوح اثر می‌گذاشت. */
.sc--lead{display:flex;flex-direction:column;align-items:stretch;gap:0;padding:8px 0 12px}
.sc--lead .sc__cover{display:block;width:100%;aspect-ratio:16/9;margin:0 0 14px;border-radius:16px}
.sc--lead .sc__main{direction:rtl;min-width:0}
.sc--lead .sc__t{font-size:calc(20px*var(--fs));line-height:1.7;-webkit-line-clamp:4;margin:4px 0}
.sc--lead .sc__ex{display:none}
@media(min-width:720px){.sc--lead{direction:ltr;display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,46%);column-gap:24px;row-gap:8px;padding:10px 0 14px}.sc--lead .sc__cover{grid-column:2;grid-row:1;width:100%;aspect-ratio:16/9;margin:0;border-radius:16px}.sc--lead .sc__main{grid-column:1;grid-row:1;direction:rtl;align-self:center}.sc--lead .sc__t{font-size:calc(23px*var(--fs));line-height:1.7}.sc--lead .sc__ex{display:-webkit-box;-webkit-line-clamp:2}}
.sc--lead .sc__foot{margin-top:5px}

/* کاروسل پوشش رسانه‌ها */
.covs{margin-top:6px;padding:16px 0 4px;border-top:var(--hair)}
.covs__h{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
.covs__h b{font-size:calc(14px*var(--fs));font-weight:700;color:var(--ink)}
.pill{display:inline-flex;align-items:center;gap:2px;min-height:32px;padding:0 6px 0 12px;border-radius:99px;background:var(--blue-soft);color:var(--blue-ink);font-size:calc(13px*var(--fs));font-weight:700;transition:background .18s,transform .18s var(--ease-o)}
.pill .ic{width:16px;height:16px}
.pill:active{transform:scale(.95)}
.rail-x{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--gut);margin-inline:calc(var(--gut)*-1);padding:2px var(--gut) 10px;scrollbar-width:none;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scroll-behavior:smooth}
.rail-x>.cc:first-child{scroll-margin-inline-start:var(--gut);scroll-snap-align:start}
.rail-x>.cc:last-child{scroll-margin-inline-end:var(--gut);scroll-snap-align:start}
.rail-x::-webkit-scrollbar{display:none}
.cc{position:relative;flex:none;width:min(66vw,244px);scroll-snap-align:start;border:var(--hair);border-radius:16px;overflow:hidden;background:var(--bg);transition:transform .2s var(--ease-o),border-color .2s,box-shadow .2s}
.cc:active{transform:scale(.98)}
.cc__b{padding:12px;display:grid;gap:8px}
.cc__t{margin:0;font-size:calc(14.5px*var(--fs));font-weight:600;line-height:1.75;color:var(--ink);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.cc .sc__a::after{inset:0}
@media (hover:hover){.cc:hover{border-color:var(--line-2);box-shadow:0 2px 8px rgba(10,10,20,.07)}}

/* بخش‌ها */
.blk{margin-top:28px}
.blk__h{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:0;min-height:36px}
.blk__h h2{font-size:calc(19px*var(--fs));font-weight:800;line-height:1.6;color:var(--ink);display:flex;align-items:center;gap:8px}
.blk__m{display:inline-flex;align-items:center;gap:2px;min-height:36px;font-size:calc(14px*var(--fs));font-weight:600;color:var(--blue-ink)}
.blk__m .ic{width:16px;height:16px}
.fol{font-style:normal;font-size:11.5px;font-weight:600;color:var(--blue-ink);background:var(--blue-soft);padding:0 8px;border-radius:99px;line-height:1.9}
.blk .feed .sc:last-child{border-bottom:0}
.endnote{text-align:center;color:var(--muted);font-size:13px;padding:32px 0}
.sentinel{height:1px}

/* حباب‌های رسانه */
.blk--o .rail-x{gap:6px;padding-top:8px}
.orb{flex:none;width:76px;display:grid;justify-items:center;gap:8px;text-align:center;scroll-snap-align:start;font-size:calc(12px*var(--fs));font-weight:500;color:var(--ink-2);transition:transform .18s var(--ease-o)}
.orb span{max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.orb:active{transform:scale(.94)}
.orb .smark{box-shadow:inset 0 0 0 1px rgba(10,10,20,.08)}

/* فهرست رسانه‌ها / صفحه‌ی رسانه */
.lede{margin:0 0 6px;font-size:calc(14.5px*var(--fs))}
.olist{display:grid}
.orow{display:flex;align-items:center;gap:14px;min-height:68px;padding:10px 0;border-bottom:var(--hair);transition:background .15s}
.orow:active{background:var(--surface)}
.orow__t{flex:1;min-width:0;display:grid;line-height:1.6}
.orow__t b{font-size:calc(16px*var(--fs));font-weight:700}
.orow__t span{font-size:12px;color:var(--muted)}
.orow__c{font-size:13px;color:var(--muted)}
.orow>.ic{width:18px;height:18px;color:var(--line-2)}
.ohead{display:flex;align-items:center;gap:16px;padding:18px 0 8px}
.ohead .page-h{margin:0}
.subhead{padding:8px 0 4px}.subhead .page-h{margin:10px 0 0}.subhead p{font-size:14px}
.page-h{font-size:calc(26px*var(--fs));font-weight:800;line-height:1.6;letter-spacing:0}

/* ───── خواننده‌ی شتاب‌دهنده ───── */
.appbar--reader{gap:4px;position:sticky;top:0}
.rbar__back{flex:none;width:40px;height:40px;background:var(--surface);color:var(--ink)}
.rbar__back .ic{width:19px;height:19px}
.rbar__src{flex:1;min-width:0;display:flex;align-items:center;gap:10px;padding-inline:4px}
.rbar__src span{display:grid;flex:1;min-width:0;line-height:1.45}
.rbar__src .smark{flex:none}
.rbar__src b{font-size:14.5px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rbar__src i{font-style:normal;font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:end}
@media(max-width:719px){
  .appbar--reader{gap:2px}
  .appbar--reader .rbar__back{width:36px;height:40px}
  .rbar__src{gap:6px;padding-inline:0}
  .rbar__src span{flex:1;width:0}
  .rbar__src b,.rbar__src i{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .appbar--reader .spacer{display:none}
  .appbar--reader .appbar__acts{flex:none;margin-inline-end:-4px}
  .appbar--reader .appbar__acts .iconbtn{width:36px;height:40px}
}
body[data-route=reader] .tabbar{display:none}
body[data-route=reader] main#view{padding:0;max-width:none}
.reader{position:relative;min-height:calc(100dvh - var(--bar) - var(--safe-t))}
.frame{position:relative;height:calc(100dvh - var(--bar) - var(--safe-t));background:var(--bg)}
.frame iframe{display:block;width:100%;height:100%;border:0;background:#fff}
.frame__fallback{position:absolute;inset:0;z-index:3;overflow:auto;background:var(--bg)}
.frame__cover{position:absolute;inset:0;z-index:2;background:var(--bg)}
.frame__cover::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,rgba(120,130,150,.12) 50%,transparent 70%);background-size:220% 100%;animation:shim-l 1.35s infinite linear}
.frame__cover[hidden]{display:none}
.edge{position:absolute;top:0;bottom:0;width:20px;z-index:3;touch-action:pan-y}
.edge--s{inset-inline-start:0}.edge--e{inset-inline-end:0}
.frame__hint{position:absolute;inset-inline:16px;bottom:84px;z-index:4;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px 10px 14px;border-radius:18px;background:var(--glass);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);box-shadow:var(--shadow-pop);font-size:14px;animation:toast-in .3s var(--ease-o)}
.frame__hint .btn{min-height:40px;padding:0 16px;font-size:14px}
.pager{position:fixed;inset-inline:0;bottom:calc(14px + var(--safe-b));margin-inline:auto;width:max-content;z-index:35;display:flex;align-items:center;gap:2px;padding:4px;border-radius:99px;background:var(--glass);-webkit-backdrop-filter:saturate(1.8) blur(20px);backdrop-filter:saturate(1.8) blur(20px);box-shadow:var(--shadow-pop),inset 0 0 0 1px rgba(10,10,20,.06);font-size:13px;font-weight:600;color:var(--ink-2)}
.pager span{min-width:64px;text-align:center}
.pager__b{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;color:var(--ink);transition:background .15s,transform .18s var(--ease-o)}
.pager__b:active{background:var(--surface-2);transform:scale(.88)}
.pager__b[disabled]{opacity:.28;pointer-events:none}
.pager__b .ic{width:20px;height:20px}
.rd{padding:12px var(--gut) 110px;max-width:760px;margin-inline:auto}
.rd__cover{width:100%;border-radius:18px;margin-bottom:18px}
.rd__b{display:grid;gap:12px}
.rd__t{font-size:calc(25px*var(--fs));font-weight:800;line-height:1.7;margin:2px 0 0;outline:none;text-wrap:balance}
.rd .prose p{font-size:calc(17.5px*var(--fs));line-height:2.1;color:var(--ink);margin:0 0 .6em;max-width:none}
.rd__note{display:flex;align-items:center;gap:10px;font-size:13.5px;color:var(--muted);margin:2px 0}
.dots{display:inline-flex;gap:4px}.dots i{width:6px;height:6px;border-radius:50%;background:var(--blue);animation:dot 1.1s infinite ease-in-out}
.dots i:nth-child(2){animation-delay:.15s}.dots i:nth-child(3){animation-delay:.3s}
@keyframes dot{0%,80%,100%{transform:scale(.55);opacity:.4}40%{transform:scale(1);opacity:1}}
.covlist{display:grid;margin-top:4px}
.covrow{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:var(--hair)}
.covrow:last-child{border-bottom:0}
.covrow__t{flex:1;min-width:0;display:grid;font-size:calc(14px*var(--fs));line-height:1.75}
.covrow__t b{font-weight:700;color:var(--ink)}.covrow__t span{color:var(--ink-2);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.covrow time{font-size:12px;color:var(--muted);white-space:nowrap}
.rd .blk{margin-top:30px}

/* ───── منوی ⋮ ───── */
.mh{display:flex;align-items:center;gap:10px;font-size:calc(15px*var(--fs));font-weight:700;line-height:1.7}
.mh>span:last-child{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.menu{display:grid;padding-bottom:6px}
.mrow{display:flex;align-items:center;gap:16px;width:100%;min-height:54px;padding:0 6px;border-radius:12px;font-size:calc(16px*var(--fs));font-weight:500;color:var(--ink);text-align:start;transition:background .12s}
.mrow:active{background:var(--surface-2)}
@media (hover:hover){.mrow:hover{background:var(--surface)}}
.mrow .ic{color:var(--ink-2);width:22px;height:22px}
dialog.sheet{box-shadow:var(--shadow-pop)}
dialog.sheet::backdrop{background:rgba(10,10,20,.36);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}

/* ───── ناوبری پایین ───── */
.tabbar{grid-template-columns:repeat(3,1fr);border-top:var(--hair)}
.nav__i{gap:2px;color:var(--muted);font-size:11px;font-weight:600}
.nav__i .ic{width:23px;height:23px}
.nav__i.is-active{color:var(--blue)}
.nav__i.is-active .ic{stroke-width:2}
.nav__badge{background:var(--blue)}
.rail .nav__i.is-active{background:var(--blue-soft)}

/* ───── Toast ───── */
.toast{border-radius:16px;padding:12px 16px 12px 18px;box-shadow:var(--shadow-pop);font-weight:500;background:#16161c}
.toast--new::before{content:"";width:8px;height:8px;border-radius:50%;background:#5b9bff;flex:none;box-shadow:0 0 0 4px rgba(91,155,255,.25)}
.toast__a{color:#8db8ff;text-decoration:none;font-weight:700;padding:0 4px}
.newpill{background:var(--blue);box-shadow:0 8px 24px rgba(0,122,255,.35)}
body[data-route=reader] #toasts{bottom:calc(76px + var(--safe-b))}

/* ───── نشانه‌ی تازه ───── */
.sc.is-new{animation:newflash 3.6s var(--ease-o) both}
@keyframes newflash{from{background:var(--blue-soft)}to{background:transparent}}

/* ───── انتقال ───── */
.enter-next{animation:in-next .34s var(--ease-o)}.enter-prev{animation:in-prev .34s var(--ease-o)}
@keyframes in-next{from{opacity:0;transform:translateX(-44px)}}@keyframes in-prev{from{opacity:0;transform:translateX(44px)}}

/* ───── تبلت/دسکتاپ ───── */
@media (min-width:720px){
  .appbar--sources,.appbar--saved,.appbar--settings{display:none}
  .tabs{top:0}
  .feed{grid-template-columns:1fr 1fr;column-gap:36px;gap:0 36px}
  .feed .sc{padding:18px 0 6px;border:0;border-bottom:var(--hair);border-radius:0;box-shadow:none;grid-template-columns:minmax(0,1fr) 112px}
  .feed .sc__th{width:112px}
  .feed .sc:not(:has(.sc__th)){grid-template-columns:minmax(0,1fr)}
  .feed .sc:hover{box-shadow:none}
  .feed .sc:last-child{border-bottom:0}
  .feed:has(> .sc:nth-child(2n):last-child) > .sc:nth-last-child(2){border-bottom:0}
  .sc.sc--lead{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,46%);column-gap:28px;align-content:center}
  .sc--lead .sc__cover{grid-column:2;grid-row:1;margin:0}
  .sc--lead .sc__main{grid-column:1;grid-row:1;align-self:center}
  .sc--lead .sc__t{font-size:calc(28px*var(--fs))}
  .rail-x{margin-inline:0;padding-inline:0;scroll-padding-inline:0}
  .cc{width:260px}
  .rd{padding-top:28px}
  .pager{inset-inline-start:calc(var(--rail) + (100vw - var(--rail))/2);inset-inline-end:auto;transform:translateX(50%);margin:0}
  .frame{height:calc(100dvh - var(--bar))}
  .frame__hint{bottom:90px}
  .tabbar{display:none}
  .blk--lead{padding-top:18px}
}
@media (min-width:720px){
  /* عنوان ذخیره‌شده‌ها را با همان قاب کارت‌ها هم‌عرض می‌کنیم؛ تنظیمات
     با قاب مستقل ۹۶۰px خود تراز می‌ماند. */
  body[data-route=saved] main#view>.page-h{max-width:1180px}
}
@media (min-width:1280px){ .feed:not(.feed--compact){grid-template-columns:1fr 1fr} }
html[data-tv] .tab{min-height:64px;font-size:20px}
html[data-tv] .sc__t{font-size:24px}

/* ───── ساعت هوشمند ───── */
@media (max-width:280px){
  .tabs,.covs,.sc__foot,.sc__th,.blk--o,.pager,.sc__ex{display:none!important}
  .sc{padding:9px 0;grid-template-columns:1fr!important;grid-template-areas:"main"!important}
  .sc.sc--lead{display:grid!important;grid-template-columns:minmax(0,1fr) 72px!important;grid-template-areas:none!important;column-gap:8px;row-gap:8px}
  .sc--lead .sc__cover{display:block!important;grid-column:2;grid-row:1;width:72px;aspect-ratio:1/1!important;margin:0}
  .sc--lead .sc__main{grid-column:1;grid-row:1}
  .sc__t{font-size:15px;-webkit-line-clamp:3}.sc--lead .sc__t{font-size:16px}
  .blk{margin-top:10px}.blk__h h2{font-size:14px}
  .rd{padding-inline:10px}.rd__t{font-size:17px}.frame iframe{display:none}
}
@media (prefers-reduced-motion:reduce){.ph img{transition:none}.sk,.dots i,.ph::before{animation:none!important}.sc.is-new{animation:none}}

/* ───── نشان نشانک‌های تازه (مثل ایمیل خوانده‌نشده) ───── */
.nav__badge{position:absolute;top:-6px;inset-inline-start:calc(100% - 10px);min-width:19px;height:19px;padding:0 5px;border-radius:10px;background:var(--blue);color:#fff;font:700 11px/19px var(--font);text-align:center;box-shadow:0 0 0 2px var(--bg);transition:opacity .25s ease,transform .25s var(--ease-o)}
.nav__badge.pop{animation:badge-pop .42s var(--ease-o)}
.nav__badge.is-out{opacity:0;transform:scale(.5)}
@keyframes badge-pop{0%{transform:scale(.4)}60%{transform:scale(1.22)}100%{transform:scale(1)}}
.sc.is-unread .sc__t{font-weight:800}
.sc.is-unread .src::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--blue);flex:none}
.tabbar,.rail{grid-template-columns:repeat(3,1fr)}

/* ───── انیمیشن نشانک (فنر + حلقه + جرقه) ───── */
[data-act=save]{position:relative}
[data-act=save] .ic{transition:color .2s}
[data-act=save].burst .ic{animation:bm-pop .5s cubic-bezier(.3,1.6,.4,1)}
[data-act=save].unburst .ic{animation:bm-out .28s ease}
[data-act=save].burst::before{content:"";position:absolute;inset:50% auto auto 50%;width:6px;height:6px;margin:-3px;border-radius:50%;pointer-events:none;color:var(--blue);box-shadow:0 -18px 0 -1px currentColor,15px -9px 0 -1px currentColor,15px 9px 0 -1px currentColor,0 18px 0 -1px currentColor,-15px 9px 0 -1px currentColor,-15px -9px 0 -1px currentColor;animation:bm-spark .5s ease-out forwards}
[data-act=save].burst::after{content:"";position:absolute;inset:50% auto auto 50%;width:30px;height:30px;margin:-15px;border-radius:50%;border:2px solid var(--blue);pointer-events:none;animation:bm-ring .45s ease-out forwards}
@keyframes bm-pop{0%{transform:scale(.6) rotate(-8deg)}45%{transform:scale(1.38) rotate(4deg)}70%{transform:scale(.92)}100%{transform:scale(1)}}
@keyframes bm-out{50%{transform:scale(.78)}}
@keyframes bm-ring{from{transform:scale(.3);opacity:.9}to{transform:scale(1.5);opacity:0}}
@keyframes bm-spark{from{transform:scale(.4);opacity:1}to{transform:scale(1.45);opacity:0}}
@media (prefers-reduced-motion:reduce){[data-act=save]::before,[data-act=save]::after{display:none}}

.blk--lead{margin-top:12px;padding-top:0}
.covlink__n{color:var(--muted);font-weight:500}
.switch[aria-checked=true]{background:var(--blue)}
.chip.is-on{background:var(--blue-soft);border-color:var(--blue);color:var(--blue-ink)}
.btn--primary{background:var(--blue);border-color:var(--blue);color:#fff}
.btn--primary:hover{background:var(--blue-ink);opacity:1}
.group{border-radius:18px}

/* ───── نشان و واژه‌نشان: یک رنگ، هندسه‌ی ساده، خوانا تا ۱۶px ───── */
.brand{direction:rtl;gap:8px}
.brand__mark{width:30px;height:30px;border-radius:9px}
.brand__fa{font:800 22px/1 var(--font);letter-spacing:-.04em;color:var(--ink);padding-bottom:2px}
.rail .brand{flex-direction:column;gap:6px}.rail .brand__mark{width:38px;height:38px}.rail .brand__fa{font-size:14px}

/* لوگوی اصلی پیدا: نسخه‌ی افقی در هدر موبایل و نسخه‌ی عمودی در نوار دسکتاپ */
.brand{display:inline-flex;justify-content:center;align-items:center;flex:none}
.brand__picture{display:block;line-height:0}
.brand__logo{display:block;width:72px;height:72px;object-fit:contain}
.appbar--feed{direction:ltr}
@media(max-width:999px){
  /* The appbar already has --gut inline padding; anchor to its padding edge. */
  .appbar .brand{position:absolute;right:0;left:auto;top:50%;transform:translateY(-50%);margin:0}
  .appbar--feed .brand{order:0}
  .appbar--feed .spacer{display:none}
  .appbar--feed .iconbtn{order:1}
  .appbar--feed > .iconbtn:first-of-type{margin:0}
  .brand__logo{width:124px;height:auto;max-height:42px}
}
@media(min-width:768px) and (max-width:999px){
  .rail .brand__logo{width:56px;height:56px;max-height:none}
}

/* ───── جداسازی مؤلفه‌ها (الگوی Google News): بخش‌های سفید روی بستر خاکستری روشن ───── */
body{background:var(--page)}
main#view[data-route=feed]{padding-top:0}
.tabs{background:rgba(255,255,255,.92);border-bottom:var(--hair)}
.blk,.blk--lead{background:var(--bg);margin-inline:calc(var(--gut)*-1);padding:10px var(--gut) 8px;margin-top:8px}
.blk--lead{padding-top:16px;margin-top:0}
.blk>.feed>.sc:last-child,.blk--lead .sc:last-child{border-bottom:0}
.pane>.feed{background:var(--bg);margin-inline:calc(var(--gut)*-1);padding:0 var(--gut);margin-top:8px}
.pane .endnote{background:var(--bg);margin:0 calc(var(--gut)*-1);padding:28px var(--gut)}
body[data-route=sources] main#view,body[data-route=saved] main#view,body[data-route=settings] main#view,body[data-route=coverage] main#view,body[data-route=outlet] main#view{background:transparent}
body[data-route=saved] .feed,body[data-route=outlet] .feed,body[data-route=coverage] .feed{background:var(--bg);margin-inline:calc(var(--gut)*-1);padding:0 var(--gut)}
body[data-route=coverage] .feed .sc:last-child{border-bottom:0}
body[data-route=coverage] .sc__related{display:none}
/* تصویر: برش هوشمند (سوژه معمولاً بالاتر از وسط است) و لبه‌ی ظریف */
.ph img{object-position:50% 30%}
.ph.is-ok::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px rgba(10,10,20,.06);pointer-events:none}
.sc__th{width:96px}
.sc{grid-template-columns:minmax(0,1fr) 96px}
@media (min-width:720px){
  .tabs{margin-inline:0;padding-inline:0;border-radius:0 0 0 0}
  .blk,.blk--lead{margin-inline:0;border-radius:20px;padding:14px 22px 10px;margin-top:14px;box-shadow:0 1px 2px rgba(10,10,20,.04)}
  .blk--lead{margin-top:14px}
  .pane>.feed,body[data-route=saved] .feed,body[data-route=outlet] .feed,body[data-route=coverage] .feed{margin-inline:0;padding:4px 22px;border-radius:20px}
  .pane .endnote{margin:0;border-radius:0 0 20px 20px}
  .rail-x{margin-inline:-22px;padding-inline:22px}
  .feed .sc__th{width:120px}.feed .sc{grid-template-columns:minmax(0,1fr) 120px}
}

/* ───── حرکت: محور مشترک (shared axis) افقی؛ ≤۳۲۰ms؛ منحنی خروجی نرم ─────
   تب‌ها: فقط محتوای بخش می‌لغزد؛ بین صفحات هم‌سطح (خانه/ذخیره/تنظیمات): محو-عبور؛ ورود به خبر: لغزش افقی */
.tab::after{display:none}
.tabs__ink{position:absolute;bottom:0;left:0;height:3px;border-radius:3px 3px 0 0;background:var(--blue);transition:transform .34s var(--ease-o),width .34s var(--ease-o);pointer-events:none;will-change:transform}
.pane-next{animation:pane-n .3s var(--ease-o) both}.pane-prev{animation:pane-p .3s var(--ease-o) both}
@keyframes pane-n{from{opacity:0;transform:translateX(-28px)}}@keyframes pane-p{from{opacity:0;transform:translateX(28px)}}
.appbar{view-transition-name:appbar}.tabs{view-transition-name:tabs}
::view-transition-old(root){animation:.14s ease-in both vt-out}
::view-transition-new(root){animation:.3s var(--ease-o) both in-fwd}
html[data-dir=back]::view-transition-new(root){animation-name:in-back}
html[data-dir=top]::view-transition-new(root){animation:.24s var(--ease-o) both in-top}
html[data-dir=top]::view-transition-old(root){animation:.1s ease-in both vt-out}
@keyframes in-top{from{opacity:0;transform:scale(.985)}}
@keyframes in-fwd{from{opacity:0;transform:translateX(-26px)}}@keyframes in-back{from{opacity:0;transform:translateX(26px)}}
@media (prefers-reduced-motion:reduce){.pane-next,.pane-prev{animation:none}.tabs__ink{transition:none}}
.tab[aria-current=page]{color:var(--ink);font-weight:700}
main#view{touch-action:pan-y pinch-zoom}.rail-x,.tabs{touch-action:pan-x pan-y}

/* فیلترهای فید تمام عرض فضای بین لبه‌ی صفحه و سایدبار را می‌گیرند؛ بدنه‌ی خبرها سقف عرض خود را حفظ می‌کند. */
@media(min-width:720px){
  body[data-route=feed] main#view{max-width:none;margin-inline:0;padding-inline:0}
  body[data-route=feed] .feed-tools{width:100%;max-width:none;margin-inline:0;padding-inline:20px;padding-block:6px}
  body[data-route=feed] .tabs{flex:0 1 auto;width:max-content;max-width:calc(100% - 56px);min-width:0;margin-inline:0;padding-inline:0;justify-content:center;background:transparent;border-bottom:0}
  body[data-route=feed] .pane{width:100%;max-width:1180px;margin-inline:auto;padding-inline:var(--gut)}
}
@keyframes search-panel-in{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
