:root{
  --paper:#FBF9F5;
  --paper-2:#F4F0EA;
  --ink:#1a1a18;
  --muted:#6a645e;
  --rule:#3a3733;
  --accent:#a8423f;

  --font-body: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono","Courier New", monospace;
  --font-display: ui-serif, Georgia, "Times New Roman", serif;

  /* Spacing scale */
  --space-xs: 6px;
  --space-sm: 12px;
  --space-md: 20px;
  --space-lg: 36px;
  --space-xl: 56px;

  /* Radius scale */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;

  /* Transitions */
  --ease-out: cubic-bezier(.22, .61, .36, 1);
  --duration: .2s;
}

*{box-sizing:border-box}
::selection{background: color-mix(in srgb, var(--accent) 18%, transparent); color: var(--ink)}
html,body{height:100%}
body{
  margin:0;
  font:400 15px/1.65 var(--font-body);
  color:var(--ink);
  background:var(--paper);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  letter-spacing: .01em;
}
body.no-scroll{overflow:hidden}
html{overflow-x:hidden}
body{overflow-x:hidden}

a{color:inherit}

/* Focus visible for keyboard navigation */
:focus-visible{
  outline: 2px solid var(--accent);
  outline-offset: 2px;
  border-radius: 4px;
}
:focus:not(:focus-visible){outline:none}
.link{
  color:inherit;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  text-decoration-color: color-mix(in srgb, var(--rule) 35%, transparent);
  transition: color var(--duration) var(--ease-out), text-decoration-color var(--duration) var(--ease-out);
}
.link:hover{
  color:var(--accent);
  text-decoration-color: var(--accent);
}

.container{
  max-width: 980px;
  margin: 0 auto;
  padding: 28px 18px 48px;
}

/* Header centrado */
.site-header{
  position:sticky;
  top:0;
  z-index:20;
  background: color-mix(in srgb, var(--paper) 88%, transparent);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid color-mix(in srgb, var(--rule) 12%, transparent);
}
.site-header__inner{
  max-width: 980px;
  margin: 0 auto;
  padding: 12px 18px;
  position:relative;
  display:flex;
  justify-content:center;
  align-items:center;
  gap: 12px;
}
.brand{
  position:absolute;
  left:18px;
  display:flex;
  align-items:center;
  text-decoration:none;
}
.logo{
  height: 88px;
  width:auto;
  display:block;
}

.nav{
  display:flex;
  gap:14px;
  align-items:center;
  flex-wrap:wrap;
  justify-content:center;
}
.nav a{
  text-decoration:none;
  border-bottom:1px solid transparent;
  padding: 22px 0;
  transition: color var(--duration) var(--ease-out), border-color var(--duration) var(--ease-out);
}
.nav a:hover{border-bottom-color:var(--accent); color: var(--accent)}
.nav a[aria-current="page"]{border-bottom-color:var(--accent); color:var(--accent)}

@media (max-width: 620px){
  .site-header__inner{
    justify-content:space-between;
    flex-wrap:wrap;
  }
  .brand{position:static}
  .nav{width:100%; padding-top:8px}
}

/* (Nav contact dropdown removed — Contacto es enlace directo) */

/* Dictionary entries */
.entry{
  padding: var(--space-xl) 0 var(--space-lg);
}
.entry__rule{
  height:1px;
  background: linear-gradient(90deg, color-mix(in srgb, var(--rule) 50%, transparent), color-mix(in srgb, var(--rule) 15%, transparent));
  margin: 0 0 var(--space-md);
}
.entry__rule--bottom{
  margin: var(--space-lg) 0 0;
}

.entry__headword{
  margin: 0;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: clamp(38px, 6.2vw, 66px);
  letter-spacing: -.02em;
  line-height: 1.02;
  color: var(--ink);
}
.entry__headword--h2{
  font-size: clamp(30px, 5vw, 48px);
}

.entry__etym{
  margin: 12px 0 20px;
  color: var(--muted);
  font-size: clamp(14px, 1.8vw, 17px);
  letter-spacing: .01em;
}
.entry__etym em{font-family: var(--font-display); font-style: italic; color: var(--ink)}

.entry__defs{
  margin: 0;
  padding-left: 1.35rem;
}
.entry__defs li{
  font-family: var(--font-display);
  font-size: clamp(22px, 3.2vw, 32px);
  line-height: 1.28;
  letter-spacing: .01em;
}

.entry__notes{
  margin: var(--space-md) 0 0;
  padding: 0;
  display: grid;
  gap: var(--space-sm);
  font-size: 15px;
}
.entry__row{
  display:grid;
  grid-template-columns: 180px 1fr;
  gap: 16px;
  align-items:start;
}
.entry__notes dt{
  margin:0;
  font-weight: 700;
}
.entry__notes dd{
  margin:0;
  color: var(--muted);
}

.entry__picks{
  display:flex;
  flex-wrap:wrap;
  gap: 8px;
}
.dot{color: color-mix(in srgb, var(--muted) 80%, transparent)}

.entry__linkline{margin: 14px 0 0}

.entry--compact{
  padding: var(--space-lg) 0 var(--space-md);
  border-top: 1px solid color-mix(in srgb, var(--rule) 10%, transparent);
}
.entry--compact .entry__etym{margin-bottom: 14px}
.entry--compact .entry__defs li{
  font-size: clamp(19px, 2.8vw, 28px);
}

/* “Ver más proyectos” sutil pero presente */
.entry__more{margin: 14px 0 0}
.more-link{
  font-weight: 700;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 4px;
  text-decoration-color: color-mix(in srgb, var(--rule) 40%, transparent);
  transition: color var(--duration) var(--ease-out), text-decoration-color var(--duration) var(--ease-out);
}
.more-link:hover{
  color:var(--accent);
  text-decoration-color: var(--accent);
}

/* Buttons */
.btn{
  appearance:none;
  border: 1px solid color-mix(in srgb, var(--rule) 55%, transparent);
  background: transparent;
  color: var(--ink);
  padding: 10px 18px;
  border-radius: var(--radius-md);
  text-decoration:none;
  cursor:pointer;
  font: inherit;
  font-size: .92rem;
  transition: transform var(--duration) var(--ease-out), background var(--duration) var(--ease-out), border-color var(--duration) var(--ease-out), box-shadow var(--duration) var(--ease-out);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
}
.btn:hover{
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--accent) 55%, transparent);
  background: color-mix(in srgb, var(--paper-2) 70%, transparent);
  box-shadow: 0 4px 12px rgba(0,0,0,.06);
}
.btn:active{transform: translateY(0); box-shadow: none}
.btn--primary{
  background: var(--accent);
  border-color: var(--accent);
  color: var(--paper);
}
.btn--primary:hover{
  background: color-mix(in srgb, var(--accent) 85%, black);
  box-shadow: 0 4px 16px color-mix(in srgb, var(--accent) 25%, transparent);
}

/* Footer */
.site-footer{
  padding: 28px 18px 34px;
  color: var(--muted);
  font-size: .85rem;
  border-top: 1px solid color-mix(in srgb, var(--rule) 8%, transparent);
  margin-top: var(--space-lg);
}
.site-footer small,
.site-footer__inner{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  flex-wrap:wrap;
}

/* Splash */
.splash{
  position:fixed;
  inset:0;
  display:grid;
  place-items:center;
  background: var(--paper);
  z-index:9999;
  opacity:1;
  transition: opacity .28s ease-out;
}
.splash__card{
  display:grid;
  place-items:center;
  gap:12px;
  text-align:center;
  padding: 12px;
}
.splash__img{
  height: clamp(220px, 52vh, 720px);
  width: auto;
  max-width: 86vw;
  border-radius: var(--radius-md);
  filter: drop-shadow(0 12px 32px rgba(0,0,0,.12));
  animation: float-y 4s ease-in-out infinite alternate;
}
.splash__opt{
  font-size: .95rem;
  color: var(--muted);
}
.btn--splash{min-width:140px}
@media (prefers-reduced-motion: reduce){
  .splash__img{animation:none}
}
@keyframes float-y{
  from{transform:translateY(-2.5%)}
  to{transform:translateY(2.5%)}
}
@keyframes fall-out{
  to{transform:translateY(28vh) scale(.98);opacity:0;filter:blur(.6px)}
}

/* Bio media */
.profile-media{margin-top: var(--space-md)}
.profile-media img{
  width:100%;
  max-width: 680px;
  height:auto;
  border-radius: var(--radius-lg);
  border:1px solid color-mix(in srgb, var(--rule) 14%, transparent);
  display:block;
}

/* Projects & gallery base (defined once below in "Ajustes 2026" block) */
/* (gallery figcaption defined in gallery block above) */


/* (Form/gift CSS removed — no longer in use) */


/* Proyectos: tipografía/espaciado más “diccionario” */
.proj__title{
  margin:0 0 10px;
  font-family: var(--font-display);
  font-size: clamp(24px, 3.5vw, 32px);
  line-height: 1.15;
  letter-spacing: -.01em;
}
.proj__text{
  margin: 0 0 14px;
  color: var(--muted);
  max-width: 62ch;
  line-height: 1.6;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.muted{color:var(--muted)}

/* “link como botón” (para NSFW) */
.more-link.as-button{
  background: transparent;
  border: 0;
  padding: 0;
  cursor: pointer;
  font: inherit;
}

/* Gallery grid & thumbs (sistema portrait/wide) */
.gallery{
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(220px, 100%), 1fr));
  gap: 14px;
  margin-top: 14px;
}
.gallery figure{
  margin: 0;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  border-radius: var(--radius-md);
  border: 1px solid color-mix(in srgb, var(--rule) 14%, transparent);
  background: var(--paper);
  display: grid;
  place-items: center;
  cursor: zoom-in;
  transition: transform var(--duration) var(--ease-out), box-shadow var(--duration) var(--ease-out);
}
.gallery figure[data-format="wide"]{
  aspect-ratio: 3 / 2;
  grid-column: span 2;
}
.gallery figure:hover{
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(0,0,0,.08);
}
.gallery img{
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  display: block;
  object-fit: contain;
  background: var(--paper);
  cursor: zoom-in;
}
.gallery figcaption{
  font-size: .85rem;
  color: var(--muted);
  margin-top: 6px;
  line-height: 1.4;
}

/* Modal (retro limpio) */
.modal{
  position:fixed;
  inset:0;
  display:none;
  place-items:center;
  background: rgba(0,0,0,.45);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  z-index: 80;
  padding: 18px;
}
.modal.is-open{display:grid}
@keyframes modal-in{
  from{opacity:0}
  to{opacity:1}
}
@keyframes modal-card-in{
  from{opacity:0; transform: translateY(12px) scale(.98)}
  to{opacity:1; transform: translateY(0) scale(1)}
}
.modal.is-open{
  animation: modal-in .2s var(--ease-out);
}
.modal.is-open .modal__card{
  animation: modal-card-in .25s var(--ease-out);
}

.modal__card{
  width: min(980px, 96vw);
  background: var(--paper);
  border-radius: var(--radius-lg);
  border: 1px solid color-mix(in srgb, var(--rule) 14%, transparent);
  box-shadow: 0 24px 80px rgba(0,0,0,.25), 0 8px 24px rgba(0,0,0,.1);
  overflow:hidden;
}

.modal__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
  padding: 12px 14px;
  border-bottom: 1px solid color-mix(in srgb, var(--rule) 16%, transparent);
}
.modal__caption{
  font-size: 14px;
  color: var(--muted);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  max-width: 70%;
}
.modal__close{
  appearance:none;
  border: 1px solid color-mix(in srgb, var(--rule) 18%, transparent);
  background: transparent;
  border-radius: var(--radius-sm);
  padding: 4px 10px;
  cursor:pointer;
  transition: border-color var(--duration) var(--ease-out), background var(--duration) var(--ease-out);
}
.modal__close:hover{
  border-color: color-mix(in srgb, var(--accent) 45%, transparent);
  background: color-mix(in srgb, var(--paper-2) 60%, transparent);
}

.modal__body{
  display:block;
  padding: 0;
  background: var(--paper);
  min-height: 0;
}

.modal__stage{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 280px;
  height: clamp(320px, 62dvh, 680px);
  padding: 12px;
  overflow: hidden;
  background: var(--paper);
}

.modal__img{
  display: block;
  flex: 0 1 auto;
  min-width: 0;
  min-height: 0;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  margin: auto;
  object-fit: contain;
  border-radius: var(--radius-md);
  background: var(--paper);
}

.modal__nav{
  appearance:none;
  width: 44px;
  height: 44px;
  border-radius: var(--radius-md);
  border: 1px solid color-mix(in srgb, var(--rule) 18%, transparent);
  background: color-mix(in srgb, var(--paper) 80%, transparent);
  cursor:pointer;
  font-size: 26px;
  line-height: 1;
  display:grid;
  place-items:center;
  transition: border-color var(--duration) var(--ease-out), background var(--duration) var(--ease-out);
}
.modal__nav:hover:not(:disabled){
  border-color: color-mix(in srgb, var(--accent) 45%, transparent);
  background: color-mix(in srgb, var(--paper-2) 60%, transparent);
}
.modal__nav:disabled{
  opacity:.3;
  cursor: default;
}

.modal__foot{
  padding: 10px 14px 12px;
  border-top: 1px solid color-mix(in srgb, var(--rule) 16%, transparent);
  font-size: 13px;
  color: var(--muted);
}


/* Modal: ficha técnica (plantilla por imagen) */
.modal__meta{
  padding: 10px 14px 12px;
  border-top: 1px dashed color-mix(in srgb, var(--rule) 22%, transparent);
}
.modal__meta .ficha{
  margin: 0;
}
.modal__meta .ficha > div{
  display: grid;
  grid-template-columns: 110px 1fr;
  gap: 10px;
  padding: 6px 0;
  border-top: 1px dashed color-mix(in srgb, var(--rule) 18%, transparent);
}
.modal__meta .ficha > div:first-child{
  border-top: 0;
}
.modal__meta .ficha dt{
  margin: 0;
  color: var(--muted);
  font-weight: 700;
}
.modal__meta .ficha dd{
  margin: 0;
  color: var(--ink);
}

@media (max-width: 640px){
  .modal__meta .ficha > div{
    grid-template-columns: 100px 1fr;
  }
}


/* Modal textual (NSFW) */
.modal__card--text{
  width: min(560px, 96vw);
}
.modal__text{
  padding: 12px 14px 6px;
  color: var(--muted);
}
.modal__actions{
  display:flex;
  justify-content:flex-end;
  gap: 10px;
  padding: 10px 14px 14px;
}

/* Mobile modal nav indicators */
.modal__swipe-hint{
  display: none;
  text-align: center;
  padding: 6px 0;
  font-size: 12px;
  color: var(--muted);
}
@media (max-width: 640px){
  .modal__swipe-hint{
    display: block;
  }
}


/* Garantía: lo hidden no se muestra nunca */
[hidden]{display:none !important}

/* ===== Media embeds (video, PDF) ===== */
.media-block{margin-top:12px}
.video-embed{
  width:100%;
  aspect-ratio:16/9;
  border-radius:var(--radius-md);
  overflow:hidden;
  border:1px solid color-mix(in srgb, var(--rule) 14%, transparent);
  background:#fff;
}
.video-embed iframe{width:100%;height:100%;border:0}

.pdf-embed{
  position:relative;
  width:100%;
  height:min(78vh,820px);
  border-radius:var(--radius-md);
  overflow:hidden;
  border:1px solid color-mix(in srgb, var(--rule) 14%, transparent);
  background:#fff;
}
.pdf-embed iframe{width:100%;height:100%;border:0}
.pdf-embed__mask{
  position:absolute;
  top:0; left:0; right:0;
  height:54px;
  background: var(--paper);
  border-bottom:1px solid color-mix(in srgb, var(--rule) 12%, transparent);
  pointer-events:none;
  z-index:2;
}

/* ===== NSFW preview tiles ===== */
.nsfw-preview{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap:10px;
  margin-top:10px;
}
.nsfw-tile{
  border:1px solid color-mix(in srgb, var(--rule) 14%, transparent);
  border-radius:var(--radius-md);
  background: color-mix(in srgb, var(--paper) 80%, white);
  padding:28px 14px;
  display:grid;
  place-items:center;
  text-align:center;
  color: var(--muted);
  user-select:none;
}
.nsfw-tile strong{font-size:20px; line-height:1}
.nsfw-tile small{display:block; margin-top:6px; font-size:12px}

/* ===== Blog preview (extras) ===== */
.blog-preview{
  margin-top: 2.2rem;
  padding-top: 1.2rem;
  border-top: 1px solid color-mix(in srgb, var(--rule) 14%, transparent);
}
.blog-preview__eyebrow{
  margin: 0 0 .35rem;
  font-size: .78rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--muted);
}
.blog-preview__title{
  margin: 0 0 .75rem;
  font-family: var(--font-display);
  font-size: 1.25rem;
  font-weight: 600;
}
.blog-preview__intro{
  margin: 0 0 1.25rem;
  max-width: 68ch;
  color: var(--muted);
}
.blog-posts{display: grid; gap: 1rem}
.blog-post{
  padding: 1rem 0;
  border-top: 1px solid color-mix(in srgb, var(--rule) 12%, transparent);
}
.blog-post:first-child{border-top: none; padding-top: 0}
.blog-post__meta{
  margin: 0 0 .35rem;
  font-size: .85rem;
  color: var(--muted);
}
.blog-post__title{
  margin: 0 0 .45rem;
  font-size: 1.05rem;
  line-height: 1.3;
}
.blog-post__title a{
  color: inherit;
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: border-color .2s ease;
}
.blog-post__title a:hover{border-bottom-color: var(--accent)}
.blog-post__excerpt{
  margin: 0 0 .55rem;
  line-height: 1.6;
  color: var(--muted);
}
.blog-post__link{
  font-size: .92rem;
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: color var(--duration) var(--ease-out), border-color var(--duration) var(--ease-out);
}
.blog-post__link:hover{
  border-bottom-color: var(--accent);
  color: var(--accent);
}

.blog-preview__footer{
  margin-top: 1rem;
  padding-top: .85rem;
  border-top: 1px solid color-mix(in srgb, var(--rule) 8%, transparent);
}
.blog-preview__footer a{text-decoration: none}
.blog-preview__footer a:hover{color: var(--accent)}

/* ===== Extras: blog posts como cards ===== */
.extra-posts{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  margin-top: 1.2rem;
}
@media (max-width: 760px){
  .extra-posts{ grid-template-columns: 1fr; }
}
.extra-post{
  margin: 0;
}
.extra-post__link{
  display: grid;
  grid-template-rows: auto 1fr;
  height: 100%;
  text-decoration: none;
  color: inherit;
  background: color-mix(in srgb, var(--paper) 90%, white);
  border: 1px solid color-mix(in srgb, var(--rule) 14%, transparent);
  border-radius: var(--radius-lg);
  overflow: hidden;
  transition: border-color var(--duration) var(--ease-out), transform var(--duration) var(--ease-out);
}
.extra-post__link:hover{
  border-color: color-mix(in srgb, var(--accent) 45%, transparent);
  transform: translateY(-1px);
}
.extra-post__media{
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: var(--paper-2);
  display: grid;
  place-items: center;
}
.extra-post__media img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.extra-post__media--fallback{
  background: var(--paper-2);
  color: var(--muted);
  font-family: var(--font-display);
  letter-spacing: .14em;
  text-transform: uppercase;
  font-size: .9rem;
}
.extra-post__body{
  padding: 14px 16px 16px;
  display: grid;
  gap: 6px;
  align-content: start;
}
.extra-post__date{
  font-size: .78rem;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--muted);
}
.extra-post__title{
  margin: 0;
  font-family: var(--font-display);
  font-size: 1.15rem;
  line-height: 1.25;
}
.extra-post__excerpt{
  margin: 0;
  font-size: .92rem;
  line-height: 1.55;
  color: var(--muted);
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.extra-post__more{
  margin-top: 6px;
  font-size: .88rem;
  color: var(--ink);
  border-bottom: 1px solid color-mix(in srgb, var(--rule) 30%, transparent);
  align-self: start;
  padding-bottom: 1px;
}
.extra-post__link:hover .extra-post__more{
  color: var(--accent);
  border-bottom-color: var(--accent);
}

/* ===== Bio retrato con desgaste ===== */
.bio-portrait{
  position: relative;
  margin: 18px auto 0;
  max-width: 460px;
  aspect-ratio: 2 / 3;
  border-radius: var(--radius-lg);
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--rule) 14%, transparent);
  background: var(--paper);
}
.bio-portrait__message{
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 2rem;
  text-align: center;
  background: var(--paper);
  z-index: 0;
}
.bio-portrait__message p{
  margin: 0;
  font-family: var(--font-display);
  font-style: italic;
  font-size: clamp(20px, 3.2vw, 32px);
  line-height: 1.25;
  color: var(--ink);
  max-width: 22ch;
}
.bio-portrait__message small{
  display: block;
  margin-top: .6rem;
  font-family: var(--font-body);
  font-style: normal;
  font-size: .82rem;
  letter-spacing: .04em;
  color: var(--muted);
}
.bio-portrait__canvas{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  z-index: 1;
}
.bio-portrait__source{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
  z-index: 2;
  background: var(--paper);
}
.bio-portrait.is-wearing .bio-portrait__source{
  opacity: 0;
}
.bio-portrait.is-canvas-ready .bio-portrait__source{
  opacity: 0;
}
@media (prefers-reduced-motion: reduce){
  .bio-portrait__canvas{ display: none; }
  .bio-portrait__source{ opacity: 1 !important; }
  .bio-portrait__message{ display: none; }
}

/* ===== Extra card (dict variant) ===== */
.extras-grid--single{
  display: block;
  margin-top: 2.4rem;
}
.extra-card--dict{
  background: transparent;
  border: 1px solid color-mix(in srgb, var(--rule) 12%, transparent);
  padding: 1.2rem 1.1rem;
}
.extra-card--dict .extra-card__eyebrow{
  margin-bottom: .35rem;
  font-size: .78rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--muted);
}
.extra-card--dict .extra-card__title{
  margin: 0 0 .65rem;
  font-family: var(--font-display);
  font-size: 1.1rem;
  line-height: 1.3;
}
.extra-card--dict .extra-card__title span{
  font-weight: 400;
  color: var(--muted);
}
.extra-card--dict .extra-card__text{
  margin: 0;
  line-height: 1.65;
  color: var(--muted);
}
.extra-card--dict .extra-card__actions{
  margin-top: .9rem;
}
.extra-card--dict .extra-card__actions a{
  text-decoration: none;
  border-bottom: 1px solid transparent;
}
.extra-card--dict .extra-card__actions a:hover{
  color: var(--accent);
  border-bottom-color: var(--accent);
}

/* Active state for project sidebar */
.projects__list-desktop a.active{
  border-color: color-mix(in srgb, var(--accent) 70%, transparent);
  color: var(--accent);
}

/* ===== Projects dropdown (mobile) ===== */
.projects__dropdown-toggle{
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  width: 100%;
  padding: 12px 14px;
  font: inherit;
  font-size: .92rem;
  font-weight: 600;
  line-height: 1.3;
  color: var(--ink);
  background: var(--paper);
  border: 1px solid color-mix(in srgb, var(--rule) 22%, transparent);
  border-radius: var(--radius-md);
  cursor: pointer;
  user-select: none;
  transition: border-color var(--duration) var(--ease-out), background var(--duration) var(--ease-out);
}
.projects__dropdown-toggle::-webkit-details-marker{display:none}
.projects__dropdown-toggle::after{
  content: '▾';
  font-size: 14px;
  color: var(--muted);
  transition: transform var(--duration) var(--ease-out);
  flex-shrink: 0;
}
.projects__dropdown[open] .projects__dropdown-toggle{
  border-color: color-mix(in srgb, var(--accent) 40%, transparent);
  border-radius: var(--radius-md) var(--radius-md) 0 0;
}
.projects__dropdown[open] .projects__dropdown-toggle::after{
  transform: rotate(180deg);
}

.projects__dropdown-menu{
  display: grid;
  gap: 0;
  border: 1px solid color-mix(in srgb, var(--rule) 22%, transparent);
  border-top: none;
  border-radius: 0 0 var(--radius-md) var(--radius-md);
  background: var(--paper);
  overflow: hidden;
}
.projects__dropdown-menu a{
  display: flex;
  align-items: center;
  min-height: 44px;
  padding: 10px 14px;
  text-decoration: none;
  font-size: .88rem;
  line-height: 1.35;
  color: var(--ink);
  border-top: 1px solid color-mix(in srgb, var(--rule) 10%, transparent);
  transition: background var(--duration) var(--ease-out), color var(--duration) var(--ease-out);
}
.projects__dropdown-menu a:first-child{
  border-top: none;
}
.projects__dropdown-menu a:hover{
  background: color-mix(in srgb, var(--paper-2) 70%, transparent);
}
.projects__dropdown-menu a.active{
  color: var(--accent);
  font-weight: 600;
  background: color-mix(in srgb, var(--accent) 6%, transparent);
}


.works{display:flex;flex-direction:column;gap:16px;margin-top:16px}
.work{
  display:grid;grid-template-columns:260px 1fr;gap:16px;
  padding:14px;border:1px solid color-mix(in srgb, var(--rule) 14%, transparent);
  border-radius:var(--radius-lg);background:color-mix(in srgb, var(--paper) 85%, white);
  transition: border-color var(--duration) var(--ease-out);
}
.work:hover{border-color: color-mix(in srgb, var(--rule) 28%, transparent)}
.work__media img{width:100%;height:auto;border-radius:var(--radius-md);display:block;cursor:zoom-in;transition: transform var(--duration) var(--ease-out)}
.work__media img:hover{transform: translateY(-1px)}
.work__title{font:700 1.05rem/1.25 var(--font-display);margin:2px 0 8px}
.ficha{margin:0}
.ficha > div{display:grid;grid-template-columns:110px 1fr;gap:10px;padding:6px 0;
  border-top:1px dashed color-mix(in srgb, var(--rule) 22%, transparent)}
.ficha dt{color:var(--muted)}
.ficha dd{margin:0}

@media (max-width:760px){
  .work{grid-template-columns:1fr}
  .ficha > div{grid-template-columns:100px 1fr}
}

/* ===== Ajustes 2026: extras, ED, proyectos y modales ===== */

.site-footer__dot{opacity:.5}

.entry__mini-list{
  margin:0;
  padding-left:1.1rem;
  color:inherit;
}
.entry__mini-list li + li{margin-top:4px}

.extras-grid{
  display:grid;
  grid-template-columns: 1.35fr .95fr;
  gap:16px;
  margin-top:10px;
}
.extra-card{
  border:1px solid color-mix(in srgb, var(--rule) 14%, transparent);
  border-radius:var(--radius-lg);
  background: color-mix(in srgb, var(--paper) 84%, white);
  padding: 20px;
  transition: border-color var(--duration) var(--ease-out);
}
.extra-card:hover{border-color: color-mix(in srgb, var(--rule) 28%, transparent)}
.extra-card--feature{
  background: linear-gradient(180deg, color-mix(in srgb, var(--paper-2) 70%, white), color-mix(in srgb, var(--paper) 90%, white));
}
.extra-card__eyebrow{
  margin:0 0 8px;
  font-size:12px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--muted);
}
.extra-card__title{
  margin:0 0 10px;
  font-family:var(--font-display);
  font-size: clamp(28px, 4vw, 40px);
  line-height:1.04;
}
.extra-card__text{
  margin:0;
  color:var(--muted);
}
.extra-card__list{
  margin:14px 0 0;
  padding-left:1.1rem;
}
.extra-card__list li + li{margin-top:6px}
.extra-card__actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:16px;
}

.projects{
  display: grid;
  grid-template-columns: 260px 1fr;
  gap: 24px;
  align-items: start;
  max-width: 100%;
  overflow: hidden;
}
.projects__list{
  position: sticky;
  top: 92px;
  align-self: start;
}
/* Desktop sidebar list */
.projects__list-desktop{
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 6px;
}
/* Mobile dropdown — hidden on desktop */
.projects__dropdown{
  display: none;
}
.projects__list-desktop a{
  min-height: 44px;
  display: flex;
  align-items: center;
  padding: 8px 12px;
  border: 1px solid transparent;
  border-radius: var(--radius-sm);
  text-decoration: none;
  font-size: .9rem;
  line-height: 1.35;
  transition: border-color var(--duration) var(--ease-out), color var(--duration) var(--ease-out), background var(--duration) var(--ease-out);
}
.projects__list-desktop a:hover{
  border-color: color-mix(in srgb, var(--rule) 18%, transparent);
  background: color-mix(in srgb, var(--paper-2) 50%, transparent);
}
.projects__detail{
  min-width: 0;
  overflow: hidden;
}
.proj{
  padding: var(--space-md) 0;
}
/* (gallery grid defined in gallery block above) */

.work__note{
  margin:12px 0 0;
  color:var(--muted);
}

.modal{
  padding:16px;
}
.modal__card{
  max-height: min(90dvh, 900px);
  display: grid;
  grid-template-rows: auto auto auto auto;
  overflow: hidden;
  background: var(--paper);
}
.modal__head{
  background: var(--paper);
  z-index: 2;
}
.modal__close{
  min-width: 44px;
  min-height: 44px;
  font-size: 26px;
  line-height: 1;
  display: grid;
  place-items: center;
}
.modal__meta{
  max-height: 28dvh;
  overflow-y: auto;
}
.modal__foot{
  display: flex;
  justify-content: center;
}

@media (max-width: 980px){
  .container{padding:24px 16px 44px}
}

@media (max-width: 860px){
  .projects{
    grid-template-columns: 1fr;
    overflow: visible;
  }
  .projects__list{
    position: static;
    overflow: visible;
    margin-bottom: 6px;
  }
  .projects__list-desktop{
    display: none;
  }
  .projects__dropdown{
    display: block;
  }
  .projects__contact-line{
    display: none;
  }
  .projects__detail{
    margin-top: 4px;
  }
  .extras-grid{
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px){
  .site-header__inner{
    padding: 10px 14px;
    flex-direction: column;
    gap: 4px;
  }
  .brand{
    position: static;
    width: auto;
    justify-content: center;
  }
  .logo{height: 88px}
  .nav{
    width: 100%;
    justify-content: center;
    gap: 6px 14px;
    padding-top: 2px;
    font-size: .9rem;
  }
  .nav a{
    padding: 6px 0;
  }
  .nav__summary{
    padding: 6px 0;
  }
  .entry{
    padding: 28px 0;
  }
  .entry__row{
    grid-template-columns: 1fr;
    gap: 4px;
  }

  /* Modal mobile */
  .modal{
    padding: 8px;
    align-items: flex-end;
  }
  .modal__card{
    width: 100%;
    max-height: 92vh;
    max-height: 92dvh;
    border-radius: var(--radius-lg) var(--radius-lg) 0 0;
  }
  .modal__head{
    padding: 10px 12px;
  }
  .modal__caption{
    max-width: 72%;
    white-space: normal;
    line-height: 1.3;
    font-size: 13px;
  }
  .modal__body{
    padding: 0;
  }
  .modal__stage{
    height: clamp(260px, 56dvh, 520px);
    padding: 8px;
    gap: 4px;
  }
  .modal__nav{
    width: 36px;
    height: 44px;
    flex: 0 0 36px;
    background: color-mix(in srgb, var(--paper) 70%, transparent);
  }
  .modal__meta{
    padding: 8px 12px 10px;
  }
  .modal__meta .ficha > div,
  .ficha > div{
    grid-template-columns: 1fr;
    gap: 2px;
  }
  .modal__foot{
    padding: 8px 12px 10px;
    font-size: 12px;
  }

  /* Gallery mobile: 2 columns minimum */
  .gallery{
    grid-template-columns: repeat(auto-fill, minmax(min(140px, 100%), 1fr));
    gap: 10px;
  }

  /* Projects text */
  .proj__title{
    font-size: clamp(20px, 5vw, 28px);
  }
  .proj__text{
    font-size: .9rem;
  }

  .works{
    gap: 12px;
  }
  .work{
    padding: 10px;
  }

  /* NSFW tiles */
  .nsfw-preview{
    grid-template-columns: repeat(auto-fill, minmax(min(140px, 100%), 1fr));
  }
}

/* Extra small screens */
@media (max-width: 380px){
  .container{
    padding: 20px 12px 36px;
  }
  .gallery{
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .projects__list a{
    font-size: .8rem;
    padding: 6px 10px;
  }
  .modal{
    padding: 0;
  }
  .modal__card{
    border-radius: 0;
    max-height: 100vh;
    max-height: 100dvh;
  }
  .nsfw-preview{
    grid-template-columns: 1fr;
  }
}

/* Fix móvil bio retrato */
.bio-portrait{
  width: min(100%, 460px);
}

@media (max-width: 640px){
  .bio-portrait{
    width: min(100%, calc(100vw - 48px));
    max-width: 360px;
    max-height: 72dvh;
    aspect-ratio: 2 / 3;
    margin: 18px auto 0;
  }

  .bio-portrait__message{
    padding: 1.25rem;
  }

  .bio-portrait__message p{
    font-size: clamp(20px, 7vw, 28px);
    max-width: 18ch;
  }

  .bio-portrait__message small{
    font-size: .72rem;
    line-height: 1.45;
  }

  .bio-portrait__canvas,
  .bio-portrait__source{
    width: 100%;
    height: 100%;
  }
}
/* ===== Manual de poses para dormir: visor PDF amplio ===== */
.proj[data-proj="precariedad-manual"] .gallery{
  display: block;
  width: 100%;
  margin-top: 24px;
}

.proj[data-proj="precariedad-manual"] .pdf-preview{
  position: relative;
  width: 100%;
  height: clamp(620px, 78dvh, 920px);
  min-height: 620px;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--rule) 14%, transparent);
  border-radius: var(--radius-md);
  background: #fff;
  box-shadow: 0 10px 30px rgba(0,0,0,.06);
}

.proj[data-proj="precariedad-manual"] .pdf-preview iframe{
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  background: #fff;
}

@media (max-width: 860px){
  .proj[data-proj="precariedad-manual"] .pdf-preview{
    height: 74dvh;
    min-height: 560px;
  }
}

@media (max-width: 640px){
  .proj[data-proj="precariedad-manual"] .gallery{
    margin-top: 18px;
  }

  .proj[data-proj="precariedad-manual"] .pdf-preview{
    height: 70dvh;
    min-height: 500px;
    border-radius: var(--radius-sm);
  }
}

@media (max-width: 380px){
  .proj[data-proj="precariedad-manual"] .pdf-preview{
    height: 68dvh;
    min-height: 460px;
  }
}