/* Meridian · tokens globales */
:root{
  --paper:#f5f2ec;
  --ink:#1a1714;
  --ink-soft:#3a342e;
  --red:#8b2d1a;
  --rule:#d9d2c4;
  --mid:#8a8175;
  --tenue:#b4aa9b;
  --crema:#efe7d7;
  --dark:#1a1410;
  --table:#1a1816;
}

html,body{margin:0;padding:0;background:#0f0d0c;}
body{
  font-family:"EB Garamond", Georgia, serif;
  color:var(--ink);
  background:
    radial-gradient(ellipse at center top, #2a2622 0%, #1a1816 50%, #0f0d0c 100%),
    #0f0d0c;
  background-attachment:fixed;
  min-height:100vh;
}
body::before{
  content:"";position:fixed;inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.012) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.012) 1px, transparent 1px);
  background-size:40px 40px;
  pointer-events:none;z-index:0;
}

/* ---- viewer chrome ---- */
.viewer{
  position:relative;z-index:1;
  display:flex;flex-direction:column;align-items:center;
  padding:48px 24px 120px;
  gap:56px;
}
.viewer-head{
  width:100%;max-width:1000px;
  display:flex;justify-content:space-between;align-items:baseline;
  font-family:"Inter", sans-serif;
  color:rgba(245,236,216,.6);
}
.viewer-head .mark{
  font-family:"Instrument Serif", serif;
  font-style:italic;font-size:26px;color:#f0ddb4;letter-spacing:.02em;
}
.viewer-head .meta{
  font-size:10px;letter-spacing:.3em;text-transform:uppercase;
}
.viewer-head .url{
  font-size:10px;letter-spacing:.18em;color:rgba(245,236,216,.4);
}

.spread{
  position:relative;display:flex;
  --w:500px; --h:707px;
  width:calc(var(--w) * 2);
  filter:drop-shadow(0 40px 60px rgba(0,0,0,.55)) drop-shadow(0 12px 20px rgba(0,0,0,.4));
}
.spread.single{width:var(--w);}
.page{width:var(--w);height:var(--h);background:var(--paper);position:relative;overflow:hidden;}
.page.left::after,.page.right::after{
  content:"";position:absolute;top:0;bottom:0;width:28px;pointer-events:none;z-index:10;
}
.page.left::after{right:0;background:linear-gradient(to right, rgba(0,0,0,0) 0%, rgba(0,0,0,.08) 60%, rgba(0,0,0,.22) 100%);}
.page.right::after{left:0;background:linear-gradient(to left, rgba(0,0,0,0) 0%, rgba(0,0,0,.08) 60%, rgba(0,0,0,.22) 100%);}
.page::before{
  content:"";position:absolute;inset:0;
  background-image:
    radial-gradient(circle at 20% 30%, rgba(139,45,26,.02), transparent 50%),
    radial-gradient(circle at 80% 70%, rgba(26,23,20,.03), transparent 55%);
  mix-blend-mode:multiply;pointer-events:none;z-index:1;
}

/* crop marks */
.crop{position:absolute;pointer-events:none;z-index:20;}
.crop svg{width:14px;height:14px;display:block;}

/* ---- typography helpers ---- */
.kicker{
  font-family:"Inter", sans-serif;
  font-size:9.5px;letter-spacing:.28em;text-transform:uppercase;font-weight:500;
  display:flex;align-items:center;gap:12px;
}
.kicker::before{content:"";width:22px;height:1px;background:currentColor;}

.running{
  position:absolute;top:24px;left:48px;right:48px;
  display:flex;justify-content:space-between;align-items:center;gap:18px;
  font-family:"Inter", sans-serif;
  font-size:8px;letter-spacing:.22em;text-transform:uppercase;color:var(--mid);z-index:4;
  white-space:nowrap;
}
.running .m{font-family:"Instrument Serif", serif;text-transform:none;letter-spacing:.04em;font-style:italic;font-size:11px;color:var(--ink-soft);}
.running > span{overflow:hidden;text-overflow:ellipsis;}
.filete{position:absolute;top:44px;left:48px;right:48px;height:1px;background:var(--ink);z-index:3;}

.folio{
  position:absolute;bottom:26px;
  font-family:"Inter", sans-serif;
  font-size:9px;letter-spacing:.3em;color:var(--mid);z-index:4;
}
.folio.l{left:48px;} .folio.r{right:48px;}
.folio .num{font-family:"EB Garamond", serif;font-size:10.5px;letter-spacing:.04em;color:var(--ink-soft);}

.byline{
  font-family:"Inter", sans-serif;
  font-size:9.5px;letter-spacing:.26em;text-transform:uppercase;
  color:var(--red);margin:0 0 18px 0;font-weight:500;
}

.body-col{
  font-family:"EB Garamond", serif;
  font-size:10.8px;line-height:1.42;color:var(--ink);
  text-align:justify;hyphens:auto;-webkit-hyphens:auto;
}
.body-col p{margin:0 0 8px 0;text-indent:1.2em;}
.body-col p.first{text-indent:0;}
.body-col p.first::first-letter{
  font-family:"Instrument Serif", serif;font-weight:400;
  float:left;font-size:52px;line-height:.88;padding:4px 8px 0 0;color:var(--ink);
}

.pull{
  margin:12px 0;padding:4px 0 4px 14px;
  border-left:1.5px solid var(--red);
  font-family:"EB Garamond", serif;font-style:italic;
  font-size:14.5px;line-height:1.3;color:var(--ink);
  text-indent:0 !important;text-align:left;hyphens:none;
}
.pull::before{content:"\201C";margin-right:.05em;color:var(--red);font-style:normal;}
.pull::after{content:"\201D";margin-left:.05em;color:var(--red);font-style:normal;}
.pull .attr{
  display:block;
  font-family:"Inter", sans-serif;font-style:normal;
  font-size:8.5px;letter-spacing:.24em;text-transform:uppercase;
  color:var(--red);margin-top:8px;font-weight:500;
}

.sep{text-align:center;color:var(--tenue);letter-spacing:.7em;margin:10px 0;font-size:10px;}

.cierre{display:inline;}
.cierre .di{color:var(--red);font-size:10px;margin:0 .35em 0 .25em;}
.cierre .au{
  font-family:"Inter", sans-serif;
  font-size:8.5px;letter-spacing:.26em;text-transform:uppercase;
  color:var(--ink-soft);font-weight:500;
}
.cierre-block{
  display:flex;align-items:center;gap:10px;margin-top:14px;
}
.cierre-block .di{color:var(--red);font-size:14px;}
.cierre-block .au{
  font-family:"Inter", sans-serif;
  font-size:8.5px;letter-spacing:.26em;text-transform:uppercase;
  color:var(--ink-soft);font-weight:500;
}

.section-label{
  font-family:"Inter", sans-serif;
  font-size:9px;letter-spacing:.32em;text-transform:uppercase;
  color:var(--mid);
}

/* ---- nav ---- */
.nav{
  position:fixed;bottom:24px;left:50%;transform:translateX(-50%);
  display:flex;gap:4px;align-items:center;z-index:50;
  background:rgba(20,18,16,.85);
  backdrop-filter:blur(12px);
  border:1px solid rgba(245,236,216,.12);
  padding:8px;border-radius:40px;
  font-family:"Inter", sans-serif;
}
.nav button{
  background:transparent;border:none;cursor:pointer;
  width:30px;height:30px;border-radius:50%;
  color:#d9c9a4;
  display:flex;align-items:center;justify-content:center;
  font-size:14px;
  transition:background .15s;
}
.nav button:hover{background:rgba(245,236,216,.1);}
.nav .ind{
  font-size:10px;letter-spacing:.2em;text-transform:uppercase;
  color:rgba(245,236,216,.65);
  padding:0 14px;min-width:160px;text-align:center;
}
.nav .ind .cur{color:#f0ddb4;font-family:"Instrument Serif", serif;font-style:italic;text-transform:none;letter-spacing:.04em;font-size:14px;margin-right:6px;}