@font-face{font-family:'Goudy Initialen';src:url('fonts/GoudyIni.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
/* User-supplied HPLHS Oldstyle: regular, italic, and a dedicated small-cap face. */
@font-face{font-family:'HPLHS Oldstyle';src:url('fonts/OLDSH___.TTF') format('truetype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'HPLHS Oldstyle';src:url('fonts/OLDSIH__.TTF') format('truetype');font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:'HPLHS Oldstyle Small Caps';src:url('fonts/OLDSSCH_.TTF') format('truetype');font-weight:400;font-style:normal;font-display:swap}
/* Change these colors to make the book your own. */
:root{color-scheme:light;--paper:#f7f1e3;--ink:#292b24;--red:#8a3029;--olive:#596044;--rule:#b8aa8b;--initial:'Goudy Initialen',var(--serif);--serif:'HPLHS Oldstyle',Palatino,'Palatino Linotype','Book Antiqua',Georgia,serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--serif);font-size:1.125rem;line-height:1.7}a{color:var(--red);text-decoration-thickness:1px;text-underline-offset:.2em}a:hover{text-decoration-thickness:2px}a:focus-visible,summary:focus-visible{outline:3px solid var(--red);outline-offset:5px}.skip{position:absolute;left:1rem;top:-8rem;background:var(--paper);padding:.5rem 1rem;z-index:2}.skip:focus{top:1rem}.shell{max-width:1120px;margin:auto;padding:0 3rem}.masthead{display:flex;justify-content:space-between;gap:1rem;align-items:center;border-bottom:1px solid var(--rule);padding:1.4rem 0;font-size:.88rem}.brand{color:var(--ink);text-decoration:none;letter-spacing:.07em}.masthead nav{display:flex;gap:1.5rem}.eyebrow,.label{font-size:.75rem;letter-spacing:.16em;text-transform:uppercase;font-family:var(--serif);color:var(--olive)}h1,h2,h3,p{margin-top:0}h1,h2,h3{font-weight:normal;line-height:1.12}h1{font-size:clamp(2.3rem,6vw,4.7rem);letter-spacing:-.04em;overflow-wrap:anywhere}h2{font-size:2.25rem}h3{font-size:1.5rem}p{margin-bottom:1.25rem}.frontispiece{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.85fr);gap:4rem;align-items:center;padding:4.5rem 0 4rem}.front-copy h1{font-size:clamp(1.65rem,4.15vw,3.15rem);overflow-wrap:normal;margin:.8rem 0 1.4rem}.front-copy .intro{max-width:32rem;font-size:1.3rem}.front-copy .aside{font-style:italic;font-size:1rem;max-width:30rem;color:var(--olive)}.button{display:inline-block;padding:.55rem 1.25rem;border:1px solid var(--red);text-decoration:none;margin:.6rem 0}.button:hover{background:var(--red);color:var(--paper)}.plate{margin:0;border:1px solid var(--rule);outline:1px solid var(--rule);outline-offset:-9px;padding:1.6rem 1.2rem 1.2rem;text-align:center;background:#eee6d3}.plate svg{display:block;width:100%;height:auto;color:var(--olive)}.plate figcaption{font-style:italic;color:var(--olive);font-size:.85rem;margin-top:1rem}.ornament{display:flex;align-items:center;gap:1.25rem;color:var(--red);margin:1rem 0 3rem}.ornament:before,.ornament:after{content:'';height:1px;background:var(--rule);flex:1}.contents{padding-bottom:3rem;scroll-margin-top:2rem}.section-head{display:flex;justify-content:space-between;align-items:baseline;gap:2rem;margin-bottom:1.5rem}.section-head h2{margin-bottom:.5rem}.section-head p{font-size:.95rem;color:var(--olive)}.day{border-top:1px solid var(--rule);display:grid;grid-template-columns:12rem 1fr;gap:2rem;padding:1.7rem 0}.day h3{margin:.3rem 0}.day-note{font-style:italic;color:var(--olive);font-size:.95rem}.tale-list{list-style:none;padding:0;margin:0}.tale-list li{padding:.3rem 0 1.25rem}.tale-list li:last-child{padding-bottom:0}.tale-list a{font-size:1.35rem}.tale-list p{font-size:1rem;margin:.35rem 0 0;max-width:38rem}.status{color:var(--olive);font-size:.9rem;font-style:italic}.colophon{border-top:1px solid var(--rule);padding:2rem 0 2.5rem;display:flex;justify-content:space-between;gap:2rem;font-size:.85rem;color:var(--olive)}.colophon p{margin:0}.reading{max-width:44rem;margin:auto;padding:3.8rem 0 2rem}.tale-heading{text-align:center;margin-bottom:3rem}.tale-heading h1{font-size:clamp(2.5rem,6vw,4.1rem);margin:1rem 0}.argument{font-style:italic;font-size:1.2rem;max-width:35rem;margin:0 auto 1rem}.byline{font-size:.85rem;color:var(--olive)}.prose{font-size:1.2rem;line-height:1.85}.prose .opening:first-letter{float:left;font-family:var(--initial);font-weight:normal;font-style:normal;font-size:4.5rem;line-height:1;padding:.09em .12em 0 0;color:var(--red)}.prose blockquote{margin:2rem 1rem;padding-left:1.4rem;border-left:2px solid var(--rule);font-style:italic}.prose h2{font-size:1.7rem;margin-top:2.5rem}.endmark{text-align:center;color:var(--red);font-size:1.4rem;margin:2rem 0}.tale-nav{border-top:1px solid var(--rule);padding:1.5rem 0;display:flex;justify-content:space-between;gap:2rem;font-size:.95rem}.note{font-size:.95rem;border:1px solid var(--rule);padding:1rem 1.25rem;margin:2rem 0;color:var(--olive)}
@media(max-width:720px){.shell{padding:0 1.3rem}.masthead{align-items:flex-start;flex-direction:column;gap:.5rem}.masthead nav{gap:1.2rem}.frontispiece{grid-template-columns:1fr;padding:2.5rem 0;gap:2rem}.plate{max-width:24rem;width:100%;margin:auto}.section-head{display:block}.day{grid-template-columns:1fr;gap:.7rem}.day-note{margin-bottom:0}.colophon{flex-direction:column;gap:.7rem}.reading{padding-top:2.5rem}.prose{font-size:1.125rem}.tale-nav{flex-wrap:wrap}h1{letter-spacing:-.03em}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
@media print{body{background:white;color:black;font-size:11pt}.shell{max-width:none;padding:0}.masthead,.skip,.tale-nav,.button{display:none}.reading{padding:0;max-width:38rem}.prose{font-size:11pt;line-height:1.65}a{color:black}.plate{max-width:16rem;break-inside:avoid}.frontispiece{padding-top:1rem}h1,h2,h3{break-after:avoid}p{orphans:3;widows:3}.colophon{margin-top:2rem}}

/* The formal title page. Small capitals are simulated where the local face lacks them. */
.front-copy{text-align:center}
.front-copy h1{font-size:clamp(1.15rem,2.55vw,2rem);letter-spacing:.035em;margin:0 0 1rem;overflow-wrap:anywhere}
.title-connector{font-size:1rem;margin:0 0 .65rem}
.epic-subtitle{font-size:clamp(1.6rem,3vw,2.2rem);line-height:1.2;margin:0 0 .8rem}
.title-account{font-size:1.05rem;line-height:1.7;margin:0 auto 1.6rem;max-width:36rem}
.compiler{font-size:1rem;line-height:1.8;margin-bottom:1.2rem}
.compiler-name{font-size:1.35rem}
.edition-source{font-size:.95rem;line-height:1.6;margin-bottom:1.2rem}
@media(max-width:720px){.front-copy h1{font-size:clamp(1rem,4.15vw,1.85rem);letter-spacing:.015em}.frontispiece{padding-top:2.7rem}.title-account{font-size:1rem}}

/* Title-page distinctions: italic narration and upright small-cap names and titles. */
.small-caps{font-family:'HPLHS Oldstyle Small Caps',var(--serif);font-variant-caps:normal;font-style:normal}
.book-name{color:var(--red)}

/* The vintage small-cap font maps digit positions to ornaments and fractions. */
.arabic-date{font-family:Georgia,serif;font-variant-numeric:lining-nums}

@font-face{font-family:'Fell Flowers 1';src:url('fonts/FeFlow1.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Fell Flowers 2';src:url('fonts/FeFlow2.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
.fell-flower{font-family:'Fell Flowers 1';font-style:normal;font-weight:400;font-size:2.6rem;line-height:1.2}
.font-credit{display:block;margin-top:.6rem;max-width:33rem}

.colophon{flex-wrap:wrap}.colophon .font-credit{flex-basis:100%;max-width:none;font-size:.8rem}

/* Preserve the former portrait plate's footprint; show the complete landscape painting. */
.artwork-window{aspect-ratio:320/340;display:flex;align-items:center;justify-content:center;overflow:hidden}
.artwork-window img{display:block;width:100%;height:100%;object-fit:contain;object-position:center}

/* A landscape frontispiece precedes the centered title page. */
.frontispiece{display:flex;flex-direction:column;gap:3rem;padding-top:3rem}
.frontispiece .plate{width:100%;max-width:52rem;padding:1.1rem 1.1rem .85rem}
.artwork-window{aspect-ratio:1400/886;display:block}
.artwork-window img{width:100%;height:100%;object-fit:contain}
.frontispiece .front-copy{width:100%;max-width:43rem;margin-inline:auto}
.front-copy h1{font-size:clamp(1.15rem,3.3vw,2.45rem)}
.ornament{gap:0}
.page-border{position:absolute;top:1.5rem;bottom:1.5rem;width:1.4rem;overflow:hidden;display:flex;flex-direction:column;align-items:center;pointer-events:none;color:var(--rule)}
body{position:relative}
.page-border-left{left:1rem}.page-border-right{right:1rem;transform:scaleX(-1)}
.page-border span{font-family:'Fell Flowers 1';font-size:1.65rem;line-height:1;flex-shrink:0}
@media(max-width:720px){.page-border-left{left:.15rem}.page-border-right{right:.15rem}.page-border{width:.75rem}.page-border span{font-size:.9rem}.frontispiece{gap:2rem}.frontispiece .plate{max-width:none;padding:.8rem}.front-copy h1{font-size:clamp(1rem,4.15vw,1.85rem)}}
@media print{.page-border{display:none}}

/* Medici is reserved for tale headings; body text stays in Oldstyle. */
@font-face{font-family:'Medici Text';src:url('fonts/MediciText.otf') format('opentype');font-weight:400;font-style:normal;font-display:swap}
.tale-heading h1,.prose h2{font-family:'Medici Text',var(--serif);font-weight:400;line-height:1.3;letter-spacing:0}

@media screen{.page-border{position:fixed}}

/* Inline ornamental capitals: large enough for their engraved detail. */
.prose .opening::first-letter{float:none;font-size:130pt;line-height:1;padding:0 .08em 0 0}

/* Lower the inline initial from the first line instead of raising its baseline. */
.prose .opening::first-letter{font-family:inherit;font-size:inherit;line-height:inherit;padding:0;color:inherit;float:none}
.initial-cap{display:inline-block;vertical-align:top;font-family:var(--initial);font-size:130pt;line-height:.85;font-weight:400;font-style:normal;color:var(--red);padding-right:.08em}

.initial-cap{float:left;margin-top:.06em;margin-right:.08em;padding-right:0}.prose .opening{display:flow-root}

.prose{text-align:justify;hyphens:auto}

.resumen{font-size:1rem;line-height:1.65;text-align:justify;hyphens:auto;max-width:38rem;margin:1rem auto 1.5rem}
.footnotes{border-top:1px solid var(--rule);margin-top:2rem;padding-top:1.2rem;font-size:.95rem;line-height:1.7}
.footnotes h2{font-family:var(--serif);font-size:1.3rem}.footnotes p{margin-bottom:0}.footnotes li{scroll-margin-top:2rem}.footnotes li:target{outline:1px solid var(--red);outline-offset:.4rem}sup{line-height:0}

/* Scholarly apparatus: keep long annotations distinct and easy to revisit. */
.footnotes li+li{margin-top:1rem}.apparatus-intro{font-style:italic;color:var(--olive)}.footnotes h2{scroll-margin-top:1.5rem}.masthead nav{flex-wrap:wrap}


/* Revised proposal: retain Oldstyle text; horizontal Fell borders only. */
h1,h2,h3,.tale-heading h1,.prose h2{font-family:'Medici Text',var(--serif);font-weight:400;letter-spacing:0;line-height:1.3}
.footnotes h2{font-family:'Medici Text',var(--serif);font-size:1.65rem}
.page-border{display:none}
.fell-band{display:flex;justify-content:center;gap:.5rem;overflow:hidden;color:var(--olive);height:2.3rem;align-items:center;margin:1rem auto;width:100%}
.fell-band span{font-family:'Fell Flowers 1';font-size:1.8rem;line-height:1;display:block;transform:rotate(90deg);flex-shrink:0}
.fell-band-footer{margin-top:2.5rem;margin-bottom:.5rem}
.reading{padding-top:1.6rem}.frontispiece{padding-top:1.5rem}
.manicule{font-family:Georgia,'Times New Roman',serif;font-size:1.5em;line-height:1;display:inline-block;vertical-align:-.08em}
.endmark{font-family:'Medici Text',var(--serif);font-size:1.8rem}
@media(max-width:720px){.fell-band{gap:.3rem}.fell-band span{font-size:1.45rem}.front-copy h1{font-size:clamp(1rem,4vw,1.85rem)}}

/* Proposed early-modern book frame, enclosing the full tale and its apparatus. */
.framed-reading{position:relative;max-width:52rem;padding:3.5rem 3.6rem 2.5rem;margin:2.5rem auto 3rem;border:1px solid var(--rule);outline:1px solid var(--rule);outline-offset:8px}
.frame-edge{position:absolute;display:flex;overflow:hidden;pointer-events:none;color:var(--olive);z-index:0}
.frame-edge span{font-family:'Fell Flowers 1';font-size:1.65rem;line-height:1;flex-shrink:0;display:block}
.frame-top,.frame-bottom{left:.5rem;right:.5rem;height:1.8rem;align-items:center}
.frame-top{top:.3rem}.frame-bottom{bottom:.3rem;transform:scaleY(-1)}
.frame-top span,.frame-bottom span{transform:rotate(90deg)}
.frame-left,.frame-right{top:2.1rem;bottom:2.1rem;width:1.8rem;flex-direction:column;align-items:center}
.frame-left{left:.3rem}.frame-right{right:.3rem;transform:scaleX(-1)}
.framed-reading article,.framed-reading .tale-nav{position:relative;z-index:1}
@media(max-width:720px){.framed-reading{margin:1.5rem auto 2rem;padding:2.7rem 1.8rem 2rem;outline-offset:4px}.frame-edge span{font-size:1.1rem}.frame-top,.frame-bottom{height:1.2rem}.frame-left,.frame-right{width:1.15rem;top:1.5rem;bottom:1.5rem}}
@media print{.framed-reading{max-width:none;margin:0;padding:1rem;border:1px solid #777;outline:none}.frame-edge{display:none}}

/* Fell Flowers 2: C is a symmetric floral corner; 1 and 2 are pointing hands. */
.frame-corner{position:absolute;width:2.1rem;height:2.1rem;display:flex;align-items:center;justify-content:center;font-family:'Fell Flowers 2';font-size:1.8rem;line-height:1;color:var(--olive);background:var(--paper);z-index:2;pointer-events:none}
.corner-tl{top:.1rem;left:.1rem}.corner-tr{top:.1rem;right:.1rem}.corner-bl{bottom:.1rem;left:.1rem}.corner-br{bottom:.1rem;right:.1rem}
.framed-reading .frame-top,.framed-reading .frame-bottom{left:2.25rem;right:2.25rem}
.framed-reading .frame-left,.framed-reading .frame-right{top:2.25rem;bottom:2.25rem}
.manicule.fell-hand{font-family:'Fell Flowers 2';font-weight:400;font-style:normal;font-size:1.7em;vertical-align:-.15em}
@media(max-width:720px){.frame-corner{width:1.4rem;height:1.4rem;font-size:1.25rem}.framed-reading .frame-top,.framed-reading .frame-bottom{left:1.5rem;right:1.5rem}.framed-reading .frame-left,.framed-reading .frame-right{top:1.5rem;bottom:1.5rem}}
@media print{.frame-corner{display:none}}

/* Match the corner pieces to the border units and the hands to their labels. */
.frame-corner{font-size:1.65rem}
.manicule.fell-hand{font-size:1em;vertical-align:baseline;line-height:1}
@media(max-width:720px){.frame-corner{font-size:1.1rem}}

/* Normalize the visible ornament bounds, rather than matching unlike font em boxes. */
.framed-reading{--frame-unit:1.6rem;--frame-inset:.35rem}
.framed-reading .frame-edge span{display:none}
.framed-reading .frame-corner{font-size:0;width:var(--frame-unit);height:var(--frame-unit);background:var(--paper) url('fell-corner.svg') center/contain no-repeat}
.framed-reading .corner-tl{left:var(--frame-inset);top:var(--frame-inset)}
.framed-reading .corner-tr{right:var(--frame-inset);top:var(--frame-inset);transform:scaleX(-1)}
.framed-reading .corner-bl{left:var(--frame-inset);bottom:var(--frame-inset);transform:scaleY(-1)}
.framed-reading .corner-br{right:var(--frame-inset);bottom:var(--frame-inset);transform:scale(-1)}
.framed-reading .frame-top,.framed-reading .frame-bottom{left:calc(var(--frame-inset) + var(--frame-unit));right:calc(var(--frame-inset) + var(--frame-unit));height:var(--frame-unit);background:url('fell-edge-horizontal.svg') left center/auto 100% repeat-x}
.framed-reading .frame-top{top:var(--frame-inset)}.framed-reading .frame-bottom{bottom:var(--frame-inset)}
.framed-reading .frame-left,.framed-reading .frame-right{top:calc(var(--frame-inset) + var(--frame-unit));bottom:calc(var(--frame-inset) + var(--frame-unit));width:var(--frame-unit);background:url('fell-edge-vertical.svg') center top/100% auto repeat-y}
.framed-reading .frame-left{left:var(--frame-inset)}.framed-reading .frame-right{right:var(--frame-inset)}
@media(max-width:720px){.framed-reading{--frame-unit:1.1rem}}

/* Large, readable Medici title on two lines. */
.front-copy h1{font-size:clamp(2.5rem,6.5vw,5rem);line-height:1.25;overflow-wrap:normal;margin-bottom:1.5rem}
.front-copy h1 .title-article{display:block;font-size:.7em;color:var(--ink)}
.front-copy h1 .book-name{display:block}
.frontispiece .front-copy{max-width:60rem}
@media(max-width:720px){.front-copy h1{font-size:clamp(1.8rem,6.5vw,3rem)}}

/* The painting alone fills its frame; attribution has its own box below. */
.frontispiece .plate{padding:0;border:0;outline:none;background:transparent}
.picture-frame{aspect-ratio:auto;overflow:hidden;border:1px solid var(--rule);outline:1px solid var(--rule);outline-offset:5px;background:transparent}
.picture-frame img{display:block;width:100%;height:auto;object-fit:contain}
.plate .artwork-caption{display:block;margin:1rem 0 0;padding:.75rem 1rem;border:1px solid var(--rule);background:#eee6d3;text-align:center;font-style:normal;font-size:.95rem;line-height:1.5}

/* Transparent landscape ornament; the painting fills the opening without distortion. */
.frontispiece .picture-frame{position:relative;aspect-ratio:1659 / 948;border:0;outline:0;overflow:visible;background:transparent}
.picture-frame > img:first-child{position:absolute;left:5.8%;top:11%;width:88.4%;height:78%;object-fit:cover;object-position:center}
.picture-frame > img.picture-frame-ornament{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none;user-select:none}

/* Give the frontispiece breathing room and simplify the page furniture. */
.plate .artwork-caption{width:78%;max-width:36rem;margin:1rem auto 0}
.masthead{border-bottom:0}
.colophon{border-top:0}

/* Scanned quill-and-ink tailpiece, immediately before the notes. */
.tale-tailpiece{width:min(72%,20rem);margin:2.5rem auto 1.5rem;background:var(--paper)}
.tale-tailpiece img{display:block;width:100%;height:auto;mix-blend-mode:multiply}

/* Consistent navigation and scholarly apparatus. */
.tale-nav{flex-wrap:wrap;align-items:center;column-gap:1.5rem;row-gap:.8rem}
.footnotes h2{font-size:1.7rem;line-height:1.3;margin:0 0 1rem}
.footnotes ol{padding-left:1.6rem}
.footnotes li{padding-left:.25rem;margin-bottom:.85rem}
.footnotes li p{margin:0}
.footnotes strong em{font-weight:bold;font-style:italic}