:root{
  --bg:#cdb57c; --paper:#f2ead6; --ink:#26231d; --muted:#5d5544;
  --red:#a3241b; --green:#2f5d50; --carbon:#2f4157; --line:rgba(38,35,29,.22); --tab:#dcc794;
  --stamp:var(--red);
  color-scheme:light;
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#1f1b14; --paper:#2b261d; --ink:#efe5cc; --muted:#b3a78a;
    --red:#e0675a; --green:#7fb8a6; --carbon:#9db4d3; --line:rgba(239,229,204,.18); --tab:#3a3226;
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --bg:#1f1b14; --paper:#2b261d; --ink:#efe5cc; --muted:#b3a78a;
  --red:#e0675a; --green:#7fb8a6; --carbon:#9db4d3; --line:rgba(239,229,204,.18); --tab:#3a3226;
  color-scheme:dark;
}
[data-genre="historica"]{
  --bg:#e6d8b2; --paper:#f1e7cc; --ink:#2a1f14; --muted:#6b5838;
  --rubric:#9b2318; --lapis:#23407a; --gold:#a8812a; --line:rgba(42,31,20,.25);
  --stamp:var(--rubric); --carbon:var(--lapis);
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) [data-genre="historica"]{
    --bg:#1a150f; --paper:#251e16; --ink:#ecdfbf; --muted:#b9a57c;
    --rubric:#e27a62; --lapis:#93abe3; --gold:#d6b55c; --line:rgba(236,223,191,.2);
  }
}
[data-genre="cf"]{
  --bg:#e9e7f2; --paper:#f7f6fb; --ink:#1a1530; --muted:#5b5677;
  --neon:#c2185b; --cyan:#00747f; --line:rgba(26,21,48,.18);
  --stamp:var(--neon); --carbon:var(--cyan);
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) [data-genre="cf"]{
    --bg:#0c0a1d; --paper:#15122b; --ink:#e8e6ff; --muted:#9c97c7;
    --neon:#ff3d9a; --cyan:#3ee6f0; --line:rgba(232,230,255,.15);
  }
}
[data-genre="terror"]{
  --bg:#e4ddd2; --paper:#efe9df; --ink:#1c1212; --muted:#5e4d48;
  --blood:#8a0f14; --candle:#7d5a1e; --line:rgba(28,18,18,.2); --shade:rgba(28,18,18,.5);
  --stamp:var(--blood); --carbon:var(--blood);
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) [data-genre="terror"]{
    --bg:#0d0909; --paper:#171010; --ink:#eadfcf; --muted:#a8968a;
    --blood:#d0333a; --candle:#e8b860; --line:rgba(234,223,207,.15); --shade:rgba(0,0,0,.8);
  }
}
[data-genre="fantasia"]{
  --bg:#d9e0cf; --paper:#eef1e4; --ink:#1f2a22; --muted:#55624f;
  --arcane:#5b3f8c; --gold:#93742a; --line:rgba(31,42,34,.2);
  --stamp:var(--arcane); --carbon:var(--arcane);
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) [data-genre="fantasia"]{
    --bg:#0e1512; --paper:#16201b; --ink:#e3ead8; --muted:#9fae98;
    --arcane:#b9a0ef; --gold:#d9bb6a; --line:rgba(227,234,216,.16);
  }
}
:root[data-theme="dark"] [data-genre="fantasia"]{
  --bg:#0e1512; --paper:#16201b; --ink:#e3ead8; --muted:#9fae98;
  --arcane:#b9a0ef; --gold:#d9bb6a; --line:rgba(227,234,216,.16);
}
:root[data-theme="dark"] [data-genre="terror"]{
  --bg:#0d0909; --paper:#171010; --ink:#eadfcf; --muted:#a8968a;
  --blood:#d0333a; --candle:#e8b860; --line:rgba(234,223,207,.15); --shade:rgba(0,0,0,.8);
}
:root[data-theme="dark"] [data-genre="cf"]{
  --bg:#0c0a1d; --paper:#15122b; --ink:#e8e6ff; --muted:#9c97c7;
  --neon:#ff3d9a; --cyan:#3ee6f0; --line:rgba(232,230,255,.15);
}
:root[data-theme="dark"] [data-genre="historica"]{
  --bg:#1a150f; --paper:#251e16; --ink:#ecdfbf; --muted:#b9a57c;
  --rubric:#e27a62; --lapis:#93abe3; --gold:#d6b55c; --line:rgba(236,223,191,.2);
}
*,*::before,*::after{box-sizing:inherit}
html{scroll-padding-top:calc(env(safe-area-inset-top,0px) + 3.5rem);scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);
  font-family:"Spectral",Georgia,"Times New Roman",serif;font-size:1.0625rem;line-height:1.6}
.type{font-family:"Special Elite","Courier New",Courier,monospace;font-weight:400}
a{color:var(--carbon)}
button{font:inherit;color:inherit;cursor:pointer}
:focus-visible{outline:3px solid var(--carbon);outline-offset:3px}
.wrap{max-width:1080px;margin:0 auto;padding:0 1.25rem}

/* Nav */
nav{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;background:var(--bg);border-bottom:1px solid var(--line)}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:10;background:var(--bg)}
nav .wrap{display:flex;gap:1.25rem;align-items:center;min-height:3.25rem;flex-wrap:wrap}
nav a,nav .g{text-decoration:none;color:var(--ink);font-family:"Special Elite","Courier New",monospace;border:0;background:none;padding:0}
nav a:hover,nav .g:hover{text-decoration:underline}
nav .genres{display:flex;gap:1rem;margin-right:auto}
nav .g[aria-pressed="true"]{color:var(--stamp);text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:2px}

/* Hero */
.hero{padding:3.5rem 0 2.5rem}
.sheet{position:relative;background:var(--paper);padding:3rem 2rem 2.5rem;border-radius:2px 10px 10px 10px;
  box-shadow:0 1px 0 var(--line),0 18px 40px -24px rgba(0,0,0,.45)}
.sheet::before{content:attr(data-tab);position:absolute;top:-2rem;left:0;height:2rem;padding:.35rem 1.1rem 0;
  background:var(--paper);border-radius:8px 8px 0 0;font-family:"Special Elite","Courier New",monospace;font-size:.9rem;color:var(--muted)}
.hero h1{font-size:clamp(2.6rem,9vw,6rem);line-height:.95;margin:0 0 1.25rem;letter-spacing:-.01em}
.hero p{max-width:34em;margin:0 0 1.75rem;font-size:1.15rem;color:var(--muted)}
.stamp{position:absolute;right:1.5rem;top:1.5rem;transform:rotate(-9deg);
  border:4px double var(--stamp);color:var(--stamp);padding:.35rem .9rem;font-size:clamp(1rem,3vw,1.5rem);
  opacity:.85;letter-spacing:.06em;pointer-events:none}
.stamp.hit{animation:thump .5s cubic-bezier(.2,1.6,.4,1) both}
@keyframes thump{from{transform:rotate(-9deg) scale(1.8);opacity:0}to{transform:rotate(-9deg) scale(1);opacity:.85}}
@media (prefers-reduced-motion:reduce){.stamp.hit{animation:none}html{scroll-behavior:auto}}
.actions{display:flex;flex-wrap:wrap;gap:.75rem}
.btn{border:2px solid var(--ink);background:transparent;padding:.6rem 1.1rem;border-radius:3px;font-family:"Special Elite","Courier New",monospace;font-size:1rem}
.btn.solid{background:var(--ink);color:var(--paper)}
.btn:hover{background:var(--ink);color:var(--paper)}

section{padding:3rem 0}
h2{font-size:clamp(1.8rem,5vw,2.6rem);margin:0 0 .4rem;line-height:1.1}
.lede{color:var(--muted);margin:0 0 1.75rem;max-width:38em}

/* Filters */
.tools{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center;margin-bottom:2rem}
.tools input{flex:1 1 240px;min-width:0;padding:.6rem .8rem;border:2px solid var(--ink);background:var(--paper);color:var(--ink);border-radius:3px;font:inherit}
.chip{border:1px solid var(--ink);background:transparent;border-radius:999px;padding:.3rem .9rem;font-size:.95rem;margin:.15rem 0}
.chip[aria-pressed="true"]{background:var(--ink);color:var(--paper)}

/* Author folders */
.folders{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:2.6rem 1.25rem;padding-top:1.4rem}
.folder{position:relative;text-align:left;border:0;background:var(--tab);padding:1.1rem 1.1rem 1.25rem;border-radius:0 6px 6px 6px;min-height:150px;
  display:flex;flex-direction:column;gap:.25rem;transition:transform .15s}
.folder::before{content:attr(data-tab);position:absolute;top:-1.5rem;left:0;height:1.5rem;padding:.2rem .8rem 0;max-width:80%;
  background:var(--tab);border-radius:6px 6px 0 0;font-family:"Special Elite","Courier New",monospace;font-size:.8rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.folder:hover{transform:translateY(-3px)}
.folder .name{font-family:"Special Elite","Courier New",monospace;font-size:1.3rem;line-height:1.2}
.folder .meta{color:var(--muted);font-size:.95rem}
.folder .count{margin-top:auto;font-size:.9rem;color:var(--carbon)}
.empty{padding:2rem;background:var(--paper);border-radius:4px}

/* Timeline */
.order{margin:-.75rem 0 1.5rem}
.decade{display:grid;grid-template-columns:9rem 1fr;gap:1rem;border-top:1px solid var(--line);padding:1.5rem 0}
.decade h3{margin:0;font-family:"Special Elite","Courier New",monospace;font-size:1.5rem;line-height:1.15;font-weight:400;color:var(--stamp)}
.books{display:grid;gap:1.1rem}
.book{display:grid;grid-template-columns:64px 1fr;gap:1rem;align-items:start}
.cover{width:64px;aspect-ratio:2/3;border-radius:2px 4px 4px 2px;padding:.35rem;color:#f4ecd8;display:flex;flex-direction:column;justify-content:space-between;
  font-family:"Special Elite","Courier New",monospace;font-size:.55rem;line-height:1.15;box-shadow:inset 4px 0 0 rgba(0,0,0,.25);overflow:hidden}
.cover b{font-weight:400;font-size:.62rem}
.book h4{margin:0;font-size:1.15rem;line-height:1.3}
.book .by{color:var(--muted);font-size:.95rem}
.book .by button,.book .by a{border:0;background:none;padding:0;color:var(--carbon);text-decoration:underline}
.book .set{font-size:.95rem;color:var(--stamp)}
.book p{margin:.3rem 0 0;max-width:36em}

/* Dossier dialog */
dialog{border:0;padding:0;background:var(--paper);color:var(--ink);width:min(680px,94vw);max-height:88vh;border-radius:4px;box-shadow:0 30px 70px -20px rgba(0,0,0,.6)}
dialog::backdrop{background:rgba(20,16,10,.6)}
.dos{padding:2rem 1.75rem}
.dos header{display:flex;justify-content:space-between;gap:1rem;align-items:start;border-bottom:1px solid var(--line);padding-bottom:1rem;margin-bottom:1.25rem}
.dos h3{margin:0;font-family:"Special Elite","Courier New",monospace;font-weight:400;font-size:1.9rem;line-height:1.1}
.dos .meta{color:var(--muted)}
.close{border:2px solid var(--ink);background:transparent;border-radius:3px;padding:.2rem .7rem}
.dos dl{display:grid;grid-template-columns:auto 1fr;gap:.2rem 1rem;margin:1rem 0 1.5rem}
.dos dt{color:var(--muted)}
.dos dd{margin:0}
.dos .book{padding:.9rem;border-radius:4px}
.dos .book.hit{background:var(--tab)}
.dos .book + .book{margin-top:.4rem}

footer{padding:2.5rem 0 3rem;border-top:1px solid var(--line);color:var(--muted);font-size:.95rem}
footer p{max-width:40em}

@media (max-width:600px){
  .sheet{padding:3.5rem 1.25rem 2rem}
  .stamp{top:.9rem;right:.9rem}
  .decade{grid-template-columns:1fr;gap:.5rem}
  nav .wrap{gap:.9rem}
}

/* ===== Novela histórica: libro impreso antiguo, rúbricas e iniciales ===== */
[data-genre="historica"]{font-family:"EB Garamond",Garamond,"Times New Roman",serif;font-size:1.15rem}
[data-genre="historica"] nav a,[data-genre="historica"] nav .g{font-family:"IM Fell English","EB Garamond",Garamond,serif;font-size:1.1rem}
.title-page{background:var(--paper);border:4px double var(--gold);padding:3.5rem 2rem 3rem;text-align:center;max-width:46rem;margin:0 auto;
  box-shadow:0 18px 40px -26px rgba(0,0,0,.45)}
.hx-title{display:inline-block;text-align:left;font-family:"IM Fell English","EB Garamond",Garamond,serif;font-weight:400;
  font-size:clamp(2.5rem,8vw,5rem);line-height:1;margin:0 0 1.5rem}
.initial{float:left;font-size:2.05em;line-height:.9;padding:.1em .15em .02em;margin:.03em .12em 0 0;
  background:var(--lapis);color:var(--paper);border:3px double var(--gold)}
.hx-sub{font-style:italic;color:var(--muted);max-width:30em;margin:0 auto 1rem;font-size:1.25rem;line-height:1.5}
.fleuron{color:var(--rubric);font-size:1.6rem;margin:0 0 1.5rem;line-height:1}
.hx-actions{display:flex;flex-wrap:wrap;gap:1.75rem;justify-content:center}
.hx-btn{border:0;background:none;padding:.15rem 0;font-family:"IM Fell English","EB Garamond",Garamond,serif;font-size:1.25rem;
  color:var(--rubric);border-bottom:1px solid currentColor}
.hx-btn:hover{color:var(--lapis)}
[data-genre="historica"] h2{font-family:"IM Fell English","EB Garamond",Garamond,serif;font-weight:400;text-align:center}
[data-genre="historica"] .lede{text-align:center;margin-left:auto;margin-right:auto;font-style:italic}
[data-genre="historica"] .tools{justify-content:center}
[data-genre="historica"] .tools input{flex:0 1 26rem;border:0;border-bottom:1px solid var(--ink);background:transparent;border-radius:0;font-style:italic}
[data-genre="historica"] [role="group"]{text-align:center}
[data-genre="historica"] .chip{border:0;border-radius:0;padding:.2rem .45rem;font-style:italic;color:var(--lapis);background:none}
[data-genre="historica"] .chip[aria-pressed="true"]{color:var(--rubric);text-decoration:underline;text-underline-offset:4px}
.index{list-style:none;margin:0 auto;padding:0;max-width:50rem;columns:2 20rem;column-gap:3.5rem}
.index li{break-inside:avoid;margin:0 0 1.15rem}
.entry{display:block;width:100%;text-align:left;border:0;background:none;padding:.15rem 0}
.entry .row{display:flex;align-items:baseline;gap:.45rem}
.entry .en-name{font-variant:small-caps;letter-spacing:.03em;font-size:1.25rem}
.entry .leader{flex:1;min-width:1rem;border-bottom:1px dotted var(--muted);transform:translateY(-.3em)}
.entry .en-years{font-variant-numeric:oldstyle-nums;color:var(--muted);white-space:nowrap}
.entry .en-tag{display:block;font-style:italic;color:var(--muted);font-size:1.02rem}
.entry:hover .en-name{color:var(--rubric)}
.era{max-width:44rem;margin:0 auto;padding:1.25rem 0}
.era-h{display:flex;align-items:center;gap:1rem;font-family:"IM Fell English","EB Garamond",Garamond,serif;font-weight:400;
  color:var(--rubric);font-size:1.5rem;margin:0 0 1.25rem;text-align:center}
.era-h::before,.era-h::after{content:"";flex:1;border-top:1px solid var(--gold)}
.hx-book{display:grid;grid-template-columns:4.5rem 1fr;gap:1.25rem;margin-bottom:1.5rem}
.hx-book .yr{font-family:"IM Fell English","EB Garamond",Garamond,serif;color:var(--rubric);font-size:1.35rem;text-align:right;
  font-variant-numeric:oldstyle-nums;line-height:1.25}
.hx-book h4{margin:0;font-style:italic;font-weight:400;font-size:1.35rem;line-height:1.25}
.hx-book .by{color:var(--muted)}
.hx-book .by button,.hx-book .by a{border:0;background:none;padding:0;color:var(--lapis);font-variant:small-caps;letter-spacing:.03em;text-decoration:underline;text-decoration-thickness:1px}
.hx-book .set{font-style:italic;color:var(--muted)}
.hx-book p{margin:.3rem 0 0;max-width:34em}
dialog.hx-dlg{font-family:"EB Garamond",Garamond,serif;font-size:1.15rem;border:4px double var(--gold);border-radius:0}
.hx-dlg h3{font-family:"IM Fell English","EB Garamond",Garamond,serif}
.hx-dlg .meta{font-style:italic}
.hx-dlg .close{border:0;border-bottom:1px solid var(--ink);border-radius:0;font-style:italic;padding:0}
.hx-dlg .hx-book{padding:.6rem;margin:0}
.hx-dlg .hx-book.hit{background:color-mix(in srgb,var(--gold) 18%,transparent)}
.drop::first-letter{float:left;font-family:"IM Fell English","EB Garamond",Garamond,serif;font-size:3.4em;line-height:.85;
  padding:.06em .1em 0 0;color:var(--rubric)}
[data-genre="historica"] footer{text-align:center;font-style:italic}
[data-genre="historica"] footer p{margin:0 auto}
@media (max-width:600px){
  .title-page{padding:2.5rem 1.25rem 2rem}
  .hx-book{grid-template-columns:3.25rem 1fr;gap:.9rem}
}

/* ===== Ciencia ficción: terminal ciberpunk, neón y esquinas cortadas ===== */
[data-genre="cf"]{font-family:"Chakra Petch","Segoe UI",system-ui,sans-serif;font-size:1.05rem}
[data-genre="cf"] nav a,[data-genre="cf"] nav .g{font-family:"Share Tech Mono","Courier New",monospace}
.mono{font-family:"Share Tech Mono","Courier New",monospace}
.term{position:relative;background:var(--paper);border:1px solid var(--cyan);overflow:hidden;
  clip-path:polygon(0 0,calc(100% - 28px) 0,100% 28px,100% 100%,28px 100%,0 calc(100% - 28px))}
.term::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:repeating-linear-gradient(to bottom,transparent 0 3px,color-mix(in srgb,var(--ink) 6%,transparent) 3px 4px)}
.term-bar{display:flex;justify-content:space-between;gap:1rem;padding:.5rem 1.1rem;border-bottom:1px solid var(--line);
  font-family:"Share Tech Mono","Courier New",monospace;font-size:.85rem;color:var(--muted)}
.term-bar .dots{color:var(--neon);letter-spacing:.3em}
.term-body{padding:2rem 2rem 2.5rem}
.boot{font-family:"Share Tech Mono","Courier New",monospace;color:var(--cyan);margin:0 0 1.5rem;font-size:.95rem}
.boot span{display:block;opacity:0;animation:bootline .01s linear forwards}
.boot span:nth-child(1){animation-delay:.15s}.boot span:nth-child(2){animation-delay:.55s}.boot span:nth-child(3){animation-delay:.95s}
@keyframes bootline{to{opacity:1}}
.glitch{font-family:"Chakra Petch","Segoe UI",system-ui,sans-serif;font-weight:700;font-size:clamp(2.6rem,9vw,6rem);line-height:.92;
  margin:0 0 1.25rem;letter-spacing:-.01em;text-shadow:3px 0 var(--neon),-3px 0 var(--cyan);animation:glitch .9s steps(3) 1.15s 1 both}
@keyframes glitch{
  0%{text-shadow:9px 0 var(--neon),-9px 0 var(--cyan);transform:translateX(-4px);clip-path:inset(10% 0 40% 0)}
  33%{transform:translateX(5px) skewX(-8deg);clip-path:inset(50% 0 5% 0)}
  66%{text-shadow:-6px 0 var(--neon),6px 0 var(--cyan);transform:none;clip-path:inset(0 0 0 0)}
  100%{text-shadow:3px 0 var(--neon),-3px 0 var(--cyan);transform:none;clip-path:none}}
@media (prefers-reduced-motion:reduce){.boot span{opacity:1;animation:none}.glitch{animation:none}}
.cf-sub{color:var(--muted);max-width:34em;font-size:1.15rem;margin:0 0 1.75rem}
.cf-btn{border:1px solid var(--cyan);background:transparent;color:var(--cyan);padding:.65rem 1.25rem;
  font-family:"Share Tech Mono","Courier New",monospace;font-size:1rem;
  clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,12px 100%,0 calc(100% - 12px))}
.cf-btn.solid{background:var(--neon);border-color:var(--neon);color:var(--paper)}
.cf-btn:hover{background:var(--cyan);border-color:var(--cyan);color:var(--paper)}
[data-genre="cf"] h2{font-weight:700}
[data-genre="cf"] .tools input{border:1px solid var(--cyan);border-radius:0;font-family:"Share Tech Mono","Courier New",monospace}
[data-genre="cf"] .chip{border:1px solid var(--cyan);border-radius:0;color:var(--cyan);background:none;font-family:"Share Tech Mono","Courier New",monospace;font-size:.9rem}
[data-genre="cf"] .chip[aria-pressed="true"]{background:var(--neon);border-color:var(--neon);color:var(--paper)}
.nodes{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:1rem}
.node{position:relative;text-align:left;background:var(--paper);border:0;border-left:3px solid var(--cyan);padding:1.1rem 1.25rem 1.2rem;
  display:flex;flex-direction:column;gap:.3rem;min-height:165px;
  clip-path:polygon(0 0,calc(100% - 18px) 0,100% 18px,100% 100%,0 100%)}
.node:hover{border-left-color:var(--neon)}
.node:hover .n-name{color:var(--neon)}
.n-name{font-weight:700;font-size:1.3rem;line-height:1.15}
.n-meta{font-family:"Share Tech Mono","Courier New",monospace;font-size:.85rem;color:var(--muted)}
.n-count{margin-top:auto;font-family:"Share Tech Mono","Courier New",monospace;font-size:.85rem;color:var(--cyan)}
.log{display:grid;grid-template-columns:10rem 1fr;gap:1rem;border-top:1px solid var(--line);padding:1.5rem 0}
.log h3{margin:0;font-family:"Share Tech Mono","Courier New",monospace;font-weight:400;color:var(--neon);font-size:1.05rem}
.cf-book{display:grid;grid-template-columns:3.5rem 1fr;gap:1rem;margin-bottom:1.3rem}
.cf-book .yr{font-family:"Share Tech Mono","Courier New",monospace;color:var(--muted);padding-top:.15rem}
.cf-book h4{margin:0;font-size:1.2rem;font-weight:700;line-height:1.25}
.cf-book .by button,.cf-book .by a{border:0;background:none;padding:0;color:var(--cyan);font-family:"Share Tech Mono","Courier New",monospace;font-size:.9rem;text-decoration:underline}
.cf-book .set{font-family:"Share Tech Mono","Courier New",monospace;font-size:.88rem;color:var(--cyan)}
.cf-book p{margin:.3rem 0 0;max-width:36em}
dialog.cf-dlg{font-family:"Chakra Petch","Segoe UI",system-ui,sans-serif;border:1px solid var(--cyan);border-radius:0}
.cf-dlg h3{font-family:"Chakra Petch","Segoe UI",system-ui,sans-serif;font-weight:700;text-shadow:2px 0 var(--neon),-2px 0 var(--cyan)}
.cf-dlg .meta{font-family:"Share Tech Mono","Courier New",monospace;font-size:.9rem}
.cf-dlg .close{border:1px solid var(--cyan);color:var(--cyan);border-radius:0;font-family:"Share Tech Mono","Courier New",monospace}
.cf-dlg .cf-book{padding:.6rem;margin:0}
.cf-dlg .cf-book.hit{background:color-mix(in srgb,var(--neon) 14%,transparent)}
@media (max-width:600px){
  .term-body{padding:1.5rem 1.25rem 2rem}
  .log{grid-template-columns:1fr;gap:.5rem}
}

/* ===== Terror: cripta gótica a la luz de una vela ===== */
[data-genre="terror"]{font-family:"Crimson Pro",Georgia,"Times New Roman",serif;font-size:1.15rem}
[data-genre="terror"] nav a,[data-genre="terror"] nav .g{font-family:"Cormorant Garamond",Georgia,serif;font-weight:600;font-size:1.1rem}
.crypt{position:relative;overflow:hidden;background:var(--paper);border:1px solid var(--line);text-align:center;padding:4.5rem 2rem 3.25rem;
  border-radius:50% 50% 6px 6px / 130px 130px 6px 6px}
.crypt::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(circle at var(--x,50%) var(--y,42%),transparent 0,transparent 110px,var(--shade) 420px)}
.crypt > *{position:relative}
.cross{color:var(--blood);font-size:1.8rem;line-height:1;margin:0 0 .75rem}
.gothic{font-family:"UnifrakturMaguntia","Old English Text MT",serif;font-weight:400;font-size:clamp(2.7rem,9vw,5.5rem);line-height:1.02;margin:0 0 1.25rem}
.t-sub{font-style:italic;color:var(--muted);max-width:30em;margin:0 auto 1.75rem;font-size:1.25rem;line-height:1.5}
.t-actions{display:flex;flex-wrap:wrap;gap:.9rem;justify-content:center}
.t-btn{border:1px solid var(--blood);background:transparent;color:var(--blood);padding:.55rem 1.35rem;
  font-family:"Cormorant Garamond",Georgia,serif;font-weight:600;font-size:1.2rem;font-variant:small-caps;letter-spacing:.04em}
.t-btn.solid{background:var(--blood);color:var(--paper)}
.t-btn:hover{background:var(--ink);border-color:var(--ink);color:var(--paper)}
[data-genre="terror"] h2{font-family:"Cormorant Garamond",Georgia,serif;font-weight:600;text-align:center}
[data-genre="terror"] .lede{text-align:center;margin-left:auto;margin-right:auto;font-style:italic}
[data-genre="terror"] .tools{justify-content:center}
[data-genre="terror"] [role="group"]{text-align:center}
[data-genre="terror"] .tools input{flex:0 1 26rem;border:0;border-bottom:1px solid var(--blood);background:transparent;border-radius:0;font-style:italic}
[data-genre="terror"] .chip{border:0;border-radius:0;background:none;color:var(--muted);font-variant:small-caps;letter-spacing:.05em}
[data-genre="terror"] .chip[aria-pressed="true"]{color:var(--blood);text-decoration:underline;text-underline-offset:4px}
.graves{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:1.5rem}
.grave{text-align:center;background:var(--paper);border:1px solid var(--line);border-radius:50% 50% 4px 4px / 90px 90px 4px 4px;
  padding:2.4rem 1rem 1.4rem;display:flex;flex-direction:column;align-items:center;gap:.3rem;min-height:235px;transition:box-shadow .25s}
.grave:hover{box-shadow:0 0 0 1px var(--candle),0 0 34px -8px var(--candle)}
.g-cross{color:var(--blood);line-height:1}
.g-name{font-family:"Cormorant Garamond",Georgia,serif;font-weight:600;font-size:1.45rem;line-height:1.1}
.g-years{font-variant:small-caps;letter-spacing:.12em;color:var(--muted)}
.g-tag{font-style:italic;color:var(--muted);font-size:1rem;line-height:1.35}
.g-count{margin-top:auto;color:var(--blood);font-size:.95rem}
.chron{max-width:44rem;margin:0 auto;padding:1.25rem 0}
.chron-h{text-align:center;font-family:"Cormorant Garamond",Georgia,serif;font-weight:600;font-variant:small-caps;letter-spacing:.08em;
  color:var(--blood);font-size:1.45rem;margin:0 0 1.25rem}
.t-book{display:grid;grid-template-columns:4.25rem 1fr;gap:1.1rem;margin-bottom:1.45rem}
.t-book .yr{font-family:"UnifrakturMaguntia","Old English Text MT",serif;color:var(--blood);font-size:1.35rem;text-align:right;line-height:1.2}
.t-book h4{margin:0;font-family:"Cormorant Garamond",Georgia,serif;font-weight:600;font-style:italic;font-size:1.45rem;line-height:1.2}
.t-book .by button,.t-book .by a{border:0;background:none;padding:0;color:var(--candle);font-variant:small-caps;letter-spacing:.04em;text-decoration:underline;text-decoration-thickness:1px}
.t-book .set{font-style:italic;color:var(--muted)}
.t-book p{margin:.3rem 0 0;max-width:34em}
dialog.t-dlg{font-family:"Crimson Pro",Georgia,serif;font-size:1.12rem;border:1px solid var(--blood);border-radius:50% 50% 4px 4px / 70px 70px 4px 4px}
.t-dlg .dos{padding-top:3.25rem}
.t-dlg h3{font-family:"UnifrakturMaguntia","Old English Text MT",serif;font-weight:400}
.t-dlg .meta{font-style:italic}
.t-dlg .close{border:1px solid var(--blood);color:var(--blood);border-radius:0;font-variant:small-caps}
.t-dlg .t-book{padding:.6rem;margin:0}
.t-dlg .t-book.hit{background:color-mix(in srgb,var(--blood) 12%,transparent)}
.blood-drop::first-letter{float:left;font-family:"UnifrakturMaguntia","Old English Text MT",serif;font-size:3.3em;line-height:.85;
  padding:.06em .12em 0 0;color:var(--blood)}
[data-genre="terror"] footer{text-align:center;font-style:italic}
[data-genre="terror"] footer p{margin:0 auto}

/* Menú de géneros compacto en móvil */
nav .genres{overflow-x:auto;white-space:nowrap;scrollbar-width:none}
nav .genres::-webkit-scrollbar{display:none}
@media (max-width:600px){
  nav .wrap{padding-top:.4rem;padding-bottom:.4rem;row-gap:.3rem}
  nav .genres{flex:1 1 100%;margin-right:0;padding-bottom:.15rem}
  .crypt{padding:3.5rem 1.25rem 2.5rem;border-radius:50% 50% 6px 6px / 80px 80px 6px 6px}
  .t-book{grid-template-columns:3.25rem 1fr;gap:.9rem}
}

/* ===== Fantasía: atlas de mundos inventados ===== */
[data-genre="fantasia"]{font-family:"Alegreya",Georgia,serif;font-size:1.12rem}
[data-genre="fantasia"] nav a,[data-genre="fantasia"] nav .g{font-family:"Alegreya",Georgia,serif;font-variant:small-caps;letter-spacing:.04em;font-size:1.1rem}
.atlas{position:relative;padding:3.25rem 2rem 2.75rem;border:7px dashed var(--ink);outline:1px solid var(--ink);outline-offset:4px;
  background:
   url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='420' height='300' viewBox='0 0 420 300'%3E%3Cg fill='none' stroke='%237d8f7f' stroke-opacity='.32' stroke-width='1'%3E%3Cpath d='M300 150c0-45 30-80 10-110s-80-25-120 5-75 50-70 95 50 80 100 85 80-30 80-75z'/%3E%3Cpath d='M280 150c0-35 22-60 6-82s-60-18-92 4-55 38-52 72 38 60 76 63 62-22 62-57z'/%3E%3Cpath d='M258 150c0-24 14-40 2-55s-40-12-62 3-37 26-35 49 25 40 51 42 44-15 44-39z'/%3E%3Cpath d='M236 150c0-13 7-21 0-29s-21-6-33 2-20 14-19 26 13 21 27 22 25-8 25-21z'/%3E%3Cpath d='M0 260c60-20 120 10 180-5s110-40 170-20 70 30 70 30'/%3E%3Cpath d='M0 282c60-18 120 8 180-6s110-36 170-18 70 26 70 26'/%3E%3Cpath d='M0 40c40 10 70-15 110-5s60 25 40 45'/%3E%3C/g%3E%3C/svg%3E") 0 0/420px 300px,
   linear-gradient(var(--paper),var(--paper)) padding-box,
   var(--gold) border-box}
.compass{position:absolute;right:1.5rem;top:1.25rem;width:clamp(70px,14vw,120px);height:auto;color:var(--ink);
  animation:compass 1.8s cubic-bezier(.2,.8,.2,1) .2s both}
@keyframes compass{from{transform:rotate(-120deg);opacity:0}to{transform:rotate(0);opacity:1}}
@media (prefers-reduced-motion:reduce){.compass{animation:none}}
.realm{font-family:"Uncial Antiqua",Georgia,serif;font-weight:400;font-size:clamp(2.4rem,8.5vw,5.2rem);line-height:1.02;margin:0 0 1.25rem;max-width:11em}
.f-sub{max-width:32em;margin:0 0 1.75rem;font-size:1.2rem;color:var(--muted);font-style:italic}
.f-btn{border:1px solid var(--arcane);background:transparent;color:var(--arcane);padding:.55rem 1.3rem;border-radius:2px;
  font-family:"Alegreya",Georgia,serif;font-variant:small-caps;letter-spacing:.05em;font-size:1.12rem}
.f-btn.solid{background:var(--arcane);color:var(--paper)}
.f-btn:hover{background:var(--ink);border-color:var(--ink);color:var(--paper)}
[data-genre="fantasia"] h2{font-family:"Uncial Antiqua",Georgia,serif;font-weight:400}
[data-genre="fantasia"] .tools input{border:1px solid var(--ink);border-radius:2px;font-style:italic}
[data-genre="fantasia"] .chip{border:1px solid var(--line);border-radius:2px;color:var(--ink);background:none;font-variant:small-caps;letter-spacing:.04em}
[data-genre="fantasia"] .chip[aria-pressed="true"]{background:var(--arcane);border-color:var(--arcane);color:var(--paper)}
.cartouches{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:1.6rem}
.cartouche{text-align:center;background:var(--paper);border:1px solid var(--ink);outline:1px solid var(--ink);outline-offset:4px;border-radius:2px;
  padding:1.3rem 1rem 1.2rem;margin:5px;display:flex;flex-direction:column;align-items:center;gap:.3rem;min-height:190px}
.cartouche:hover{outline-color:var(--arcane);border-color:var(--arcane)}
.c-world{font-family:"Uncial Antiqua",Georgia,serif;color:var(--arcane);font-size:1.35rem;line-height:1.15}
.c-mark{color:var(--gold);font-size:.9rem;line-height:1}
.c-name{font-weight:700;font-size:1.12rem}
.c-meta{color:var(--muted);font-size:.95rem}
.c-sub{margin-top:auto;font-variant:small-caps;letter-spacing:.05em;color:var(--gold);font-size:.95rem}
.leg{max-width:46rem;margin:0 auto;padding:1rem 0 1.5rem}
.leg-h{display:inline-block;font-family:"Uncial Antiqua",Georgia,serif;font-weight:400;font-size:1.3rem;color:var(--arcane);
  border:1px solid var(--ink);outline:1px solid var(--ink);outline-offset:3px;padding:.2rem .9rem;margin:0 0 1.25rem .25rem;background:var(--paper)}
.route{border-left:2px dashed var(--arcane);margin-left:.6rem;padding-left:1.6rem}
.f-book{position:relative;margin-bottom:1.5rem}
.f-book::before{content:"";position:absolute;left:calc(-1.6rem - 8px);top:.45rem;width:12px;height:12px;border-radius:50%;
  background:var(--paper);border:2px solid var(--arcane)}
.f-book h4{margin:0;font-size:1.3rem;font-weight:700;line-height:1.25}
.f-book .by{color:var(--muted)}
.f-book .by button,.f-book .by a{border:0;background:none;padding:0;color:var(--arcane);text-decoration:underline;text-decoration-thickness:1px}
.f-book .set{font-style:italic;color:var(--gold)}
.f-book p{margin:.3rem 0 0;max-width:36em}
dialog.f-dlg{font-family:"Alegreya",Georgia,serif;font-size:1.1rem;border:6px dashed var(--ink);border-radius:0;
  background:linear-gradient(var(--paper),var(--paper)) padding-box,var(--gold) border-box}
.f-dlg h3{font-family:"Uncial Antiqua",Georgia,serif;font-weight:400}
.f-dlg .close{border:1px solid var(--arcane);color:var(--arcane);border-radius:2px;font-variant:small-caps}
.f-dlg .route{margin-top:1rem}
.f-dlg .f-book.hit h4{color:var(--arcane)}
.f-drop::first-letter{float:left;font-family:"Uncial Antiqua",Georgia,serif;font-size:3.1em;line-height:.9;padding:.04em .12em 0 0;color:var(--arcane)}
.saga-h{font-family:"Uncial Antiqua",Georgia,serif;font-weight:400;font-size:1.15rem;color:var(--arcane);margin:1.5rem 0 .5rem}
.saga{margin:0 0 1.25rem;padding-left:1.6rem}
.saga li{padding:.1rem 0}
.saga li::marker{color:var(--gold);font-weight:700}
@media (max-width:600px){
  .atlas{padding:5.5rem 1.25rem 2rem}
  .compass{right:1rem;top:1rem}
}

/* ===== Web multipágina ===== */
[hidden]{display:none!important}
.skip{position:absolute;left:-999px;top:0}
.skip:focus{left:1rem;top:1rem;z-index:20;background:var(--paper);padding:.5rem 1rem}
nav .brand{font-weight:600;white-space:nowrap;order:1}
nav .genres{order:2;margin-right:auto}
nav .sagas-link{order:3;white-space:nowrap}
nav .g[aria-current="page"]{color:var(--stamp);text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:2px}
a.btn,a.hx-btn,a.cf-btn,a.t-btn,a.f-btn{display:inline-block;text-decoration:none}
a.folder,a.node,a.grave,a.cartouche,a.entry,a.door{text-decoration:none;color:inherit}
.buy{display:inline-block;margin-top:.45rem;font-size:.95rem;color:var(--carbon);text-decoration:underline;text-underline-offset:3px}
.buy::after{content:" ↗";text-decoration:none}
.muted{color:var(--muted)}
.empty{margin-top:1rem}

/* Tipografías de título por género */
.home-h{font-family:"Spectral",Georgia,serif;font-weight:600;font-size:clamp(2.3rem,7vw,4.2rem);line-height:1.05;margin:0 0 1rem}
[data-genre="negra"] :is(.author-h,.door-h,.sg-h){font-family:"Special Elite","Courier New",monospace;font-weight:400}
[data-genre="historica"] :is(.author-h,.door-h,.sg-h){font-family:"IM Fell English","EB Garamond",Garamond,serif;font-weight:400}
[data-genre="cf"] :is(.author-h,.door-h,.sg-h){font-family:"Chakra Petch",system-ui,sans-serif;font-weight:700;text-shadow:2px 0 var(--neon),-2px 0 var(--cyan)}
[data-genre="terror"] :is(.author-h,.door-h,.sg-h){font-family:"UnifrakturMaguntia","Old English Text MT",serif;font-weight:400}
[data-genre="fantasia"] :is(.author-h,.door-h,.sg-h){font-family:"Uncial Antiqua",Georgia,serif;font-weight:400}

/* Páginas de autor y de saga */
.author-page{padding:2rem 1.25rem 3rem}
.crumbs{color:var(--muted);font-size:.95rem;margin:0 0 1rem}
.a-panel{background:var(--paper);padding:2.25rem 2rem;max-width:48rem;margin:0 0 2.5rem}
[data-genre="negra"] .a-panel{border-radius:0 10px 10px 10px;box-shadow:0 18px 40px -26px rgba(0,0,0,.45)}
[data-genre="historica"] .a-panel{border:4px double var(--gold)}
[data-genre="cf"] .a-panel{border-left:3px solid var(--cyan);clip-path:polygon(0 0,calc(100% - 26px) 0,100% 26px,100% 100%,0 100%)}
[data-genre="terror"] .a-panel{border:1px solid var(--blood);border-radius:50% 50% 4px 4px / 70px 70px 4px 4px;padding-top:3.5rem}
[data-genre="fantasia"] .a-panel{border:6px dashed var(--ink);background:linear-gradient(var(--paper),var(--paper)) padding-box,var(--gold) border-box}
.author-h{font-size:clamp(2rem,6vw,3.2rem);line-height:1.08;margin:0 0 .4rem}
.a-meta{color:var(--muted);margin:0 0 1.25rem}
.a-dl{display:grid;grid-template-columns:auto 1fr;gap:.25rem 1rem;margin:1.25rem 0 1.75rem}
.a-dl dt{color:var(--muted)}
.a-dl dd{margin:0}
.author-page h2{font-size:1.5rem;margin:2rem 0 1rem}
.note{color:var(--muted);font-style:italic}
.saga{margin:0 0 1rem;padding-left:1.6rem}
.saga li{padding:.15rem 0}
.saga li::marker{color:var(--stamp);font-weight:700}
.saga-big li{padding:.55rem 0;border-bottom:1px solid var(--line)}
.saga-big .st{font-weight:600;font-size:1.1rem;margin-right:.6rem}
.saga-big .buy{margin-top:0}
.more ul,.saga-list{padding-left:1.2rem}
.more li,.saga-list li{margin:.3rem 0}
.sagas-box{padding-top:0}
.author-page .book,.author-page .hx-book,.author-page .cf-book,.author-page .t-book{margin-bottom:1.4rem}

/* Portada */
.home{padding-top:3rem;padding-bottom:3rem}
.home-hero{max-width:42rem;margin-bottom:2.5rem}
.doors{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1.5rem}
.door{display:flex;flex-direction:column;gap:.6rem;padding:1.75rem 1.5rem;min-height:210px;background:var(--bg);color:var(--ink);border:1px solid var(--line);transition:transform .15s}
.door:hover{transform:translateY(-3px)}
.door-h{font-size:1.8rem;line-height:1.1}
.door-t{color:var(--muted)}
.door-n{margin-top:auto;color:var(--stamp);font-size:.95rem}
.door[data-genre="negra"]{background:var(--paper);border-radius:0 10px 10px 10px}
.door[data-genre="historica"]{border:4px double var(--gold)}
.door[data-genre="cf"]{border:0;border-left:3px solid var(--cyan);clip-path:polygon(0 0,calc(100% - 20px) 0,100% 20px,100% 100%,0 100%)}
.door[data-genre="terror"]{border-radius:50% 50% 4px 4px / 60px 60px 4px 4px;padding-top:2.75rem;text-align:center;align-items:center}
.door[data-genre="fantasia"]{border:5px dashed var(--ink);background:linear-gradient(var(--bg),var(--bg)) padding-box,var(--gold) border-box}
.home-sagas{margin-top:3rem}
.sagas-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.25rem}
.sg{background:var(--bg);color:var(--ink);padding:1.25rem 1.5rem;border:1px solid var(--line)}
.sg a{color:var(--carbon)}
.sg-h{font-size:1.5rem;margin:0 0 .5rem}

.site-foot{margin-top:1rem}
.site-foot .legal{font-size:.9rem}
.site-foot .legal a{margin-right:1rem}
.legal-page h2{font-size:1.3rem}
@media (max-width:600px){
  nav .sagas-link{order:2;margin-left:auto}
  nav .genres{order:3;margin-right:0}
  nav .wrap{gap:.4rem .9rem}
  nav a,nav .g{font-size:.9rem!important}
  .a-panel{padding:1.75rem 1.25rem}
  [data-genre="terror"] .a-panel{border-radius:50% 50% 4px 4px / 40px 40px 4px 4px}
}