/* ═══════════════════════════════════════════════════════
   CricBun — Series Directory
   Extracted from html/cricbun-series-directory.html
   Body-content styles only. Chrome owned by global-shell.css.
   ═══════════════════════════════════════════════════════ */

.hero{display:flex;justify-content:space-between;align-items:end;gap:20px}
.hero h1{font-size:clamp(2rem,5vw,3.2rem);letter-spacing:-.065em}
.hero p{font-size:.73rem;color:var(--muted);margin-top:7px}
.search{width:300px;height:42px;border:1px solid var(--line);border-radius:10px;background:var(--paper);display:flex;align-items:center;gap:8px;padding:0 12px}
.search input{width:100%;border:0;outline:0;background:transparent;font-size:.68rem}
.tabs,.filters{display:flex;gap:7px;overflow:auto;scrollbar-width:none}
.tabs{margin:22px 0 12px}
.filters{margin-bottom:18px}
.tab,.filter{white-space:nowrap;border:1px solid var(--line);background:var(--paper);border-radius:999px;padding:8px 12px;color:var(--muted);font-size:.63rem}
.tab.on{background:var(--navy);border-color:var(--navy);color:var(--paper)}
.filter.on{background:var(--cyan-p);border-color:oklch(84% .06 221);color:var(--cyan-d)}
.layout{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:17px}
.stack{display:grid;gap:17px}
.panel{background:var(--paper);border:1px solid var(--line);border-radius:13px;box-shadow:var(--shadow);overflow:hidden}
.head{height:48px;padding:0 15px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}
.head h2{font-size:.82rem}
.head a{font-size:.57rem;color:var(--cyan-d)}
.serieslist{display:grid;grid-template-columns:1fr 1fr}
.series{padding:16px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);transition:background .15s}
.series:nth-child(2n){border-right:0}
.series:hover{background:oklch(98% .008 230)}
.seriesmeta{display:flex;justify-content:space-between;font-size:.53rem;color:var(--muted)}
.state{color:var(--green);font-weight:800}
.series h3{font-size:.75rem;margin-top:10px}
.series p{font-size:.56rem;color:var(--muted);margin-top:4px}
.seriesfoot{display:flex;justify-content:space-between;align-items:center;margin-top:14px}
.progress{width:55%;height:6px;background:var(--line);border-radius:8px;overflow:hidden}
.progress i{display:block;height:100%;background:var(--cyan)}
.seriesfoot a{font-size:.54rem;color:var(--cyan-d);font-weight:700}
.sidebody{padding:14px}
.quick{display:grid;gap:8px}
.quick a{display:flex;justify-content:space-between;padding:9px 0;border-bottom:1px solid var(--line);font-size:.6rem}
.quick a:last-child{border:0}
.quick span{color:var(--muted)}
.calendar{display:grid;grid-template-columns:repeat(7,1fr);gap:3px}
.calendar span{text-align:center;font-size:.48rem;color:var(--muted);padding:5px}
.calendar b{aspect-ratio:1;border-radius:6px;display:grid;place-items:center;font-size:.51rem;font-weight:500}
.calendar b.has{background:var(--cyan-p);color:var(--cyan-d);font-weight:800}
.follow{display:grid;gap:10px}
.followrow{display:grid;grid-template-columns:30px 1fr auto;gap:8px;align-items:center}
.followrow h3{font-size:.6rem}
.followrow p{font-size:.49rem;color:var(--muted)}
.toggle{width:34px;height:20px;border:0;border-radius:999px;background:var(--line);padding:3px}
.toggle:after{content:"";display:block;width:14px;height:14px;border-radius:50%;background:var(--paper);transition:transform .2s}
.toggle.on{background:var(--cyan-d)}
.toggle.on:after{transform:translateX(14px)}
.empty{display:none;padding:45px;text-align:center;color:var(--muted);font-size:.67rem}
@media(max-width:940px){.layout{grid-template-columns:1fr}.aside{grid-template-columns:1fr 1fr}}
@media(max-width:680px){.hero{display:grid}.search{width:100%}.serieslist{grid-template-columns:1fr}.series{border-right:0}.layout,.stack{gap:9px}.panel{border-radius:10px}.aside{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
