/* Hallmark · component: weekly editorial shelf · genre: editorial · theme: Sabketo brand (locked DESIGN-LANGUAGE.md) · redesign: full · signature: five real covers above a ranked reading line · posture: restrained · v2.0.0 */
/* Hallmark · pre-emit critique: P4 H4 E4 S4 R4 V4 · weakest: H, the old panel hides its covers; enlarge the covers and remove every nested card */
/* Hallmark · reworded "پرمخاطب‌های سبکتو" to "بیلبورد سبکتو" · 54 merges the redundant eyebrow into the heading */
/* Hallmark · copy: verbatim (published catalog titles, including their original punctuation); the only heading change is recorded above */
/* Hallmark · finish-review: subagent, fix, 1 finding resolved; media titles now wrap fully without an added clamp */
:root{
  --hc-paper:#f0f3eb;
  --hc-paper-hover:#e7ecdf;
  --hc-ink:#263f4b;
  --hc-muted:#596a62;
  --hc-green:#2f4e3e;
  --hc-rule:#c8d1c3;
  --hc-focus:#2f4e3e;
  --hc-disabled:#788379;
  --hc-shadow:rgba(35,60,50,.09);
  --hc-font:Dana,sans-serif;
  --hc-space-xs:8px;
  --hc-space-sm:12px;
  --hc-space-md:16px;
  --hc-space-lg:24px;
  --hc-space-xl:40px;
  --hc-space-2xl:64px;
  --hc-ease:cubic-bezier(.2,.7,.2,1);
}
.home-chart{margin-block:var(--hc-space-xl) var(--hc-space-2xl);color:var(--hc-ink);font-family:var(--hc-font);font-synthesis:none}
.home-chart *, .home-chart *::before, .home-chart *::after{box-sizing:border-box}
.hc-shell{padding:var(--hc-space-xl);background:var(--hc-paper);border-radius:16px;position:relative}
.hc-heading{display:flex;justify-content:space-between;align-items:baseline;gap:var(--hc-space-lg);padding:0;margin:0 0 var(--hc-space-lg);background:none;border:0;position:relative;height:auto;min-height:0;box-shadow:none}
.hc-heading h2{margin:0;color:var(--hc-ink);font-size:clamp(30px,3.3vw,46px);font-weight:700;line-height:1.5;text-wrap:balance;overflow-wrap:break-word;min-width:0}
.hc-heading p{margin:0;color:var(--hc-muted);font-size:17px;line-height:1.8;white-space:nowrap}
.hc-tabs{display:flex;align-items:stretch;justify-content:space-between;gap:var(--hc-space-xs);border-bottom:1px solid var(--hc-rule);margin-bottom:var(--hc-space-xl)}
.hc-tabs button{font:inherit;font-size:15px;line-height:1.6;color:var(--hc-muted);border:0;border-bottom:3px solid transparent;background:transparent;padding:var(--hc-space-sm) var(--hc-space-xs);min-height:48px;cursor:pointer;white-space:nowrap;position:relative}
.hc-tabs button[aria-selected=true]{border-bottom-color:var(--hc-green);color:var(--hc-green);font-weight:700}
.hc-tabs button:active,.hc-tabs button.is-active{background:var(--hc-paper-hover)}
.hc-tabs button:disabled{color:var(--hc-disabled);opacity:.55;cursor:not-allowed}
.hc-tabs button:focus-visible,.hc-tabs button.is-focus,.hc-content:focus-visible,.hc-bottom a:focus-visible{outline:2px solid var(--hc-focus);outline-offset:4px}
.hc-panel[hidden]{display:none!important}
.hc-ranking{list-style:none;display:grid;grid-template-columns:minmax(0,1.14fr) repeat(4,minmax(0,1fr));gap:var(--hc-space-lg);padding:0;margin:0}
.hc-item{min-width:0;margin:0;padding:0;position:relative}
.hc-content{color:var(--hc-ink);text-decoration:none;display:grid;grid-template-columns:46px minmax(0,1fr);grid-template-rows:250px auto;gap:var(--hc-space-lg) var(--hc-space-sm);height:100%;position:relative;border-radius:2px;align-content:start}
.hc-art{grid-column:1/-1;grid-row:1;min-width:0;height:250px;display:flex;align-items:flex-end;justify-content:center;padding-inline:var(--hc-space-xs)}
.hc-art img{display:block;width:auto;height:214px;max-height:100%;max-width:100%;object-fit:contain;border-radius:1px;box-shadow:0 5px 12px var(--hc-shadow)}
.hc-first .hc-art img{height:250px}
.hc-rank{grid-column:1;grid-row:2;align-self:start;font-size:70px;line-height:1.05;font-weight:700;color:var(--hc-green);font-variant-numeric:tabular-nums;text-align:start}
.hc-first .hc-rank{font-size:82px}
.hc-copy{grid-column:2;grid-row:2;min-width:0;padding-top:4px}
.hc-copy h3{margin:0;color:var(--hc-ink);font-size:16px;font-weight:700;line-height:1.85;text-wrap:pretty;overflow-wrap:break-word;min-width:0;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:clip}
.hc-first .hc-copy h3{font-size:18px}
.hc-meta{display:none}
.hc-article .hc-meta{display:block;color:var(--hc-muted);font-size:12px;line-height:1.7;margin-bottom:4px}
.hc-verb{display:inline-flex;align-items:center;gap:var(--hc-space-sm);font-size:13px;line-height:1.7;color:var(--hc-green);margin-top:var(--hc-space-sm)}
.hc-row-arrow{display:none}
.hc-movement{display:block;position:absolute;inset-inline-start:0;top:var(--hc-space-xs);padding:4px 8px;background:var(--hc-paper);color:var(--hc-green);font-size:12px;font-weight:700;line-height:1.5}
.hc-down{color:var(--hc-muted)}
.hc-nano .hc-art img{height:auto;width:180px;aspect-ratio:1;object-fit:contain}
.hc-nano .hc-first .hc-art img{width:210px}
.hc-podcast .hc-content,.hc-video .hc-content,.hc-article .hc-content{grid-template-rows:176px auto}
.hc-podcast .hc-art,.hc-video .hc-art,.hc-article .hc-art{height:176px;padding-inline:0}
.hc-podcast .hc-art img,.hc-video .hc-art img,.hc-article .hc-art img{width:100%;height:auto;max-height:176px;aspect-ratio:auto;object-fit:contain;box-shadow:none}
.hc-video .hc-ranking,.hc-article .hc-ranking{grid-template-columns:minmax(0,1.5fr) repeat(4,minmax(0,1fr))}
.hc-video .hc-rank,.hc-article .hc-rank{font-size:58px}
.hc-video .hc-copy h3,.hc-article .hc-copy h3{font-size:15px}
.hc-video .hc-first .hc-copy h3,.hc-article .hc-first .hc-copy h3{font-size:17px}
.hc-podcast .hc-copy h3,.hc-video .hc-copy h3,.hc-article .hc-copy h3{display:block;overflow:visible;-webkit-line-clamp:unset}
.hc-bottom{display:flex;justify-content:flex-end;border-top:1px solid var(--hc-rule);padding-top:var(--hc-space-lg);margin-top:var(--hc-space-lg)}
.hc-bottom a{display:inline-flex;align-items:center;min-height:44px;gap:var(--hc-space-sm);font-size:14px;line-height:1.8;color:var(--hc-green);text-decoration:none}
.hc-bottom svg,.hc-verb svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.5;flex:none}
.hc-content:active,.hc-bottom a:active{transform:translateY(1px)}
@media(hover:hover){
  .hc-tabs button:hover,.hc-tabs button.is-hover{background:var(--hc-paper-hover)}
  .hc-content:hover h3,.hc-bottom a:hover{text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}
}
@media(min-width:1500px){.hc-shell{padding:var(--hc-space-xl)}.hc-art{height:274px}.hc-content{grid-template-rows:274px auto}.hc-art img{height:234px}.hc-first .hc-art img{height:274px}.hc-copy h3{font-size:18px}.hc-first .hc-copy h3{font-size:20px}}
@media(max-width:1050px){
  .hc-shell{padding:var(--hc-space-lg)}
  .hc-heading p{font-size:15px}
  .hc-tabs{gap:0;margin-bottom:var(--hc-space-lg)}
  .hc-tabs button{font-size:13px;padding-inline:8px}
  .hc-ranking{gap:var(--hc-space-md)}
  .hc-content{grid-template-columns:34px minmax(0,1fr);grid-template-rows:218px auto;column-gap:var(--hc-space-xs);row-gap:var(--hc-space-md)}
  .hc-art{height:218px;padding-inline:0}
  .hc-art img{height:182px}.hc-first .hc-art img{height:214px}
  .hc-rank{font-size:56px}.hc-first .hc-rank{font-size:64px}
  .hc-copy h3,.hc-first .hc-copy h3{font-size:15px}
}
@media(max-width:960px){
  .home-chart{margin-block:var(--hc-space-lg) var(--hc-space-xl)}
  .hc-shell{padding:var(--hc-space-lg) var(--hc-space-md);border-radius:12px}
  .hc-heading{display:block;margin-bottom:var(--hc-space-md)}
  .hc-heading h2{font-size:32px;line-height:1.55}
  .hc-heading p{font-size:14px;margin-top:4px;white-space:normal}
  .hc-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 var(--hc-space-xs);margin-bottom:var(--hc-space-lg)}
  .hc-tabs button{font-size:12px;min-height:50px;white-space:normal;padding:var(--hc-space-xs) 2px}
  .hc-tab-full{display:block}
  .hc-ranking,.hc-video .hc-ranking,.hc-article .hc-ranking{display:flex;gap:var(--hc-space-lg);overflow-x:auto;overflow-y:clip;overscroll-behavior-inline:contain;scroll-snap-type:inline mandatory;scroll-padding-inline:var(--hc-space-xs);scrollbar-width:thin;scrollbar-color:var(--hc-rule) transparent;padding:var(--hc-space-xs) var(--hc-space-xs) var(--hc-space-lg);margin-inline:calc(-1 * var(--hc-space-xs))}
  .hc-item{scroll-snap-align:start;flex:0 0 72%}
  .hc-content{grid-template-columns:44px minmax(0,1fr);grid-template-rows:246px auto;gap:var(--hc-space-md) var(--hc-space-sm)}
  .hc-art{height:246px;padding:0 var(--hc-space-md)}
  .hc-art img{height:232px;max-width:100%}.hc-first .hc-art img{height:246px}
  .hc-rank,.hc-first .hc-rank{font-size:68px}
  .hc-copy h3,.hc-first .hc-copy h3{font-size:16px;line-height:1.85}
  .hc-nano .hc-art img,.hc-nano .hc-first .hc-art img{width:210px;height:auto;max-height:232px}
  .hc-podcast .hc-content,.hc-video .hc-content,.hc-article .hc-content{grid-template-rows:150px auto}
  .hc-podcast .hc-art,.hc-video .hc-art,.hc-article .hc-art{height:150px;padding:0}
  .hc-podcast .hc-art img,.hc-video .hc-art img,.hc-article .hc-art img{height:auto;max-height:150px;aspect-ratio:auto}
  .hc-bottom{margin-top:var(--hc-space-sm);padding-top:var(--hc-space-sm)}
  .hc-bottom a{font-size:13px}
}
@media(min-width:601px) and (max-width:960px){.hc-item{flex-basis:40%}}
@media(prefers-reduced-motion:reduce){.home-chart *{scroll-behavior:auto;animation:none;transition:none}}