:root{
    --paper:#F4F2E8;
    --panel:rgba(250,249,242,.72);
    --ink:#343B22;
    --ink-deep:#252B14;
    --muted:#666B4C;
    --hair:#DCD8C6;
    --sun:#A8762A;
    --datecol:9.5rem;
    --hair-soft:#E4E1D3;
    --serif:"Newsreader",Georgia,serif;
    --sans:"Public Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  }

  *{box-sizing:border-box}
  html{-webkit-text-size-adjust:100%}

  body{
    margin:0;
    background-color:var(--paper);
    background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2716%27%20height%3D%2716%27%20viewBox%3D%270%200%2016%2016%27%3E%3Cg%20fill%3D%27none%27%20stroke%3D%27%232A2F16%27%20stroke-width%3D%271%27%20opacity%3D%270.055%27%3E%3Cpath%20d%3D%27M0%202h8M0%206h8M8%2010h8M8%2014h8%27%2F%3E%3Cpath%20d%3D%27M10%200v8M14%200v8M2%208v8M6%208v8%27%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
    background-repeat:repeat;
    color:var(--ink);
    font-family:var(--sans);
    font-size:1.0625rem;
    line-height:1.62;
    font-feature-settings:"tnum" 1;
  }

  .wrap{max-width:44rem;margin:0 auto;padding:0 2rem}

  a{color:var(--ink);text-decoration:underline;text-underline-offset:.18em;
    text-decoration-thickness:.06em;text-decoration-color:#BAB79F}
  a:hover{text-decoration-color:var(--ink)}
  a:focus-visible{outline:2px solid var(--ink);outline-offset:3px;text-decoration:none}

  /* ---------- transition band ---------- */
  .band{
    background:#252B14;
    color:#EFEDDE;
    font-size:.9375rem;
    line-height:1.45;
  }
  .band .wrap{
    display:flex;flex-wrap:wrap;
    gap:.65rem 1.25rem;align-items:center;justify-content:space-between;
    padding-top:.95rem;padding-bottom:.95rem;
  }
  .band p{margin:0;max-width:none}
  .band a{
    display:inline-block;
    background:#F4F2E8;color:#252B14;
    font-weight:600;text-decoration:none;
    padding:.35rem .95rem;white-space:nowrap;
  }
  .band a:hover{background:#FFFFFF;text-decoration:none}
  .band a:focus-visible{outline:2px solid #FFFFFF;outline-offset:3px}

  /* ---------- masthead ---------- */
  .masthead{border-bottom:1px solid var(--hair);background:var(--panel)}
  .masthead .wrap{
    display:flex;flex-wrap:wrap;gap:.75rem 2rem;
    align-items:center;justify-content:space-between;
    padding-top:1.4rem;padding-bottom:1.4rem;
  }
  .wordmark{
    display:inline-block;
    /* the mark and "Limited" are positioned, so room has to be reserved
       for them here; generous rather than exact, to avoid any overlap */
    padding-top:3.1em;
    padding-bottom:2.4em;
    line-height:1.2;
    text-align:center;
  }

  .sr-only{
    position:absolute;
    width:1px;height:1px;
    padding:0;margin:-1px;
    overflow:hidden;
    clip:rect(0,0,0,0);
    white-space:nowrap;
    border:0;
  }

  .wm-limited{
    position:absolute;
    top:100%;
    margin-top:.22em;
    left:50%;
    transform:translateX(-50%);
    white-space:nowrap;
    color:#252B14;
    background-image:linear-gradient(178deg,#48522E 0%,#20260F 46%,#161A09 63%,#3C4526 100%);
    -webkit-background-clip:text;
    background-clip:text;
    -webkit-text-fill-color:transparent;
  }

  /* the mark sits directly over the word it belongs to, at its width */
  .wm-crown{
    position:relative;
    display:inline-block;
  }
  .wm-crown .mark{
    position:absolute;
    left:50%;
    bottom:100%;
    transform:translateX(-50%);
    /* two thirds of the word's width, and lifted clear, so the mark rises
       above the word rather than capping it */
    width:66%;
    height:auto;
    margin-bottom:.3em;
  }
  .wm-dinesh{
    font-size:1.15em;
    color:#A8762A;
    background-image:linear-gradient(176deg,#C48F36 0%,#A8762A 42%,#8A6020 64%,#B7842F 100%);
    -webkit-background-clip:text;
    background-clip:text;
    -webkit-text-fill-color:transparent;
  }

  .wordmark-name{
    display:block;
    text-align:center;
    font-family:var(--serif);
    font-size:1.25rem;
    font-weight:600;
    letter-spacing:-.006em;
    line-height:1.1;
    color:#252B14;
    background-image:linear-gradient(178deg,#48522E 0%,#20260F 46%,#161A09 63%,#3C4526 100%);
    -webkit-background-clip:text;
    background-clip:text;
    -webkit-text-fill-color:transparent;
  }
  nav ul{display:flex;gap:1.6rem;list-style:none;margin:0;padding:0;font-size:.9375rem}
  nav a{text-decoration:none;color:var(--muted)}
  nav a:hover,nav a[aria-current]{color:var(--ink)}
  nav a[aria-current]{text-decoration:underline;text-underline-offset:.25em}

  /* ---------- page head ---------- */
  .register{padding:8rem 0 5rem}
  .register h1{
    font-family:var(--serif);
    font-weight:300;
    font-size:clamp(2.2rem,5.6vw,3.5rem);
    line-height:1.08;
    letter-spacing:-.018em;
    margin:0;
    max-width:16ch;
    color:var(--ink-deep);
  }
  .crumb{font-size:.875rem;margin:0 0 1.5rem;color:var(--muted)}
  .crumb a{color:var(--muted)}

  /* ---------- sections ---------- */
  section{padding-bottom:5rem}
  section:last-of-type{padding-bottom:7rem}

  h2{
    font-family:var(--serif);
    font-size:1.5rem;
    font-weight:500;
    line-height:1.25;
    letter-spacing:-.01em;
    color:var(--ink-deep);
    margin:0 0 1.6rem;
    padding-bottom:.7rem;
    border-bottom:1px solid var(--hair);
  }

  h3{
    font-family:var(--sans);
    font-size:1rem;
    font-weight:600;
    line-height:1.35;
    color:var(--ink-deep);
    margin:2rem 0 .6rem;
  }

  p{margin:0 0 1.35rem;max-width:33em}
  p:last-child{margin-bottom:0}

  .statement,
  .lede{
    font-family:var(--serif);
    font-weight:400;
    font-size:1.3125rem;
    line-height:1.5;
    letter-spacing:-.006em;
    color:var(--ink-deep);
    margin-bottom:1.5rem;
    max-width:30em;
  }


  .section-note{font-size:.9375rem;line-height:1.55;color:var(--muted);margin:0 0 1.5rem;max-width:36em}
  .more{font-size:.9375rem;margin-top:1.6rem}

  address{font-style:normal}

  /* ---------- pointer ---------- */
  .pointer{
    margin-top:3rem;
    padding:1.35rem 1.5rem;
    border-left:3px solid var(--ink-deep);
    background:rgba(250,249,242,.8);
    font-size:1rem;
    color:var(--ink);
    max-width:33em;
  }
  .pointer.flush{margin-top:0}
  .pointer p{margin:0;max-width:none}
  .pointer p + p{margin-top:.65rem}
  .pointer a{color:var(--ink-deep);font-weight:600;text-decoration-color:var(--ink-deep)}
  .pointer a:hover{text-decoration-thickness:.1em}

  .todo{
    background:#E9E4C6;
    box-shadow:0 0 0 1px #D3CDA6 inset;
    padding:0 .35em;
    color:#5E5726;
    font-size:.9em;
  }

  /* ---------- particulars ---------- */
  dl.particulars{margin:0;border-top:1px solid var(--hair-soft);font-size:.9375rem}
  dl.particulars > div{
    display:grid;grid-template-columns:11rem 1fr;gap:1.25rem;
    padding:.85rem 0;border-bottom:1px solid var(--hair-soft);
  }
  dl.particulars dt{color:var(--muted)}
  dl.particulars dd{margin:0}

  /* ---------- index lists ---------- */
  ul.index{list-style:none;margin:0;padding:0;border-top:1px solid var(--hair-soft)}
  ul.index li{border-bottom:1px solid var(--hair-soft)}
  ul.index a{display:block;padding:.95rem 0;font-size:.9375rem;text-decoration:none}
  ul.index a:hover{text-decoration:underline;text-underline-offset:.2em}

  /* ---------- filings ---------- */
  ul.filings{list-style:none;margin:0;padding:0;border-top:1px solid var(--hair-soft)}
  ul.filings li{
    display:grid;
    /* a single fixed width everywhere, so titles begin on the same
       vertical line on every page regardless of the dates in the list */
    grid-template-columns:var(--datecol) minmax(0,1fr);
    gap:0;
    padding:.95rem 0;border-bottom:1px solid var(--hair-soft);
    font-size:.9375rem;line-height:1.5;align-items:baseline;
  }
  ul.filings li > span{min-width:0}
  ul.filings li.undated{grid-template-columns:minmax(0,1fr)}
  ul.filings li > a{min-width:0}
  ul.filings time{color:var(--muted);white-space:nowrap}

  /* ---------- roster tables ---------- */
  table.roster{width:100%;border-collapse:collapse;font-size:.9375rem;margin:0}
  table.roster th{
    text-align:left;font-weight:600;font-size:.8125rem;color:var(--muted);
    padding:0 0 .6rem;border-bottom:1px solid var(--ink);
  }
  table.roster td{padding:.85rem 0;border-bottom:1px solid var(--hair-soft);vertical-align:top}
  table.roster td + td,table.roster th + th{padding-left:1.5rem}


  /* ---------- footer ---------- */
  footer{
    border-top:1px solid var(--hair);background:var(--panel);
    padding:3.75rem 0 4.75rem;font-size:.875rem;color:var(--muted);
  }
  footer h3{font-size:.8125rem;font-weight:600;color:var(--ink);margin:0 0 .55rem}
  .foot-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(13rem,1fr));gap:2.25rem}
  .foot-grid p{margin:0;font-size:.875rem;max-width:none}
  .colophon{margin-top:3rem;padding-top:1.3rem;border-top:1px solid var(--hair-soft)}
  .colophon p{margin:0;font-size:.8125rem}

  @media (max-width:34rem){
    .wrap{padding:0 1.5rem}
    .register{padding:4.5rem 0 3.5rem}
    h2{font-size:1.3125rem}
    .statement,.lede{font-size:1.1875rem}
    section{padding-bottom:3.5rem}
    section:last-of-type{padding-bottom:4.5rem}
    dl.particulars > div{grid-template-columns:1fr;gap:.2rem;padding:.85rem 0}
    ul.filings li{grid-template-columns:1fr;gap:.2rem}
    table.roster,table.roster tbody,table.roster tr,table.roster td{display:block;width:100%}
    table.roster thead{display:none}
    table.roster tr{border-bottom:1px solid var(--hair-soft);padding:.85rem 0}
    table.roster td{border:0;padding:0}
    table.roster td + td{padding-left:0;color:var(--muted);font-size:.875rem}
  }
  @media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* ---------- category label on the latest list ---------- */

ul.filings .cat{
  display:inline-block;
  margin-top:.15rem;
  font-size:.8125rem;
  color:var(--muted);
  text-decoration:none;
}
ul.filings .cat:hover{color:var(--ink);text-decoration:underline;text-underline-offset:.2em}

  /* ---------- page navigation within a section ---------- */

  .pager{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:1rem;
    flex-wrap:wrap;
    margin-top:2rem;
    padding-top:1.25rem;
    border-top:1px solid var(--hair);
    font-size:.9375rem;
  }
  .pager .nums{display:flex;gap:.35rem;flex-wrap:wrap}
  .pager .num{
    display:inline-block;
    min-width:2rem;
    padding:.35rem .5rem;
    text-align:center;
    text-decoration:none;
    border:1px solid var(--hair);
    background:rgba(250,249,242,.7);
  }
  .pager .num:hover{border-color:var(--ink);text-decoration:none}
  .pager .num.here{
    background:var(--ink-deep);
    border-color:var(--ink-deep);
    color:#F7F5EC;
    font-weight:500;
  }
  .pager .step{padding:.35rem 0;text-decoration:none;font-weight:500}
  .pager .step:hover{text-decoration:underline;text-underline-offset:.2em}
  .pager .step.off{color:#A9AC96}
  .pager-note{font-size:.8125rem;color:var(--muted);margin-top:.9rem}

  @media (max-width:34rem){
    .pager{justify-content:center}
    .pager .nums{order:-1;width:100%;justify-content:center}
  }

  /* ---------- heritage ---------- */

  section.decade{margin-top:3rem}
  section.decade h2{
    font-family:var(--serif);
    font-size:1.6rem;
    font-weight:300;
    letter-spacing:.01em;
    color:var(--ink-deep);
    padding-bottom:.6rem;
    border-bottom:1px solid var(--hair);
  }
  /* The gallery steps outside the 44rem text measure: photographs want the
     room, and with no captions they pack better in columns than in a grid,
     which would leave holes wherever the heights disagree. */
  .plates{
    width:min(64rem, calc(100vw - 4rem));
    margin:1.75rem 50% 0;
    transform:translateX(-50%);
    columns:3;
    column-gap:1.25rem;
  }
  figure.plate{
    margin:0 0 1.25rem;
    break-inside:avoid;
    -webkit-column-break-inside:avoid;
  }
  figure.plate img{
    display:block;
    width:100%;
    height:auto;
    border:1px solid var(--hair);
    background:#FAF9F2;
  }
  .plate-none{
    width:100%;
    aspect-ratio:4/3;
    border:1px dashed var(--hair);
    background:rgba(250,249,242,.6);
  }
  figure.plate figcaption{
    margin-top:.7rem;
    font-size:.875rem;
    line-height:1.55;
    color:var(--muted);
  }
  .plate-year{
    display:block;
    font-family:var(--serif);
    font-size:1rem;
    color:var(--sun);
    letter-spacing:.02em;
    margin-bottom:.15rem;
  }
  .plate-credit{
    display:block;
    margin-top:.4rem;
    font-size:.75rem;
    color:#8A8E72;
  }
  @media (max-width:52rem){
    .plates{columns:2}
  }
  @media (max-width:34rem){
    .plates{columns:1;width:100%;margin:1.75rem 0 0;transform:none}
  }

  /* ---------- the menu button, on small screens only ---------- */

  .menu-button{
    display:none;
    align-items:center;
    gap:.55rem;
    background:transparent;
    border:1px solid var(--hair);
    color:var(--ink-deep);
    font-family:var(--sans);
    font-size:.875rem;
    letter-spacing:.02em;
    padding:.6rem .9rem;
    cursor:pointer;
    min-height:44px;
  }
  .menu-bars{display:inline-block;width:16px}
  .menu-bars span{
    display:block;
    height:1.5px;
    background:var(--ink-deep);
    margin:3px 0;
  }
  .menu-button[aria-expanded="true"]{background:#E8E5D6}

  @media (max-width:40rem){
    .menu-button{display:inline-flex}
    /* with the button present, the menu starts closed */
    .has-menu-button nav[aria-label="Primary"]{display:none}
    .has-menu-button nav[aria-label="Primary"].open{display:block}

    nav[aria-label="Primary"] ul{
      flex-direction:column;
      align-items:stretch;
      gap:0;
      margin-top:1rem;
      border-top:1px solid var(--hair);
    }
    nav[aria-label="Primary"] li{width:100%}
    nav[aria-label="Primary"] a{
      display:block;
      padding:.95rem .25rem;
      border-bottom:1px solid var(--hair-soft);
      font-size:1rem;
      min-height:44px;
    }

    /* a whole row is the tap target, not just the words */
    ul.filings li a,
    ul.index a{
      display:block;
      padding-top:.35rem;
      padding-bottom:.35rem;
      min-height:44px;
    }
    ul.filings li{padding:.7rem 0}

    /* less header before the reader reaches anything */
    .register{padding:3rem 0 2.5rem}
    .masthead .wrap{padding-top:1.1rem;padding-bottom:1.1rem}
    h1{font-size:1.9rem}
  }
