/* theme compartido — extraido de index.html
   dark por defecto; el override vive en [data-theme="light"] y lo decide assets/theme.js */
:root {
  --bg:        #121316;
  --ink:       #ECECEA;
  --ink-soft:  #9FA0A4;
  --sand:      #CE7A4E;
  --line:      #292B30;
  /* superficies derivadas, para tablas y codigo en entradas largas */
  --panel:     #181A1E;
  --panel-2:   #1E2025;
  --serif: "Fraunces", Georgia, serif;
  --mono:  "JetBrains Mono", ui-monospace, monospace;
}
:root[data-theme="light"] {
  --bg:        #F7F6F2;
  --ink:       #1A1A18;
  --ink-soft:  #57544C;
  --sand:      #CE7A4E;
  --line:      #DEDAD0;
  --panel:     #EFEDE6;
  --panel-2:   #E7E4DA;
}
* { margin:0; padding:0; box-sizing:border-box; }
html { -webkit-font-smoothing:antialiased; }
::selection { background:var(--ink); color:var(--bg); }

body {
  background:var(--bg); color:var(--ink);
  font-family:var(--mono);
  transition:background .5s ease, color .5s ease;
}

/* firma arriba a la izquierda */
.sig {
  position:fixed; top:28px; left:32px; z-index:10;
  font-family:var(--mono); font-size:12px; letter-spacing:0.04em;
  color:var(--ink-soft); text-decoration:none;
}
.sig b { color:var(--ink); font-weight:500; }
.sig:hover { color:var(--ink); }

/* toggle de tema */
.toggle {
  position:fixed; top:24px; right:26px; z-index:10;
  width:38px; height:38px;
  display:flex; align-items:center; justify-content:center;
  background:var(--bg); border:1px solid var(--line); border-radius:50%;
  color:var(--ink-soft); cursor:pointer;
  transition:color .25s ease, border-color .25s ease, transform .4s ease;
}
.toggle:hover { color:var(--ink); border-color:var(--ink); transform:rotate(18deg); }
.toggle svg { width:17px; height:17px; }
.toggle .moon { display:none; }
:root[data-theme="light"] .toggle .sun  { display:none; }
:root[data-theme="light"] .toggle .moon { display:block; }

/* grano de pelicula */
#grain {
  position:fixed; inset:0; z-index:5; pointer-events:none;
  opacity:.05; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size:180px 180px;
}
:root[data-theme="light"] #grain { opacity:.06; mix-blend-mode:multiply; }

/* entrada */
.fade { opacity:0; transform:translateY(16px); animation:rise .9s cubic-bezier(.2,.7,.2,1) forwards; }
.d1 { animation-delay:.05s; } .d2 { animation-delay:.22s; }
.d3 { animation-delay:.4s; }  .d4 { animation-delay:.55s; }
@keyframes rise { to { opacity:1; transform:none; } }

@media (prefers-reduced-motion:reduce) {
  .fade { opacity:1; transform:none; animation:none; }
}
@media (max-width:540px) {
  .sig { top:20px; left:22px; }
  .toggle { top:18px; right:18px; }
}

/* saltar al contenido — visible solo al tabular */
.skip {
  position:fixed; top:-60px; left:16px; z-index:20;
  background:var(--bg); color:var(--ink);
  border:1px solid var(--sand); padding:9px 14px;
  font-family:var(--mono); font-size:12px; text-decoration:none;
  transition:top .18s ease;
}
.skip:focus { top:16px; }
:focus-visible { outline:2px solid var(--sand); outline-offset:3px; }

/* ---- impresion: los informes acaban en papel y en PDF ---- */
@media print {
  :root {
    --bg:#fff; --ink:#111; --ink-soft:#444; --line:#bbb;
    --panel:#fff; --panel-2:#f2f2f2; --sand:#8a4a22;
  }
  #grain, .toggle, .skip, .sig, .toc, .progress { display:none !important; }
  body { background:#fff !important; color:#111 !important; }
  .wrap { max-width:none; padding-inline:0; }
  .post-head { padding-block:0 18px; }
  article { padding-block:0; }
  /* los enlaces externos pierden su destino al imprimirse: lo escribimos */
  article a[href^="http"]::after { content:" (" attr(href) ")"; font-size:0.82em; color:#555; word-break:break-all; }
  /* no partir figuras, tablas ni bloques de codigo entre paginas */
  figure, .tablewrap, pre, .callout, .stage { break-inside:avoid; page-break-inside:avoid; }
  h2, h3 { break-after:avoid; page-break-after:avoid; }
  article h2 { margin-top:28px; }
  pre { border-left-width:1px; }
  .fade { opacity:1 !important; transform:none !important; animation:none !important; }
}

/* selector de idioma, junto al toggle de tema */
.lang {
  position:fixed; top:24px; right:78px; z-index:10;
  display:flex; align-items:center; gap:6px; height:38px;
  font-family:var(--mono); font-size:11px; letter-spacing:0.1em;
}
.lang a { color:var(--ink-soft); text-decoration:none; transition:color .25s ease; }
.lang a:hover { color:var(--ink); }
.lang-on { color:var(--sand); }
.lang-sep { color:var(--line); }
@media (max-width:540px) { .lang { top:18px; right:64px; } }
@media print { .lang { display:none !important; } }
