:root{
  --paper:#f4f4f1;--paper-deep:#e8e8e4;--paper-light:#fdfdfb;--ink:#1b1b1a;--ink-soft:#444441;
  --night:#111110;--night-soft:#222220;--line:#cbc9c3;--line-dark:#464541;--muted:#6d6c67;
  --brand:#7a4246;--brand-deep:#562d31;--brass:#8b8173;--star:#6d6255;--danger:#743c3f;
  --hero-font:Newsreader,Georgia,serif;--sans:"Plus Jakarta Sans",system-ui,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,monospace;--radius:2px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.5}
body{background-image:linear-gradient(rgba(25,25,23,.018) 1px,transparent 1px);background-size:100% 4px}
button,input,select{font:inherit;color:inherit}
button,a,select,input{outline-color:var(--brand)}
a{color:var(--brand);text-underline-offset:3px}
[hidden]{display:none!important}

/* mastheads */
.hero{border-bottom:1px solid var(--line);padding:54px 24px 42px;text-align:left;background:var(--paper-light)}
.hero-inner{max-width:1180px;margin:0 auto}
.hero h1{margin:0;font-family:var(--hero-font);font-weight:500;line-height:.92;letter-spacing:-.035em}
.hero .t1{display:block;font-size:clamp(52px,8vw,104px);color:var(--ink)}
.hero .t2{display:block;width:max-content;margin:12px 0 0;padding-top:10px;border-top:1px solid var(--ink);font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--brand)}
.hero .sub{color:var(--ink-soft);max-width:680px;margin:22px 0 0;font-size:16px}
.credits{font-family:var(--mono);font-size:12px!important;line-height:1.5;opacity:1;margin-top:10px!important;color:var(--muted)!important}

.landing-hero{position:relative;min-height:460px;padding:0;background:var(--night) url('/assets/skipto-archive-hero.png') center/cover no-repeat;color:var(--paper-light);border:0;display:flex;align-items:stretch;isolation:isolate}
.landing-hero:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(11,9,7,.98) 0%,rgba(15,12,9,.91) 34%,rgba(15,12,9,.28) 68%,rgba(15,12,9,.05));z-index:-1}
.landing-hero .hero-inner{width:100%;padding:52px 32px 44px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center}
.brand-kicker{margin:0 0 24px;font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:#b8b3a9}
.landing-title{display:flex;align-items:baseline;margin:0;font-family:var(--hero-font);font-weight:500;line-height:.7;letter-spacing:-.07em;color:var(--paper-light)}
.landing-title span{font-size:clamp(68px,9vw,116px)}
.landing-title b{font-family:var(--mono);font-size:clamp(18px,3vw,36px);font-weight:500;letter-spacing:-.06em;color:#b8b3a9}
.tagline{margin:30px 0 0;font-family:var(--hero-font);font-size:clamp(30px,3.4vw,46px);font-weight:400;line-height:.98;letter-spacing:-.035em;color:#f4efe5}
.landing-hero .sub{max-width:500px;margin:16px 0 0;color:#c9c0b4;font-size:14px}
.hero-cta{display:inline-block;margin-top:24px;padding:12px 18px;background:var(--paper);color:var(--ink);border:1px solid var(--paper);font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;text-decoration:none;transition:.18s}
.hero-cta:hover{background:transparent;color:var(--paper)}

.archive-intro{max-width:1240px;margin:0 auto;padding:70px 28px 36px;display:grid;grid-template-columns:1fr 2fr;gap:32px;border-bottom:1px solid var(--ink)}
.archive-index{margin:8px 0 0;font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--brand)}
.archive-intro h2{margin:0;font-family:var(--hero-font);font-size:clamp(38px,5vw,66px);font-weight:500;line-height:1;letter-spacing:-.035em}
.archive-intro div p{max-width:620px;margin:16px 0 0;color:var(--muted)}

/* buttons and controls */
.btn{background:transparent;border:1px solid var(--ink);border-radius:0;padding:9px 13px;cursor:pointer;font-family:var(--mono);font-size:12px;letter-spacing:.025em;transition:.14s}
.btn:hover{background:var(--ink);color:var(--paper-light)}
.btn.ghost{background:transparent;border-color:var(--line);color:var(--muted)}
.btn.ghost:hover{border-color:var(--ink);color:var(--ink)}
.btn.small{padding:5px 9px;font-size:11.5px}
.btn.primary{background:var(--brand);color:#fffaf2;border-color:var(--brand);font-weight:500}
.btn.primary:hover{background:var(--brand-deep);border-color:var(--brand-deep)}
.btn.wide{width:100%;margin-top:8px;padding:12px}

/* chart */
.chart-wrap{padding:20px 24px 14px;border-bottom:1px solid var(--line);background:var(--paper-deep)}
.chart-toolbar{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;max-width:1600px;margin:0 auto 14px}
.chart-copy{display:flex;flex-direction:column;gap:4px;min-width:0}
.chart-title{font-family:var(--hero-font);font-size:28px;font-weight:500;line-height:1;color:var(--ink)}
.chart-title span{margin-left:9px;font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.03em;text-transform:uppercase;color:var(--muted)}
.legend-hint{color:var(--muted);font-family:var(--mono);font-size:11.5px}
.chart-actions{display:flex;gap:8px}
.chart-viewport{position:relative;max-width:1600px;margin:auto;transition:max-height .25s ease}
.chart-scroll{overflow-x:auto;padding-bottom:6px}
.chart-wrap.preview .chart-viewport{max-height:220px;overflow:hidden}
.chart-wrap.preview .chart-viewport:after{content:"";position:absolute;left:0;right:0;bottom:0;height:78px;background:linear-gradient(transparent,var(--paper-deep));pointer-events:none}
.chart-wrap.expanded .chart-viewport{max-height:none}
.chart{--cols:var(--ncols,15);--label:150px;display:grid;grid-template-columns:var(--label) repeat(var(--cols),minmax(64px,1fr));gap:2px;min-width:calc(var(--label) + var(--cols) * 66px);font-family:var(--mono);font-size:11.5px;user-select:none}
.chart .hdr{background:var(--ink);color:var(--paper-light);font-weight:500;text-align:center;padding:6px 2px;cursor:pointer;border-radius:0}
.chart .hdr:hover{background:var(--brand)}
.chart .hdr.on{background:var(--brand);color:#fff}
.chart .hdr.lbl{cursor:default;text-align:left;padding-left:8px}
.chart .hdr.lbl:hover{background:var(--ink)}
.chart .rowlbl{background:var(--paper-light);color:var(--ink);border-left:4px solid var(--brand);font-weight:600;padding:7px 9px;display:flex;align-items:center;font-size:11px;letter-spacing:.055em;text-transform:uppercase}
.chart .rowlbl.sub{background:var(--paper-deep);color:var(--muted);border-left:0;font-weight:400;text-transform:none;font-size:11px}
.chart .rowlbl.sub.empty{background:rgba(255,255,255,.32);border:1px solid rgba(27,27,26,.05)}
.chart .cell{min-height:28px;background:rgba(68,57,44,.1)}
.chart .bar{display:flex;align-items:center;justify-content:center;text-align:center;padding:4px 6px;line-height:1.15;cursor:pointer;border:1px solid rgba(30,27,22,.14);transition:.12s;font-weight:500;overflow:hidden}
.chart .bar:hover{filter:contrast(1.15);outline:2px solid var(--paper-light);outline-offset:-3px}
.chart .bar.on{outline:3px solid var(--brand-deep);outline-offset:-3px;box-shadow:none}
.chart .bar.dim{opacity:.28}
.chart .grp{grid-column:1 / -1;height:8px}

/* explorer layout */
.layout{display:grid;grid-template-columns:280px 1fr;gap:28px;padding:28px 24px 56px;max-width:1600px;margin:0 auto}
.filters{position:sticky;top:16px;align-self:start;background:var(--paper-light);border:1px solid var(--line);border-top:5px solid var(--brand);border-radius:0;padding:18px;max-height:calc(100vh - 32px);overflow:auto}
.filter-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;padding-bottom:12px;border-bottom:1px solid var(--line)}
.filter-head h2{margin:0;font-family:var(--hero-font);font-size:25px;font-weight:500;letter-spacing:-.02em}
.search input{width:100%;padding:10px 0;border:0;border-bottom:1px solid var(--ink);border-radius:0;background:transparent;outline:none}
.search input:focus{border-color:var(--brand);box-shadow:0 1px 0 var(--brand)}
.fgroup{margin-top:20px}
.fgroup-title{font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:.09em;color:var(--muted);margin-bottom:8px;font-weight:500}
.chips{display:flex;flex-wrap:wrap;gap:5px}
.chip{border:1px solid var(--line);background:transparent;border-radius:0;padding:5px 9px;font-size:12px;cursor:pointer;transition:.12s}
.chip:hover{border-color:var(--brand);color:var(--brand)}
.chip.on{background:var(--brand);color:#fff;border-color:var(--brand);font-weight:600}
.chips.seasons .chip{min-width:32px;text-align:center;padding:5px}
select{width:100%;padding:9px;border-radius:0;border:1px solid var(--line);background:var(--paper-light)}
.row{display:flex;align-items:center;gap:8px;margin-top:9px}
.row span{min-width:80px;color:var(--muted);font-size:13px}
.row input[type=range]{flex:1;accent-color:var(--brand)}
.row output{min-width:32px;font-family:var(--mono);font-size:12px}
.row.check{gap:8px}.row.check input{width:16px;height:16px;accent-color:var(--brand)}
.muted{color:var(--muted)}.tiny{font-size:12px;margin-top:6px;line-height:1.4}

.results-head{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:15px;padding-bottom:12px;border-bottom:1px solid var(--ink)}
.count{font-family:var(--mono);font-size:12px;text-transform:uppercase;letter-spacing:.05em;font-weight:500}
.active{display:flex;flex-wrap:wrap;gap:5px}
.active .chip{background:var(--paper-deep);border-color:var(--line)}
.active .chip b{margin-left:7px;font-weight:400;opacity:.7}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:22px 14px}
.card{background:var(--paper-light);border:1px solid var(--line);border-radius:0;overflow:hidden;display:flex;flex-direction:column;cursor:pointer;transition:transform .15s,box-shadow .15s}
.card:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(48,38,27,.13)}
.card.watched{opacity:.48}
.card .thumb{aspect-ratio:16/9;background:#322d25 center/cover no-repeat;position:relative;filter:saturate(.72) contrast(1.04)}
.card .thumb:after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);pointer-events:none}
.card .thumb .code,.card .thumb .rating{position:absolute;top:8px;background:rgba(20,20,19,.86);padding:4px 7px;border-radius:0;font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.03em;color:#f7f7f3}
.card .thumb .code{left:8px}.card .thumb .rating{right:8px;color:#e2c28d}
.card .thumb .era{position:absolute;left:0;right:0;bottom:0;height:4px}
.card .body{padding:14px 14px 13px;display:flex;flex-direction:column;gap:7px;flex:1}
.card h3{margin:0;font-family:var(--hero-font);font-size:23px;font-weight:500;line-height:1.05;letter-spacing:-.02em}
.card .meta{font-family:var(--mono);font-size:11px;line-height:1.45;text-transform:uppercase;letter-spacing:.025em;color:var(--muted)}
.card .sum{font-size:14px;color:var(--ink-soft);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.tags{display:flex;flex-wrap:wrap;gap:4px;margin-top:auto}
.tag{font-family:var(--mono);font-size:11.5px;padding:3px 6px;border-radius:0;background:var(--paper-deep);color:var(--ink-soft);border:1px solid var(--line);text-transform:uppercase;letter-spacing:.01em}
.tag.guest{background:#ebe2d3;border-color:#cbbca3;color:#624c32}
.card .foot{display:flex;justify-content:space-between;align-items:center;margin-top:5px;padding-top:8px;border-top:1px solid var(--line)}
.watch{background:transparent;border:0;border-bottom:1px solid var(--ink);border-radius:0;padding:2px 0;font-family:var(--mono);font-size:11.5px;text-transform:uppercase;cursor:pointer}
.watch.on{color:var(--brand);border-color:var(--brand)}
.empty{padding:60px;text-align:center;color:var(--muted)}

/* modal */
.modal{position:fixed;inset:0;background:rgba(16,13,10,.82);display:flex;align-items:center;justify-content:center;padding:20px;z-index:50}
.modal-card{background:var(--paper-light);border:1px solid var(--line);border-radius:0;max-width:900px;width:100%;max-height:92vh;overflow:auto;position:relative;box-shadow:0 30px 70px rgba(0,0,0,.4)}
.modal-close{position:absolute;right:10px;top:10px;background:rgba(20,20,19,.84);border:1px solid rgba(255,255,255,.35);color:#fff;border-radius:0;padding:7px 10px;cursor:pointer;z-index:2;font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:.06em}
.modal .hero-img{aspect-ratio:16/8;background:#211d18 center/cover no-repeat;filter:saturate(.75)}
.modal .mbody{padding:24px 26px 30px}.modal h2{margin:0 0 5px;font-family:var(--hero-font);font-size:34px;font-weight:500;line-height:1.05;letter-spacing:-.025em}
.modal .meta{color:var(--muted);font-family:var(--mono);font-size:11px;margin-bottom:14px;text-transform:uppercase}
.modal p{color:var(--ink-soft)}
.modal .section{margin-top:18px}.modal .section h4{margin:0 0 7px;font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:.09em;color:var(--muted)}
.ctx{display:flex;flex-wrap:wrap;gap:4px}.ctx .bar{font-family:var(--mono);font-size:11px;padding:4px 7px;border-radius:0;font-weight:500;cursor:pointer;border:1px solid rgba(30,27,22,.2)}
.ctx .bar:hover{outline:2px solid var(--brand)}
.cast{columns:2;font-size:13px;color:var(--ink-soft)}
.foot{text-align:center;color:var(--muted);font-family:var(--mono);font-size:11px;line-height:1.5;padding:25px;border-top:1px solid var(--line);text-transform:uppercase;letter-spacing:.025em}

/* top navigation */
.topnav{display:flex;align-items:center;gap:10px;padding:10px 24px;border-bottom:1px solid var(--line-dark);background:var(--night);color:#eeeeea;font-family:var(--mono);font-size:11px;letter-spacing:.03em;text-transform:uppercase;flex-wrap:wrap}
.topnav-home{color:#c5b8a6;text-decoration:none}.topnav-home:hover{color:#fff}.topnav-sep{color:#665e52}.topnav-current{font-weight:500;color:#fff}
.topnav-switch{margin-left:auto;display:flex;align-items:center;gap:7px;font-size:11px}.topnav-switch select{width:auto;padding:5px 8px;font-size:11px;background:var(--night-soft);color:#fff;border-color:#565652}

/* landing show archive */
.shows-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px 14px;padding:28px 28px 76px;max-width:1240px;margin:0 auto;counter-reset:shows}
.show-card{counter-increment:shows;display:flex;flex-direction:column;background:transparent;border:0;border-radius:0;padding:0;color:inherit;text-decoration:none;transition:transform .16s;position:relative;min-width:0}
.show-card:hover{transform:translateY(-4px)}
.show-image{position:relative;aspect-ratio:16/10;background:#363634 center/cover no-repeat;overflow:hidden;filter:grayscale(.2) saturate(.72) contrast(1.05);border:1px solid rgba(27,27,26,.22)}
.show-image:after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 1px rgba(255,255,255,.06);transition:.18s}
.show-card:hover .show-image{filter:grayscale(0) saturate(.9) contrast(1.02)}
.show-body{padding:13px 0 11px;border-bottom:1px solid var(--line)}
.show-body h2{margin:0 0 7px;font-family:var(--hero-font);font-size:32px;font-weight:500;line-height:1;letter-spacing:-.025em}
.show-body p{margin:0;font-size:14px;line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;color:var(--muted)}
.show-meta{display:flex;gap:6px;flex-wrap:wrap;margin-top:12px;font-family:var(--mono);font-size:11px;letter-spacing:.02em;text-transform:uppercase;color:var(--brand)}
.show-cta{margin-top:11px;font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.07em;text-transform:uppercase;color:var(--ink)}
#notfound{padding:80px 20px;text-align:center}#notfound h2{margin:0 0 8px;font-family:var(--hero-font);font-size:40px;font-weight:500}

/* mobile */
.mobile-bar,.drawer-foot{display:none}
@media(max-width:1000px){.shows-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:900px){
  .hero{padding:38px 16px 30px}.hero .sub{font-size:14px}.topnav{padding:9px 12px}.topnav-switch{margin-left:0;width:100%}.topnav-switch select{flex:1}
  .chart-wrap{padding:14px 12px 12px}.chart-toolbar{align-items:flex-start}.chart-title{font-size:25px}.chart-title span{display:block;margin:6px 0 0;font-size:10.5px}.legend-hint{font-size:11px}.chart-wrap.preview .chart-viewport{max-height:190px}.layout{display:block;padding:12px}
  .mobile-bar{display:flex;gap:8px;position:sticky;top:0;z-index:20;background:var(--paper);padding:8px 0 10px;margin:-4px 0 8px;border-bottom:1px solid var(--line)}
  .mobile-bar input{flex:1;min-width:0;padding:10px;border-radius:0;border:1px solid var(--line);background:var(--paper-light);outline:none;font-size:16px}
  .mobile-bar .btn{white-space:nowrap;padding:9px 12px}.mobile-bar .btn .n{display:inline-block;min-width:18px;padding:1px 5px;margin-left:6px;background:var(--brand);color:#fff;font-size:10px;text-align:center}
  .filters{display:none;position:fixed;inset:0;height:100vh;height:100dvh;z-index:60;max-height:none;border:0;border-top:6px solid var(--brand);overflow:auto;padding:18px 16px 100px;-webkit-overflow-scrolling:touch}
  body.drawer-open .filters{display:block}body.drawer-open{overflow:hidden}.filters .search{display:none}
  .drawer-foot{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:61;padding:24px 14px calc(12px + env(safe-area-inset-bottom));background:linear-gradient(transparent,var(--paper-light) 35%);gap:8px}
  body:not(.drawer-open) .drawer-foot{display:none}.drawer-foot .btn{flex:1;padding:13px;font-size:12px}
  .chip{padding:7px 11px;font-size:13px}.results-head{margin-bottom:12px}.grid{grid-template-columns:1fr;gap:16px}.card .sum{-webkit-line-clamp:2}
  .modal{padding:0;align-items:flex-end}.modal-card{max-height:100vh;height:100vh;border:0}.modal .mbody{padding:18px 16px 40px}.cast{columns:1}.foot{padding-bottom:calc(24px + env(safe-area-inset-bottom))}
}
@media(max-width:700px){
  .landing-hero{min-height:500px;background-position:62% center}.landing-hero:after{background:linear-gradient(90deg,rgba(11,9,7,.97),rgba(15,12,9,.7))}.landing-hero .hero-inner{padding:44px 20px 38px}.brand-kicker{margin-bottom:24px}.landing-title span{font-size:clamp(64px,19vw,92px)}.landing-title b{font-size:17px}.tagline{margin-top:32px;font-size:35px}.landing-hero .sub{font-size:13px;max-width:330px}
  .archive-intro{padding:46px 16px 28px;grid-template-columns:1fr;gap:16px}.archive-intro h2{font-size:44px}.archive-index{margin:0}
  .shows-grid{grid-template-columns:1fr;padding:18px 16px 50px;gap:28px}.show-body h2{font-size:32px}
}
@media(max-width:480px){.hero .t1{font-size:47px}.chart{--label:120px;font-size:11px}.modal .hero-img{aspect-ratio:16/10}}
@media(max-width:600px){.cast{columns:1}}

/* episode-axis chart */
.axis-episode .chart{--label:150px;grid-template-columns:var(--label) repeat(var(--cols),minmax(58px,1fr));min-width:calc(var(--label) + var(--cols) * 60px);font-size:11px}
.axis-episode .chart .hdr.ep{font-weight:500;font-size:10.5px;color:#ddd4c8;padding:5px 1px}.axis-episode .chart .hdr.ep:hover{color:#fff}.axis-episode .chart .hdr .muted{font-weight:400}.axis-episode .chart .bar{padding:4px;font-size:10.5px}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}