/* Puffin Row: a field guide on screen. Black, white, puffin orange. */
:root{--ink:#131210;--white:#fff;--ora:#e4570f;--orat:#ad3e07;--mute:#57534d;--hair:#cfccc5;--wash:#f6f4ef;--head:'Old Standard TT',Georgia,'Times New Roman',serif;--text:Spectral,Georgia,'Times New Roman',serif}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--white);color:var(--ink);font:400 1.09rem/1.66 var(--text);overflow-x:hidden}
img,svg{max-width:100%;height:auto;display:block}
a{color:var(--orat);text-underline-offset:.16em;text-decoration-thickness:1px}
a:hover{color:var(--ink);text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--ora);outline-offset:2px}
h1,h2,h3{font-family:var(--head);font-weight:400;line-height:1.14;margin:0}
.pl-skip{position:absolute;left:-999px;top:0;background:var(--ink);color:#fff;padding:.6rem 1rem;z-index:9}
.pl-skip:focus{left:0}

/* spine + leaf */
.pl-book{display:grid;grid-template-columns:82px minmax(0,1fr);min-height:100vh}
.pl-spine{background:var(--ink);color:#fff;position:sticky;top:0;height:100vh;display:flex;flex-direction:column;align-items:center;padding:1.2rem 0;gap:1.5rem;overflow:hidden}
.pl-spine svg{width:48px}
.pl-spine span{writing-mode:vertical-rl;transform:rotate(180deg);font:400 1rem/1 var(--head);letter-spacing:.2em;text-transform:uppercase;white-space:nowrap}
.pl-spine i{display:block;margin-top:auto;width:100%;height:92px;background:var(--ora)}
.pl-leaf{min-width:0}

/* running head */
.pl-run{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.9rem clamp(1rem,4vw,3.2rem);border-bottom:2px solid var(--ink);position:relative}
.pl-logo{display:flex;align-items:center;gap:.6rem;color:var(--ink);text-decoration:none}
.pl-logo svg{width:42px;flex:none}
.pl-logo b{font:400 1.62rem/1 var(--head);display:block}
.pl-logo small{display:block;font:italic 400 .82rem/1.2 var(--text);color:var(--mute);margin-top:.2rem}
.pl-tabs{display:flex;flex-wrap:wrap;gap:.1rem 1.5rem;list-style:none;margin:0;padding:0;font-size:.97rem}
.pl-tabs a{color:var(--ink);text-decoration:none;padding:.25rem 0;display:block;border-bottom:3px solid transparent}
.pl-tabs a:hover,.pl-tabs a[aria-current]{border-color:var(--ora)}
.pl-tabs em{font:italic 400 .85em var(--head);color:var(--orat);margin-right:.3em}
.pl-nvk{position:absolute;opacity:0;pointer-events:none}
.pl-nvb{display:none;font:600 .92rem var(--text);border:2px solid var(--ink);padding:.3rem .8rem;cursor:pointer}
.pl-nvk:focus-visible+.pl-nvb{outline:3px solid var(--ora);outline-offset:2px}

.pl-pad{padding-inline:clamp(1rem,4vw,3.2rem)}

/* title page */
.pl-title{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(1.5rem,4vw,3.5rem);padding-block:clamp(1.6rem,4vw,3.4rem) 2.5rem;align-items:start}
.pl-over{font:italic 400 1rem var(--head);margin:0 0 1rem;color:var(--orat)}
.pl-title h1{font-size:clamp(2.35rem,5vw,4.3rem);line-height:1.03;letter-spacing:-.01em}
.pl-title h1 em{color:var(--orat);font-style:italic}
.pl-lede{font-size:1.15rem;margin:1.3rem 0 0;max-width:32rem}
.pl-plate{margin:0;border:2px solid var(--ink);padding:.7rem;background:#fff}
.pl-plhd{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;font:400 1rem var(--head);padding:0 .1rem .5rem}
.pl-plhd i{font-size:.95em}
.pl-pic{position:relative}
.pl-dot{position:absolute;width:30px;height:30px;margin:-15px 0 0 -15px;border-radius:50%;background:var(--ora);color:#fff;border:2px solid #fff;font:700 .9rem/26px var(--text);text-align:center}
.pl-legend{list-style:none;margin:.8rem 0 0;padding:0;columns:2;column-gap:1.4rem;font-size:.95rem;line-height:1.4}
.pl-legend li{break-inside:avoid;margin-bottom:.45rem;padding-left:1.55rem;position:relative}
.pl-legend b{position:absolute;left:0;top:.05rem;width:1.2rem;height:1.2rem;border-radius:50%;background:var(--ora);color:#fff;font-size:.78rem;line-height:1.2rem;text-align:center}
.pl-credit{display:block;font-size:.76rem;line-height:1.35;color:var(--mute);margin-top:.45rem}
.pl-credit a{color:inherit}

/* contents + rule */
.pl-front{display:grid;grid-template-columns:minmax(0,8fr) minmax(0,4fr);border-block:2px solid var(--ink)}
.pl-toc{padding:2rem clamp(1rem,4vw,3.2rem)}
.pl-sec{font-size:clamp(1.8rem,3.2vw,2.5rem)}
.pl-toc ol{list-style:none;margin:1.1rem 0 0;padding:0}
.pl-toc li{border-bottom:1px solid var(--hair)}
.pl-toc li:last-child{border:0}
.pl-toc a{display:grid;grid-template-columns:3rem minmax(0,1fr) auto;gap:.5rem;align-items:baseline;padding:.75rem 0;color:var(--ink);text-decoration:none}
.pl-toc a:hover .pl-tt{color:var(--orat);text-decoration:underline}
.pl-toc .pl-num{font:italic 400 1.1rem var(--head);color:var(--orat)}
.pl-tt{font:400 1.32rem/1.2 var(--head)}
.pl-toc time{font-size:.84rem;color:var(--mute);white-space:nowrap}
.pl-rule{background:var(--ink);color:#fff;padding:2rem 1.6rem;display:flex;flex-direction:column;justify-content:center}
.pl-rule strong{font:400 clamp(3.6rem,7vw,6rem)/.95 var(--head);color:var(--ora);display:block}
.pl-rule p{margin:.7rem 0 0;font-size:1rem;line-height:1.5}
.pl-rule a{color:#fff}

/* plates */
.pl-plates{padding-block:2.6rem 1rem}
.pl-gridp{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.6rem 1.4rem;margin-top:1.3rem}
.pl-sp{border:1px solid var(--ink);padding:.6rem .6rem .8rem;display:flex;flex-direction:column}
.pl-spt{display:flex;justify-content:space-between;font:italic 400 .95rem var(--head);padding-bottom:.4rem}
.pl-spt b{font-style:normal;font-weight:400;color:var(--orat)}
.pl-sp h3{font-size:1.5rem;margin-top:.7rem}
.pl-latin{font-style:italic;margin:.1rem 0 0;color:var(--mute);font-size:.96rem}
.pl-marks{margin:.6rem 0;padding:0;list-style:none;font-size:.95rem;line-height:1.42}
.pl-marks li{padding-left:.95rem;position:relative;margin-bottom:.25rem}
.pl-marks li::before{content:"";position:absolute;left:0;top:.52em;width:.42rem;height:.42rem;background:var(--ora);border-radius:50%}
.pl-sp>a{margin-top:auto;font-size:.95rem}

/* season chart */
.pl-season{padding-block:2.2rem 2.8rem}
.pl-cal{width:100%;border-collapse:collapse;margin-top:1.1rem;table-layout:fixed;font-size:.92rem}
.pl-cal th{font-weight:400;text-align:left;padding:.45rem .5rem .45rem 0;line-height:1.2}
.pl-cal thead th{text-align:center;padding:.2rem 0;font:400 .9rem var(--head);border-bottom:2px solid var(--ink)}
.pl-cal thead th:first-child{width:28%;text-align:left}
.pl-cal td{border:1px solid var(--hair);height:1.9rem;padding:0}
.pl-cal td.on{background:var(--ora)}
.pl-cal td.lt{background:repeating-linear-gradient(135deg,var(--ora) 0 3px,#fff 3px 7px)}
.pl-fine{font-size:.88rem;color:var(--mute);margin:.7rem 0 0;line-height:1.45}

/* colophon */
.pl-col{border-top:2px solid var(--ink);padding-block:1.6rem 2rem;display:flex;flex-wrap:wrap;gap:1rem 2.4rem;justify-content:space-between;font-size:.94rem}
.pl-col p{margin:0;max-width:34rem}
.pl-col ul{list-style:none;display:flex;flex-wrap:wrap;gap:.2rem 1.1rem;margin:0;padding:0}

/* article */
.pl-ahd{padding-block:clamp(1.6rem,4vw,3rem) 1.5rem;max-width:64rem}
.pl-crumb{font-size:.88rem;color:var(--mute);margin:0 0 1rem}
.pl-crumb a{color:inherit}
.pl-ahd h1{font-size:clamp(2.2rem,4.8vw,3.8rem);line-height:1.05}
.pl-stand{font-size:1.22rem;line-height:1.5;margin:1.1rem 0 .8rem;max-width:46rem}
.pl-meta{font-size:.9rem;color:var(--mute);margin:0}
.pl-hero{margin:0;padding:0 clamp(1rem,4vw,3.2rem)}
.pl-hero img{width:100%;border:2px solid var(--ink)}
.pl-hero figcaption{font-size:.92rem;margin-top:.45rem}
.pl-hero figcaption b{font:italic 400 1em var(--head);color:var(--orat);margin-right:.35em}
.pl-sheet{display:grid;grid-template-columns:minmax(0,1fr) 17rem;gap:clamp(1.5rem,4vw,3.5rem);padding-block:2rem 3rem}
.pl-prose{max-width:43rem;min-width:0}
.pl-prose>p:first-child::first-letter{font:400 3.7em/.82 var(--head);float:left;padding:.08em .1em 0 0;color:var(--orat)}
.pl-prose h2{font-size:clamp(1.6rem,3vw,2.08rem);margin:2.2rem 0 .6rem;padding-top:.8rem;border-top:1px solid var(--ink)}
.pl-prose h3{font-size:1.32rem;margin:1.5rem 0 .3rem}
.pl-prose p{margin:0 0 1rem}
.pl-prose li{margin-bottom:.4rem}
.pl-dots{list-style:none;padding:0;margin:0 0 1.1rem}
.pl-dots li{padding-left:1.1rem;position:relative}
.pl-dots li::before{content:"";position:absolute;left:0;top:.65em;width:.45rem;height:.45rem;background:var(--ora);border-radius:50%}
.pl-steps{padding:0;margin:0 0 1.2rem;list-style:none;counter-reset:s}
.pl-steps li{counter-increment:s;padding:0 0 0 2.5rem;position:relative;margin-bottom:.8rem}
.pl-steps li::before{content:counter(s);position:absolute;left:0;top:.08em;width:1.8rem;height:1.8rem;border:2px solid var(--ink);border-radius:50%;text-align:center;font:400 1rem/1.62rem var(--head)}
.pl-key{list-style:none;padding:0;margin:0 0 1.2rem;border-top:1px solid var(--ink)}
.pl-key li{display:grid;grid-template-columns:2.6rem minmax(0,1fr);padding:.55rem 0;border-bottom:1px solid var(--hair);margin:0}
.pl-kn{font:italic 400 1.05rem var(--head);color:var(--orat)}
.pl-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin:1rem 0 1.4rem}
.pl-card{border:2px solid var(--ink);padding:.9rem}
.pl-card h3{margin:.1rem 0 0;font-size:1.5rem}
.pl-cardno{margin:0!important;font:italic 400 .92rem var(--head);color:var(--orat)}
.pl-card dl{margin:.7rem 0 0;font-size:.95rem;line-height:1.42}
.pl-card dt{font-weight:600;margin-top:.45rem}
.pl-card dd{margin:0}
.pl-svg{margin:1.4rem 0}
.pl-svg svg{width:100%}
.pl-svg figcaption{font-size:.84rem;color:var(--mute);margin-top:.4rem;line-height:1.4}
.pl-photo{margin:1.4rem 0}
.pl-photo img{width:100%;border:1px solid var(--ink)}
.pl-side{float:right;width:min(44%,15rem);margin:.3rem 0 1rem 1.4rem}
.pl-scroll{overflow-x:auto;margin:1rem 0 1.4rem}
.pl-tab{border-collapse:collapse;width:100%;font-size:.96rem;line-height:1.42}
.pl-tab caption{text-align:left;font:italic 400 .98rem var(--head);padding-bottom:.45rem}
.pl-tab th,.pl-tab td{text-align:left;vertical-align:top;padding:.5rem .7rem .5rem 0;border-bottom:1px solid var(--hair)}
.pl-tab thead th{border-bottom:2px solid var(--ink);font-weight:600}
.pl-tab tbody th{font-weight:600}
.pl-do{background:var(--wash);border-left:6px solid var(--ora);padding:.5rem 1rem 1px;margin:1.2rem 0}
.pl-do h3{margin-top:.6rem}
.pl-do ul{margin:.2rem 0 .8rem;padding-left:1.1rem}
.pl-note{border:2px solid var(--ink);padding:.8rem 1rem;font-size:.97rem;margin-bottom:1.4rem}
.pl-note p{margin:0}
.pl-rail{font-size:.94rem;line-height:1.45;min-width:0}
.pl-rail>div{position:sticky;top:1rem}
.pl-rail h2{font-size:1.2rem;border-bottom:2px solid var(--ink);padding-bottom:.3rem}
.pl-rail ul{list-style:none;margin:.6rem 0 1.6rem;padding:0}
.pl-rail li{padding:.42rem 0;border-bottom:1px solid var(--hair)}

/* static pages */
.pl-page{max-width:46rem;padding-block:clamp(1.6rem,4vw,3rem) 3rem}
.pl-page h1{font-size:clamp(2.3rem,5vw,3.7rem);line-height:1.05;margin-bottom:.9rem}
.pl-page h2{font-size:1.75rem;margin:2rem 0 .5rem;padding-top:.7rem;border-top:1px solid var(--ink)}
.pl-page ul{padding-left:1.15rem}
.pl-page li{margin-bottom:.35rem}
.pl-small{font-size:.9rem;line-height:1.45}
.pl-index{list-style:none;margin:1.5rem 0 0;padding:0;display:grid;gap:0}
.pl-entry{display:grid;grid-template-columns:minmax(0,15rem) minmax(0,1fr);gap:1.4rem;padding:1.3rem 0;border-top:1px solid var(--ink)}
.pl-entry img{width:100%;border:1px solid var(--ink)}
.pl-entry h2{font-size:1.65rem;margin:0}
.pl-entry h2 a{color:var(--ink);text-decoration:none}
.pl-entry h2 a:hover{color:var(--orat);text-decoration:underline}
.pl-entry p{margin:.45rem 0 0;font-size:1rem;line-height:1.5}
.pl-entry .pl-num{font:italic 400 1rem var(--head);color:var(--orat)}
.pl-wide{max-width:68rem}

@media (max-width:1100px){
.pl-sheet{grid-template-columns:minmax(0,1fr)}
.pl-rail>div{position:static}
.pl-gridp{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:860px){
.pl-book{grid-template-columns:minmax(0,1fr)}
.pl-spine{display:none}
.pl-title,.pl-front{grid-template-columns:minmax(0,1fr)}
.pl-nvb{display:block}
.pl-tabs{display:none;position:absolute;left:0;right:0;top:100%;z-index:5;background:#fff;border-bottom:2px solid var(--ink);padding:.3rem 1rem .8rem;flex-direction:column}
.pl-nvk:checked~.pl-tabs{display:flex}
}
@media (max-width:560px){
body{font-size:1.04rem}
.pl-legend{columns:1}
.pl-gridp,.pl-cards{grid-template-columns:minmax(0,1fr)}
.pl-toc a{grid-template-columns:2.3rem minmax(0,1fr)}
.pl-toc time{display:none}
.pl-entry{grid-template-columns:minmax(0,1fr);gap:.7rem}
.pl-dot{width:24px;height:24px;margin:-12px 0 0 -12px;font-size:.75rem;line-height:20px}
.pl-cal{font-size:.74rem}
.pl-cal thead th{font-size:.72rem}
.pl-side{float:none;width:70%;margin:1rem 0}
.pl-tab{font-size:.9rem}
}
@media print{.pl-spine,.pl-nvb{display:none}.pl-book{display:block}}
.pl-entry h2{border:0;padding:0}
.pl-toc .pl-num{white-space:nowrap}
@media (max-width:560px){.pl-toc a{grid-template-columns:3rem minmax(0,1fr)}.pl-toc .pl-num{font-size:1rem}}
