/* Бреслав и Ложечкин — архив. Палитра из обложки: оранжевый, чёрная тушь, бумага. */
:root{
  --paper:#efece6; --paper2:#e5e0d6; --card:#f7f5f0; --ink:#0d0c0b; --ink2:#3b3631; --muted:#6a625a; --faint:#8f877e;
  --rule:#0d0c0b; --hair:#cfc8bc;
  --or:#e38639; --or-ink:#9c4c0c; --or-soft:#f6dcc3; --hl:#f7c68f;
  --head:#0d0c0b; --head-ink:#f1eee8;
  --ORG:#e38639; --ENG:#0d0c0b; --PPL:#9c4c0c; --UNC:#8a8076; --SIMP:#d9b48f; --META:#8a8076;
  --f-body:'Golos Text',system-ui,sans-serif; --f-disp:'Unbounded','Golos Text',sans-serif; --f-mono:'JetBrains Mono',ui-monospace,monospace;
  color-scheme:light;
}
[data-theme=dark]{
  --paper:#12110f; --paper2:#1c1a17; --card:#181613; --ink:#efebe4; --ink2:#cfc8be; --muted:#a39a8f; --faint:#7c746b;
  --rule:#efebe4; --hair:#2f2b26;
  --or:#ec9142; --or-ink:#f0a35c; --or-soft:#3a2614; --hl:#7a4a1a;
  --head:#000; --head-ink:#efebe4;
  --ENG:#efebe4; --PPL:#f0a35c; --SIMP:#c9a37c; --UNC:#9a9086;
  color-scheme:dark;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:400 16px/1.55 var(--f-body);-webkit-font-smoothing:antialiased;min-height:100vh;display:flex;flex-direction:column}
a{color:inherit}
button{font:inherit;color:inherit;cursor:pointer}
img{display:block;max-width:100%}
:focus-visible{outline:2px solid var(--or);outline-offset:2px}
.skip{position:absolute;left:-999px;top:0;background:var(--or);color:#000;padding:8px 12px;z-index:50}
.skip:focus{left:8px;top:8px}

/* Header */
.top{background:var(--head);color:var(--head-ink);display:grid;grid-template-columns:auto 1fr auto auto;gap:24px;align-items:center;padding:12px 32px;position:sticky;top:0;z-index:20;border-bottom:4px solid var(--or)}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.brand img{width:46px;height:46px;border:2px solid var(--head-ink)}
.brand b{display:block;font:700 17px/1.05 var(--f-disp);letter-spacing:-.01em}
.brand small{display:block;font:500 11px/1.4 var(--f-mono);color:var(--or);text-transform:uppercase;letter-spacing:.08em;margin-top:3px}
.searchbox{display:flex;align-items:center;gap:10px;background:var(--head-ink);color:#0d0c0b;padding:0 12px;height:42px;max-width:620px;width:100%}
.searchbox input{flex:1;border:0;background:transparent;font:inherit;font-size:15px;outline:0;color:#0d0c0b;min-width:0}
.searchbox input::placeholder{color:#6a625a}
.searchbox:focus-within{box-shadow:0 0 0 3px var(--or)}
kbd{font:500 11px var(--f-mono);border:1.5px solid #0d0c0b;padding:0 5px;line-height:17px}
.tabs{display:flex;gap:4px}
.tabs a{font:500 12px/1 var(--f-mono);text-transform:uppercase;letter-spacing:.08em;text-decoration:none;padding:14px 10px;border-bottom:3px solid transparent;color:#c9c2b8}
.tabs a:hover{color:var(--head-ink)}
.tabs a.on{color:var(--head-ink);border-bottom-color:var(--or)}
.icon{background:none;border:1.5px solid #5a544d;color:var(--head-ink);width:40px;height:40px;display:grid;place-items:center}
.icon:hover{border-color:var(--or)}

main{flex:1;width:100%;max-width:1320px;margin:0 auto;padding:28px 32px 64px}
.loading{padding:60px 0;color:var(--muted);font:500 13px var(--f-mono);text-transform:uppercase;letter-spacing:.08em}

/* Masthead strip on list */
.mast{display:grid;grid-template-columns:1fr auto;gap:24px;align-items:end;border-bottom:2px solid var(--rule);padding-bottom:18px;margin-bottom:24px}
.mast h1{font:800 clamp(32px,4.6vw,56px)/.95 var(--f-disp);margin:0;letter-spacing:-.03em}
.mast h1 em{font-style:normal;color:var(--or)}
.mast p{margin:10px 0 0;color:var(--ink2);max-width:60ch}
.mast .figs{display:flex;gap:28px;font-family:var(--f-mono)}
.mast .figs div{display:flex;flex-direction:column;align-items:flex-end}
.mast .figs b{font:700 26px/1 var(--f-disp)}
.mast .figs span{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin-top:6px}

/* Layout */
.layout{display:grid;grid-template-columns:250px 1fr;gap:40px;align-items:start}
aside.filters{position:sticky;top:96px;max-height:calc(100vh - 110px);overflow:auto;padding-right:6px;scrollbar-width:thin}
.fwrap summary{display:none}
.fgroup{border-top:2px solid var(--rule);padding:10px 0 18px}
.fgroup h4{margin:0 0 10px;font:600 11px/1 var(--f-mono);text-transform:uppercase;letter-spacing:.1em}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{display:inline-flex;align-items:center;text-align:left;gap:6px;border:1.5px solid var(--ink);background:transparent;padding:5px 9px;font-size:13px;line-height:1.2;min-height:32px}
.chip:hover{background:var(--paper2)}
.chip.on{background:var(--ink);color:var(--paper)}
.chip .c{font:500 11px var(--f-mono);color:var(--muted)}
.chip.on .c{color:var(--or)}
.cl{display:inline-flex;align-items:center;gap:6px;font-size:13px}
.cl::before{content:"";width:9px;height:9px;background:var(--cc);border:1px solid var(--ink);flex:none}
select,.seg{font:inherit;font-size:14px;background:var(--card);color:var(--ink);border:1.5px solid var(--ink);padding:7px 9px;border-radius:0;width:100%}
.taglist{display:flex;flex-direction:column}
.taglist button{display:flex;justify-content:space-between;gap:8px;text-align:left;background:none;border:0;border-bottom:1px solid var(--hair);padding:6px 2px;font-size:14px}
.taglist button:hover{color:var(--or-ink)}
.taglist button.on{background:var(--ink);color:var(--paper);padding-left:6px}
.taglist .c{font:500 11px var(--f-mono);color:var(--faint)}
.taglist button.on .c{color:var(--or)}

.resbar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;font:500 12px var(--f-mono);text-transform:uppercase;letter-spacing:.08em;color:var(--muted);padding-bottom:10px;border-bottom:2px solid var(--rule)}
.resbar .active{display:flex;gap:6px;flex-wrap:wrap;text-transform:none;letter-spacing:0}
.reset{background:none;border:0;text-decoration:underline;font:500 12px var(--f-mono);color:var(--or-ink)}

/* Episode rows */
.cards{display:flex;flex-direction:column}
.card{display:grid;grid-template-columns:280px 1fr 96px;gap:22px;padding:20px 0;border-bottom:1px solid var(--hair);text-decoration:none;align-items:start}
.card:hover h3{text-decoration:underline;text-decoration-color:var(--or);text-decoration-thickness:3px;text-underline-offset:4px}
.thumb{position:relative;aspect-ratio:16/9;background:var(--paper2);border:2px solid var(--ink);overflow:hidden}
.thumb img{width:100%;height:100%;object-fit:cover;transition:transform .35s ease}
.card:hover .thumb img{transform:scale(1.03)}
.thumb .no{position:absolute;left:-2px;bottom:-2px;background:var(--ink);color:var(--paper);font:800 20px/1 var(--f-disp);padding:7px 10px 6px}
.thumb .no::before{content:"#";color:var(--or);margin-right:1px}
.eno{display:inline-block;font:700 13px/1 var(--f-mono);color:var(--or-ink);margin-bottom:6px;letter-spacing:.02em}
.card h3{font:600 21px/1.2 var(--f-body);margin:0 0 6px;letter-spacing:-.01em}
.q{margin:0;color:var(--ink2);font-size:15.5px}
.meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;margin-top:10px;font-size:13px;color:var(--muted)}
.meta .d{font-family:var(--f-mono);font-size:12px}
.tags{display:flex;flex-wrap:wrap;gap:4px 12px;margin-top:8px}
.tag{background:none;border:0;padding:0;font-size:13px;color:var(--or-ink);text-decoration:none}
.tag::before{content:"#";opacity:.6}
.tag:hover{text-decoration:underline}
.badge{font:600 10px/1 var(--f-mono);text-transform:uppercase;letter-spacing:.08em;background:var(--or);color:#0d0c0b;padding:4px 6px}
.badge.no{background:transparent;border:1px solid var(--faint);color:var(--muted)}
.stats{display:flex;flex-direction:column;gap:6px;text-align:right;font:400 11px/1.2 var(--f-mono);color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.stats b{display:block;font:700 18px/1 var(--f-disp);color:var(--ink);letter-spacing:-.02em;text-transform:none}
.snips{margin-top:12px;display:flex;flex-direction:column;gap:6px}
.snip{font-size:14px;color:var(--ink2);border-left:3px solid var(--or);padding:2px 0 2px 10px}
.snip .src{font:600 10px var(--f-mono);text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin-right:8px}
mark{background:var(--hl);color:inherit;padding:0 1px}

/* Episode page */
.back{display:inline-block;font:500 12px var(--f-mono);text-transform:uppercase;letter-spacing:.08em;text-decoration:none;margin-bottom:18px;color:var(--muted)}
.back:hover{color:var(--or-ink)}
.ephead{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:36px;align-items:start;padding-bottom:26px;border-bottom:2px solid var(--rule)}
.hero{position:relative;display:block;aspect-ratio:16/9;border:2px solid var(--ink);overflow:hidden;background:var(--paper2)}
.hero img{width:100%;height:100%;object-fit:cover}
.hero{border-bottom:0}
.playbar{display:flex;align-items:center;gap:10px;background:var(--ink);color:var(--paper);padding:12px 14px;text-decoration:none;font:600 12px/1.2 var(--f-mono);text-transform:uppercase;letter-spacing:.08em;border:2px solid var(--ink)}
.playbar svg{color:var(--or);flex:none}
.playbar span{margin-left:auto;text-transform:none;letter-spacing:0;font:400 13px var(--f-body);color:var(--faint);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:55%}
.playbar:hover{background:var(--or);color:#0d0c0b;border-color:var(--or)}
.playbar:hover svg,.playbar:hover span{color:#0d0c0b}
.hero .play-old{position:absolute;right:14px;bottom:14px;background:var(--or);color:#0d0c0b;font:600 12px/1 var(--f-mono);text-transform:uppercase;letter-spacing:.08em;padding:11px 14px;display:flex;gap:8px;align-items:center;border:2px solid #0d0c0b}
.hero:hover .play-old{background:#0d0c0b;color:var(--or)}
.epnum{font:800 64px/.9 var(--f-disp);letter-spacing:-.04em;margin:0}
.epnum span{color:var(--or)}
.ephead h1{font:700 clamp(26px,3vw,38px)/1.08 var(--f-disp);margin:12px 0 12px;letter-spacing:-.02em}
.ephead .q{font-size:17px}
.links{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.btn{display:inline-flex;align-items:center;min-height:38px;padding:0 12px;border:1.5px solid var(--ink);font-size:14px;text-decoration:none;background:transparent}
.btn:hover{background:var(--ink);color:var(--paper)}
.btn.pri{background:var(--or);border-color:var(--or);color:#0d0c0b;font-weight:600}
.btn.pri:hover{background:var(--ink);border-color:var(--ink);color:var(--or)}
.kv{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:22px;border-top:2px solid var(--rule)}
.kv div{padding:10px 10px 10px 0;border-bottom:1px solid var(--hair)}
.kv span{display:block;font:500 10px var(--f-mono);text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.kv b{font:700 20px/1.2 var(--f-disp);letter-spacing:-.02em}
.kvnote{font-size:12.5px;color:var(--muted);margin-top:10px}
.prevnext{display:flex;justify-content:space-between;margin-top:14px;font:500 12px var(--f-mono);text-transform:uppercase;letter-spacing:.08em}
.prevnext a{text-decoration:none}
.prevnext a:hover{color:var(--or-ink)}

.subtabs{display:flex;gap:0;margin:22px 0 22px;border-bottom:2px solid var(--rule);overflow-x:auto}
.subtabs button{background:none;border:0;padding:12px 16px 10px;font:600 12px var(--f-mono);text-transform:uppercase;letter-spacing:.08em;color:var(--muted);border-bottom:4px solid transparent;margin-bottom:-2px;white-space:nowrap}
.subtabs button:hover{color:var(--ink)}
.subtabs button.on{color:var(--ink);border-bottom-color:var(--or)}

.prose{max-width:76ch;font-size:16.5px;line-height:1.65}
.prose h1{display:none}
.prose p{margin:0 0 16px}
.prose strong{font-weight:600}
.prose > p > strong:first-child{display:block;font:600 11px/1.3 var(--f-mono);text-transform:uppercase;letter-spacing:.1em;color:var(--or-ink);margin:26px 0 6px;padding-top:12px;border-top:1px solid var(--hair)}
.prose ul{padding-left:20px;margin:0 0 16px}
.prose li{margin:5px 0}
.prose li::marker{color:var(--or)}
.prose code{font:500 13px var(--f-mono);background:var(--paper2);padding:1px 5px}
.prose a{color:var(--or-ink);text-decoration-thickness:1px;text-underline-offset:3px}
.note{background:var(--card);border-left:4px solid var(--or);padding:12px 16px;margin:0 0 18px;font-size:14px;color:var(--ink2);max-width:90ch}

/* Tables */
table.c{width:100%;border-collapse:collapse;font-size:14px}
table.c th{text-align:left;font:600 10.5px var(--f-mono);text-transform:uppercase;letter-spacing:.08em;padding:9px 8px;border-bottom:2px solid var(--rule);cursor:pointer;white-space:nowrap;position:sticky;top:0;background:var(--paper)}
table.c th:hover{color:var(--or-ink)}
table.c td{padding:10px 8px;border-bottom:1px solid var(--hair);vertical-align:top}
td.n{font-family:var(--f-mono);font-size:13px;white-space:nowrap}
td.n a{color:var(--or-ink)}
.pill{display:inline-block;font-size:12px;border:1px solid var(--hair);padding:1px 6px;white-space:nowrap}
.pill.высокий{background:var(--or);border-color:var(--or);color:#0d0c0b}
.pill.критический,.pill.токсичный{border-color:var(--ink);font-weight:600}
.ctl{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:14px}
.ctl input,.ctl select{font:inherit;font-size:14px;background:var(--card);color:var(--ink);border:1.5px solid var(--ink);padding:7px 10px;border-radius:0;width:auto}
.ctl input{min-width:240px}

/* Transcript */
.tr{font-size:15px;max-width:90ch}
.tr .ln{display:grid;grid-template-columns:62px 1fr;gap:10px;padding:3px 0}
.tr .ln .t{font:500 12px/1.9 var(--f-mono);color:var(--faint)}
.tr .ln.hit{background:var(--or-soft)}
.tr .ln.hit .t{color:var(--or-ink)}

/* Tags & audience */
h2.sec{font:700 24px/1.1 var(--f-disp);letter-spacing:-.02em;margin:36px 0 14px;padding-top:12px;border-top:2px solid var(--rule)}
.tagcloud{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:0 28px}
.tagbox{padding:12px 0 16px;border-top:1px solid var(--hair);break-inside:avoid}
.tagbox h3{margin:0 0 8px;font:600 15px var(--f-body);display:flex;align-items:center;gap:8px}
.tagbox a{display:block;font-size:14px;text-decoration:none;padding:3px 0;color:var(--ink2)}
.tagbox a:hover{color:var(--or-ink)}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:0 40px}
.bar{display:grid;grid-template-columns:minmax(120px,190px) 1fr 52px;gap:10px;align-items:center;font-size:14px;padding:4px 0}
.bar i{display:block;height:12px;background:var(--ink)}
.bar b{font:500 12px var(--f-mono);text-align:right}

.foot{border-top:4px solid var(--or);background:var(--head);color:#bdb6ac;padding:18px 32px;font:400 12px/1.6 var(--f-mono)}
.foot a{color:var(--head-ink)}
.empty{padding:40px 0;color:var(--muted)}

@media (max-width:1100px){
  .top{grid-template-columns:auto 1fr auto;padding:10px 20px}
  .tabs{grid-column:1/-1;order:3;margin-top:-6px}
  .card{grid-template-columns:220px 1fr}
  .stats{grid-column:2;flex-direction:row;gap:18px;text-align:left}
}
@media (max-width:900px){
  main{padding:20px 16px 48px}
  .top{gap:12px;padding:10px 16px}
  .brand b{font-size:15px}
  .brand small{display:none}
  .brand img{width:38px;height:38px}
  kbd{display:none}
  .layout{grid-template-columns:1fr;gap:12px}
  aside.filters{position:static;max-height:none;overflow:visible}
  .fwrap summary{display:block;font:600 12px var(--f-mono);text-transform:uppercase;letter-spacing:.08em;padding:12px 0;border-top:2px solid var(--rule);cursor:pointer}
  .ephead{grid-template-columns:1fr;gap:20px}
  .grid2{grid-template-columns:1fr}
  .mast{grid-template-columns:1fr}
  .mast .figs div{align-items:flex-start}
}
@media (max-width:600px){
  .top{grid-template-columns:1fr auto}
  .searchbox{grid-column:1/-1;order:2}
  .tabs{order:3}
  .card{grid-template-columns:1fr;gap:12px}
  .stats{grid-column:1}
  .kv{grid-template-columns:repeat(2,1fr)}
  .epnum{font-size:48px}
  .ctl input{min-width:0;width:100%}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
.ephead > *{min-width:0}
.ephead h1{overflow-wrap:break-word;hyphens:auto}
@media (max-width:600px){
  .ephead h1{font-size:24px}
  .playbar span{display:none}
  .mast h1{font-size:30px}
  .mast .figs b{font-size:22px}
}

.listen{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px;margin-top:14px;padding-top:12px;border-top:1px solid var(--hair);font-size:14px}
.listen span{font:600 10.5px var(--f-mono);text-transform:uppercase;letter-spacing:.1em;color:var(--muted);margin-right:2px}
.listen a{text-decoration:none;border-bottom:1.5px solid var(--or)}
.listen a:hover{color:var(--or-ink)}
.fplat{margin-bottom:6px;color:var(--head-ink)}

.related{margin-top:26px}
.relh{font:600 11px/1 var(--f-mono);text-transform:uppercase;letter-spacing:.1em;margin:0 0 12px}
.rgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:16px}
.rtile{display:flex;flex-direction:column;text-decoration:none}
.rtile img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border:2px solid var(--ink);margin-bottom:8px;transition:border-color .2s}
.rtile .eno{margin-bottom:3px}
.rtile b{font-weight:600;font-size:14.5px;line-height:1.3}
.rtile:hover img{border-color:var(--or)}
.rtile:hover b{text-decoration:underline;text-decoration-color:var(--or);text-decoration-thickness:2px;text-underline-offset:3px}
.backrefs{display:flex;flex-wrap:wrap;gap:4px 16px;margin:14px 0 0;font-size:14px}
.backrefs span{font:600 10.5px var(--f-mono);text-transform:uppercase;letter-spacing:.1em;color:var(--muted);width:100%}
.backrefs a{text-decoration:none;border-bottom:1.5px solid var(--or)}
a.eplink{font-weight:600;color:var(--ink);text-decoration:none;border-bottom:2px solid var(--or)}
a.eplink:hover{background:var(--or-soft)}
@media (max-width:600px){.rgrid{grid-template-columns:repeat(2,1fr);gap:12px}.rtile b{font-size:13.5px}}
