@font-face{font-family:"Barlow Condensed";src:url("fonts/barlow-condensed-semibold.ttf") format("truetype");font-weight:600;font-display:swap}
@font-face{font-family:"Literata";src:url("fonts/literata-italic.ttf") format("truetype");font-weight:200 900;font-style:italic;font-display:swap}
@font-face{font-family:"IBM Plex Sans";src:url("fonts/ibm-plex-sans.ttf") format("truetype");font-weight:100 700;font-display:swap}

:root{
  --canvas:#191b23;--surface:#242733;--paper:#f3eddf;--ink:#252732;
  --muted:#b4b5c1;--line:#3c3e4b;--accent:#ffae94;--red:#a63623;
  --sans:"IBM Plex Sans",system-ui,sans-serif;
  --display:"Barlow Condensed","Arial Narrow",sans-serif;
  --serif:"Literata",Georgia,serif;
}
*{box-sizing:border-box}
html{font:100%/1.5 var(--sans);color:var(--paper);background:var(--canvas)}
body{margin:0 auto;max-width:1440px;padding:0 clamp(24px,5vw,76px);border-top:5px solid var(--accent)}
a{color:inherit;text-underline-offset:5px}
a:focus-visible{outline:3px solid var(--accent);outline-offset:6px}
::selection{background:var(--accent);color:var(--canvas)}
.skip{position:absolute;left:24px;top:-100px;padding:12px 18px;background:var(--paper);color:var(--ink);z-index:2}
.skip:focus{top:12px}
.masthead{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:28px 0;border-bottom:1px solid var(--line)}
.name{display:flex;align-items:center;gap:16px;font-size:1.125rem;font-weight:600;text-decoration:none}
.monogram{font:600 2.7rem/.9 var(--display);letter-spacing:-.06em;border-right:1px solid var(--line);padding-right:20px}
.monogram span{color:var(--accent)}
.name-detail{display:block;font-size:.875rem;color:var(--muted);font-weight:400;margin-top:2px}
.repository{font-size:.875rem;color:var(--muted)}
.repository[href]:hover{color:var(--paper)}
.pending{display:flex;align-items:center;gap:9px;padding:8px 13px;border:1px solid var(--line);border-radius:100px;white-space:nowrap}
.pending>span{width:6px;height:6px;background:var(--accent);border-radius:50%}
.intro{display:flex;align-items:baseline;justify-content:space-between;gap:24px;padding:36px 0 30px}
h1{margin:0;font:600 clamp(3rem,5.6vw,5rem)/1.05 var(--display);letter-spacing:-.025em;text-transform:uppercase}
h1>span{font:italic 450 .67em/1.2 var(--serif);text-transform:none;letter-spacing:-.05em;color:var(--accent)}
.collection-count{margin:0;color:var(--muted);font-size:.875rem;white-space:nowrap}
.collection-count>span{color:var(--paper);font-weight:500}
.classroom{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px 28px;margin-bottom:32px;border:1px solid var(--line);border-left:4px solid var(--accent);border-radius:4px;background:var(--surface)}
.classroom-label{margin:0 0 8px;color:var(--accent);font-size:.875rem;font-weight:600}
.classroom h2{max-width:none;font-size:2rem;line-height:1.1}
.classroom p:last-child{max-width:52ch;margin:10px 0 0;color:var(--muted)}
.gallery-launch{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:52px;padding:14px 18px;border:1px solid var(--accent);border-radius:3px;color:var(--canvas);background:var(--accent);font-weight:600;text-decoration:none;flex-shrink:0}
.gallery-launch:hover{background:var(--paper);border-color:var(--paper)}
.gallery-handoff{max-width:640px;margin:clamp(32px,8vh,88px) auto}
.gallery-handoff h1{margin:24px 0}
.gallery-handoff>p{font-size:1rem;line-height:1.7;color:var(--muted)}
.gallery-handoff .gallery-launch{margin:28px 0 16px}
.talk-list{display:grid;gap:32px}
.talk{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);border:1px solid #484955;border-radius:8px;overflow:hidden;box-shadow:0 20px 50px #0003}
.talk-visual{display:flex;flex-direction:column;justify-content:center;gap:26px;min-width:0;padding:clamp(24px,3vw,44px);background:var(--surface)}
.cover-heading,.cover-caption{display:flex;justify-content:space-between;gap:16px;align-items:baseline;font-size:.875rem;color:var(--muted)}
.number{font-weight:500;color:var(--accent)}
.cover{position:relative;display:flex;align-items:center;justify-content:center;aspect-ratio:16/9;background:var(--canvas);border:1px solid #535564;border-radius:3px;box-shadow:0 18px 32px #0005;transform:rotate(-2deg);transition:transform .25s ease,box-shadow .25s ease;text-decoration:none}
.cover img{display:block;width:100%;height:auto;border-radius:2px}
.cover:hover{transform:rotate(0);box-shadow:0 20px 40px #0007}
.cover:focus-visible{transform:rotate(0)}
.cover-open{position:absolute;right:-12px;bottom:-12px;display:grid;place-items:center;width:48px;height:48px;background:var(--accent);color:var(--canvas);border:4px solid var(--surface);border-radius:50%;font-size:1.5rem;line-height:1}
.cover-title{padding:28px;font:600 clamp(2rem,4vw,4rem)/1.1 var(--display);text-transform:uppercase}
.cover-caption{padding-top:4px}
.talk-content{display:flex;flex-direction:column;align-items:flex-start;padding:clamp(28px,3.4vw,48px);background:var(--paper);color:var(--ink)}
.event{margin:0 0 18px;font-size:.875rem;font-weight:600;color:var(--red);letter-spacing:.045em}
h2{margin:0;font:600 clamp(2.6rem,4vw,3.7rem)/.98 var(--display);letter-spacing:-.015em;text-transform:uppercase;max-width:12ch}
h2 a{text-decoration:none}
h2 a:hover{text-decoration:underline;text-decoration-thickness:2px}
.subtitle{margin:14px 0 20px;font:italic 500 1.125rem/1.5 var(--serif)}
.description{margin:0;font-size:1rem;line-height:1.7;color:#52535c;max-width:45ch}
.topics{display:flex;flex-wrap:wrap;gap:7px;list-style:none;padding:0;margin:24px 0 30px}
.topics li{border:1px solid #cbc5ba;border-radius:4px;padding:5px 9px;font-size:.875rem;color:#52535c;line-height:1.35}
.launch{display:flex;align-items:center;justify-content:space-between;gap:32px;width:100%;margin-top:auto;padding:15px 18px;min-height:52px;border-radius:3px;background:var(--red);color:#fff8ed;text-decoration:none;font-size:1rem;font-weight:500;transition:background .2s ease}
.launch>span{font-size:1.4rem;line-height:1}
.launch:hover{background:#802819}
.talk-content a:focus-visible{outline-color:var(--red)}
.notes{display:flex;flex-wrap:wrap;gap:10px 18px;margin-top:20px;font-size:.875rem}
footer{display:flex;justify-content:space-between;gap:28px;margin:38px 0 28px;font-size:.875rem;color:var(--muted)}
footer p{margin:0}
footer p:first-child{font-weight:500;color:var(--paper)}
footer p:first-child span{display:block;margin-top:3px;font-weight:400;color:var(--muted)}
footer p:last-child{text-align:right}

@media(min-width:1450px){body{margin-top:32px;border:1px solid var(--line);border-top:5px solid var(--accent);border-radius:5px}}
@media(max-width:1000px){
  .intro{align-items:flex-start;flex-direction:column;gap:12px}
  .talk{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}
  .talk-visual{padding:24px;gap:24px}
  .talk-content{padding:28px}
}
@media(max-width:760px){
  .classroom{align-items:stretch;flex-direction:column;padding:24px;gap:20px}
  .talk{grid-template-columns:1fr}
  .talk-visual{padding:26px 28px 24px;gap:24px}
  .cover{max-width:600px;width:100%;align-self:center;transform:rotate(-1deg)}
  .talk-content{padding:30px}
  h2{max-width:none;font-size:2.8rem}
  .launch{max-width:360px}
  footer{flex-direction:column;gap:14px}
  footer p:last-child{text-align:left}
}
@media(max-width:480px){
  .masthead{align-items:flex-start;padding:22px 0;gap:16px}
  .monogram{display:none}
  .name-detail{max-width:19ch}
  .pending{padding:6px 9px;font-size:.8125rem}
  h1>span{display:block;margin-top:6px}
  .intro{padding:28px 0 24px}
  .talk-content{padding:24px}
  .talk-visual{padding:22px;gap:22px}
  .cover-caption{flex-wrap:wrap;gap:5px 12px}
  .cover-heading{flex-wrap:wrap;gap:5px 12px}
}
@media(prefers-reduced-motion:reduce){.cover,.launch{transition:none}.cover,.cover:hover,.cover:focus-visible{transform:none}}
@media print{
  html{background:white;color:black}
  body{border:0;padding:0}
  .repository,.skip,.cover-open{display:none}
  .talk{break-inside:avoid;box-shadow:none;border:1px solid #ccc}
  .talk-content,.talk-visual{background:white;color:black}
  .cover{transform:none;box-shadow:none}
  .launch{background:none;color:black;border:1px solid black}
  .name-detail,.collection-count,.collection-count>span,.cover-heading,.cover-caption,.number,footer,footer p:first-child,footer p:first-child span{color:#444}
}
