:root{
  --canvas:#F4F2ED; --surface:#FFFFFF; --ink:#2B2B2B; --muted:#5A5750;
  --accent:#1F6F78; --rule:#D8D3C8;
  --display:"Oswald","Arial Narrow","Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;
  --body:"Open Sans","Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;
  --serif:"Droid Serif",Georgia,"Hiragino Mincho ProN","Yu Mincho",serif;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{background:var(--canvas);color:var(--ink);font-family:var(--body);font-size:17px;line-height:1.9;
  -webkit-text-size-adjust:100%;}
img,svg{max-width:100%;}
a{color:var(--accent);}
.canvas{width:100%;max-width:1160px;margin:0 auto;padding:0 24px;}

/* 1 visual identity header */
.pb-header{border-bottom:1px solid var(--accent);background:var(--canvas);}
.pb-header .canvas{min-height:78px;display:flex;align-items:center;justify-content:space-between;
  gap:24px;flex-wrap:wrap;padding-top:12px;padding-bottom:12px;}
.brandmark{display:flex;align-items:center;gap:14px;text-decoration:none;color:var(--ink);}
.brandmark img{width:44px;height:44px;display:block;}
.brandname{font-family:var(--display);font-size:30px;letter-spacing:.10em;line-height:1.1;text-transform:none;}
.branddesc{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);display:block;
  margin-top:2px;}
.pb-pagelinks{display:flex;flex-wrap:wrap;gap:8px 22px;}
.pb-pagelinks a{font-size:12px;letter-spacing:.16em;text-transform:uppercase;text-decoration:none;
  color:var(--ink);font-family:var(--body);}
.pb-pagelinks a:hover,.pb-pagelinks a:focus{color:var(--accent);text-decoration:underline;}

/* 2 plain page anchors */
.pb-anchors{border-bottom:1px solid var(--rule);}
.pb-anchors .canvas{padding-top:12px;padding-bottom:12px;}
.pb-anchors .idx{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);
  margin-right:14px;}
.pb-anchors a{color:var(--accent);text-decoration:underline;font-size:13px;letter-spacing:.08em;}
.pb-anchors span.sep{color:var(--rule);padding:0 8px;}

/* 3 image stage and offset panel */
.pb-stage .canvas{padding-top:40px;padding-bottom:56px;}
.stagewrap{position:relative;}
.stagewrap>img{display:block;width:100%;height:420px;object-fit:cover;object-position:center;}
.offsetpanel{background:var(--surface);border:1px solid var(--rule);padding:32px 34px 30px;
  width:520px;max-width:100%;margin:-140px 0 0 auto;position:relative;}
.offsetpanel h1{font-family:var(--display);font-size:46px;line-height:1.14;margin:0 0 14px;font-weight:600;}
.offsetpanel p.intro{font-size:18px;margin:0 0 20px;color:var(--ink);}
.routelink{font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);
  text-decoration:none;border-bottom:1px solid var(--accent);padding-bottom:3px;}

/* 4 shows */
.pb-shows .canvas{padding-bottom:48px;}
.chapter-title{font-family:var(--display);font-size:30px;margin:0 0 6px;font-weight:600;}
.chapter-rule{border:0;border-top:1px solid var(--rule);margin:0 0 28px;}
.showrow{display:flex;gap:28px;padding:26px 0;border-bottom:1px solid var(--rule);align-items:flex-start;}
.showrow:first-of-type{border-top:1px solid var(--rule);}
.showrow img{width:132px;height:132px;flex:0 0 132px;}
.showrow h3{font-family:var(--display);font-size:26px;margin:0 0 4px;font-weight:600;}
.showrow .pull{font-family:var(--serif);font-style:italic;font-size:15px;color:var(--muted);margin:0 0 10px;}
.showrow p{margin:0 0 10px;}
.showmeta{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);}

/* 5 gallery / evidence */
.pb-gallery .canvas{padding-bottom:48px;}
.notegrid{display:grid;grid-template-columns:1fr 1fr;gap:0 40px;}
.noterow{display:flex;gap:16px;padding:20px 0;border-bottom:1px solid var(--rule);align-items:flex-start;}
.noterow img{width:64px;height:64px;flex:0 0 64px;}
.noterow .ep{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);
  display:block;margin-bottom:3px;}
.noterow h3{font-size:18px;margin:0 0 6px;line-height:1.5;font-weight:700;}
.noterow h3 a{color:var(--ink);text-decoration:none;}
.noterow h3 a:hover{color:var(--accent);text-decoration:underline;}
.noterow p{margin:0;font-size:14px;color:var(--muted);line-height:1.75;}

/* 6 listen */
.pb-listen{background:var(--surface);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);}
.pb-listen .canvas{padding:36px 24px;}
.pb-listen ul{list-style:none;margin:0;padding:0;}
.pb-listen li{padding:8px 0;border-bottom:1px solid var(--rule);font-size:15px;}
.pb-listen li:last-child{border-bottom:0;}
.pb-listen li b{font-family:var(--display);font-weight:600;letter-spacing:.04em;margin-right:10px;}

/* 7 footer */
.pb-footer{border-top:1px solid var(--accent);}
.pb-footer .canvas{padding:22px 24px 40px;display:flex;justify-content:space-between;gap:14px;
  flex-wrap:wrap;align-items:baseline;}
.pb-footer .colophon{font-size:12px;letter-spacing:.10em;text-transform:uppercase;color:var(--muted);}
.pb-footer .flinks a{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);
  text-decoration:none;margin-left:18px;}
.pb-footer .flinks a:hover{color:var(--accent);text-decoration:underline;}

/* inner pages */
.pageplate{padding-top:40px;}
.pageplate .plate{display:flex;gap:26px;align-items:flex-end;}
.pageplate .plate img{width:200px;height:200px;flex:0 0 200px;}
.platepanel{background:var(--surface);border:1px solid var(--rule);padding:26px 30px;flex:1 1 auto;}
.platepanel .kicker{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--accent);
  display:block;margin-bottom:8px;}
.platepanel h1{font-family:var(--display);font-size:34px;line-height:1.2;margin:0;font-weight:600;}
.notebody{display:flex;gap:44px;align-items:flex-start;padding:36px 0 8px;}
.notemain{flex:1 1 auto;min-width:0;max-width:41em;}
.notemain p{margin:0 0 20px;}
.notemain h2{font-family:var(--display);font-size:28px;margin:34px 0 12px;font-weight:600;}
.notemain h3{font-size:19px;margin:28px 0 10px;font-weight:700;border-left:3px solid var(--accent);
  padding-left:12px;}
.notemain .pull{font-family:var(--serif);font-style:italic;color:var(--muted);font-size:16px;
  border-left:1px solid var(--rule);padding-left:16px;margin:0 0 20px;}
.notemain ul.note-refs{margin:0 0 22px;padding-left:20px;}
.notemain ul.note-refs li{margin:0 0 6px;font-size:15px;}
.factrail{flex:0 0 226px;background:var(--surface);border:1px solid var(--rule);padding:20px 22px;
  font-size:13px;line-height:1.8;}
.factrail dt{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);
  margin-bottom:2px;}
.factrail dd{margin:0 0 14px;color:var(--ink);}
.factrail dd:last-of-type{margin-bottom:0;}
.related{border-top:1px solid var(--rule);padding:22px 0 8px;display:flex;gap:26px;flex-wrap:wrap;
  font-size:14px;}
.related span.lbl{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);}
.returnlink{padding:6px 0 44px;font-size:13px;letter-spacing:.14em;text-transform:uppercase;}

/* archive pages */
.archiveband{border-bottom:1px solid var(--accent);padding:38px 0 18px;}
.archiveband .kicker{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);
  display:block;margin-bottom:6px;}
.archiveband h1{font-family:var(--display);font-size:38px;margin:0;font-weight:600;line-height:1.2;}
.archiveband p.blurb{margin:12px 0 0;max-width:40em;}
.archiverows{padding:8px 0 40px;}
.arow{display:flex;gap:20px;padding:22px 0;border-bottom:1px solid var(--rule);align-items:flex-start;}
.arow img{width:76px;height:76px;flex:0 0 76px;}
.arow .ep{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);
  display:block;margin-bottom:3px;}
.arow h2{font-size:20px;margin:0 0 6px;font-weight:700;line-height:1.5;}
.arow h2 a{color:var(--ink);text-decoration:none;}
.arow h2 a:hover{color:var(--accent);text-decoration:underline;}
.arow p{margin:0;font-size:14px;color:var(--muted);}
.arow .who{font-size:12px;letter-spacing:.10em;color:var(--muted);margin-top:6px;}

a:focus,button:focus{outline:2px solid var(--accent);outline-offset:2px;}
.notemain a,.archiveband a,.showrow p a{text-decoration:underline;}

@media (max-width:900px){
  .notegrid{grid-template-columns:1fr;gap:0;}
  .notebody{flex-direction:column;gap:26px;}
  .factrail{flex:1 1 auto;width:100%;}
}
@media (max-width:760px){
  body{font-size:16px;}
  .canvas{padding:0 16px;}
  .pb-header .canvas{justify-content:flex-start;}
  .pb-pagelinks{gap:8px 18px;}
  .stagewrap>img{height:230px;}
  .offsetpanel{width:100%;margin:0;border-top:0;}
  .offsetpanel h1{font-size:30px;}
  .chapter-title,.archiveband h1{font-size:24px;}
  .platepanel h1{font-size:24px;}
  .showrow{flex-direction:column;gap:14px;}
  .showrow img{width:96px;height:96px;flex:0 0 96px;}
  .pageplate .plate{flex-direction:column;align-items:stretch;gap:16px;}
  .pageplate .plate img{width:120px;height:120px;flex:0 0 120px;}
  .pb-footer .canvas{flex-direction:column;}
  .pb-footer .flinks a{margin:0 18px 0 0;display:inline-block;}
}