/* El nuevo Archivo — stylesheet. Tokens first, then layout, then the page kinds. */
:root{
  --paper:#F4F5F2; --ink:#15181C; --graphite:#6A7079; --hair:#D6D9D4; --accent:#2544B4;
  --panel:#FFFFFF; --panel-2:#ECEEEA;
  --display:"Fraunces","Iowan Old Style",Georgia,serif;
  --body:"Newsreader","Palatino Linotype",Palatino,Georgia,serif;
  --ui:"Archivo","Helvetica Neue",Arial,sans-serif;
  --measure:64ch; --rail:13rem;
  --s1:.5rem; --s2:1rem; --s3:1.75rem; --s4:clamp(2rem,1.5rem + 2vw,3.5rem);
}
@media (prefers-color-scheme:dark){:root{
  --paper:#111316; --ink:#E6E5E0; --graphite:#9AA0A8; --hair:#2A2E33; --accent:#8FA3F5;
  --panel:#181B1F; --panel-2:#1F2327;
}}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--body);font-size:clamp(1.05rem,.98rem + .3vw,1.2rem);line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:inherit;text-decoration:underline;text-decoration-color:var(--hair);text-underline-offset:3px;text-decoration-thickness:1px;transition:text-decoration-color .15s}
a:hover{text-decoration-color:var(--accent)}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
img{max-width:100%;height:auto}
p{margin:0 0 var(--s2)}
p:empty{display:none}
hr{border:0;height:1px;background:var(--hair);width:30%;margin:var(--s4) auto}
blockquote{margin:var(--s3) 0;padding-left:var(--s2);border-left:2px solid var(--hair);font-style:italic;color:var(--graphite)}
table{border-collapse:collapse}
.tablewrap{overflow-x:auto}
.num{font-family:var(--ui);font-variant-numeric:tabular-nums}
.k{font-family:var(--ui);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--graphite);font-weight:600}

/* ---- frame: rail + main ---- */
.site{display:grid;grid-template-columns:var(--rail) minmax(0,1fr);min-height:100vh}
.rail{border-right:1px solid var(--hair);padding:var(--s3) var(--s2) var(--s2) var(--s3);font-family:var(--ui);font-size:.86rem;display:flex;flex-direction:column;gap:var(--s3);position:sticky;top:0;height:100vh;align-self:start}
.rail .name{font-family:var(--display);font-size:1.45rem;font-weight:400;line-height:1.1;letter-spacing:-.01em;text-decoration:none}
.rail .name small{display:block;font-family:var(--ui);font-size:.7rem;color:var(--graphite);letter-spacing:.1em;text-transform:uppercase;margin-top:.4rem;font-weight:500}
.langs{display:flex;gap:.9rem;font-size:.74rem;letter-spacing:.12em;font-weight:600}
.langs a{text-decoration:none;color:var(--graphite);padding-bottom:2px;border-bottom:2px solid transparent}
.langs a[aria-current]{color:var(--accent);border-bottom-color:var(--accent)}
.rail nav{display:flex;flex-direction:column;gap:.45rem;line-height:1.3}
.rail nav a{text-decoration:none;color:var(--graphite)}
.rail nav a:hover{color:var(--ink)}
.rail nav a[aria-current]{color:var(--ink);font-weight:600}
.rail .crest{margin-top:auto;width:28px;opacity:.8}
.rail .crest img{display:block;width:28px;height:auto}
main{padding:var(--s4) clamp(1.2rem,4vw,4rem) var(--s4) clamp(1.2rem,4vw,3.5rem);min-width:0}
.col{max-width:var(--measure)}
.wide{max-width:70rem}
@media (max-width:720px){
  .site{grid-template-columns:1fr}
  .rail{position:static;height:auto;border-right:0;border-bottom:1px solid var(--hair);flex-direction:row;flex-wrap:wrap;align-items:center;gap:.6rem 1.4rem;padding:var(--s2) var(--s2)}
  .rail .name{font-size:1.2rem}.rail .name small{display:none}
  .rail nav{flex-direction:row;flex-wrap:wrap;gap:.3rem .9rem}
  .rail .crest{display:none}
  main{padding:var(--s3) var(--s2) var(--s4)}
}

/* ---- headings ---- */
.kicker{font-family:var(--ui);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--graphite);font-weight:600;margin:0 0 .5rem}
.kicker a{text-decoration:none}
h1.title{font-family:var(--display);font-weight:300;font-size:clamp(2rem,1.6rem + 2vw,3.2rem);line-height:1.05;letter-spacing:-.015em;margin:0 0 var(--s2);font-variation-settings:"opsz" 144;text-wrap:balance;max-width:24ch}
h1.title br{display:none}
h2{font-family:var(--display);font-weight:400;font-size:clamp(1.35rem,1.15rem + .8vw,1.8rem);line-height:1.15;margin:var(--s4) 0 var(--s2);letter-spacing:-.01em;text-wrap:balance}
h2.section{font-size:clamp(1.6rem,1.3rem + 1.2vw,2.2rem);margin-top:var(--s4)}
h3{font-family:var(--body);font-weight:500;font-size:1.15em;margin:var(--s3) 0 var(--s1)}
.deck{font-size:1.05em;color:var(--graphite);max-width:var(--measure);margin-bottom:var(--s3)}

/* ---- reading page ---- */
.dedication{font-family:var(--ui);font-size:.8rem;color:var(--graphite);margin:0 0 var(--s2);text-align:left}
.epigraph{font-style:italic;max-width:32ch;margin:var(--s2) 0 .2rem;line-height:1.45;font-size:1.02em}
.epigraph-by{font-family:var(--ui);font-size:.74rem;color:var(--graphite);letter-spacing:.04em;margin:0 0 var(--s3)}
.text{max-width:var(--measure)}
.text p{hyphens:auto}
.text .opener::first-letter{float:left;font-family:var(--display);font-weight:300;font-size:3.4em;line-height:.8;padding:.06em .1em 0 0;color:var(--accent)}
.text .verse{white-space:normal;text-align:left;font-style:normal;max-width:none}
.text .stanza{margin:0 0 var(--s2);font-style:italic}
.text .stanza.long{font-style:italic}
.text .stanza span{display:block;padding-left:2em;text-indent:-2em}
.text .q{font-weight:600;margin:var(--s3) 0 var(--s1)}
.text .a{margin:0 0 var(--s3)}
.text .sig{font-family:var(--ui);font-size:.82rem;color:var(--graphite);text-align:right}
.text .note,.note{font-family:var(--ui);font-size:.82rem;color:var(--graphite)}
.text .caption,.caption,figcaption{font-family:var(--ui);font-size:.78rem;color:var(--graphite);text-align:center;margin:.4rem 0 var(--s3)}
.text figure{margin:var(--s3) 0}
.text figure img{display:block;margin:0 auto;border:1px solid var(--hair)}
.text figure .pair{display:flex;gap:var(--s2);justify-content:center;flex-wrap:wrap}
.text h2.supertitle{text-align:left}
.byline{display:flex;gap:1rem;align-items:baseline;font-family:var(--ui);font-size:.78rem;color:var(--graphite);margin-top:var(--s4);padding-top:var(--s2);border-top:1px solid var(--hair);flex-wrap:wrap}
.byline b{font-family:var(--body);font-style:italic;font-weight:400;color:var(--ink);font-size:1rem}
.footnotes{font-family:var(--ui);font-size:.8rem;color:var(--graphite);margin-top:var(--s3);padding-left:1.2em}
.footnotes li{margin-bottom:.4rem}
.prevnext{display:flex;justify-content:space-between;gap:var(--s2);margin-top:var(--s3);font-family:var(--ui);font-size:.82rem;flex-wrap:wrap}
.prevnext a{text-decoration:none;color:var(--graphite);max-width:45%}
.prevnext a:hover{color:var(--ink)}
.prevnext b{display:block;font-family:var(--body);font-weight:400;color:var(--ink);font-size:1rem}

/* ---- lists ---- */
.list{display:grid;grid-template-columns:4rem minmax(0,1fr);max-width:var(--measure)}
.list>div{padding:.55rem 0;border-bottom:1px solid var(--hair)}
.list .y{font-family:var(--ui);font-variant-numeric:tabular-nums;color:var(--graphite);font-size:.8rem;padding-top:.7rem}
.list .ti a{text-decoration:none}
.list .ti a:hover{text-decoration:underline;text-decoration-color:var(--accent)}
.list .ti small{display:block;font-family:var(--ui);font-size:.74rem;color:var(--graphite);margin-top:.1rem}
.list .ti .m{font-family:var(--ui);font-size:.74rem;color:var(--graphite);margin-left:.5rem}
ul.plain{list-style:none;padding:0;margin:0 0 var(--s3);max-width:var(--measure)}
ul.plain li{padding:.45rem 0;border-bottom:1px solid var(--hair)}
main ul:not(.plain){padding-left:1.2em;margin:0 0 var(--s3);max-width:var(--measure)}
main li{margin:.2rem 0}

/* ---- home ---- */
.home-top{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:var(--s4);align-items:start;max-width:70rem;margin-bottom:var(--s4)}
@media (max-width:820px){.home-top{grid-template-columns:1fr}}
.recent .t{font-family:var(--display);font-weight:300;font-size:clamp(1.8rem,1.4rem + 1.6vw,2.6rem);line-height:1.05;letter-spacing:-.015em;margin:.3rem 0 .6rem}
.recent .t a{text-decoration:none}
.recent .excerpt{max-width:48ch;margin-bottom:var(--s2)}
.recent .excerpt.verse{font-style:italic}
.books{display:flex;gap:var(--s2);align-items:flex-end;flex-wrap:wrap;margin:.6rem 0 var(--s2)}
.books a{line-height:0}
.books img{height:6rem;width:auto;border:1px solid var(--hair);box-shadow:0 10px 24px -16px rgba(0,0,0,.5)}
.map{display:grid;grid-template-columns:repeat(auto-fill,minmax(9.5rem,1fr));gap:.9rem;margin:var(--s2) 0 var(--s3);max-width:70rem}
.map a{border-top:1px solid var(--ink);padding:.6rem 0;text-decoration:none}
.map b{display:block;font-family:var(--display);font-weight:300;font-size:1.8rem;line-height:1;letter-spacing:-.02em}
.map span{font-family:var(--ui);font-size:.76rem;color:var(--graphite);letter-spacing:.03em}
.map a:hover span{color:var(--ink)}
.intro{max-width:var(--measure)}

/* ---- galleries ---- */
.gal{display:grid;grid-template-columns:repeat(auto-fill,minmax(11rem,1fr));gap:var(--s3) var(--s2);margin-top:var(--s2);max-width:70rem}
.gal figure{margin:0}
.gal a{text-decoration:none;display:block}
.gal img{width:100%;height:auto;display:block;border:1px solid var(--hair);background:var(--panel-2)}
.gal figcaption{text-align:left;margin:.45rem 0 0;font-size:.76rem}
.gal figcaption b{display:block;color:var(--ink);font-weight:500;font-family:var(--body);font-size:1rem}
.work{display:grid;grid-template-columns:minmax(0,2fr) minmax(14rem,1fr);gap:var(--s3);align-items:start;max-width:70rem}
@media (max-width:720px){.work{grid-template-columns:1fr}}
.work img{width:100%;height:auto;display:block;border:1px solid var(--hair)}
.meta{font-family:var(--ui);font-size:.82rem;display:grid;grid-template-columns:auto 1fr;gap:.4rem 1rem;margin:0}
.meta dt{color:var(--graphite);letter-spacing:.04em}
.meta dd{margin:0}
.meta .tri{grid-column:1/-1;border-top:1px solid var(--hair);padding-top:.5rem;margin-top:.3rem;color:var(--graphite);font-style:italic;font-family:var(--body);font-size:.95rem}

/* ---- aphorisms, reviews, media ---- */
.aph{max-width:var(--measure)}
.aph li{list-style:none;padding:.6rem 0;border-bottom:1px solid var(--hair)}
.aph li small{display:block;font-family:var(--ui);font-size:.72rem;color:var(--graphite);margin-top:.15rem}
.rating{font-family:var(--ui);letter-spacing:.2em;color:var(--accent)}
.podcasts li{display:grid;grid-template-columns:5rem 1fr;gap:var(--s2);align-items:center}
.podcasts audio{width:100%;max-width:26rem;display:block;margin-top:.3rem}
.book{display:grid;grid-template-columns:8rem minmax(0,1fr);gap:var(--s2);padding:var(--s2) 0;border-bottom:1px solid var(--hair);max-width:var(--measure)}
.book img{width:100%;border:1px solid var(--hair)}
.book b{font-family:var(--body);font-weight:500;font-size:1.1em}
.book .ed{font-family:var(--ui);font-size:.8rem;color:var(--graphite)}
.book .dl{font-family:var(--ui);font-size:.8rem;margin-top:.4rem}
.photos{display:flex;gap:var(--s1);flex-wrap:wrap;margin:var(--s2) 0}
.photos img{height:8rem;width:auto;border:1px solid var(--hair)}

/* ---- footer ---- */
footer{font-family:var(--ui);font-size:.76rem;color:var(--graphite);border-top:1px solid var(--hair);margin-top:var(--s4);padding-top:var(--s2);max-width:var(--measure);display:flex;gap:1.2rem;flex-wrap:wrap}
footer a{text-decoration:none}
@media print{.rail,.prevnext,footer{display:none}main{padding:0}body{background:#fff;color:#000}}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* ---- search ---- */
.search{position:relative;font-family:var(--ui)}
.search input{width:100%;font:inherit;font-size:.86rem;padding:.45rem .6rem;border:1px solid var(--hair);border-radius:0;background:var(--panel);color:var(--ink)}
.search input:focus{border-color:var(--accent);outline:none}
.search .results{list-style:none;margin:.4rem 0 0;padding:0;position:absolute;left:0;right:0;z-index:5;background:var(--panel);border:1px solid var(--hair);max-height:22rem;overflow:auto;box-shadow:0 12px 28px -14px rgba(0,0,0,.45)}
.search .results li a{display:block;padding:.45rem .6rem;text-decoration:none;border-bottom:1px solid var(--hair)}
.search .results li a:hover{background:var(--panel-2)}
.search .results b{display:block;font-family:var(--body);font-weight:500;font-size:.98rem}
.search .results small{color:var(--graphite);font-size:.72rem}
.search .results .none{padding:.45rem .6rem;color:var(--graphite);font-size:.8rem}
@media (max-width:720px){.search{flex-basis:100%}.search .results{position:static;box-shadow:none}}
