/* The outer stack never scrolls or clips its loose sheets. Only the front
   sheet scrolls, leaving the paper edges visible throughout the field notes. */
.reader-sheet{display:contents}
#inspect.is-reading{
  --reader-paper:#f6efdf;
  --sheet-back:#e8deca;
  --sheet-middle:#f1e8d6;
  width:min(820px,calc(100% - 100px));
  max-height:none;overflow:visible;isolation:isolate;
  background:none;border:0;border-radius:0;box-shadow:none;
}
#inspect.is-reading::before,#inspect.is-reading::after{
  content:"";position:absolute;inset:5px 3px 0;pointer-events:none;
  background:var(--paper-grain) 0 0/280px,var(--sheet-back);
  background-blend-mode:multiply;
  border:1px solid #fffae899;border-radius:1px 3px 4px 2px;
  box-shadow:0 1px 0 #94856e55,2px 5px 9px #24322b20;
}
#inspect.is-reading::before{z-index:-2;transform:translate(-13px,13px) rotate(-1.8deg)}
#inspect.is-reading::after{
  z-index:-1;transform:translate(13px,23px) rotate(1.25deg);
  background-color:var(--sheet-middle);
  box-shadow:0 1px 0 #94856e55,3px 9px 16px #24322b26;
}
#inspect.is-reading .reader-sheet{
  display:block;position:relative;isolation:isolate;
  max-height:calc(100svh - 108px);overflow:auto;overscroll-behavior:contain;
  background:var(--paper-grain) 0 0/280px,var(--reader-paper);
  background-blend-mode:multiply;
  border:1px solid #fffbee;border-right-color:#c9bda8;
  border-bottom-color:#b7aa94;border-radius:1px 2px 5px 2px;
  box-shadow:1px 1px 0 #fff5e0,2px 2px 0 #a99a8055,0 3px 7px #2c302324,4px 10px 22px #2c302326;
  scrollbar-width:thin;scrollbar-color:#a89a7f66 transparent;
}
#inspect.is-reading .inspect-actions{display:none}
#inspect.is-reading .recap-reader{
  padding:42px 66px 56px;min-height:calc(100svh - 168px);
  background-color:var(--reader-paper);
  background-image:linear-gradient(92deg,#9c815b26,transparent 3.5%,#fffdf433 14%,transparent 60%,#a58d6412 91%,#fff9e973 98.4%,#8a714d33);
  border-radius:0;box-shadow:none;
}
#inspect.is-reading .recap-reader::before,
#inspect.is-reading .recap-navigation::before{
  background:url('assets/paper/paper-fibre-detail.svg') 0 0/320px,var(--paper-grain) 0 0/280px;
  filter:grayscale(.3);mix-blend-mode:multiply;opacity:.82;
}
#inspect.is-reading .recap-reader::after{
  left:0;right:0;bottom:0;height:36px;
  background:linear-gradient(176deg,transparent 30%,#bba47a13 70%,#fff8e86b 94%,#96805c40);
  border-radius:0 0 5px 2px;
}
#inspect.is-reading .recap-navigation{
  isolation:isolate;background-color:var(--reader-paper);
  background-image:linear-gradient(92deg,#9c815b26,transparent 3.5%,#fffdf433 14%,transparent 60%,#a58d6412 91%,#fff9e973 98.4%,#8a714d33);
  border-bottom:1px solid #95836514;border-radius:0;
  box-shadow:inset 0 1px 0 #fffbed;min-height:58px;
}
#inspect.is-reading .reader-authorship{background:#b4a28510;border-left-color:#a57e60}
#inspect.is-reading .postcard-collection{background-color:var(--reader-paper)}
[data-beach-light=dusk] #inspect.is-reading{
  --reader-paper:#363132;--sheet-back:#4b4140;--sheet-middle:#5b4e47;box-shadow:none;
}
[data-beach-light=dusk] #inspect.is-reading .reader-sheet{
  border-color:#b19c7955;border-right-color:#201f20;
  box-shadow:1px 1px 0 #a4947840,0 3px 7px #11151a30,4px 10px 22px #11151a33;
}
[data-beach-light=dusk] #inspect.is-reading::before,
[data-beach-light=dusk] #inspect.is-reading::after{border-color:#b19c7955}
[data-beach-light=dusk] #inspect.is-reading .recap-reader,
[data-beach-light=dusk] #inspect.is-reading .recap-navigation{
  background-image:linear-gradient(92deg,#0002,transparent 4% 90%,#d7ba8d0b 98%,#0003);box-shadow:none;
}
[data-beach-light=dusk] #inspect.is-reading .recap-reader::before,
[data-beach-light=dusk] #inspect.is-reading .recap-navigation::before{opacity:.22;mix-blend-mode:screen}
@media(max-width:700px){
  #inspect.is-reading{width:calc(100% - 46px)}
  #inspect.is-reading .reader-sheet{max-height:calc(100svh - 82px)}
  #inspect.is-reading::before{transform:translate(-6px,8px) rotate(-1.25deg)}
  #inspect.is-reading::after{transform:translate(6px,15px) rotate(1deg)}
  #inspect.is-reading .recap-reader{padding:32px 24px 42px;min-height:calc(100svh - 140px)}
}

/* Uncropped photographs from the talks, with full-size originals available. */
.talk-photos{display:grid;gap:24px;margin:28px 0 36px}
.talk-photo{margin:0;min-width:0}
.talk-photo a{display:block;width:fit-content;max-width:100%;margin:auto}
.talk-photo img{display:block;max-width:100%;width:auto;height:auto;max-height:680px;object-fit:contain;border-radius:2px}
.talk-photo figcaption{margin-top:10px;text-align:center;font-size:14px;line-height:1.5;opacity:.75}
@media(max-width:600px){.talk-photo img{max-height:500px}.talk-photos{gap:20px}}

.tweet-card{border:1px solid color-mix(in srgb,currentColor 16%,transparent);border-radius:12px;padding:18px;margin:24px 0;background:color-mix(in srgb,var(--paper) 35%,transparent)}
.tweet-card .tweet-source{display:flex;align-items:center;gap:10px;text-decoration:none;font-size:14px}.tweet-source img{border-radius:50%}.tweet-source .icon{margin-left:auto;width:16px;height:16px}
.tweet-card p{font-size:16px;white-space:pre-wrap}.tweet-card video{display:block;width:100%;max-height:420px;border-radius:8px;background:#111;margin:14px 0}.tweet-card>a:last-child{font-size:12px;opacity:.7}
#recap-navigation{grid-template-columns:96px 1fr auto 1fr 44px}
.reader-arrows{grid-column:1;display:flex;align-items:center;border:1px solid color-mix(in srgb,currentColor 12%,transparent);border-radius:28px;padding:2px;background:color-mix(in srgb,var(--paper) 25%,transparent)}
.reader-arrows button{width:44px;height:40px;padding:10px;border-radius:50%;background:transparent}.reader-arrows .icon{width:20px;height:20px;stroke-linecap:round;stroke-linejoin:round}
#close-reader{border-radius:50%;width:40px;height:40px}#close-reader .icon{stroke-linecap:round;stroke-linejoin:round}
@media(max-width:600px){#recap-navigation{grid-template-columns:76px 1fr auto 1fr 36px;padding-left:12px;padding-right:12px}.reader-arrows button{width:34px;height:36px;padding:8px}#browse-recaps{gap:5px;font-size:12px}}
#recap-navigation .reader-arrows{border-radius:28px;background:transparent}
#recap-navigation .reader-arrows button{border-radius:50%;background:transparent;border:0;box-shadow:none}
#recap-navigation .reader-arrows button:hover,#recap-navigation #close-reader:hover{background:color-mix(in srgb,currentColor 8%,transparent)}
#recap-navigation #close-reader{border-radius:50%;background:transparent}
