/* SKITFILM — the midnight picture show */
:root{--bg:#eee9d9;--paper:#f6f0df;--paper-2:#e5ddc6;--ink:#141510;--dim:#66614f;--slime:#dcf446;--yellow:#f4ee3a;--red:#e34130;--dark:#11120f;--display:"Bricolage",Impact,sans-serif;--wrap:1360px;--line:rgba(20,21,16,.2)}
body{background-color:var(--bg);background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath filter='url(%23n)' opacity='.12' d='M0 0h180v180H0z'/%3E%3C/svg%3E");font-family:var(--body);overflow-x:clip}
h1,h2,h3{font-family:var(--body);font-weight:900;letter-spacing:-.045em}a,button,input{touch-action:manipulation}a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid #e34130;outline-offset:5px}
.top{position:relative;background:#11120f;color:var(--paper);border-bottom:1px solid #525241;box-shadow:none;z-index:20}.top::after,.tape{display:none}.top-in{min-height:90px;gap:36px;max-width:1440px}.brand{font:1000 32px/.9 var(--body);letter-spacing:-2px;transform:rotate(-4deg);text-shadow:none;color:var(--yellow)}.brand b{color:var(--yellow);text-shadow:none}.brand i{font:700 12px var(--mono);color:var(--paper);letter-spacing:-1px}.inav{gap:25px;margin-left:auto}.inav a{font:700 12px var(--mono);text-transform:uppercase;letter-spacing:.02em;padding:14px 0;border:0;color:var(--paper);border-radius:0;background:none}.inav a svg{display:none}.inav a.on,.inav a:hover{color:var(--yellow);background:none;box-shadow:0 2px var(--yellow)}.tsearch{width:230px;max-width:100%;background:#25261e;border:1px solid #5a5b49;border-radius:0;color:var(--paper)}.tsearch input{color:var(--paper);font-size:11px}.tsearch input::placeholder{color:#c5c4af}.res{background:var(--paper);color:var(--ink);max-height:65vh;overflow:auto}
.midnight-hero{position:relative;background:#0c1110;min-height:640px;color:var(--paper);isolation:isolate;overflow:hidden;border-bottom:7px solid var(--yellow)}.hero-art{position:absolute;inset:0;z-index:-2;background:url('/assets/skitfilm/midnight-monsters.webp') center 45%/cover no-repeat}.midnight-hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(6,11,8,.18),rgba(6,11,8,.6) 38%,rgba(6,11,8,.6) 62%,rgba(6,11,8,.1)),linear-gradient(0deg,#0b110ed9,transparent 25%,transparent 80%,#0b110eaa)}.hero-topline,.hero-bottomline{display:flex;justify-content:space-between;gap:20px;padding:18px 35px;font:10px var(--mono);letter-spacing:.13em}.hero-topline{border-bottom:1px solid #ffffff40;color:#e4ddbd}.hero-bottomline{position:absolute;bottom:0;left:0;right:0;color:var(--yellow);font-size:11px}.hero-copy{position:relative;text-align:center;padding:48px 20px 90px;max-width:900px;margin:auto}.hero-kicker{font:11px var(--mono);letter-spacing:.17em;color:var(--yellow);margin:0 0 16px}.hero-copy h1{font:1000 clamp(78px,12vw,172px)/.9 var(--body);letter-spacing:-.085em;transform:rotate(-4deg);color:var(--yellow);text-shadow:4px 5px #982d20,7px 8px #080d09;margin:10px 0 24px}.hero-copy h1 span{color:#f5edd0}.hero-copy h1 sup{font:700 16px var(--mono);letter-spacing:-1px;display:inline-block;transform:rotate(90deg);vertical-align:middle;margin-left:5px}.hero-tagline{font:850 clamp(20px,3vw,36px)/1.15 var(--body);letter-spacing:-.035em;margin:0 0 18px}.hero-tagline em{color:var(--yellow);font-family:var(--hand);font-weight:400}.hero-description{font-size:16px;line-height:1.6;color:#e7e2cc;margin:0 0 26px}.hero-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}.btn{font:700 11px var(--mono);padding:16px 22px;letter-spacing:.04em;background:var(--yellow);border:1px solid var(--ink);box-shadow:4px 4px var(--ink);transform:none;border-radius:0}.btn.ghost{transform:none}.hero-actions .btn.ghost{background:#131810cc;color:var(--paper);border-color:var(--paper);box-shadow:4px 4px #000}.hero-seal{position:absolute;right:4%;bottom:75px;background:var(--red);color:#ffefcb;display:grid;place-content:center;text-align:center;width:125px;height:125px;transform:rotate(13deg);border-radius:50%;border:2px dashed #ffefcb;outline:6px solid var(--red);font:9px var(--mono)}.hero-seal span{font:1000 28px/.9 var(--body);letter-spacing:-1px;margin:9px 0}
.trash-genres{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:0;background:var(--yellow);border-bottom:2px solid var(--ink);padding:5px 16px}.trash-genres a,.trash-genres>span{padding:14px 18px;font:700 11px var(--mono);text-decoration:none}.trash-genres>span{font-size:10px;opacity:.65}.trash-genres a:hover{background:var(--ink);color:var(--yellow)}.intro-strip{display:flex;align-items:center;gap:24px;padding-top:27px;padding-bottom:27px;border-bottom:1px solid var(--ink)}.intro-star{font-size:58px;color:var(--red);line-height:1}.intro-strip p{font-size:13px;line-height:1.7;margin:0}.intro-strip strong{font:800 15px var(--body);letter-spacing:.03em}.intro-strip>a{font:10px var(--mono);margin-left:auto;text-underline-offset:4px}
.sec{margin-top:55px;margin-bottom:65px}.sec-head,.sec:nth-of-type(odd) .sec-head{transform:none;border-bottom:2px solid var(--ink);padding:0 0 18px;margin-bottom:25px;align-items:flex-end}.sec-head::before{display:none}.sec-head h2{font:900 clamp(30px,3.3vw,46px)/1 var(--body);letter-spacing:-.05em;text-shadow:none}.sec-head h2 small{font:10px var(--mono);display:block;background:none;padding:0;margin:0 0 12px;color:var(--red);letter-spacing:.12em}.sec-head>a{font:11px var(--mono)}.sec:has(.stk-hd) .sec-head{padding-right:0}.stk{display:none}
.feat{display:grid;grid-template-columns:1.15fr 1fr;border:2px solid var(--ink);box-shadow:7px 7px 0 #b5b09e;background:var(--dark);border-radius:0;overflow:hidden}.feat-pic{min-height:420px}.feat-pic::after{background:linear-gradient(0deg,#0008,transparent 60%)}.feat-pic::before{opacity:.3}.feat-still{filter:saturate(.85) contrast(1.15);width:100%;height:100%;object-fit:cover}.feat-poster{width:145px;bottom:25px;left:25px;box-shadow:6px 6px 0 var(--yellow)}.feat-txt{position:relative;padding:36px 38px}.feat-badge{font:700 10px var(--mono);letter-spacing:.09em;clip-path:none;transform:rotate(-3deg);padding:7px 11px;margin-bottom:22px;background:var(--red);color:var(--paper)}.feat h3{font:1000 clamp(48px,5vw,76px)/.9 var(--body);letter-spacing:-.06em;text-shadow:none}.feat-meta{font:10px var(--mono);color:#bcbca6}.feat-quote{font:700 22px var(--body);border-left:0;color:var(--yellow);padding-left:0}.feat-sum{font-size:14px;color:#dedcc8}.feat .poo.big svg{width:23px;height:23px}.feat-tags a{font:9px var(--mono);border-radius:0}.feat .btn.ghost{box-shadow:none}.osd{font-size:11px}.track{display:none}
.card .art,.toplist .art{border:1px solid var(--ink);box-shadow:4px 4px #c4beaa;border-radius:0}.card:nth-child(odd) .art,.card:nth-child(even) .art,.toplist li:nth-child(odd) .art,.toplist li:nth-child(even) .art{transform:none}.card:hover .art{transform:rotate(-2deg) translateY(-6px);box-shadow:7px 9px var(--ink)}.card b{font:900 17px/1.12 var(--body);letter-spacing:-.025em;margin-top:16px}.card .meta{font:10px var(--mono);margin-top:7px}.card .stamp{font:700 9px var(--mono);background:var(--yellow);padding:6px 9px;top:auto;bottom:12px;left:9px;border:0;transform:rotate(-3deg)}.row,.toplist{gap:26px}.toplist li::before{background:var(--red);color:var(--paper);font:900 26px var(--body);border:2px solid var(--ink);border-radius:0;left:-6px;top:0}.home #soptoppen{padding-top:35px;border-top:1px solid var(--ink)}
.mani{background:var(--yellow);color:var(--ink);margin-top:65px;border-top:3px solid var(--ink);border-bottom:3px solid var(--ink);padding:55px 0}.mani .big{font:1000 clamp(38px,5vw,66px)/.95 var(--body);letter-spacing:-.06em;text-shadow:none}.mani .big>span{font:11px var(--mono);letter-spacing:0;margin-top:20px}.mani p{font-size:16px;line-height:1.7}.site-foot{background:var(--dark);color:var(--paper);margin-top:0;border-top:0}.foot-mural{display:none}.foot-top{padding-top:55px;padding-bottom:40px}.foot-brand .brand{font-size:40px}.site-foot p{color:#bebfac}.foot-col h3{font:700 11px var(--mono);color:var(--yellow);letter-spacing:.08em}.foot-col a{font-size:13px;color:#dedfca}.foot-bottom{border-top:1px solid #454638;color:#aeaf9c;padding-top:20px;padding-bottom:20px;font-size:10px}
.g-hero{background:var(--dark);color:var(--paper);border-bottom:7px solid var(--yellow);padding:55px 0;isolation:isolate}.g-hero::before{opacity:.25;background:linear-gradient(90deg,#11120f,transparent),url('/assets/skitfilm/midnight-monsters.webp') center/cover}.g-hero h1,.rvw-title{font:1000 clamp(42px,6vw,80px)/.95 var(--body);letter-spacing:-.055em;text-shadow:none}.g-kick{color:var(--yellow);font:11px var(--mono)}.g-hero .g-desc{color:#e0deca}.gt{border-radius:0;background:var(--paper);box-shadow:4px 4px var(--ink);min-height:150px;border:2px solid var(--ink)}.gt:nth-child(3n+1){background:var(--yellow)}.gt:nth-child(3n+2){background:#e7a3b3}.gt b{font:900 27px var(--body);letter-spacing:-.04em}.gt small{font:10px var(--mono)}.rvw-head{padding-top:35px;padding-bottom:40px}.rvw-title{color:var(--ink)}.rvw-poster img{box-shadow:8px 8px var(--red);border:2px solid var(--ink)}.review{font-size:17px;line-height:1.85}.review h2{font-family:var(--body);font-weight:900;text-shadow:none;letter-spacing:-.04em}.baksidan{background:var(--yellow);font-family:var(--mono);transform:none}.baksidan dd{font-family:var(--body)}.baksidan::before{display:none}.rvw-main{padding-bottom:60px}.backlink{font:11px var(--mono)}
@media(min-width:1600px){.midnight-hero{min-height:720px}.hero-copy{padding-top:75px}.hero-art{background-position:center 40%}}
@media(max-width:1050px){.top-in{flex-wrap:wrap;gap:18px;padding-top:20px;padding-bottom:16px}.inav{gap:20px}.tsearch{width:100%;order:3}.hero-seal{right:3%;bottom:55px;width:95px;height:95px;font-size:7px}.hero-seal span{font-size:22px}.hero-copy{padding-top:55px}.midnight-hero{min-height:600px}.hero-art{background-position:center}.feat-txt{padding:26px}.feat-pic{min-height:420px}.row,.toplist{gap:18px}.row:not(.grid),.toplist:not(.full){grid-template-columns:repeat(3,minmax(0,1fr))}.intro-strip>a{max-width:160px}.trash-genres a,.trash-genres>span{padding:12px}}
@media(max-width:650px){.top-in{gap:16px;justify-content:space-between}.brand{font-size:29px}.inav{width:100%;order:2;justify-content:space-between;gap:8px;margin:0}.inav a{font-size:9px;padding:8px 0}.tsearch{order:3}.hero-topline{font-size:7px;padding:12px 16px;gap:8px}.hero-topline span:last-child{display:none}.hero-copy{padding:55px 14px 90px}.hero-copy h1{font-size:clamp(68px,17vw,110px);margin:20px 0 26px}.hero-copy h1 sup{font-size:10px;margin-left:0}.hero-kicker{font-size:8px;letter-spacing:.06em}.hero-tagline{font-size:24px}.hero-description{font-size:13px}.midnight-hero{min-height:560px}.midnight-hero::before{background:linear-gradient(0deg,#0c110fe6,transparent 25%,#0c110f88 50%,#0c110f44),linear-gradient(90deg,#0c110f22,#0c110faa 40%,#0c110f66 70%,#0c110f22)}.hero-art{background-size:auto 100%;background-position:center}.hero-seal{display:none}.hero-bottomline{padding:12px 16px;font-size:8px}.hero-bottomline span:last-child{display:none}.hero-actions{gap:10px}.hero-actions .btn{font-size:9px;padding:14px}.trash-genres{justify-content:flex-start;padding:8px}.trash-genres>span{width:100%;padding:6px 10px}.trash-genres a{font-size:9px;padding:10px}.intro-strip{gap:14px;flex-wrap:wrap}.intro-strip p{font-size:11px;flex:1}.intro-strip strong{font-size:12px}.intro-strip>a{max-width:none;width:100%;margin-left:48px;font-size:9px}.intro-star{font-size:36px}.sec{margin-top:35px;margin-bottom:40px}.sec-head{gap:16px}.sec-head h2{font-size:32px}.sec-head h2 small{font-size:8px}.sec-head>a{font-size:9px;max-width:105px}.feat{grid-template-columns:1fr;box-shadow:4px 4px #b5b09e}.feat-pic{min-height:280px;height:280px}.feat-poster{width:105px;left:20px;bottom:20px}.feat-txt{padding:26px 23px}.feat h3{font-size:64px}.feat-badge{margin-bottom:18px}.row:not(.grid),.toplist:not(.full){grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 18px}.card b{font-size:15px}.card .meta{font-size:9px}.mani{padding:35px 0}.mani .wrap{display:block}.mani p{font-size:14px;margin-top:25px}.foot-top{padding-top:35px}.g-hero{padding:35px 0}.rvw-title{font-size:46px}.review{font-size:16px}.rvw-main{padding-bottom:35px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}
.top-in{display:flex}.brand b{font-weight:1000}.sec{padding:0 clamp(16px,3vw,32px)}.tsearch{min-width:0;box-shadow:none}.sec-head>a{white-space:normal}.rvw-head-txt{min-width:0}.feat-tags{margin-top:15px}
@media(max-width:1050px){.top-in{display:flex}.tsearch{margin-bottom:0}.inav{margin-left:auto}}
@media(max-width:650px){.top-in{padding-top:18px}.top .brand{margin-right:auto}.inav{justify-content:space-between;flex-wrap:nowrap}.inav a{padding:8px 0;font-size:9px;letter-spacing:0}.tsearch{margin-bottom:0}.sec-head>a{text-align:right}.hero-copy h1{white-space:nowrap}}

/* Keep every part of the rating manifesto legible on yellow. */
.mani .big,.mani .big span,.mani p,.mani a{color:var(--ink)}
.mani a{text-decoration:underline;text-underline-offset:3px}

/* Illustrated, transparent grindhouse title. Keep the accessible h1. */
.hero-copy h1.hero-wordmark{width:min(100%,780px);height:clamp(110px,17vw,230px);margin:8px auto 24px;transform:none;text-shadow:none;line-height:0;font-size:inherit;letter-spacing:normal}
.hero-wordmark img{width:100%;height:100%;object-fit:contain}
@media(max-width:650px){.hero-copy h1.hero-wordmark{height:auto;aspect-ratio:3/1;margin:20px auto 26px}}
/* Illustrated navigation branding, with the hero left to the monsters. */
.top .brand{display:block;width:210px;flex:0 0 210px;transform:none;line-height:0}
.top .brand img{width:100%;height:auto}
.home .hero-copy{padding-top:110px}
.hero-copy h1.sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
/* Browse genres like a wall of lurid video-store artwork. */
.genres:has(.gt-image){grid-template-columns:repeat(3,minmax(0,1fr));gap:25px}
.gt.gt-image{min-height:300px;aspect-ratio:4/3;padding:24px;background:#11120f;color:#fff5dc;isolation:isolate}
.gt.gt-image::before{inset:0;height:auto;background:linear-gradient(180deg,transparent 20%,rgba(8,12,7,.15) 35%,rgba(8,12,7,.93) 100%);opacity:1;z-index:-1}
.gt-image>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 30%;z-index:-2;transition:transform .3s}
.gt-image:hover>img,.gt-image:focus-visible>img{transform:scale(1.06)}
.gt-image .gt-copy{display:block;padding-right:25px}
.gt-image b{display:block;color:#fff5dc;font-size:32px;line-height:1.05;text-shadow:0 2px 6px #000}
.gt-image small{display:inline-block;margin-top:12px;padding:5px 8px;background:var(--yellow);color:var(--ink);font-size:10px}
.gt-image .gt-arrow{position:absolute;right:22px;bottom:25px;color:var(--yellow);font:32px/1 var(--body)}
@media(max-width:1050px){.top .brand{width:190px;flex-basis:190px}.genres:has(.gt-image){grid-template-columns:repeat(2,minmax(0,1fr))}.gt.gt-image{min-height:260px}}
@media(max-width:650px){.top .brand{width:180px;flex-basis:180px}.home .hero-copy{padding-top:100px}.genres:has(.gt-image){gap:16px}.gt.gt-image{min-height:220px;aspect-ratio:3/4;padding:16px 12px}.gt-image b{font-size:23px}.gt-image .gt-arrow{right:12px;bottom:18px;font-size:24px}.gt-image .gt-copy{padding-right:12px}.gt-image small{font-size:9px}}
@media(max-width:360px){.genres:has(.gt-image){grid-template-columns:1fr}.gt.gt-image{aspect-ratio:4/3}}

/* Artwork-only hero: no central copy, controls, or dark text scrim. */
.home .midnight-hero{min-height:0;aspect-ratio:3/1}
.home .midnight-hero::before{display:none}
.home .hero-art{background-size:cover;background-position:center}
.home .hero-topline,.home .hero-bottomline{background:rgba(6,11,8,.65)}
@media(max-width:650px){.home .hero-topline,.home .hero-bottomline{padding:7px 12px;font-size:6px}}
/* Sources stay readable and long cult titles wrap on narrow screens. */
.rvw-title{overflow-wrap:anywhere}
.research-intro{max-width:65ch;margin:0 0 25px;font-size:15px}
.review-sources{margin-top:36px;padding-top:24px;border-top:2px solid var(--ink)}
.review-sources h2{font-size:24px;margin-bottom:15px}
.review-sources p,.review-sources li{font-size:13px;line-height:1.7}
.review-sources ul{padding-left:20px}
.review-sources li{margin-bottom:10px}
.review-sources a{color:var(--ink);text-decoration:underline;text-underline-offset:3px;overflow-wrap:anywhere}
.review-sources .image-credit{font-size:11px;color:var(--dim)}
