/* THE READING ROOM / the living index, opened to a page. */
#reader .reader__bar,#booking .reader__bar{
  background:#11120f;color:#f0ece2;border-bottom:1px solid #37382f;
  display:grid;grid-template-columns:minmax(0,1fr) auto;gap:30px;
  min-height:76px;padding:0 clamp(24px,4.5vw,72px)
}
#reader .reader__bar :is(a,button),#booking .reader__bar :is(a,button){color:#f0ece2}
#reader .reader__brand,#booking .reader__brand{font:800 22px/1.02 var(--display);letter-spacing:-.045em;max-width:13ch}
#reader .reader__actions,#booking .reader__actions{gap:25px}
#reader .reader__bar :is(a,button):hover,#booking .reader__bar :is(a,button):hover{color:#fa4b2a}
#reader .reader__bar :focus-visible,#booking .reader__bar :focus-visible{outline-color:#fa4b2a}
#reader .reader__progress{height:3px;background:#fa4b2a}
#reader .theme-switch{min-height:48px}
#reader #themeIcon{color:#fa4b2a}
#reader .reader__page,#booking .reader__page{width:min(calc(100% - var(--gutter)*2),1100px);padding:58px 0 85px}
#reader .reader__kicker,#booking .reader__kicker{font:500 12px/1.5 var(--sans);letter-spacing:.065em;text-transform:uppercase;margin-bottom:23px}
#reader[data-view="essay"] .reader__kicker{display:flex;align-items:center;gap:15px}
#reader[data-view="essay"] .reader__kicker::before{content:"";flex:none;width:29px;height:3px;background:var(--pen)}
#reader[data-view="essay"] .reader__title{
  max-width:20ch;font:800 clamp(46px,5.8vw,83px)/1.01 var(--display);
  letter-spacing:-.055em;text-wrap:balance;overflow-wrap:normal
}
#reader[data-view="essay"] .reader__deck{max-width:49ch;font:400 clamp(24px,2.3vw,29px)/1.37 var(--serif);margin-top:25px}
#reader[data-view="essay"] .byline{font:500 12px/1.5 var(--sans);letter-spacing:.025em;margin-top:25px}
#reader[data-view="essay"] .reader__rule{margin:36px 0 46px;border-color:var(--line)}
#reader[data-view="essay"] .reader__body{max-width:700px;font:400 22px/1.72 var(--serif);letter-spacing:0;text-transform:none}
#reader[data-view="essay"] .reader__body p{margin-bottom:27px}
#reader[data-view="essay"] .reader__body :is(h1,h2,h3,h4,h5,h6){
  font-family:var(--display);font-weight:800;line-height:1.2;letter-spacing:-.025em;
  color:var(--ink);margin:43px 0 17px;text-wrap:pretty;overflow-wrap:break-word
}
#reader[data-view="essay"] .reader__body h1{font-size:40px;line-height:1.1;margin-top:52px}
#reader[data-view="essay"] .reader__body h2{font-size:35px;line-height:1.15;margin-top:48px}
#reader[data-view="essay"] .reader__body h3{font-size:31px;line-height:1.18}
#reader[data-view="essay"] .reader__body h4{font-size:28px}
#reader[data-view="essay"] .reader__body h5{font-size:25px;margin-top:36px}
#reader[data-view="essay"] .reader__body h6{font-size:23px;margin-top:32px}
#reader[data-view="essay"] .reader__body :is(h1,h2,h3,h4,h5,h6):first-child{margin-top:0}
#reader[data-view="essay"] .reader__body :is(h1,h2,h3,h4,h5,h6)+:is(h1,h2,h3,h4,h5,h6){margin-top:17px}
#reader[data-view="essay"] .reader__body blockquote{border-left:3px solid var(--pen);padding-left:26px}
#reader[data-view="essay"] .reader__end,#reader[data-view="essay"] .reader__next,#reader[data-view="essay"] .reader__subscribe{max-width:700px;margin-inline:auto}
#reader[data-view="essay"] .reader__end{font:400 25px/1.3 var(--serif);margin-top:42px;margin-bottom:39px}
#reader[data-view="essay"] .reader__next{border-top:2px solid var(--ink);padding-top:20px;margin-top:35px}
#reader[data-view="essay"] .reader__next-head{font:500 12px/1.5 var(--sans);color:var(--muted);margin-bottom:5px;text-transform:uppercase;letter-spacing:.055em}
#reader[data-view="essay"] .reader__next .also-row{position:relative;padding:22px 45px 25px 70px}
#reader[data-view="essay"] .reader__next .also-row::before{content:attr(data-issue);position:absolute;left:0;top:20px;font:800 37px/1 var(--display);letter-spacing:-.06em;color:var(--pen)}
#reader[data-view="essay"] .reader__next .also-row__arrow{position:absolute;right:0;top:21px;width:27px;height:27px;color:var(--pen)}
#reader[data-view="essay"] .reader__next .also-row__title{font:800 31px/1.08 var(--display);letter-spacing:-.04em}
#reader[data-view="essay"] .reader__next .also-row__desc{font:400 20px/1.4 var(--serif)}
#reader[data-view="essay"] .reader__subscribe{margin-top:30px;padding:23px 25px;border-left:3px solid var(--pen);font:400 18px/1.6 var(--serif)}

/* An index, rather than an oversized article carrying a search box. */
#reader[data-view="archive"]{overflow-y:scroll}
@supports(scrollbar-gutter:stable){
  #reader[data-view="archive"]{overflow-y:auto;scrollbar-gutter:stable}
}
#reader[data-view="archive"] .morgue-results{min-height:100vh;min-height:100svh;overflow-anchor:none}
#reader[data-view="archive"] .reader__page{width:min(calc(100% - var(--gutter)*2),1130px);padding-top:52px}
#reader[data-view="archive"] .reader__kicker{color:var(--pen);margin-bottom:16px}
#reader[data-view="archive"] .reader__title{font:800 clamp(64px,9vw,126px)/.94 var(--display);letter-spacing:-.065em;max-width:12ch;text-wrap:normal}
#reader[data-view="archive"] .reader__deck{font:400 25px/1.35 var(--serif);margin-top:23px}
#reader[data-view="archive"] .reader__rule{margin:29px 0 0}
#reader[data-view="archive"] .reader__body{max-width:none;font:400 20px/1.5 var(--serif)}
#reader[data-view="archive"] .morgue-search{margin:0;padding:27px 0 32px;border-bottom:1px solid var(--line)}
.morgue-search__top{display:flex;justify-content:space-between;align-items:baseline;gap:20px;margin-bottom:14px}
#reader[data-view="archive"] .morgue-search label{margin:0;font:500 12px/1.5 var(--sans);letter-spacing:.035em}
.morgue-count{font:400 12px/1.5 var(--sans);color:var(--muted);white-space:nowrap}
#reader[data-view="archive"] .morgue-search input{border:0;border-bottom:2px solid var(--ink);padding:11px 0 16px;font:500 clamp(23px,3vw,36px)/1.2 var(--display);letter-spacing:-.03em;background:transparent}
#reader[data-view="archive"] .morgue-search input::placeholder{color:var(--muted);opacity:.82}
#reader[data-view="archive"] .morgue-row{display:grid;grid-template-columns:68px minmax(0,1fr) 35px;gap:0 26px;position:relative;padding:30px 0!important;border-bottom:1px solid var(--line);transition:color .2s,background .2s}
#reader[data-view="archive"] .morgue-row::before{content:attr(data-n);grid-column:1;grid-row:1/4;font:800 32px/1 var(--display);letter-spacing:-.05em;color:var(--pen);padding-top:3px;white-space:nowrap;font-variant-numeric:tabular-nums}
#reader[data-view="archive"] .morgue-row::after{content:none}
#reader[data-view="archive"] .morgue-row .also-row__arrow{grid-column:3;grid-row:1/4;align-self:center;width:29px;height:29px;color:var(--pen)}
.also-row__arrow .icon{width:100%;height:100%}
#reader[data-view="archive"] .morgue-row .also-row__meta{grid-column:2;margin:0 0 11px;font:400 12px/1.5 var(--sans);letter-spacing:.015em;color:var(--muted)}
#reader[data-view="archive"] .morgue-row .also-row__title{grid-column:2;font:800 clamp(28px,3.1vw,43px)/1.08 var(--display);letter-spacing:-.04em;text-wrap:pretty}
#reader[data-view="archive"] .morgue-row .also-row__desc{grid-column:2;max-width:62ch;font:400 21px/1.4 var(--serif);margin-top:12px}
#reader[data-view="archive"] .morgue-row:hover .also-row__title{color:var(--pen)}
#reader[data-view="archive"] .reader__end{display:none}
#reader[data-view="archive"] .reader__subscribe{border-top:2px solid var(--ink);background:transparent;padding:24px 0;margin-top:34px;font:400 21px/1.45 var(--serif)}
#reader[data-view="archive"] :is(.reader__body,.morgue-results)>.booking__status{padding:30px 0 15px;font:400 23px/1.4 var(--serif)}

/* The appointment desk uses exactly the availability the calendar offers. */
#booking .reader__page{max-width:1060px}
#booking .reader__kicker{margin-bottom:17px}
#booking .reader__title{font:800 clamp(58px,8vw,109px)/.98 var(--display);letter-spacing:-.065em;max-width:14ch;text-wrap:balance}
#booking .reader__deck{max-width:39ch;font:400 27px/1.35 var(--serif);margin-top:25px}
#booking #bookingDeck{max-width:67ch;font:400 14px/1.6 var(--sans);padding-left:16px;border-left:3px solid var(--pen);margin:27px 0 0}
#booking .reader__rule{margin:30px 0 28px}
#booking #bookingBody{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:start}
#booking .slot-day{margin:0;padding:23px;border:1px solid var(--line);background:var(--panel)}
#booking .slot-day__head{font:600 13px/1.5 var(--sans);letter-spacing:.025em;text-transform:uppercase;margin-bottom:18px;color:var(--ink)}
#booking .slot-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
#booking .slot{min-width:0;min-height:49px;padding:12px 8px;font:500 14px/1.3 var(--sans);background:var(--paper);border:1px solid var(--line);color:var(--ink);transition:background .18s,border-color .18s,color .18s}
#booking .slot:hover,#booking .slot[aria-pressed="true"]{background:#fa4b2a;border-color:#fa4b2a;color:#11120f}
#booking .booking-form{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:14px 0 0;padding:29px 0 0;border-top:2px solid var(--ink);scroll-margin-top:90px}
#booking .booking-form__slot{grid-column:1/-1;font:600 14px/1.5 var(--sans);padding:0 0 16px;border-bottom:1px solid var(--line);color:var(--ink)}
#booking .booking-form .field:has(textarea){grid-column:1/-1}
#booking .field label{font:500 12px/1.5 var(--sans);letter-spacing:.025em;margin-bottom:9px}
#booking .field input,#booking .field textarea{border:1px solid var(--line);background:transparent;padding:14px 15px;font:400 17px/1.5 var(--sans)}
#booking .field textarea{min-height:124px}
#booking .booking-form .booking-submit{min-height:52px;min-width:185px;padding:15px 21px;background:var(--ink);color:var(--paper);border:1px solid var(--ink);font:500 14px/1.5 var(--sans)}
#booking .booking-submit{display:inline-flex;gap:20px;align-items:center;justify-content:space-between}
#booking .booking-form .booking-submit:hover{background:#fa4b2a;border-color:#fa4b2a;color:#11120f}
#booking .booking-error{grid-column:1/-1;margin:0;font:400 15px/1.6 var(--sans)}
#booking .booking-confirm{grid-column:1/-1;max-width:25ch;font:800 clamp(30px,4vw,50px)/1.15 var(--display);letter-spacing:-.04em;padding:12px 0 25px}
#booking #bookingBody>.booking__status,#booking #bookingBody>.reader__end{grid-column:1/-1}

@media(max-width:760px){
  #reader .reader__bar,#booking .reader__bar{min-height:68px;padding-inline:17px;gap:15px}
  #reader .reader__brand,#booking .reader__brand{font-size:18px;max-width:10ch}
  #reader .reader__actions,#booking .reader__actions{gap:14px}
  #reader .reader__archive,#reader .reader__share,#reader .reader__close,#booking .reader__close{font-size:12px;padding:7px 0;min-height:48px}
  #reader .theme-switch{min-width:31px;padding-inline:0}
  #reader .reader__page,#booking .reader__page{width:calc(100% - 44px);padding:35px 0 60px}
  #reader[data-view="essay"] .reader__title{font-size:clamp(38px,7.2vw,54px);line-height:1.035;letter-spacing:-.045em}
  #reader .reader__kicker,#booking .reader__kicker{font-size:11px;margin-bottom:19px}
  #reader[data-view="essay"] .reader__deck{font-size:24px;line-height:1.35;margin-top:21px}
  #reader[data-view="essay"] .byline{margin-top:21px;font-size:12px}
  #reader[data-view="essay"] .reader__rule{margin:27px 0 29px}
  #reader[data-view="essay"] .reader__body{font-size:21px;line-height:1.66}
  #reader[data-view="essay"] .reader__body :is(h1,h2,h3,h4,h5,h6){margin-top:35px;margin-bottom:15px}
  #reader[data-view="essay"] .reader__body h1{font-size:35px}
  #reader[data-view="essay"] .reader__body h2{font-size:31px}
  #reader[data-view="essay"] .reader__body h3{font-size:28px}
  #reader[data-view="essay"] .reader__body h4{font-size:25px}
  #reader[data-view="essay"] .reader__body h5{font-size:23px}
  #reader[data-view="essay"] .reader__body h6{font-size:22px}
  #reader[data-view="essay"] .reader__next .also-row{padding-left:48px;padding-right:27px}
  #reader[data-view="essay"] .reader__next .also-row::before{font-size:29px}
  #reader[data-view="essay"] .reader__next .also-row__title{font-size:27px}
  #reader[data-view="essay"] .reader__subscribe{padding:21px;font-size:18px}
  #reader[data-view="archive"] .reader__page{width:calc(100% - 44px);padding-top:34px}
  #reader[data-view="archive"] .reader__title{font-size:clamp(61px,10vw,86px);line-height:.96}
  #reader[data-view="archive"] .reader__deck{font-size:23px;margin-top:20px}
  #reader[data-view="archive"] .morgue-search{padding:22px 0 26px}
  .morgue-search__top{gap:10px;margin-bottom:9px}
  #reader[data-view="archive"] .morgue-search label,.morgue-count{font-size:11px}
  #reader[data-view="archive"] .morgue-search input{font-size:24px;padding-bottom:13px}
  #reader[data-view="archive"] .morgue-row{grid-template-columns:31px minmax(0,1fr) 20px;gap:0 13px;padding:25px 0!important}
  #reader[data-view="archive"] .morgue-row::before{font-size:24px;padding-top:0}
  #reader[data-view="archive"] .morgue-row .also-row__arrow{width:23px;height:23px;align-self:start;margin-top:33px}
  #reader[data-view="archive"] .morgue-row .also-row__meta{font-size:11px;line-height:1.5;margin-bottom:10px}
  #reader[data-view="archive"] .morgue-row .also-row__title{font-size:27px;line-height:1.1;letter-spacing:-.035em}
  #reader[data-view="archive"] .morgue-row .also-row__desc{font-size:19px;line-height:1.4;margin-top:12px}
  #booking .reader__title{font-size:clamp(54px,10vw,78px);line-height:.98}
  #booking .reader__deck{font-size:25px;margin-top:22px}
  #booking #bookingDeck{font-size:13px;margin-top:24px;padding-left:13px}
  #booking #bookingBody{grid-template-columns:1fr;gap:15px}
  #booking .slot-day{padding:21px 19px}
  #booking .slot-day__head{font-size:12px;margin-bottom:15px}
  #booking .slot{font-size:13px;min-height:48px}
  #booking .booking-form{grid-template-columns:1fr;gap:21px;margin-top:12px;padding-top:24px}
  #booking .booking-form>*{grid-column:1}
  #booking .booking-confirm{font-size:32px}
}
@media(max-width:370px){
  #reader .reader__bar,#booking .reader__bar{padding-inline:12px;gap:10px}
  #reader .reader__brand,#booking .reader__brand{font-size:16px;max-width:9ch}
  #reader .reader__actions,#booking .reader__actions{gap:10px}
  #reader .reader__archive,#reader .reader__share,#reader .reader__close,#booking .reader__close{font-size:11px}
  #reader .theme-switch{min-width:25px}
  #reader .reader__page,#reader[data-view="archive"] .reader__page,#booking .reader__page{width:calc(100% - 38px)}
  #reader[data-view="essay"] .reader__title{font-size:35px}
  #reader[data-view="essay"] .reader__deck{font-size:22px}
  #reader[data-view="essay"] .reader__body{font-size:20px;line-height:1.66}
  #reader[data-view="archive"] .morgue-row{grid-template-columns:25px minmax(0,1fr) 16px;gap:0 10px}
  #reader[data-view="archive"] .morgue-row .also-row__title{font-size:24px}
  #reader[data-view="archive"] .morgue-row .also-row__desc{font-size:18px}
  #reader[data-view="archive"] .morgue-search input{font-size:22px}
  #booking .reader__title{font-size:49px}
}
@media print{
  #reader[data-view="archive"]{overflow:visible;scrollbar-gutter:auto}
  #reader[data-view="archive"] .morgue-results{min-height:0}
  #reader .reader__bar,#booking .reader__bar{display:none}
  #reader .reader__page,#reader[data-view="archive"] .reader__page,#booking .reader__page{width:100%;padding:0}
  #reader[data-view="essay"] .reader__title{font-size:32pt;max-width:none}
  #reader[data-view="essay"] .reader__body{font-size:12pt;max-width:none}
}
