:root{
  --ink:#0B0B0D;          /* title-sequence black */
  --panel:#131318;
  --panel2:#1A1A21;
  --gold:#C9A227;         /* aged Goldfinger gold */
  --gold-dim:#8A6F1C;
  --crimson:#B3172B;      /* blood-drip red */
  --screen:#D8D5CC;       /* silver-screen white */
  --gunmetal:#6E6E76;
  --hair:#26262E;
  --connery:#C9A227; --lazenby:#7FB2C9; --moore:#C97B3A;
  --dalton:#9AA3AD; --brosnan:#4C7DBE; --craig:#B3172B;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto} *{animation:none!important;transition:none!important}}
body{
  background:var(--ink);
  color:var(--screen);
  font-family:'Libre Franklin',sans-serif;
  font-weight:300;
  font-size:15px;
  line-height:1.55;
}
a{color:var(--gold)}

/* ---------- header ---------- */
header{
  padding:56px 32px 36px;
  max-width:1400px;margin:0 auto;
  border-bottom:1px solid var(--hair);
  position:relative;
}
.eyebrow{
  font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.28em;
  text-transform:uppercase;color:var(--gunmetal);margin-bottom:14px;
}
h1{
  font-family:'Oswald',sans-serif;font-weight:600;
  font-size:clamp(38px,6vw,72px);line-height:1.02;
  text-transform:uppercase;letter-spacing:.015em;
}
h1 .red{color:var(--crimson)}
h1 .gold{color:var(--gold)}
.thesis{max-width:640px;margin-top:18px;color:#A6A39B;font-size:15px}
.thesis strong{color:var(--screen);font-weight:600}

/* ---------- leaderboard barrels ---------- */
.leader{
  max-width:1400px;margin:0 auto;padding:34px 32px 8px;
  display:flex;gap:36px;flex-wrap:wrap;align-items:flex-end;
}
.leader h2{
  flex-basis:100%;
  font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.28em;
  text-transform:uppercase;color:var(--gunmetal);font-weight:400;margin-bottom:4px;
}
.barrel-card{display:flex;align-items:center;gap:16px}
.barrel{position:relative;flex:none}
.barrel svg{display:block}
.barrel .score{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-family:'Oswald',sans-serif;font-weight:600;color:var(--gold);
}
.barrel-card .meta .film{
  font-family:'Oswald',sans-serif;font-weight:500;text-transform:uppercase;
  font-size:17px;letter-spacing:.04em;line-height:1.15;
}
.barrel-card .meta .sub{
  font-family:'IBM Plex Mono',monospace;font-size:11px;color:var(--gunmetal);margin-top:3px;
}

/* ---------- controls ---------- */
.controls{
  max-width:1400px;margin:0 auto;padding:26px 32px 18px;
  display:flex;gap:10px;flex-wrap:wrap;align-items:center;
}
.chip{
  font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.1em;
  text-transform:uppercase;
  background:var(--panel);border:1px solid var(--hair);color:#B9B6AE;
  padding:7px 14px;border-radius:2px;cursor:pointer;
  transition:border-color .15s,color .15s;
}
.chip:hover{border-color:var(--gunmetal)}
.chip:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.chip.active{border-color:var(--gold);color:var(--gold)}
.chip .swatch{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:7px;vertical-align:1px}
.controls .spacer{flex:1}
.sortnote{font-family:'IBM Plex Mono',monospace;font-size:11px;color:var(--gunmetal)}

/* ---------- matrix ---------- */
.matrix-wrap{
  max-width:1400px;margin:0 auto 26px;padding:0 32px;
}
.scroller{
  overflow:auto;border:1px solid var(--hair);border-radius:3px;
  max-height:78vh;background:var(--panel);
}
table{border-collapse:separate;border-spacing:0;width:max-content;min-width:100%}
thead th{
  position:sticky;top:0;z-index:3;background:var(--panel2);
  border-bottom:1px solid var(--gold-dim);
  padding:0;
  vertical-align:bottom;
}
thead th.filmhead{
  left:0;z-index:5;text-align:left;padding:10px 14px;
  font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:.22em;
  text-transform:uppercase;color:var(--gunmetal);font-weight:400;
  min-width:230px;
}
th.motif{cursor:pointer}
th.motif .rot{
  writing-mode:vertical-rl;transform:rotate(180deg);
  padding:12px 0 10px;margin:0 auto;
  font-family:'Oswald',sans-serif;font-weight:300;font-size:12.5px;
  letter-spacing:.08em;text-transform:uppercase;color:#B9B6AE;
  height:150px;display:block;white-space:nowrap;
  transition:color .15s;
}
th.motif:hover .rot{color:var(--gold)}
th.motif.sorted .rot{color:var(--gold);font-weight:500}
th.motif{width:44px;min-width:44px}
tbody th{
  position:sticky;left:0;z-index:2;background:var(--panel);
  text-align:left;padding:8px 14px 8px 11px;font-weight:400;
  border-bottom:1px solid var(--hair);
  border-left:3px solid var(--era,#333);
  min-width:230px;
}
tbody th .t{
  font-family:'Oswald',sans-serif;font-weight:500;font-size:14.5px;
  letter-spacing:.05em;text-transform:uppercase;line-height:1.15;
}
tbody th .y{
  font-family:'IBM Plex Mono',monospace;font-size:10.5px;color:var(--gunmetal);
}
td{
  text-align:center;border-bottom:1px solid var(--hair);
  padding:0;height:40px;width:44px;min-width:44px;
}
td .dot{
  display:inline-block;width:11px;height:11px;border-radius:50%;
  background:var(--gold);
  box-shadow:0 0 6px rgba(201,162,39,.35);
}
td.off{background:transparent}
td.off::after{content:"";display:inline-block;width:4px;height:1px;background:#2E2E36}
td.hl{background:rgba(201,162,39,.06)}
td.scorecell{
  min-width:120px;width:120px;padding:0 12px;
}
.scorebar{display:flex;align-items:center;gap:8px}
.scorebar .bar{
  flex:1;height:5px;background:#22222A;border-radius:2px;overflow:hidden;
}
.scorebar .fill{height:100%;background:linear-gradient(90deg,var(--gold-dim),var(--gold))}
.scorebar .n{
  font-family:'IBM Plex Mono',monospace;font-size:12px;font-weight:600;color:var(--gold);
  width:20px;text-align:right;
}
thead th.scorehead{
  min-width:120px;cursor:pointer;padding:10px 12px;text-align:right;
  font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--gunmetal);font-weight:400;
}
thead th.scorehead:hover,thead th.scorehead.sorted{color:var(--gold)}
tfoot td,tfoot th{
  position:sticky;bottom:0;background:var(--panel2);
  border-top:1px solid var(--gold-dim);border-bottom:none;
  font-family:'IBM Plex Mono',monospace;font-size:11.5px;font-weight:600;color:var(--gold);
  height:36px;
}
tfoot th{left:0;z-index:2;text-align:left;padding:8px 14px;
  font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--gunmetal);font-weight:400}
tr.dim{display:none}

/* ---------- repertory company ---------- */
.company{max-width:1400px;margin:0 auto;padding:34px 32px 10px;border-top:1px solid var(--hair)}
.company h2{
  font-family:'Oswald',sans-serif;font-weight:600;font-size:clamp(26px,3.5vw,40px);
  text-transform:uppercase;letter-spacing:.02em;margin-bottom:6px;
}
.company h2 .gold{color:var(--gold)}
.company .lede{max-width:640px;color:#A6A39B;margin-bottom:28px}
.company h3{
  font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.28em;
  text-transform:uppercase;color:var(--gunmetal);font-weight:400;
  margin:34px 0 14px;
}
.strips{border:1px solid var(--hair);border-radius:3px;background:var(--panel);overflow-x:auto}
.striprow{
  display:grid;grid-template-columns:260px 1fr 44px;gap:14px;align-items:center;
  padding:9px 14px;border-bottom:1px solid var(--hair);min-width:720px;
}
.striprow:last-child{border-bottom:none}
.striprow .who .actor{
  font-family:'Oswald',sans-serif;font-weight:500;font-size:14px;
  letter-spacing:.05em;text-transform:uppercase;line-height:1.1;
}
.striprow .who .role{font-family:'IBM Plex Mono',monospace;font-size:10.5px;color:var(--gunmetal)}
.striprow .count{
  font-family:'IBM Plex Mono',monospace;font-size:13px;font-weight:600;color:var(--gold);text-align:right;
}
.slots{display:grid;grid-template-columns:repeat(25,minmax(10px,1fr));gap:3px}
.slot{height:16px;border-radius:1.5px;background:#1F1F27;cursor:pointer;transition:transform .1s}
.slot:hover{transform:scaleY(1.3)}
.slot.on{background:var(--gold);box-shadow:0 0 5px rgba(201,162,39,.3)}
.slot.alt{background:var(--crimson);box-shadow:0 0 5px rgba(179,23,43,.3)}
.slot.colhl{outline:1px solid var(--screen);outline-offset:1px}
.striphead{
  display:grid;grid-template-columns:260px 1fr 44px;gap:14px;align-items:end;
  padding:10px 14px 6px;border-bottom:1px solid var(--gold-dim);min-width:720px;
  position:sticky;top:0;background:var(--panel2);z-index:2;
}
.striphead .labels{display:grid;grid-template-columns:repeat(25,minmax(10px,1fr));gap:3px}
.striphead .lab{
  writing-mode:vertical-rl;transform:rotate(180deg);margin:0 auto;
  font-family:'IBM Plex Mono',monospace;font-size:9.5px;letter-spacing:.05em;
  color:var(--gunmetal);white-space:nowrap;cursor:pointer;padding:2px 0;
  transition:color .15s;
}
.striphead .lab:hover,.striphead .lab.colhl{color:var(--gold)}
.striphead .cap{
  font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:.22em;
  text-transform:uppercase;color:var(--gunmetal);align-self:end;padding-bottom:2px;
}
.readout{
  margin-top:12px;padding:10px 14px;border:1px solid var(--hair);border-radius:3px;
  background:var(--panel);font-size:13px;color:#B9B6AE;min-height:41px;
}
.readout .film{color:var(--gold);font-family:'Oswald',sans-serif;font-weight:500;
  letter-spacing:.05em;text-transform:uppercase}
.readout .who{color:var(--screen);font-weight:600}
.slot-legend{
  display:flex;gap:18px;margin:10px 2px 0;flex-wrap:wrap;
  font-family:'IBM Plex Mono',monospace;font-size:10.5px;color:var(--gunmetal);
}
.slot-legend .k{display:inline-block;width:10px;height:10px;border-radius:1.5px;margin-right:6px;vertical-align:-1px}
.dips{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
.dip{
  background:var(--panel);border:1px solid var(--hair);border-radius:3px;padding:14px 16px;
}
.dip .actor{
  font-family:'Oswald',sans-serif;font-weight:500;font-size:15px;
  letter-spacing:.05em;text-transform:uppercase;
}
.dip .path{margin-top:6px;font-size:13px;color:#B9B6AE;line-height:1.5}
.dip .path .r{color:var(--screen);font-weight:600}
.dip .path .f{font-family:'IBM Plex Mono',monospace;font-size:11px;color:var(--gunmetal)}
.dip .path .arrow{color:var(--crimson);padding:0 4px}
.dip .note{margin-top:7px;font-size:11.5px;color:var(--gunmetal);font-style:italic}
.lineages .lin{
  background:var(--panel);border:1px solid var(--hair);border-radius:3px;
  padding:14px 16px;margin-bottom:10px;
}
.lin .rolename{
  font-family:'Oswald',sans-serif;font-weight:500;font-size:15px;letter-spacing:.06em;
  text-transform:uppercase;color:var(--gold);margin-bottom:8px;
}
.lin .chain{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.lin .actorchip{
  border:1px solid var(--hair);border-radius:2px;padding:5px 10px;background:var(--panel2);
  font-size:12.5px;
}
.lin .actorchip b{font-weight:600;color:var(--screen)}
.lin .actorchip span{font-family:'IBM Plex Mono',monospace;font-size:10.5px;color:var(--gunmetal);display:block}
.lin .chev{color:var(--crimson);font-family:'Oswald',sans-serif}
@media (max-width:720px){
  .company{padding:28px 18px 10px}
  .striprow{grid-template-columns:150px 1fr 36px;gap:8px}
}

/* ---------- world map ---------- */
.mapsec{max-width:1400px;margin:0 auto;padding:34px 32px 10px;border-top:1px solid var(--hair)}
.mapsec h2{font-family:'Oswald',sans-serif;font-weight:600;font-size:clamp(26px,3.5vw,40px);
  text-transform:uppercase;letter-spacing:.02em;margin-bottom:6px}
.mapsec h2 .gold{color:var(--gold)}
.mapsec .lede{max-width:660px;color:#A6A39B;margin-bottom:18px}
.mapbox{border:1px solid var(--hair);border-radius:3px;background:#BFD9E8;position:relative;overflow:hidden}
#worldmap{display:block;width:100%;height:auto;cursor:grab;touch-action:none;background:#BFD9E8}
#worldmap:active{cursor:grabbing}
#worldmap .land{fill:#EAE3D2;stroke:#CFC7B2;stroke-width:.6}
#worldmap .grat{stroke:#A9C8DB;stroke-width:.5}
.mk{cursor:pointer}
.mk circle{transition:r .12s;stroke:#F6F2E7;stroke-width:.8}
.mk.real circle{fill:#B8901F}
.mk.fict circle{fill:var(--crimson)}
.mk.stand circle{fill:#5E6673}
.mk.shoot circle{fill:#2C6E99}
.mk text{
  font-family:'IBM Plex Mono',monospace;fill:#2A2721;paint-order:stroke;
  stroke:#F2EDE0;stroke-width:2.5;pointer-events:none;opacity:0;
}
.mk.sel text,.mk:hover text{opacity:1}
.mk.sel circle{stroke:#14120F;stroke-width:1.4}
.mapctl{position:absolute;top:10px;right:10px;display:flex;flex-direction:column;gap:6px;z-index:4}
.mapctl button{
  width:32px;height:32px;border:1px solid var(--hair);background:var(--panel2);
  color:var(--screen);font-size:17px;border-radius:2px;cursor:pointer;font-family:'IBM Plex Mono',monospace;
}
.mapctl button:hover{border-color:var(--gold);color:var(--gold)}
.mapreadout{
  margin-top:12px;padding:12px 14px;border:1px solid var(--hair);border-radius:3px;
  background:var(--panel);font-size:13px;color:#B9B6AE;min-height:46px;
}
.mapreadout .place{color:var(--gold);font-family:'Oswald',sans-serif;font-weight:500;
  letter-spacing:.05em;text-transform:uppercase;font-size:15px}
.mapreadout .tag{
  font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:.14em;text-transform:uppercase;
  border:1px solid var(--hair);border-radius:2px;padding:2px 7px;margin-left:8px;vertical-align:2px;
}
.mapreadout .tag.fict{color:var(--crimson);border-color:var(--crimson)}
.mapreadout .tag.real{color:var(--gold);border-color:var(--gold-dim)}
.mapreadout .tag.stand{color:#8C93A8;border-color:#8C93A8}
.mapreadout .tag.shoot{color:#7FB2C9;border-color:#7FB2C9}
.mapreadout .films{font-family:'IBM Plex Mono',monospace;font-size:11.5px;color:var(--gunmetal);margin-top:4px}
.filmkey{
  margin-top:14px;border:1px solid var(--hair);border-radius:3px;background:var(--panel);
  padding:16px 18px;
}
.filmkey h4{
  font-family:'IBM Plex Mono',monospace;font-size:10.5px;letter-spacing:.24em;
  text-transform:uppercase;color:var(--gunmetal);font-weight:400;margin-bottom:12px;
}
.filmkey .cols{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));
  gap:4px 22px;
}
.filmkey .k{
  display:flex;gap:10px;align-items:baseline;font-size:12.5px;color:#B9B6AE;
  padding:2px 0;
}
.filmkey .k .code{
  font-family:'IBM Plex Mono',monospace;font-weight:600;font-size:11px;
  color:var(--gold);min-width:64px;
}
.filmkey .k .yr{font-family:'IBM Plex Mono',monospace;font-size:10.5px;color:var(--gunmetal)}
.filmkey .k .yt{
  font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:.08em;
  color:var(--crimson);text-decoration:none;margin-left:auto;white-space:nowrap;
  border:1px solid transparent;border-radius:2px;padding:1px 6px;
}
.filmkey .k .yt:hover{border-color:var(--crimson)}
.filmkey .note{margin-top:12px;font-size:11.5px;color:var(--gunmetal);font-style:italic}
.miniplayer{
  position:fixed;right:18px;bottom:18px;z-index:50;
  background:var(--panel2);border:1px solid var(--gold-dim);border-radius:4px;
  padding:8px;box-shadow:0 8px 30px rgba(0,0,0,.55);
  width:316px;max-width:calc(100vw - 36px);
}
.miniplayer .bar{
  display:flex;align-items:center;gap:8px;margin-bottom:6px;
}
.miniplayer .now{
  flex:1;font-family:'IBM Plex Mono',monospace;font-size:10.5px;letter-spacing:.08em;
  color:var(--gold);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.miniplayer .x{
  background:none;border:1px solid var(--hair);border-radius:2px;color:var(--screen);
  font-family:'IBM Plex Mono',monospace;font-size:11px;cursor:pointer;padding:2px 8px;
}
.miniplayer .x:hover{border-color:var(--crimson);color:var(--crimson)}
.miniplayer iframe{display:block;width:300px;height:169px;max-width:100%;border:0;border-radius:2px}

/* ---------- footnote ---------- */
.foot{
  max-width:1400px;margin:0 auto;padding:6px 32px 60px;
  color:var(--gunmetal);font-size:12.5px;max-width:1400px;
}
.foot p{max-width:720px}

@media (max-width:720px){
  header{padding:40px 18px 26px}
  .leader,.controls,.matrix-wrap,.foot{padding-left:18px;padding-right:18px}
  tbody th,thead th.filmhead{min-width:160px}
  .barrel-card .meta .film{font-size:14px}
}

/* ---------- site nav ---------- */
.sitenav{max-width:1400px;margin:0 auto;padding:14px 32px;display:flex;gap:4px;flex-wrap:wrap;
  border-bottom:1px solid var(--hair);align-items:center}
.sitenav .brand{font-family:'Oswald',sans-serif;font-weight:600;text-transform:uppercase;
  letter-spacing:.06em;color:var(--screen);text-decoration:none;margin-right:18px;font-size:15px}
.sitenav .brand .g{color:var(--gold)}
.sitenav a.nl{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.12em;
  text-transform:uppercase;color:#B9B6AE;text-decoration:none;padding:6px 11px;border-radius:2px;
  border:1px solid transparent}
.sitenav a.nl:hover{color:var(--gold)}
.sitenav a.nl.here{border-color:var(--gold-dim);color:var(--gold)}
.pagehead{max-width:1400px;margin:0 auto;padding:40px 32px 8px}
.pagehead h1{font-family:'Oswald',sans-serif;font-weight:600;font-size:clamp(30px,4.5vw,52px);
  text-transform:uppercase;letter-spacing:.02em}
.pagehead h1 .gold{color:var(--gold)}.pagehead h1 .red{color:var(--crimson)}
.pagehead .lede{max-width:660px;color:#A6A39B;margin-top:12px}
.idxgrid{max-width:1400px;margin:0 auto;padding:26px 32px 40px;display:grid;
  grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px}
.idxcard{display:block;background:var(--panel);border:1px solid var(--hair);border-radius:3px;
  padding:18px;text-decoration:none;transition:border-color .15s}
.idxcard:hover{border-color:var(--gold-dim)}
.idxcard .t{font-family:'Oswald',sans-serif;font-weight:500;font-size:17px;letter-spacing:.05em;
  text-transform:uppercase;color:var(--gold)}
.idxcard .d{color:#A6A39B;font-size:13px;margin-top:7px;line-height:1.5}
@media (max-width:720px){.sitenav,.pagehead,.idxgrid{padding-left:18px;padding-right:18px}}