/* TollyScore: printed-annual direction. Brand kept: Anton + Inter, black ground, TollyScore yellow. */
:root{--bg:#111;--t:#1a1a1a;--t2:#222;--ink:#f1f0ed;--mu:#bdbbb6;--ac:#ffc400;--acd:#7a6000;
--m:clamp(16px,2.4vw,32px);--axis:42%;
--s1:13px;--s2:16px;--s3:20px;--s4:clamp(30px,3.4vw,48px);--s5:clamp(52px,8.4vw,132px)}
*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font:var(--s2)/1.5 Inter,system-ui,sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit}img{display:block;max-width:100%;height:auto}
a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid var(--ac);outline-offset:2px}
h1,h2{font-family:Anton,Impact,sans-serif;font-weight:400;letter-spacing:-.01em;line-height:1}
h1{font-size:var(--s5);line-height:.95}h2{font-size:var(--s4)}
.nav{display:flex;align-items:center;justify-content:space-between;padding:20px var(--m)}
.logo{font-family:Anton,Impact,sans-serif;font-size:var(--s3);text-decoration:none;letter-spacing:.01em}.logo b{color:var(--ac);font-weight:400}
.nav nav{display:flex;gap:24px}.nav nav a{text-decoration:none;font-weight:600}.nav nav a:hover{color:var(--ac)}
/* axis layout */
.intro,.films>.ax,.crit,.money2,.fhero{display:grid;grid-template-columns:var(--axis) 1fr;padding:0 var(--m)}
.ax{grid-column:2;min-width:0}.side{grid-column:1;padding-right:clamp(16px,3vw,48px);color:var(--mu)}
.films>.ax{display:block;padding-left:calc(var(--m) + (100% - 2*var(--m))*.42)}
/* masthead mosaic */
.mast{display:grid;grid-template-columns:repeat(6,1fr);height:min(46svh,520px)}
.mt{overflow:hidden;background:var(--t)}.mt img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}.mt:hover img{transform:scale(1.04)}
.tile{background:var(--ac);color:#111;display:flex;flex-direction:column;justify-content:flex-end;padding:20px}
.tile b{font-family:Anton,sans-serif;font-weight:400;font-size:var(--s5);line-height:.9}.tile span{font-size:var(--s2);font-weight:600}
.intro{padding-top:56px;padding-bottom:clamp(96px,12vw,180px)}.intro .side{padding-top:14px}
.lead{font-size:var(--s3);line-height:1.45;max-width:38ch;margin-top:28px}
/* films */
.films h2{margin-bottom:28px}
.controls{display:flex;flex-wrap:wrap;gap:12px 20px;align-items:center;margin-bottom:32px}
.chips,.sorts{display:flex;gap:6px;flex-wrap:wrap;align-items:center}.sorts span{color:var(--mu);margin-right:6px}
.chip,.srt{background:var(--t2);color:var(--ink);border:0;font:600 var(--s2) Inter,sans-serif;padding:0 16px;min-height:44px;cursor:pointer;transition:background .2s,color .2s}
.chip:hover,.srt:hover{background:#333}.chip.on,.srt.on{background:var(--ac);color:#111}
#q{flex:1 1 240px;min-height:44px;background:var(--t2);color:var(--ink);border:0;padding:0 14px;font:var(--s2) Inter,sans-serif}
#q::placeholder{color:var(--mu)}
.list{padding:0 var(--m)}
.row{display:grid;grid-template-columns:80px minmax(0,1.3fr) 120px minmax(0,1.2fr) minmax(0,1.3fr);gap:24px;align-items:center;padding:16px;text-decoration:none;background:var(--bg);transition:background .2s}
.row:nth-child(odd){background:var(--t)}.row:hover{background:var(--t2)}
.row[hidden]{display:none}
.rp img{width:80px;height:120px;object-fit:cover}.rp{width:80px;height:120px;background:var(--t2)}
.rt b{display:block;font-family:Anton,sans-serif;font-weight:400;font-size:clamp(24px,2.2vw,32px);line-height:1.05}.rt span{color:var(--mu)}
.rs b{display:block;font-family:Anton,sans-serif;font-weight:400;font-size:clamp(44px,4vw,60px);line-height:1;color:var(--ac)}.rs span{color:var(--mu)}
.rn{display:flex;flex-direction:column;gap:2px}.rn b{font-weight:800}
.key{padding:20px var(--m) 0;color:var(--mu)}.empty{padding:24px var(--m)}
/* bars */
.bars{display:flex;flex-direction:column;gap:8px}.bar{display:grid;grid-template-columns:64px 1fr auto;gap:10px;align-items:center}
.bl{color:var(--mu)}.bv{font-weight:600;white-space:nowrap}.track{height:10px;background:var(--t2);display:flex}
.track i{display:block;height:100%}.track .b{background:var(--ink)}.track .x{background:var(--ac)}.track .rng{opacity:.45}.track.miss{background:transparent}
.bars.big .track{height:18px}.bars.big{gap:14px;margin:8px 0 28px}
.na{color:var(--mu)}
/* method: full yellow colour page, staircase */
.method{background:var(--ac);color:#111;padding:clamp(96px,12vw,180px) var(--m);margin-top:clamp(96px,12vw,180px);display:grid;grid-template-columns:repeat(8,1fr);column-gap:24px}
.method h2.st{font-size:clamp(34px,4.6vw,76px);line-height:1;grid-column:var(--c) / -1;margin-top:56px}.method h2.st:first-child{margin-top:0}
.method p.st{grid-column:var(--c) / span 3;font-size:var(--s2);margin-top:12px;max-width:40ch;font-weight:600}
.s1{--c:1}.s2{--c:3}.s3{--c:5}.s4{--c:7}.method p.s4{grid-column:5 / -1;padding-left:calc(50% + 12px)}
/* film page */
.fhero{padding-top:24px;padding-bottom:clamp(96px,12vw,160px);align-items:start}
.fp img{width:100%;max-width:420px;aspect-ratio:2/3;object-fit:cover}
.back{display:inline-block;margin-top:32px;font-weight:600;color:var(--mu)}.back:hover{color:var(--ink)}
.agg{display:flex;gap:24px;align-items:flex-start;margin-top:40px;max-width:640px}
.agg>b{font-family:Anton,sans-serif;font-weight:400;font-size:clamp(80px,9vw,140px);line-height:.85;color:var(--ac)}.agg p{padding-top:6px}
.big b{display:block;font-family:Anton,sans-serif;font-weight:400;font-size:clamp(64px,7vw,112px);line-height:.9;color:var(--ink)}.big span{display:block;margin-top:12px;max-width:28ch}
.crit,.money2{padding-bottom:clamp(96px,12vw,180px)}.money2{background:var(--t);padding-top:clamp(80px,10vw,140px)}
.crl{display:flex;flex-direction:column;gap:4px;margin-top:24px;max-width:720px}
.cr{background:var(--t);padding:20px 24px}.crh{display:flex;justify-content:space-between;gap:16px;align-items:baseline}
.crh b{font-size:var(--s3)}.cv{font-family:Anton,sans-serif;font-size:var(--s4);line-height:1;color:var(--ac)}.cv small{font-size:var(--s2);color:var(--mu);font-family:Inter,sans-serif}.cv.off{font:600 var(--s2) Inter,sans-serif;color:var(--mu)}
.cbar{display:block;height:8px;background:var(--t2);margin:12px 0 14px}.cbar i{display:block;height:100%;background:var(--ac)}
blockquote{font-size:var(--s3);line-height:1.45;max-width:56ch}.att{margin-top:10px;color:var(--mu)}.att a{color:var(--ink)}
.nf{margin-top:16px;color:var(--mu)}
.h2b{margin-top:clamp(64px,8vw,112px)}
.imdb{display:flex;gap:24px;align-items:center;margin-top:24px;text-decoration:none;max-width:720px;background:var(--t);padding:20px 24px}
.imdb b{font-family:Anton,sans-serif;font-weight:400;font-size:var(--s5);line-height:.9;color:var(--ink)}.imdb small{font-size:var(--s3);color:var(--mu)}.imdb:hover{background:var(--t2)}
.cite p{margin-top:8px;max-width:60ch}.cite a,.srcs a{font-weight:600}
.srcs{list-style:none;display:flex;flex-wrap:wrap;gap:8px 28px;margin-top:20px;font-size:var(--s3)}
.more{padding:clamp(96px,12vw,180px) var(--m) 0}.more h2{margin-bottom:28px}
.mos{display:grid;grid-template-columns:repeat(4,1fr)}.mini{text-decoration:none;display:block}.mini img{width:100%;aspect-ratio:2/3;object-fit:cover}
.mini span{display:block;padding:12px 4px 0;font-size:var(--s2)}.mini b{font-weight:600}
/* footer */
.foot{margin-top:clamp(96px,12vw,180px);background:#000;padding:56px var(--m) 32px;overflow:hidden}
.fw{font-family:Anton,sans-serif;font-size:min(19.5vw,330px);line-height:.85;letter-spacing:-.01em;color:var(--ac);white-space:nowrap}
.frow{display:grid;grid-template-columns:var(--axis) 1fr;gap:24px;margin-top:72px}
.fsrc{display:flex;flex-direction:column;gap:6px}.fsrc a{font-size:clamp(24px,2.4vw,34px);font-weight:600;text-decoration:none;color:var(--ac)}.fsrc a:hover{text-decoration:underline}
.fnote p{max-width:60ch;margin-bottom:12px}
.flast{display:flex;justify-content:space-between;margin-top:96px;font-size:var(--s1);color:var(--mu)}
/* motion */
.rv.pre{opacity:0;transform:translateY(16px);transition:opacity .6s ease,transform .6s ease}.rv.pre.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto}}
/* phone */
@media (max-width:760px){
:root{--axis:100%}
.intro,.crit,.money2,.fhero,.frow{grid-template-columns:1fr}.ax,.side{grid-column:1}.side{padding-right:0}
.films>.ax{padding-left:var(--m)}
.mast{grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(2,1fr);height:44svh}
.intro{padding-top:32px;padding-bottom:96px}.intro .side{order:2;padding-top:20px}
.list{padding:0}
.row{grid-template-columns:64px 1fr auto;gap:6px 14px;padding:14px var(--m)}
.rp,.rp img{width:64px;height:96px}.rp{grid-row:1 / span 2}
.rt b{font-size:22px}.rs{grid-column:3;grid-row:1;text-align:right}.rs b{font-size:40px}
.rn{grid-column:2 / -1;grid-row:2;font-size:var(--s2)}
.rb2{grid-column:1 / -1}
.bar{grid-template-columns:56px 1fr auto}
.method{grid-template-columns:1fr;padding:96px var(--m)}
.method h2.st{font-size:8.4vw;margin-top:40px;padding-left:var(--i)}.method p.st{grid-column:1;padding-left:var(--i)!important}
.s1{--i:0}.s2{--i:6vw}.s3{--i:12vw}.s4{--i:18vw}.method h2.st,.method p.st{grid-column:1!important}
.fhero{padding-top:8px;grid-template-columns:96px 1fr;column-gap:16px}.fp{grid-column:1;grid-row:1;padding:0}.fhero .ax{grid-column:2;grid-row:1}.fp img{width:96px;aspect-ratio:2/3}.fhero .agg{margin-left:-112px}.fhero .lead{margin-left:-112px}.fhero .back{margin-left:-112px}
.fhero h1{font-size:clamp(36px,10vw,64px);min-height:144px;display:flex;align-items:flex-end}
.agg>b{font-size:88px}.big{margin-bottom:28px}
.cr{padding:16px}.imdb{padding:16px}.imdb b{font-size:64px}
.mos{grid-template-columns:repeat(2,1fr)}
.flast{flex-direction:column;gap:8px}
}
