/* «כיוונים» (streams.html) — streams.py; the shell (topnav, h1) comes from style.css + lineage.css */
.picks{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;max-width:1100px;margin:6px auto 16px}
.spick{display:flex;flex-direction:column;gap:2px;padding:10px 12px;border-radius:14px;text-decoration:none;color:var(--ink);
  background:hsl(var(--h) var(--s) 96%);border:1.5px solid hsl(var(--h) var(--s) 72%);box-shadow:0 1px 0 rgba(0,0,0,.04)}
.spick b{font-family:"Frank Ruhl Libre",serif;font-size:20px;color:hsl(var(--h) var(--s) 30%)}
.spick .ssub{font-size:12.5px;color:#555;line-height:1.35}
.spick .smeta{font-size:12.5px;color:var(--muted);margin-top:auto}
.spick.on{background:hsl(var(--h) var(--s) 88%);border-color:hsl(var(--h) var(--s) 40%);box-shadow:inset 0 0 0 1.5px hsl(var(--h) var(--s) 40%)}
.stream{max-width:900px;margin:0 auto 26px;border:1px solid #e3ded3;border-radius:14px;background:#fffdf8;padding:12px 16px 16px;
  border-top:5px solid hsl(var(--h) var(--s) 45%)}
.stream h2{font-family:"Frank Ruhl Libre",serif;font-size:28px;margin:2px 0 0;color:hsl(var(--h) var(--s) 28%)}
.stream>.ssub{margin:0 0 6px;color:#555;font-size:14px}
.stream .intro{font-size:16px;line-height:1.75;margin:6px 0 8px}
.stream .smeta{font-size:13.5px;color:var(--muted);margin:0 0 10px}
.tabs{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 10px}
.tab{font:inherit;font-size:14px;padding:6px 14px;border-radius:999px;border:1.5px solid var(--ink);background:#fff;color:var(--ink);cursor:pointer}
.tab.on{background:var(--ink);color:#fff}
.span{font-size:14px;color:#fff;background:hsl(var(--h) var(--s) 40%);display:inline-block;border-radius:999px;padding:1px 12px;margin:12px 0 4px}
.sl{list-style:none;margin:0;padding:0}
.sl li{padding:8px 10px;border-top:1px solid #eee7da;border-inline-start:4px solid var(--c);margin:0 0 2px;background:#fff;border-radius:4px}
.sl li.flash{animation:stfl 2.2s ease}
@keyframes stfl{0%,40%{background:var(--f);box-shadow:0 0 0 3px var(--c)}100%{background:#fff;box-shadow:none}}
.l1{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px}
.l1 .nm{font-family:"Frank Ruhl Libre",serif;font-weight:800;font-size:18px;color:var(--c);text-decoration:none;border-bottom:1.5px solid transparent}
.l1 .nm:hover{border-bottom-color:var(--c)}
.l1 .yr{font-size:13.5px;color:#444}
.l1 .gen{font-size:12px;color:#fff;background:#8a8f9c;border-radius:999px;padding:0 8px}
.l1 .also{font-size:12px;color:#5a4a2a;background:#f4ecd8;border-radius:999px;padding:0 8px;text-decoration:none}
.l2{font-size:13px;color:var(--muted);margin-top:2px}
.l2 .ln{color:#3b5a99;text-decoration:none}
.sc{color:var(--c);font-weight:700;text-decoration:none;border-bottom:1.5px solid var(--c)}
.gens{list-style:none;margin:0;padding:0;counter-reset:none}
.gens li{position:relative;padding:2px 0 8px 0;padding-inline-start:18px;border-inline-start:3px solid hsl(var(--h) var(--s) 70%);margin-inline-start:8px}
.gens li::before{content:"";position:absolute;inset-inline-start:-7px;top:5px;width:11px;height:11px;border-radius:50%;background:hsl(var(--h) var(--s) 45%)}
.gens h4,.loose{margin:4px 0 6px;font-size:15px;color:hsl(var(--h) var(--s) 28%)}
.gc{display:flex;flex-wrap:wrap;gap:6px 14px;line-height:1.7}
.gw{white-space:nowrap}
.gy{font-size:11.5px;color:var(--muted);margin-inline-start:4px}
.foot{max-width:900px;margin:10px auto;text-align:center;color:var(--muted);font-size:13px}
@media (max-width:700px){
  .picks{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .spick b{font-size:18px}
  .stream{padding:10px 10px 14px}
  .stream h2{font-size:24px}
  .stream .intro{font-size:15px}
  .gw{white-space:normal}
}
html[dir=ltr] .sl li{border-inline-start-width:4px}
.stream,.sl li{scroll-margin-top:84px}
.fam2{margin:0 0 14px;padding:8px 10px 2px;border:1px solid #eee7da;border-radius:10px;background:#fff}
.fam2 h4{margin:0 0 6px;font-size:16px;color:hsl(var(--h) var(--s) 28%)}
.fam2 h4 small{color:var(--muted);font-weight:400}
.gens .gn{display:block;font-size:12.5px;color:var(--muted);margin:0 0 2px}
.pgroup h3{text-align:center;font-size:15px;color:var(--muted);margin:8px 0 4px}
.l1 .era{font-size:11.5px;border-radius:999px;padding:0 7px;border:1px solid #c9cfdb;color:#55607a;background:#f4f6fa}
.l1 .era.e-rishonim{color:#7a5a12;background:#fbf3df;border-color:#e5d2a0}
.smaps{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:8px;margin:0 0 12px}
.smaps a{display:block;border:1px solid #e3ded3;border-radius:10px;overflow:hidden;background:#fff}
.smaps img{display:block;width:100%;height:auto}
.l1 .era.e-cp{color:#6b2f2f;background:#fbecec;border-color:#e2bcbc}
