/* lofi.show: "The Series". Night-broadcast episode guide; each episode tints the page with its cover's own colours. */
@font-face{font-family:Tilt;src:url(/fonts/tiltwarp.woff2) format("woff2");font-display:swap}
@font-face{font-family:RHT;src:url(/fonts/redhattext.woff2) format("woff2");font-weight:300 700;font-display:swap}
@font-face{font-family:RHM;src:url(/fonts/redhatmono.woff2) format("woff2");font-weight:400 600;font-display:swap}
@property --room{syntax:"<color>";inherits:true;initial-value:#1A1F3A}
body,[style*="--acc"]{--acl:color-mix(in srgb,var(--acc) 62%,#fff)}
@property --acc{syntax:"<color>";inherits:true;initial-value:#FF9E7A}
:root{--acl:#FFB59E;--ink:#101426;--ink2:#171c33;--cream:#F4E9D8;--mute:#B9B3C9;--coral:#FF7A59;--line:rgba(244,233,216,.14);color-scheme:dark}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ink);color:var(--cream);font:400 17px/1.6 RHT,system-ui,sans-serif;padding-bottom:120px;transition:--room 1s,--acc 1s}
a{color:inherit}img{display:block;max-width:100%;height:auto}button{font:inherit;color:inherit}
.w{max-width:1240px;margin:0 auto;padding:0 28px}.nar{max-width:800px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:8px;background:var(--cream);color:var(--ink);padding:8px 14px;z-index:99}.skip:focus{left:8px}
:focus-visible{outline:3px solid var(--acc);outline-offset:3px}
.kicker{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font:500 13px/1.3 RHM,monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--acl);margin:0 0 18px}.kicker a{text-decoration:none;border-bottom:1px solid currentColor}
.rec{width:10px;height:10px;border-radius:50%;background:#FF4D4D;box-shadow:0 0 12px #FF4D4D;animation:rec 1.4s steps(2) infinite}@keyframes rec{50%{opacity:.25}}
.h1{font:400 clamp(44px,7.4vw,108px)/.92 Tilt,sans-serif;letter-spacing:-.01em;margin:0;text-wrap:balance}.h1 em{font-style:normal;color:var(--acc);display:block}
.h2{font:400 clamp(30px,3.6vw,52px)/1 Tilt,sans-serif;margin:0}.h2.sm{font-size:clamp(24px,2.4vw,32px)}
.h3{font:500 13px/1 RHM,monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--mute);margin:0 0 18px;padding-bottom:12px;border-bottom:1px solid var(--line)}
.lede{font-size:20px;color:#E4DCCF;max-width:620px;margin:22px 0 0}.sub{color:var(--mute);margin:8px 0 22px}
.acts{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:30px}
.btn{display:inline-flex;align-items:center;gap:10px;background:var(--acl);color:var(--ink);border:2px solid var(--acl);border-radius:4px;padding:13px 22px;font:600 16px/1 RHT,sans-serif;text-decoration:none;cursor:pointer;transition:transform .2s,background .2s}
.btn:hover{transform:translateY(-2px)}.btn.ln{background:transparent;color:var(--cream);border-color:var(--line)}.btn.ln:hover{border-color:var(--cream)}.btn.sm{padding:9px 14px;font-size:14px}
.hd{display:flex;justify-content:space-between;align-items:center;gap:18px;max-width:1240px;margin:0 auto;padding:22px 28px}
.mark{display:flex;align-items:center;gap:10px;text-decoration:none;font:400 26px/1 Tilt,sans-serif}.mark i{font-style:normal;color:var(--coral)}.lg{width:38px;height:38px}
.hd-n{display:flex;gap:4px;flex-wrap:wrap}.hd-n a{text-decoration:none;padding:8px 12px;font-weight:500;color:var(--mute);border-bottom:2px solid transparent}.hd-n a:hover,.hd-n a[aria-current]{color:var(--cream);border-color:var(--acl)}
/* hero */
.hero{position:relative;padding:40px 0 80px;background:radial-gradient(80% 90% at 80% 30%,color-mix(in srgb,var(--room) 85%,#fff 4%),transparent 70%)}
.hero-g{display:grid;grid-template-columns:1.15fr .85fr;gap:60px;align-items:center}
.hero-k{position:relative;display:block;text-decoration:none;border-radius:6px;overflow:hidden;box-shadow:0 40px 80px -30px #000,0 0 0 1px var(--line);transform:rotate(1.2deg);transition:transform .5s}
.hero-k:hover{transform:rotate(0) scale(1.01)}
.hero-c{position:absolute;left:0;right:0;bottom:0;padding:60px 22px 20px;background:linear-gradient(transparent,rgba(8,10,20,.92));display:grid;gap:2px;font:500 13px/1.4 RHM,monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--mute)}.hero-c b{font:400 34px/1 Tilt,sans-serif;text-transform:none;letter-spacing:0;color:var(--cream)}
/* ribbon timeline */
.tl{padding:30px 0 60px}
.rib{display:grid;gap:6px;margin-top:10px}.rib-s{display:grid;grid-template-columns:52px 1fr;align-items:center;gap:12px}
.rib-y{font:500 13px/1 RHM,monospace;color:var(--mute)}.rib-r{display:flex;flex-wrap:wrap;gap:3px;min-height:26px}.rib-r a{height:26px}
.rib-r a{flex:0 0 calc(var(--w) * 1px / 30);min-width:24px;max-width:100%;background:color-mix(in srgb,var(--acc) 70%,transparent);border-radius:2px;transition:transform .2s,background .2s}
.rib-r a:hover,.rib-r a.on{background:var(--acc);transform:scaleY(1.35)}.rib-r a.on{box-shadow:0 0 0 2px var(--cream)}
/* seasons + cards */
.sea{padding:40px 0 30px;border-top:1px solid var(--line)}.sea-h{display:flex;align-items:baseline;gap:18px;flex-wrap:wrap;margin-bottom:26px}.sea-h p{margin:0;color:var(--mute);font:500 14px RHM,monospace}.sea-h a{margin-left:auto;color:var(--acl);font-weight:600}
.eps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:26px 22px}
.ep a{display:block;text-decoration:none;height:100%}
.ep-img{position:relative;display:block;border-radius:5px;overflow:hidden;background:var(--room);aspect-ratio:1}.ep-img img{width:100%;transition:transform .6s cubic-bezier(.2,.7,.2,1),filter .4s}
.ep a:hover .ep-img img{transform:scale(1.05);filter:saturate(1.15)}
.ep-rt{position:absolute;right:8px;bottom:8px;background:rgba(10,12,22,.85);padding:3px 8px;border-radius:3px;font:500 12px/1.4 RHM,monospace}
.ep-b{display:grid;gap:3px;padding:12px 2px 0}.ep-c{font:500 12px/1 RHM,monospace;letter-spacing:.1em;color:var(--acl)}.ep-h{font:400 24px/1.05 Tilt,sans-serif}.ep-m{color:var(--mute);font-size:14px}.ep-l{color:#DDD4C6;font-size:14px;font-style:italic;line-height:1.45}
/* page head */
.ph{padding:40px 0 30px}
.sn{display:flex;flex-wrap:wrap;gap:6px;margin-top:26px}.sn a{text-decoration:none;font:500 14px/1 RHM,monospace;padding:9px 12px;border:1px solid var(--line);border-radius:3px}.sn a[aria-current]{background:var(--cream);color:var(--ink)}
.guide{width:100%;border-collapse:collapse;font-size:16px}.guide th,.guide td{text-align:left;padding:11px 10px;border-bottom:1px solid var(--line)}.guide thead th{font:500 12px RHM,monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--mute)}
.guide .g-s th{padding-top:30px;font:400 26px Tilt,sans-serif;border-bottom:2px solid var(--acl)}.guide .g-s a{text-decoration:none}.g-c,.g-n,.g-r{font-family:RHM,monospace;font-size:14px;color:var(--mute)}.guide tbody th a{text-decoration:none;font-weight:600}.guide tbody th a:hover{color:var(--acc)}
/* episode */
.pg-ep{background:linear-gradient(180deg,var(--room) 0,var(--ink) 820px) no-repeat,var(--ink)}
.prev{padding:6px 0 0}.prev-k{font:500 12px/1 RHM,monospace;letter-spacing:.16em;text-transform:uppercase;color:var(--mute);margin:0 0 12px}
.prev-r{list-style:none;margin:0;padding:0;display:flex;gap:14px;overflow-x:auto}.prev-r a{display:flex;gap:10px;align-items:center;text-decoration:none;padding:6px 14px 6px 6px;background:rgba(0,0,0,.25);border-radius:4px;font-weight:600;font-size:15px;white-space:nowrap}
.prev-r img{width:44px;height:44px;border-radius:3px;filter:grayscale(.7) contrast(.9);transition:filter .3s}.prev-r a:hover img{filter:none}.prev-r small{display:block;font:500 11px RHM,monospace;color:var(--mute)}
.prev-r li{animation:recap .6s both}.prev-r li:nth-child(2){animation-delay:.12s}.prev-r li:nth-child(3){animation-delay:.24s}@keyframes recap{from{opacity:0;transform:translateX(-24px)}}
.tc{padding:34px 0 50px}.tc-g{display:grid;grid-template-columns:minmax(0,480px) 1fr;gap:56px;align-items:center}
.tc-art img{border-radius:6px;box-shadow:0 40px 80px -30px #000;animation:art 1s cubic-bezier(.2,.7,.2,1) both}@keyframes art{from{opacity:0;transform:scale(.94)}}
.tc-h .wd{display:inline-block;white-space:nowrap}.tc-h .lt{display:inline-block;animation:lt .7s cubic-bezier(.2,.8,.2,1.2) var(--d) both}@keyframes lt{from{opacity:0;transform:translateY(.4em) rotate(4deg)}}
.tc-l{font:italic 400 21px/1.4 RHT,sans-serif;color:#EADFCF;margin:20px 0 0;max-width:560px}
.tc-m{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px 20px;margin:30px 0 0;padding:20px 0 0;border-top:1px solid var(--line)}.tc-m dt{font:500 11px/1 RHM,monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--mute);margin-bottom:6px}.tc-m dd{margin:0;font-weight:600}
.watch{color:var(--mute);font-size:15px}.watch a{margin-left:8px;color:var(--cream)}
.body{padding:20px 0 50px}.body-g{display:grid;grid-template-columns:1.1fr .9fr;gap:60px}
.ch{list-style:none;margin:0;padding:0}.ch-r{display:grid;grid-template-columns:40px 64px 1fr auto auto;gap:12px;align-items:center;padding:9px 0;border-bottom:1px solid var(--line)}
.ch-p{width:36px;height:36px;border-radius:50%;border:1px solid var(--line);background:transparent;cursor:pointer;display:grid;place-items:center}.ch-p:hover{border-color:var(--acc)}
.ch-ic{width:0;height:0;border-left:10px solid currentColor;border-top:6px solid transparent;border-bottom:6px solid transparent;margin-left:3px}.ch-p.now .ch-ic{width:10px;height:12px;border:0;margin:0;background:linear-gradient(90deg,currentColor 35%,transparent 35% 65%,currentColor 65%)}
.ch-r.on{color:var(--acl)}.ch-r.on .ch-p{background:var(--acl);color:var(--ink);border-color:var(--acl)}
.ch-tc{font:500 14px RHM,monospace;color:var(--mute)}.ch-t b{font-weight:600}.ch-t small{font:500 11px RHM,monospace;text-transform:uppercase;letter-spacing:.1em;color:var(--acl);margin-left:8px}.ch-d{font:14px RHM,monospace;color:var(--mute)}
.ch-l{display:flex;gap:10px;font:500 13px RHM,monospace}.ch-l a{color:var(--mute);text-decoration:none}.ch-l a:hover{color:var(--cream)}
.ln-n p{margin:0 0 14px;color:#E4DCCF}.ln-n a{color:var(--acl)}.ln-n .src{font-size:14px;color:var(--mute)}.ln-n .use{font-size:14px;color:var(--mute);border-left:3px solid var(--acc);padding-left:12px}
code{font:500 .92em RHM,monospace;background:rgba(255,255,255,.08);padding:2px 6px;border-radius:3px}
.next{padding:20px 0 60px}.nx{display:grid;grid-template-columns:160px 1fr;gap:26px;align-items:center;text-decoration:none;padding:20px;border:1px solid var(--line);border-radius:6px;background:linear-gradient(90deg,color-mix(in srgb,var(--acc) 18%,transparent),transparent);transition:border-color .3s}
.nx:hover{border-color:var(--acc)}.nx img{border-radius:4px}.nx span{display:grid;gap:4px}.nx small{font:500 12px RHM,monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--acl)}.nx b{font:400 clamp(30px,4vw,48px)/1 Tilt,sans-serif}.nx span span{color:var(--mute)}
.nx-end{grid-template-columns:1fr}.nx-end a{color:var(--acl)}
.pn{display:flex;justify-content:space-between;gap:20px;margin:22px 0 30px}.pn a{color:var(--mute);font-weight:600}.pn a:hover{color:var(--cream)}
/* faq/prose */
.faq-s{padding:60px 0;border-top:1px solid var(--line)}.faq{margin:26px 0 0}.faq div{padding:18px 0;border-bottom:1px solid var(--line)}.faq dt{font-weight:700;font-size:19px}.faq dd{margin:8px 0 0;color:#DDD4C6}.faq a{color:var(--acl)}
.prose h2{font:400 30px Tilt,sans-serif;margin:40px 0 10px}.prose a{color:var(--acl)}.prose li{margin:6px 0}.cred{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.nf{padding:80px 0 120px}
/* footer */
.ft{border-top:1px solid var(--line);padding:56px 0 40px;margin-top:20px;color:var(--mute)}
.ft-big{font:400 clamp(34px,6vw,84px)/1 Tilt,sans-serif;color:var(--cream);margin:0 0 40px}
.ft-g{display:grid;grid-template-columns:1fr 1fr 1.4fr;gap:40px}.ft h2{font:500 12px RHM,monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--cream);margin:0 0 12px}
.ft ul{list-style:none;margin:0;padding:0}.ft li{margin:5px 0}.ft a{text-decoration:none}.ft a:hover{color:var(--cream);text-decoration:underline}.ft-s{columns:2}.inl{display:flex;flex-wrap:wrap;gap:4px 14px}
.fine{font-size:14px;margin:40px 0 0;max-width:860px}.ft .fine a{text-decoration:underline;color:var(--cream)}
/* player */
.pb{position:fixed;left:0;right:0;bottom:0;z-index:50;padding:0 12px 12px;pointer-events:none}
.pb-in{pointer-events:auto;max-width:1240px;margin:0 auto;display:grid;grid-template-columns:auto minmax(0,1.3fr) auto minmax(0,1.5fr) auto;gap:16px;align-items:center;background:rgba(14,17,32,.94);backdrop-filter:blur(14px);border:1px solid var(--line);border-radius:6px;padding:10px 16px 10px 10px;box-shadow:0 20px 40px -20px #000}
.pb-c{width:52px;height:52px;border-radius:3px}.pb-t{margin:0;display:grid;min-width:0;line-height:1.3}.pb-t small{font:500 11px RHM,monospace;letter-spacing:.1em;text-transform:uppercase;color:var(--acl);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pb-t b,.pb-t span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pb-t span{color:var(--mute);font-size:14px}
.pb-ctl{display:flex;gap:6px;align-items:center}.pb-b{width:38px;height:38px;border:0;background:transparent;cursor:pointer;display:grid;place-items:center}.pb-b svg{width:18px;height:18px;fill:currentColor;stroke:currentColor;stroke-width:2}
.pb-pp{width:48px;height:48px;border-radius:50%;border:0;background:var(--cream);color:var(--ink);cursor:pointer;display:grid;place-items:center}.pb-pp svg{width:16px;height:16px;fill:currentColor}
.pb-sk{display:flex;align-items:center;gap:10px;font:12px RHM,monospace;color:var(--mute)}.pb-rail{position:relative;flex:1;height:4px;background:var(--line);border-radius:2px}.pb-rail i{position:absolute;inset:0;background:var(--acl);transform-origin:0;transform:scaleX(0);border-radius:2px}
.pb-seek{position:absolute;inset:-10px 0;width:100%;opacity:0;cursor:pointer;margin:0}.pb-dl{font:500 13px RHM,monospace;color:var(--mute);text-decoration:none;border:1px solid var(--line);padding:6px 10px;border-radius:3px}
.un{position:fixed;right:18px;bottom:104px;z-index:51;display:flex;gap:14px;align-items:center;background:var(--cream);color:var(--ink);padding:12px 14px;border-radius:6px;box-shadow:0 20px 50px -20px #000;transform:translateY(20px);opacity:0;transition:.4s}
.un.in{transform:none;opacity:1}.un img{border-radius:3px}.un p{margin:0;display:grid;line-height:1.25}.un small{font:500 11px RHM,monospace;letter-spacing:.1em;text-transform:uppercase}.un b{font:400 22px Tilt,sans-serif}.un .btn{background:var(--ink);color:var(--cream);border-color:var(--ink)}.un-x{border:0;background:none;font-size:22px;cursor:pointer;color:var(--ink)}
.toast{position:fixed;left:50%;bottom:110px;transform:translate(-50%,20px);background:var(--cream);color:var(--ink);padding:10px 16px;border-radius:4px;opacity:0;transition:.3s;z-index:60;pointer-events:none;font-weight:600}.toast.show{opacity:1;transform:translate(-50%,0)}
@media (max-width:900px){.hero-g,.tc-g,.body-g{grid-template-columns:1fr;gap:34px}.hero-k{max-width:440px;transform:none}.tc-art{max-width:420px}.ft-g{grid-template-columns:1fr 1fr}.ft-g>div:last-child{grid-column:1/-1}
 .pb-in{grid-template-columns:auto minmax(0,1fr) auto;gap:10px}.pb-sk{grid-column:1/-1;order:5}.pb-dl{display:none}.pb-b[data-pc=prev]{display:none}}
@media (max-width:560px){.w{padding:0 18px}.hd{flex-direction:column;align-items:flex-start;padding:16px 18px}.hd-n a{padding:6px 8px 6px 0;margin-right:8px}
 .eps{grid-template-columns:1fr 1fr;gap:20px 14px}.ep-h{font-size:19px}.ep-l{display:none}.tc-m{grid-template-columns:1fr 1fr}.ch-r{grid-template-columns:36px 52px 1fr auto}.ch-l{grid-column:3/-1}.nx{grid-template-columns:90px 1fr;gap:14px;padding:14px}
 .rib-s{grid-template-columns:40px 1fr;gap:8px}.rib-r a{flex-basis:calc(var(--w) * 1px / 60);min-width:24px}.guide .g-c,.guide thead th:nth-child(1),.guide .g-n,.guide thead th:nth-child(2){display:none}.un{left:12px;right:12px;bottom:130px}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}