:root { color-scheme: light; --ink:#172033; --muted:#5d6677; --line:#dbe2ea; --primary:#4f46e5; }
* { box-sizing:border-box; }
body { margin:0; background:#f4f7fb; color:var(--ink); font:14px/1.45 system-ui,-apple-system,"Segoe UI",sans-serif; }
main { max-width:960px; margin:auto; padding:24px 20px 36px; }
nav { margin-bottom:18px; }
a { color:var(--primary); text-decoration:none; }
a:hover { text-decoration:underline; }
.eyebrow { color:var(--primary); font-weight:750; font-size:.75rem; letter-spacing:.12em; }
h1 { margin:6px 0; font-size:clamp(1.5rem,4vw,1.9rem); line-height:1.2; }
header p { margin:8px 0 18px; color:var(--muted); }
.state { border:1px dashed var(--line); border-radius:14px; padding:32px 20px; background:white; color:var(--muted); text-align:center; }
.publication { margin:0 0 12px; padding:16px; background:white; border:1px solid var(--line); border-radius:10px; box-shadow:0 3px 12px #17203306; }
.meta { display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.tag { display:inline-block; padding:2px 8px; font-size:.7rem; font-weight:750; border-radius:5px; }
.tag.nuevo { background:#dcfce7; color:#166534; }
.tag.mejora { background:#e0e7ff; color:#3730a3; }
.tag.correccion { background:#ffe4e6; color:#9f1239; }
time { color:var(--muted); font-size:.75rem; }
h2 { margin:8px 0 6px; font-size:1.05rem; line-height:1.3; overflow-wrap:anywhere; }
.description { margin:0; white-space:pre-line; overflow-wrap:anywhere; }
.images { display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,220px),1fr)); gap:10px; margin-top:12px; }
figure { margin:0; min-width:0; }
.image-button { display:block; width:100%; padding:5px; border:1px solid var(--line); background:#f8fafc; border-radius:7px; cursor:zoom-in; }
.image-button img { display:block; max-width:100%; width:auto; height:auto; max-height:130px; object-fit:contain; margin:auto; }
figcaption { margin-top:4px; font-size:.72rem; line-height:1.35; color:var(--muted); }
button:focus-visible,a:focus-visible { outline:3px solid #a5b4fc; outline-offset:3px; }
dialog { width:fit-content; max-width:95vw; max-height:94dvh; padding:18px; border:0; border-radius:12px; }
dialog::backdrop { background:#0f172abf; }
dialog .image-actions { display:flex; justify-content:flex-end; margin-bottom:12px; }
dialog button { padding:8px 14px; border:1px solid var(--line); background:white; border-radius:8px; cursor:pointer; font:inherit; }
dialog img { display:block; max-width:100%; max-height:70dvh; object-fit:contain; margin:auto; }
dialog p { margin:12px 0 0; color:var(--muted); }
.embedded .standalone { display:none; }
.embedded main { padding-top:14px; }
@media (max-width:600px) {
  main { padding:18px 12px 24px; }
  .publication { padding:12px; }
  header p { margin-bottom:14px; }
  .images { grid-template-columns:repeat(auto-fill,minmax(min(100%,140px),1fr)); gap:8px; }
  .image-button img { max-height:110px; }
}