/* Memorias del rincón de mi corazón · diseño del 28-oct-2026.
   Paleta: degradado pastel rojo → morado → azul; la tinta usa el mismo degradado en tonos profundos.
   Los textos de las entradas y los comentarios se muestran tal cual: este archivo solo viste la página. */

:root{
  --rosa:#F6C1CC; --lila:#D8C3F1; --cielo:#BFD5F6;
  --rosa-t:#9E3654; --lila-t:#62399A; --cielo-t:#2B5797;
  --g-pastel:linear-gradient(115deg,#F8CBD4 0%,#DCC8F3 50%,#C6DAF7 100%);
  --g-tinta:linear-gradient(100deg,var(--rosa-t) 0%,var(--lila-t) 52%,var(--cielo-t) 100%);
  --tinta:#2A2142; --tinta-2:#51466C; --tinta-3:#6E6488;
  --papel:rgba(255,255,255,.93); --papel-2:rgba(255,255,255,.97);
  --linea:rgba(98,57,154,.16); --linea-2:rgba(98,57,154,.28);
  --sombra:0 1px 0 rgba(255,255,255,.7) inset,0 18px 48px rgba(62,40,104,.12),0 2px 8px rgba(62,40,104,.06);
  --f-titulo:"Iowan Old Style","Palatino Linotype",Palatino,"Book Antiqua","URW Palladio L",Georgia,serif;
  --f-texto:Georgia,"Iowan Old Style","Palatino Linotype",Palatino,serif;
  --f-sans:"Segoe UI Variable Text","Segoe UI",system-ui,-apple-system,Roboto,"Helvetica Neue",Arial,sans-serif;
  --r-1:14px; --r-2:22px; --r-3:999px;
  --ease:cubic-bezier(.16,1,.3,1);
  --canal:clamp(16px,4vw,40px);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:96px;background:#EEE6F6}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;min-height:100vh;color:var(--tinta);font:400 1.0625rem/1.72 var(--f-texto);-webkit-font-smoothing:antialiased;overflow-x:clip;background:transparent}
img,svg{max-width:100%}
a{color:var(--lila-t)}
:focus-visible{outline:2px solid var(--lila-t);outline-offset:3px}
::selection{background:rgba(216,195,241,.7)}
[hidden]{display:none!important}
.sr-only{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.skip{position:fixed;left:16px;top:-80px;z-index:50;padding:10px 18px;border-radius:var(--r-3);background:var(--tinta);color:#fff;text-decoration:none;font:600 .9rem var(--f-sans)}
.skip:focus{top:12px}

/* ---------- Cielo, árbol y pétalos (detrás de todo) ---------- */
.cielo{position:fixed;inset:0;z-index:-3;background:
  radial-gradient(70% 55% at 85% 8%,rgba(198,218,247,.9),transparent 70%),
  radial-gradient(60% 50% at 10% 45%,rgba(220,200,243,.75),transparent 70%),
  radial-gradient(70% 60% at 70% 100%,rgba(248,203,212,.85),transparent 70%),
  linear-gradient(180deg,#E7EEFB 0%,#EEE4F7 48%,#F8E6EC 100%)}
.arbol{position:absolute;left:0;top:0;width:100%;height:100vh;z-index:-2;pointer-events:none;overflow:hidden;contain:layout paint style}
.ramas{position:absolute;left:0;top:0;width:100%;height:100%;opacity:0;transition:opacity 1.4s ease}
.arbol.listo .ramas{opacity:1}
.petalos{position:fixed;left:0;top:0;width:100%;height:100vh;height:100lvh;z-index:-1;pointer-events:none}
/* Cada racimo cuelga de su punto de unión: --my y --oy lo ponen arriba (colgante) o abajo (erguido).
   rotate: el vaivén del viento · scale y opacity: la floración al llegar · transform: las sacudidas (WAAPI). */
.flor{position:absolute;left:0;top:0;width:var(--s,96px);height:var(--s,96px);margin:calc(var(--s,96px) * var(--my,-.86)) 0 0 calc(var(--s,96px) * -.5);background:center/contain no-repeat;transform-origin:50% var(--oy,86%);rotate:var(--r,0deg);opacity:0;scale:.35;transition:scale 1.1s var(--ease) var(--fd,0s),opacity .9s ease var(--fd,0s)}
.arbol.florece .flor{opacity:1;scale:1}
.flor.viva{animation:mecer var(--d,7s) ease-in-out var(--de,0s) infinite alternate}
@keyframes mecer{from{rotate:calc(var(--r,0deg) - var(--a,2deg))}to{rotate:calc(var(--r,0deg) + var(--a,2deg))}}

/* ---------- Buscador de fechas (arriba de todo) ---------- */
.buscador{position:sticky;top:max(10px,env(safe-area-inset-top));z-index:20;display:flex;align-items:center;gap:10px;width:min(100% - 2*var(--canal),1080px);margin:12px auto 0;padding:7px 8px 7px 10px;border-radius:var(--r-3);background:rgba(255,255,255,.82);border:1px solid rgba(255,255,255,.9);box-shadow:0 10px 34px rgba(62,40,104,.14),0 0 0 1px var(--linea) inset}
.buscador__campo{flex:1 1 280px;min-width:0;display:flex;align-items:center;gap:10px;padding:0 12px;height:44px;border-radius:var(--r-3);background:var(--g-pastel)}
.buscador__ico{flex:none;width:20px;height:20px;fill:none;stroke:var(--lila-t);stroke-width:1.7;stroke-linecap:round}
.buscador input{flex:1;min-width:0;height:100%;border:0;background:none;color:var(--tinta);font:500 .98rem var(--f-sans);outline:0}
.buscador input::placeholder{color:var(--tinta-3)}
.year-filters{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;max-width:52%;padding:2px}
.year-filters::-webkit-scrollbar{display:none}
.year-filters button{flex:none;min-height:36px;padding:0 13px;border-radius:var(--r-3);border:1px solid var(--linea-2);background:rgba(255,255,255,.7);color:var(--tinta-2);font:600 .82rem var(--f-sans);cursor:pointer;transition:background-color .25s,color .25s,border-color .25s}
.year-filters button:hover{border-color:var(--lila-t);color:var(--lila-t)}
.year-filters button[aria-pressed=true]{background:var(--g-tinta);border-color:transparent;color:#fff}
.mov{flex:none;display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 14px;border-radius:var(--r-3);border:1px solid var(--linea-2);background:rgba(255,255,255,.7);color:var(--tinta-2);font:600 .8rem var(--f-sans);cursor:pointer}
.mov:hover{border-color:var(--lila-t)}
.mov__ico{width:12px;height:12px;background:linear-gradient(90deg,currentColor 0 35%,transparent 35% 65%,currentColor 65%)}
.mov[aria-pressed=true] .mov__ico{background:currentColor;clip-path:polygon(0 0,100% 50%,0 100%)}

/* ---------- Título ---------- */
.portada{width:min(100% - 2*var(--canal),1080px);margin:clamp(72px,12vw,150px) auto clamp(36px,6vw,72px);text-align:center}
.titulo{margin:0 auto;max-width:15ch;font:600 clamp(2.4rem,1.25rem + 5.2vw,5.4rem)/1.02 var(--f-titulo);letter-spacing:-.018em;text-wrap:balance;background:var(--g-tinta);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 2px 14px rgba(255,255,255,.85))}
.titulo::after{content:"";display:block;width:84px;height:2px;margin:26px auto 0;border-radius:2px;background:var(--g-tinta);opacity:.75}

/* ---------- Entradas colgadas del árbol ---------- */
.archivo{width:min(100% - 2*var(--canal),1080px);margin:0 auto;padding-bottom:clamp(80px,10vw,140px)}
.archive-count{display:table;margin:0 auto 34px;padding:7px 16px;border-radius:var(--r-3);background:rgba(255,255,255,.9);box-shadow:0 6px 20px rgba(62,40,104,.1),0 0 0 1px var(--linea) inset;text-align:center;color:var(--tinta-2);font:600 .76rem var(--f-sans);letter-spacing:.12em;text-transform:uppercase}
.post-list{position:relative;display:flex;flex-direction:column}
.post-card{position:relative;width:calc(50% - 64px);padding:24px 26px 20px;border-radius:var(--r-2);background:var(--papel);box-shadow:var(--sombra);transition:transform .45s var(--ease),box-shadow .45s var(--ease),background-color .3s}
.post-card::before{content:"";position:absolute;inset:0;padding:1px;border-radius:inherit;background:var(--g-tinta);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:.28;pointer-events:none;transition:opacity .35s}
.post-card:nth-child(odd){align-self:flex-start}
.post-card+.post-card{margin-top:clamp(28px,4vw,46px)}
.post-card:nth-child(even){align-self:flex-end;margin-top:clamp(-30px,-3vw,-14px)}
@media (hover:hover){.post-card:hover{transform:translateY(-3px);background:var(--papel-2);box-shadow:0 1px 0 rgba(255,255,255,.7) inset,0 24px 60px rgba(62,40,104,.18)}.post-card:hover::before{opacity:.65}}
.post-card:focus-within::before{opacity:.65}
.post-card__nudo{position:absolute;top:30px;width:12px;height:12px;border-radius:50%;background:#fff;box-shadow:0 0 0 3px rgba(98,57,154,.35)}
.post-card:nth-child(odd) .post-card__nudo{right:-6px}
.post-card:nth-child(even) .post-card__nudo{left:-6px}
.post-card-meta{display:flex;justify-content:space-between;gap:12px;color:var(--tinta-3);font:600 .74rem var(--f-sans);letter-spacing:.08em;text-transform:uppercase}
.card-label{color:var(--lila-t)}
.post-card-link{display:block;margin-top:10px;color:inherit;text-decoration:none}
.post-card-link::after{content:"";position:absolute;inset:0;border-radius:inherit}
.post-card h3{margin:0;font:600 clamp(1.3rem,1.05rem + .9vw,1.7rem)/1.18 var(--f-titulo);letter-spacing:-.01em;background:var(--g-tinta);-webkit-background-clip:text;background-clip:text;color:transparent}
.post-excerpt{margin:12px 0 0;color:var(--tinta-2);font-size:.98rem;line-height:1.6}
.post-card-bottom{display:flex;justify-content:space-between;gap:10px;margin-top:16px;padding-top:12px;border-top:1px dashed var(--linea-2);color:var(--tinta-3);font:600 .72rem var(--f-sans);letter-spacing:.08em;text-transform:uppercase}
.read-label{color:var(--rosa-t)}
.post-card.is-secret{background:rgba(255,255,255,.72)}
.post-card.is-secret::before{opacity:.55;background:linear-gradient(100deg,var(--rosa-t),var(--lila-t),var(--cielo-t),var(--rosa-t));background-size:300% 100%}
.post-card.is-secret .post-excerpt{font-style:italic}
.loading,.empty-state{padding:30px;text-align:center;color:var(--tinta-2)}
.error-box{padding:18px;border-radius:var(--r-1);background:#fff;color:var(--rosa-t)}

/* ---------- Lectura ---------- */
.reader{width:min(100% - 2*var(--canal),860px);margin:clamp(40px,7vw,90px) auto clamp(80px,10vw,140px);padding:clamp(24px,4vw,56px);border-radius:var(--r-2);background:#FFFDFE;box-shadow:var(--sombra)}
.reader-nav{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
.back-link,.lock-again{display:inline-flex;align-items:center;min-height:40px;padding:0 16px;border-radius:var(--r-3);border:1px solid var(--linea-2);background:#fff;color:var(--lila-t);font:600 .85rem var(--f-sans);text-decoration:none;cursor:pointer}
.back-link:hover,.lock-again:hover{border-color:var(--lila-t)}
.reader-header{margin:30px 0 26px;text-align:center}
.reader-meta{display:flex;justify-content:center;gap:16px;flex-wrap:wrap;color:var(--tinta-3);font:600 .76rem var(--f-sans);letter-spacing:.1em;text-transform:uppercase}
.reader-header h1{margin:14px 0 0;font:600 clamp(1.9rem,1.2rem + 3vw,3.1rem)/1.1 var(--f-titulo);letter-spacing:-.015em;background:var(--g-tinta);-webkit-background-clip:text;background-clip:text;color:transparent}
.reader-header h1:focus{outline:0}
.divider{display:block;margin-top:14px;color:var(--lila-t);font-size:1.4rem}
.reader-layout{display:grid;grid-template-columns:minmax(0,1fr) 190px;gap:clamp(20px,4vw,48px)}
.post-content{min-width:0;overflow-wrap:anywhere}
.post-content img{height:auto;border-radius:10px}
.reader-aside{color:var(--tinta-3);font:500 .85rem/1.5 var(--f-sans)}
.reader-aside p{margin:10px 0 0}
.aside-line{width:42px;height:2px;border-radius:2px;background:var(--g-tinta)}
.original-link{display:inline-block;margin-top:12px;color:var(--lila-t)}
.asset-missing{display:inline-block;min-width:160px;min-height:90px;padding:8px;border:1px dashed var(--linea-2);border-radius:10px;background:rgba(216,195,241,.18)}
.asset-missing::after{content:"Imagen original no recuperada";color:var(--tinta-3);font:500 .78rem var(--f-sans)}
.comments{margin-top:clamp(36px,5vw,60px);padding-top:28px;border-top:1px dashed var(--linea-2)}
.comments-heading{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.comments-heading h2{margin:0;font:600 clamp(1.3rem,1.1rem + .8vw,1.7rem)/1.2 var(--f-titulo);background:var(--g-tinta);-webkit-background-clip:text;background-clip:text;color:transparent}
.comments-heading span{color:var(--tinta-3);font:600 .85rem var(--f-sans)}
.legacy-note{margin:6px 0 18px;color:var(--tinta-3);font:500 .85rem var(--f-sans)}
.legacy-comment{margin-top:14px;padding:16px 18px;border-radius:var(--r-1);background:linear-gradient(115deg,rgba(248,203,212,.25),rgba(220,200,243,.22),rgba(198,218,247,.25));border:1px solid var(--linea)}
.comment-meta{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font:600 .78rem var(--f-sans)}
.comment-author{color:var(--lila-t)}
.comment-meta time{color:var(--tinta-3)}
.comment-content{margin-top:8px;overflow-wrap:anywhere}

/* ---------- Escrito secreto ---------- */
.reader.is-secret{background:#FFFDFE}
.secret-panel{max-width:520px;margin:10px auto 0;text-align:center}
.secret-symbol{margin:0;color:var(--lila-t);font:600 1.2rem ui-monospace,Consolas,monospace;letter-spacing:.2em}
.secret-panel h2{margin:14px 0 8px;font:600 1.6rem/1.2 var(--f-titulo);background:var(--g-tinta);-webkit-background-clip:text;background-clip:text;color:transparent}
.secret-note{margin:0 0 20px;color:var(--tinta-2)}
.secret-form{display:flex;gap:8px;padding:6px;border-radius:var(--r-3);background:var(--g-pastel)}
.secret-form input{flex:1;min-width:0;height:46px;padding:0 18px;border:0;border-radius:var(--r-3);background:#fff;color:var(--tinta);font:500 1rem var(--f-sans)}
.secret-form button{flex:none;width:46px;height:46px;border:0;border-radius:50%;background:var(--g-tinta);color:#fff;font:700 1.1rem var(--f-sans);cursor:pointer}
.secret-form button:disabled,.secret-form input:disabled{opacity:.6}
.secret-status{min-height:1.6em;margin:12px 0 0;color:var(--tinta-2);font:500 .9rem var(--f-sans)}
.secret-status.is-error{color:var(--rosa-t)}
.secret-open-note{margin:18px 0 0;text-align:center;color:var(--lila-t);font:700 .74rem var(--f-sans);letter-spacing:.2em}
.reader.recien-abierto .post-content,.reader.recien-abierto .reader-aside,.reader.recien-abierto .comments{animation:aparecer 1.1s var(--ease) both}
.reader.recien-abierto .reader-aside{animation-delay:.15s}
.reader.recien-abierto .comments{animation-delay:.3s}
@keyframes aparecer{from{opacity:0;translate:0 12px}}
.decrypt-scene{margin:26px auto 0;max-width:100%;overflow:hidden;font:600 clamp(.72rem,.6rem + .5vw,1rem)/1.25 ui-monospace,Consolas,"Cascadia Code",monospace;letter-spacing:.08em;text-align:center;white-space:pre;background:var(--g-tinta);-webkit-background-clip:text;background-clip:text;color:transparent}

/* ---------- Pie: la base del tronco ---------- */
.site-footer{position:relative;margin-top:40px;padding:clamp(150px,18vw,230px) var(--canal) 40px;text-align:center}
.pie__int{position:relative;width:min(100%,640px);margin:0 auto;padding:26px 24px;border-radius:var(--r-2);background:#FFFDFE;box-shadow:var(--sombra)}
.pie__titulo{margin:0;font:600 1.3rem/1.2 var(--f-titulo);background:var(--g-tinta);-webkit-background-clip:text;background-clip:text;color:transparent}
.pie__bienvenida{margin:12px 0 0;color:var(--tinta-2);white-space:pre-line;font-size:.98rem}
.pie__nota{margin:12px 0 0;color:var(--tinta-3);font:500 .82rem var(--f-sans)}
.pie__arriba{display:inline-block;margin-top:14px;color:var(--lila-t);font:600 .85rem var(--f-sans)}

/* ---------- Teléfono: el tronco va a la izquierda ---------- */
@media (max-width:899px){
  .portada{margin-top:clamp(120px,32vw,170px)}
  .buscador{flex-wrap:wrap;border-radius:26px}
  .buscador__campo{flex-basis:100%}
  .year-filters{max-width:none;flex:1}
  .mov__txt{position:absolute!important;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
  .mov{padding:0 12px}
  .post-list{padding-left:34px}
  .post-card,.post-card:nth-child(odd),.post-card:nth-child(even){width:100%;align-self:stretch;margin-top:0}
  .post-card+.post-card,.post-card+.post-card:nth-child(even){margin-top:44px}
  .post-card:nth-child(odd) .post-card__nudo,.post-card:nth-child(even) .post-card__nudo{left:-6px;right:auto}
  .reader-layout{grid-template-columns:minmax(0,1fr)}
}

/* ---------- Quietud ---------- */
[data-movimiento=pausado] .flor.viva{animation-play-state:paused}
@media (prefers-reduced-motion:reduce){.flor{transition:none;opacity:1;scale:1}.flor.viva{animation:none}.ramas{transition:none}.post-card{transition:none}.reader.recien-abierto .post-content,.reader.recien-abierto .reader-aside,.reader.recien-abierto .comments{animation:none}}