:root {
  --bg: #05010d;
  --panel: rgba(9, 4, 22, 0.82);
  --ink: #e8e2f5;
  --muted: #a89cc8;
  --pink: #ff2bd6;
  --purple: #7c5cff;
  --cyan: #25d9ff;
  --border: rgba(124, 92, 255, 0.35);
}

* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  background: var(--bg);
  color: var(--ink);
  font-family: 'Chakra Petch', system-ui, sans-serif;
  font-size: 17px;
  line-height: 1.65;
  min-height: 100vh;
}
::selection { background: rgba(255,43,214,.45); color:#fff; }
a:focus-visible, button:focus-visible { outline: 2px solid var(--cyan); outline-offset: 3px; border-radius: 4px; }

#bg-gl { position:fixed; inset:0; width:100%; height:100%; display:block; z-index:0; }
.site { position:relative; z-index:1; max-width: 1080px; margin: 0 auto; padding: 0 1.4rem 4rem; }

/* ---------- header (sticky, se congela arriba y desenfoca lo que pasa por debajo) ---------- */
header.site-head {
  position: sticky; top: 0; z-index: 20;
  border-bottom: 1px solid transparent;
  background-color: transparent;
  backdrop-filter: blur(0px);
  -webkit-backdrop-filter: blur(0px);
  transition: background-color .3s ease, border-color .3s ease,
              backdrop-filter .3s ease, -webkit-backdrop-filter .3s ease;
}
header.site-head.is-scrolled {
  background-color: rgba(5,1,13,.62);
  border-bottom-color: rgba(124,92,255,.22);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.head-wrap {
  max-width: 1080px; margin: 0 auto; padding: 1.6rem 1.4rem 1rem;
  display:flex; align-items:baseline; justify-content:space-between; gap:1rem; flex-wrap:wrap;
}
.brand {
  font-family:'Audiowide', sans-serif;
  font-size: 1.7rem; text-decoration:none; letter-spacing:.06em;
  background: linear-gradient(180deg,
    #331947 0%, #9545a1 14%, #ebd9ed 22%, #b653b2 30%,
    #2c294a 37%, #000000 45.4%, #ffffff 45.8%,
    #8bacf7 55%, #dfe7fb 66%, #ff8fd8 78%, #ffd0ec 88%, #ffffff 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
  filter: drop-shadow(0 0 5px rgba(78,70,188,.4)) drop-shadow(0 3px 7px rgba(41,191,253,.2));
  will-change: opacity;
}
/* en la portada el brand arranca invisible: header.js lo desvanece al entrar
   a medida que el JESVS del héroe se desvanece al salir */
body.home .brand { opacity: 0; visibility: hidden; }
nav a {
  color: var(--muted); text-decoration:none; margin-left:1.4rem;
  font-size:.95rem; letter-spacing:.14em; text-transform:uppercase;
  transition: color .18s ease;
}
nav a:hover { color: var(--cyan); text-shadow: 0 0 8px rgba(37,217,255,.6); }
nav a.active {
  color: var(--cyan); text-shadow: 0 0 8px rgba(37,217,255,.55);
  border-bottom: 1px solid rgba(37,217,255,.55); padding-bottom: .15rem;
}

/* ---------- hero ---------- */
.hero { text-align:center; padding: 4.5rem 0 3.5rem; }
.hero h1 {
  font-family:'Audiowide', sans-serif;
  font-size: clamp(3rem, 10vw, 6.5rem);
  letter-spacing:.05em;
  /* capa 1: shine que barre (se anima) | capa 2: cromo base */
  background:
    linear-gradient(105deg, rgba(255,255,255,0) 44%, rgba(255,255,255,.85) 50%, rgba(255,255,255,0) 56%) no-repeat,
    linear-gradient(180deg,
    #331947 0%, #9545a1 14%,
    #ebd9ed 22%, #b653b2 30%,
    #2c294a 37%, #000000 45.4%, #ffffff 45.8%,
    #8bacf7 55%, #dfe7fb 66%,
    #ff8fd8 78%, #ffd0ec 88%, #ffffff 100%);
  background-size: 250% 100%, 100% 100%;
  background-position: -125% 0, 0 0;
  animation: chrome-shine 14s ease-in-out infinite;
  -webkit-background-clip:text; background-clip:text; color:transparent;
  filter: drop-shadow(0 0 20px rgba(78,70,188,.40)) drop-shadow(0 12px 26px rgba(41,191,253,.22));
  margin-bottom: .5rem;
  will-change: opacity; /* header.js lo desvanece conforme sube */
}
@keyframes chrome-shine {
  0%   { background-position: -125% 0, 0 0; }
  45%  { background-position: 225% 0, 0 0; }
  100% { background-position: 225% 0, 0 0; }
}
@media (prefers-reduced-motion: reduce){
  .hero h1 { animation:none; }
}
/* reflejo especular bajo el título (como en la referencia) */
@supports (-webkit-box-reflect: below 0) {
  .hero h1 {
    -webkit-box-reflect: below -0.28em linear-gradient(transparent 62%, rgba(160,200,255,.10) 85%, rgba(41,191,253,.22));
  }
}
.cards {
  display:grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr));
  gap: 1.3rem; margin-top: 1rem;
}
.card {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 1.5rem 1.5rem 1.3rem;
  backdrop-filter: blur(7px);
  -webkit-backdrop-filter: blur(7px);
  transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease;
  display:flex; flex-direction:column; gap:.55rem;
}
.card:hover {
  transform: translateY(-3px);
  border-color: var(--pink);
  box-shadow: 0 0 26px rgba(255,43,214,.22), inset 0 0 18px rgba(255,43,214,.05);
}
.card h2 { font-size:1.22rem; line-height:1.35; }
.card h2 a { color:#fff; text-decoration:none; }
.card h2 a:hover { color: var(--pink); text-shadow: 0 0 10px rgba(255,43,214,.55); }
.card p { color:var(--muted); font-size:.95rem; flex:1; }
.meta {
  font-size:.8rem; color:var(--cyan); letter-spacing:.12em;
  display:flex; gap:.9rem; align-items:center; flex-wrap:wrap;
}
.meta time { color:var(--cyan); }

.tags { display:flex; gap:.45rem; flex-wrap:wrap; }
.tag {
  display:inline-flex; align-items:center; gap:.35rem;
  font-size:.72rem; letter-spacing:.1em; text-transform:uppercase;
  color:var(--purple); text-decoration:none;
  border:1px solid rgba(124,92,255,.4); border-radius:999px; padding:.18rem .7rem;
  transition: all .18s ease;
}
.tag:hover { color:#fff; border-color:var(--pink); background:rgba(255,43,214,.12); text-shadow:0 0 6px rgba(255,43,214,.6); }
.tag .tag-icon { width:14px; height:14px; flex:none; }

/* ---------- íconos de tags (SVG inline, animados) ---------- */
.tag-icon { display:inline-block; }
.tag-icon svg { display:block; width:100%; height:100%; }
.section-title .tag-icon {
  width:56px; height:56px;
  vertical-align:-14px; margin-right:.4rem;
}

.tag-grid {
  display:grid; grid-template-columns:repeat(auto-fill, minmax(140px, 1fr));
  gap:.9rem; margin:1.2rem 0 2rem;
}
.tag-card {
  display:flex; flex-direction:column; align-items:center; gap:.55rem;
  background:var(--panel); border:1px solid var(--border); border-radius:14px;
  padding:1.1rem .6rem .9rem; text-align:center; text-decoration:none;
  transition: all .18s ease;
}
.tag-card:hover {
  transform:translateY(-3px); border-color:var(--pink);
  box-shadow:0 0 26px rgba(255,43,214,.22), inset 0 0 18px rgba(255,43,214,.05);
}
.tag-card .tag-icon { width:72px; height:72px; }
.tag-card-name {
  font-size:.8rem; letter-spacing:.08em; text-transform:uppercase;
  color:var(--ink); word-break:break-word;
}
.tag-card:hover .tag-card-name { color:var(--pink); text-shadow:0 0 8px rgba(255,43,214,.55); }
.tag-card .count { font-size:.72rem; color:var(--muted); }

/* ---------- listado / sección ---------- */
.section-title {
  font-family:'Audiowide', sans-serif; font-size:1.5rem; margin:2.2rem 0 .4rem;
  color:#fff; text-shadow: 0 0 14px rgba(124,92,255,.55);
}
.section-title .count { color:var(--purple); font-size:1rem; }

/* ---------- artículo ---------- */
article.post {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 16px;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  padding: clamp(1.6rem, 4vw, 3rem);
  margin-top: 1.6rem;
}
article.post h1 {
  font-family:'Audiowide', sans-serif;
  font-size: clamp(1.6rem, 4.5vw, 2.4rem);
  line-height:1.25; color:#fff;
  text-shadow: 0 0 16px rgba(255,43,214,.35);
  margin-bottom: .4rem;
}
article.post .meta { margin-bottom: 1.8rem; }
article.post h2 { color:var(--pink); margin:2rem 0 .7rem; font-size:1.35rem; text-shadow:0 0 10px rgba(255,43,214,.4); }
article.post h3 { color:var(--purple); margin:1.6rem 0 .5rem; font-size:1.12rem; }
article.post p { margin-bottom: 1rem; }
article.post a { color:var(--cyan); text-decoration:underline; text-underline-offset:3px; }
article.post a:hover { color:#fff; text-shadow:0 0 8px rgba(37,217,255,.7); }
article.post ul, article.post ol { margin: 0 0 1rem 1.4rem; }
article.post li { margin-bottom:.35rem; }
article.post img { max-width:100%; border-radius:10px; border:1px solid var(--border); }

article.post code {
  font-family:'JetBrains Mono', ui-monospace, monospace;
  font-size:.86em;
  background: rgba(124,92,255,.14);
  border:1px solid rgba(124,92,255,.25);
  border-radius:5px; padding:.1em .4em;
}
article.post pre {
  margin: 1.2rem 0; padding: 1.1rem 1.3rem;
  /* fondo CRT: líneas de barrido + grano sobre el negro base */
  background-color: rgba(3,1,10,.85);
  background-image:
    repeating-linear-gradient(0deg, rgba(0,0,0,.22) 0 1px, transparent 1px 3px),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.14'/%3E%3C/svg%3E");
  border:1px solid var(--border); border-radius:10px;
  overflow-x:auto;
}
article.post pre code { background:none; border:none; padding:0; font-size:.86rem; line-height:1.55; }

article.post blockquote {
  border-left: 3px solid var(--pink);
  background: rgba(255,43,214,.07);
  padding: .8rem 1.2rem; margin: 1.2rem 0;
  border-radius: 0 10px 10px 0;
  color: var(--muted);
}
article.post hr { border:none; border-top:1px dashed rgba(124,92,255,.4); margin:2rem 0; }

/* ---------- tablas ---------- */
article.post table {
  display:block; width:fit-content; max-width:100%;
  margin:1.2rem 0; overflow-x:auto;
  background: rgba(3,1,10,.55);
  border:1px solid var(--border); border-radius:10px;
  border-spacing:0;
}
article.post th, article.post td {
  padding:.55rem .95rem; text-align:left; vertical-align:top;
  font-size:.95rem;
  border-bottom:1px solid rgba(124,92,255,.2);
}
article.post thead th {
  font-size:.76rem; letter-spacing:.12em; text-transform:uppercase;
  color:var(--cyan); text-shadow:0 0 8px rgba(37,217,255,.35);
  background:rgba(37,217,255,.06);
  border-bottom:2px solid rgba(255,43,214,.45);
  white-space:nowrap;
}
article.post tbody tr { transition: background .15s ease; }
article.post tbody tr:nth-child(even) { background:rgba(124,92,255,.05); }
article.post tbody tr:hover { background:rgba(255,43,214,.08); }
article.post tbody tr:last-child td { border-bottom:none; }
article.post tbody td:first-child { color:#fff; }

.back {
  display:inline-block; margin-top:1.4rem;
  color:var(--muted); text-decoration:none; font-size:.9rem; letter-spacing:.1em;
}
.back:hover { color:var(--cyan); }

/* ---------- flecha volver arriba ---------- */
.to-top {
  position:fixed; right:1.6rem; bottom:1.6rem; z-index:10;
  width:46px; height:46px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:1.25rem; line-height:1; text-decoration:none;
  color:var(--cyan);
  background: rgba(9,4,22,.85);
  border:1px solid rgba(37,217,255,.45);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  box-shadow: 0 0 14px rgba(37,217,255,.25);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, color .18s ease;
}
.to-top:hover {
  color:#fff;
  border-color:var(--pink);
  transform: translateY(-3px);
  box-shadow: 0 0 22px rgba(255,43,214,.45);
}
@media (max-width:560px){ .to-top{ right:1rem; bottom:1rem; width:42px; height:42px; } }

footer.site-foot {
  margin-top: 4rem; text-align:center;
  color: rgba(190,182,220,.72); font-size:.84rem; letter-spacing:.12em;
}

@media (max-width: 560px){
  .head-wrap { justify-content:center; text-align:center; }
  nav a:first-child { margin-left:0; }
  article.post th, article.post td { padding:.4rem .6rem; }
}

@media (prefers-reduced-motion: reduce){
  .card, .tag, nav a, article.post tbody tr { transition:none; }
}

/* ---------- FM-1 Firmwares: catálogo ---------- */
/* sección con jerarquía real (h1) */
.fw-title {
  font-family:'Audiowide', sans-serif;
  font-size: clamp(1.9rem, 4.5vw, 2.7rem);
  line-height:1.15; color:#fff; letter-spacing:.03em;
  text-shadow: 0 0 16px rgba(124,92,255,.55);
  margin:2.4rem 0 .9rem;
  display:flex; align-items:center; gap:.9rem; flex-wrap:wrap;
}
.fw-count-badge {
  font-family:'Chakra Petch', system-ui, sans-serif;
  font-size:.8rem; letter-spacing:.12em; text-transform:uppercase;
  color:var(--cyan); border:1px solid rgba(37,217,255,.45);
  background:rgba(37,217,255,.08);
  border-radius:999px; padding:.28rem .85rem;
  text-shadow:none;
}

/* intro sobre panel: nunca directo sobre el fondo synthwave */
.fw-intro {
  background: rgba(7, 3, 18, 0.92);
  border: 1px solid var(--border);
  border-radius: 16px;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  padding: clamp(1.4rem, 3.5vw, 2.2rem);
}
.fw-intro p {
  margin:0 0 1.15em; max-width:70ch;
  color:var(--ink); line-height:1.7; font-weight:400;
}
.fw-intro p:last-child { margin-bottom:0; }
.fw-intro h2 {
  color:var(--pink); font-size:1.28rem; margin:1.9rem 0 .8rem;
  text-shadow:0 0 10px rgba(255,43,214,.4);
}
.fw-intro a {
  color:#7fdcff; text-decoration:underline;
  text-underline-offset:3px; text-decoration-thickness:1px;
}
.fw-intro a:hover, .fw-intro a:focus-visible {
  color:#ff6ad5; text-decoration-thickness:2px;
}
.fw-intro a:visited { color:#b9a6ff; }
.fw-intro strong { color:#fff; font-weight:600; }
.fw-intro ol, .fw-intro ul { margin:0 0 1.15rem 1.5rem; }
.fw-intro li { margin-bottom:.4rem; line-height:1.65; }
.fw-intro blockquote {
  border-left: 3px solid var(--pink);
  background: rgba(255,43,214,.07);
  padding: .8rem 1.2rem; margin: 1.3rem 0 0;
  border-radius: 0 10px 10px 0;
  color: #cfc9e8;
}
.fw-intro blockquote p { margin:0; }

/* tabla comparativa: la hoja de especificaciones junto a la consola */
.fw-compare { margin-top:1.3rem; }
.fw-compare-h {
  font-family:'JetBrains Mono', ui-monospace, monospace;
  font-size:.7rem; letter-spacing:.3em; text-transform:uppercase;
  color:var(--cyan); margin:0 0 .6rem;
  text-shadow:0 0 10px rgba(37,217,255,.35);
}
.fw-tablewrap {
  background: rgba(7, 3, 18, 0.92);
  border: 1px solid var(--border);
  border-radius: 16px;
  overflow-x:auto;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.fw-table { width:100%; min-width:960px; border-collapse:collapse; font-size:.82rem; }
.fw-table th, .fw-table td { padding:.55rem .8rem; text-align:left; vertical-align:top; }
.fw-table thead th {
  font-family:'JetBrains Mono', ui-monospace, monospace;
  font-size:.62rem; letter-spacing:.16em; text-transform:uppercase;
  color:rgba(168,156,200,.85); white-space:nowrap;
  background:rgba(10,5,24,.9);
  border-bottom:1px solid rgba(124,92,255,.45);
}
.fw-table thead th[data-sort] { cursor:pointer; user-select:none; transition:color .15s ease; }
.fw-table thead th[data-sort]:hover { color:var(--cyan); }
.fw-table thead th[data-sort]:focus-visible { outline: 2px solid var(--cyan); outline-offset:-2px; }
.fw-table thead th[data-sort]::after { content:'↕'; margin-left:.4em; opacity:.4; }
.fw-table thead th[aria-sort="ascending"] { color:var(--pink); }
.fw-table thead th[aria-sort="ascending"]::after { content:'↑'; opacity:1; }
.fw-table thead th[aria-sort="descending"] { color:var(--pink); }
.fw-table thead th[aria-sort="descending"]::after { content:'↓'; opacity:1; }
.fw-table tbody tr { border-bottom:1px solid rgba(124,92,255,.14); transition:background .15s ease; }
.fw-table tbody tr:last-child { border-bottom:none; }
.fw-table tbody tr:nth-child(even) { background:rgba(124,92,255,.045); }
.fw-table tbody tr:hover { background:rgba(255,43,214,.07); }
.fw-table td { color:#cfc9e8; }
.fwtd-name a { color:#fff; text-decoration:none; }
.fwtd-name a:hover, .fwtd-name a:focus-visible { color:#ff6ad5; text-shadow:0 0 8px rgba(255,43,214,.5); }
.fwtd-ver, .fwtd-upd {
  font-family:'JetBrains Mono', ui-monospace, monospace;
  font-size:.74rem; white-space:nowrap;
}
.fwtd-ver { color:#7fdcff; }
.fwtd-upd { color:#b8b0da; }
.fwtd-est { font-size:.68rem; letter-spacing:.1em; text-transform:uppercase; white-space:nowrap; }
.fwtd-tipos { white-space:nowrap; }
.fwtd-fork { font-size:.76rem; color:#b8b0da; }
.fwtd-emula { min-width:20rem; max-width:26rem; font-size:.76rem; line-height:1.5; }
.fwtd-more {
  font-family:'JetBrains Mono', ui-monospace, monospace;
  font-size:.66rem; color:var(--cyan); white-space:nowrap;
}
.fw-compare-note { color:var(--muted); font-size:.76rem; margin:.55rem 0 0; }

/* barra de filtros: teclas de silicona sobre riel pegajoso */
.fw-toolbar {
  position: sticky; top: 72px; z-index: 6;
  display:flex; gap:.6rem; align-items:center;
  margin:1.3rem 0 .5rem; padding:.6rem .7rem;
  background: rgba(5,1,13,.93);
  border:1px solid rgba(124,92,255,.35); border-radius:14px;
  border-bottom:2px solid rgba(124,92,255,.55);
  box-shadow: 0 12px 28px rgba(3,1,10,.85);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.fw-chips {
  display:flex; gap:.45rem; align-items:center;
  overflow-x:auto; scrollbar-width:thin;
}
.fw-chip {
  font-family:'JetBrains Mono', ui-monospace, monospace;
  font-size:.74rem; letter-spacing:.04em;
  color:#d8d2f0; cursor:pointer; min-height:34px; white-space:nowrap;
  background: linear-gradient(180deg, rgba(46,28,92,.55), rgba(20,10,44,.78));
  border:1px solid rgba(124,92,255,.45); border-radius:8px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.09), 0 2px 5px rgba(3,1,10,.5);
  padding:.35rem .78rem;
  transition: color .15s ease, border-color .15s ease, box-shadow .15s ease, transform .1s ease;
}
.fw-chip:hover { color:#fff; border-color:rgba(37,217,255,.6); }
.fw-chip.is-active {
  background: linear-gradient(180deg, rgba(255,43,214,.32), rgba(255,43,214,.14));
  border-color: rgba(255,43,214,.65); color:#fff;
  box-shadow: inset 0 2px 6px rgba(0,0,0,.45), 0 0 12px rgba(255,43,214,.25);
  transform: translateY(1px);
}
.fw-search {
  margin-left:auto; flex:none;
  font-family:'JetBrains Mono', ui-monospace, monospace; font-size:.8rem;
  color:var(--ink); background:#0a0518;
  border:1px solid rgba(124,92,255,.4); border-radius:8px;
  box-shadow: inset 0 2px 6px rgba(0,0,0,.55);
  padding:.42rem .9rem; width:170px; min-height:34px;
}
.fw-search::placeholder { color:var(--muted); }
.fw-search:focus { border-color:var(--cyan); outline:none; box-shadow: inset 0 2px 6px rgba(0,0,0,.55), 0 0 10px rgba(37,217,255,.2); }

/* ---------- la tarjeta-unidad: cada firmware es un FM-1 con su pantalla ---------- */
.fw-grid {
  display:grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 1.3rem; margin-top:1rem;
}
.unit {
  position:relative;
  display:flex; flex-direction:column;
  background: linear-gradient(180deg, rgba(17,9,40,.94), rgba(9,4,22,.94));
  border:1px solid rgba(124,92,255,.32); border-radius:16px;
  overflow:hidden;
  box-shadow: 0 4px 18px rgba(3,1,10,.5), inset 0 1px 0 rgba(255,255,255,.04);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.unit:hover, .unit:has(.unit-name a:focus-visible) {
  transform: translateY(-3px);
  border-color: rgba(255,43,214,.55);
  box-shadow: 0 10px 30px rgba(3,1,10,.7), 0 0 24px rgba(255,43,214,.16), inset 0 1px 0 rgba(255,255,255,.05);
}
.unit:has(.unit-name a:focus-visible) { border-color: var(--cyan); }

/* la pantalla: bezel + CRT (líneas de barrido, viñeta, reflejo de vidrio) */
.unit-screen {
  position:relative; margin:14px 14px 0;
  border-radius:12px; overflow:hidden;
  border:1px solid rgba(124,92,255,.4);
  background:#07030f;
  box-shadow:
    inset 0 0 0 4px #0c0720,
    inset 0 0 0 5px rgba(0,0,0,.6),
    inset 0 3px 10px rgba(0,0,0,.9),
    0 1px 0 rgba(255,255,255,.05);
  transition: box-shadow .25s ease;
}
.unit-screen img, .unit-nosignal {
  display:block; width:100%; aspect-ratio:1/1;
  object-fit:cover; object-position:top center;
}
.unit-screen img {
  filter:brightness(.82) saturate(1.02);
  transition: filter .25s ease;
}
.unit:hover .unit-screen img { filter:brightness(1) saturate(1.1); }
.unit:hover .unit-screen {
  box-shadow: inset 0 0 0 3px #0b0618, inset 0 0 18px rgba(0,0,0,.6), 0 0 16px rgba(37,217,255,.14);
}
/* capturas claras/blancas: descansan más oscuras, se encienden al hover */
.unit-screen img.claro { filter:brightness(.68) saturate(1.05); }
.unit-screen img[data-blanca] { filter:brightness(.55) saturate(1.08) contrast(1.03); }
.unit:hover .unit-screen img.claro { filter:brightness(.92) saturate(1.1); }
.unit:hover .unit-screen img[data-blanca] { filter:brightness(.8) saturate(1.12) contrast(1.03); }
.unit-screen::after {
  content:''; position:absolute; inset:0; pointer-events:none;
  background:
    repeating-linear-gradient(0deg, rgba(0,0,0,.16) 0 1px, transparent 1px 3px),
    radial-gradient(ellipse at center, transparent 58%, rgba(3,1,10,.5) 100%),
    linear-gradient(115deg, rgba(255,255,255,.07) 0%, transparent 28%);
}
/* pantalla sin captura: fósforo apagado */
.unit-nosignal {
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.5rem;
  background:
    radial-gradient(circle at 30% 22%, rgba(124,92,255,.16), transparent 52%),
    radial-gradient(circle at 72% 78%, rgba(255,43,214,.1), transparent 50%),
    #0a0518;
}
.ns-init {
  font-family:'Audiowide', sans-serif; font-size:2.3rem;
  color:rgba(63,255,190,.5); letter-spacing:.16em;
  text-shadow:0 0 16px rgba(63,255,190,.35);
}
.ns-label {
  font-family:'JetBrains Mono', ui-monospace, monospace; font-size:.6rem;
  letter-spacing:.32em; text-transform:uppercase; color:rgba(168,156,200,.6);
}
/* LED de estado en la esquina de la pantalla */
.unit-led {
  position:absolute; top:10px; right:10px; z-index:2;
  width:9px; height:9px; border-radius:50%;
  background: currentColor;
  box-shadow:
    0 0 0 3px rgba(5,1,13,.82),
    0 0 12px 2px currentColor;
  animation: unit-led-pulse 3.2s ease-in-out infinite;
}
@keyframes unit-led-pulse {
  0%, 100% { opacity:1; } 50% { opacity:.35; }
}

/* el cuerpo: placa serigrafiada + hoja de parche */
.unit-body {
  padding:.85rem 1.05rem 1rem;
  display:flex; flex-direction:column; gap:.5rem; flex:1;
}
.unit-head { display:flex; justify-content:space-between; align-items:center; gap:.6rem; }
.unit-version {
  font-family:'JetBrains Mono', ui-monospace, monospace;
  font-size:.8rem; color:#7fdcff; letter-spacing:.02em;
}
.unit-estado {
  font-size:.68rem; letter-spacing:.12em; text-transform:uppercase;
  display:inline-flex; align-items:center; gap:.38rem;
}
.unit-estado::before {
  content:''; width:6px; height:6px; border-radius:50%;
  background: currentColor; box-shadow:0 0 7px currentColor;
}
.ue-estable { color:#8fe3ff; }
.ue-beta { color:#cabaff; }
.ue-alpha, .ue-test, .ue-experimental { color:#ffa7ec; }
.ue-en-camino, .ue-abandonado { color:#c5bde6; }
.unit-name { font-family:'Audiowide', sans-serif; font-size:1.02rem; letter-spacing:.02em; line-height:1.3; }
.unit-name a { color:#fff; text-decoration:none; }
.unit-name a::after { content:''; position:absolute; inset:0; z-index:3; }
.unit:hover .unit-name { text-shadow:0 0 12px rgba(255,43,214,.45); }
.unit-desc { color:#cac5e6; font-size:.93rem; line-height:1.55; flex:1 1 auto; }
/* hoja de parche: datos en mono, como en la LCD */
.unit-sheet {
  display:grid; gap:.26rem; margin:.15rem 0 0;
  font-family:'JetBrains Mono', ui-monospace, monospace; font-size:.72rem;
}
.unit-sheet > div { display:flex; gap:.6rem; align-items:baseline; }
.unit-sheet dt {
  color:rgba(140,124,190,.9); flex:none; width:2.9rem;
  font-size:.6rem; text-transform:uppercase; letter-spacing:.14em; padding-top:.14em;
}
.unit-sheet dd { color:#cfc9e8; }
.lic-dot {
  display:inline-block; width:7px; height:7px; border-radius:2px;
  margin-right:.45rem; vertical-align:baseline;
  background:#8f86b8; box-shadow:0 0 6px rgba(124,92,255,.35);
}
.lic-dot.lic-gpl { background:#25d9ff; box-shadow:0 0 6px rgba(37,217,255,.5); }
.lic-dot.lic-cerrado { background:#ff2bd6; box-shadow:0 0 6px rgba(255,43,214,.5); }
.lic-dot.lic-comercial { background:#ffd24a; box-shadow:0 0 6px rgba(255,210,74,.5); }
.lic-dot.lic-free { background:#7c5cff; box-shadow:0 0 6px rgba(124,92,255,.5); }
.unit-by {
  margin-top:auto; padding-top:.7rem;
  display:flex; justify-content:space-between; align-items:flex-end; gap:.7rem;
  font-size:.82rem; color:#b8b0da;
}
.unit-cta {
  font-family:'JetBrains Mono', ui-monospace, monospace;
  font-size:.7rem; letter-spacing:.08em; color:#a79ecb; white-space:nowrap;
  transition: color .15s ease, text-shadow .15s ease;
}
.unit:hover .unit-cta { color:var(--pink); text-shadow:0 0 8px rgba(255,43,214,.55); }

.fw-empty { text-align:center; color:var(--muted); padding:2.6rem 0; font-size:.95rem; }

/* ficha de firmware (detalle) */
.fw-figure { margin:1.4rem 0; }
.fw-crt {
  position:relative; display:block; border-radius:10px; overflow:hidden;
  border:1px solid rgba(124,92,255,.4);
  background:#07030f;
  box-shadow: inset 0 0 0 3px #0b0618, inset 0 0 26px rgba(0,0,0,.6);
}
.fw-crt img { display:block; max-width:100%; }
.fw-crt::after {
  content:''; position:absolute; inset:0; pointer-events:none;
  background:
    repeating-linear-gradient(0deg, rgba(0,0,0,.12) 0 1px, transparent 1px 3px),
    radial-gradient(ellipse at center, transparent 62%, rgba(3,1,10,.4) 100%);
}
.fw-figure figcaption {
  font-size:.8rem; color:var(--muted); margin-top:.45rem; letter-spacing:.04em;
}
.fw-specs { margin:1.4rem 0; }
.fw-specs th {
  font-size:.78rem; letter-spacing:.12em; text-transform:uppercase;
  color:var(--cyan); text-shadow:0 0 8px rgba(37,217,255,.35);
  white-space:nowrap;
}
.fw-emula { margin:0; padding-left:1.2rem; }
.fw-stamp { color:var(--muted); font-size:.8rem; }
.fw-page .fw-meta { margin-bottom:.4rem; }
.fw-version {
  font-family:'JetBrains Mono', ui-monospace, monospace;
  font-size:.82rem; color:#dcd7f2;
}
.fw-estado {
  font-size:.74rem; letter-spacing:.1em; text-transform:uppercase;
  padding:.16rem .65rem; border-radius:999px; border:1px solid;
}
.estado-estable { color:#9feaff; border-color:rgba(37,217,255,.5); background:rgba(37,217,255,.12); }
.estado-beta { color:#cabaff; border-color:rgba(124,92,255,.55); background:rgba(124,92,255,.14); }
.estado-alpha, .estado-test, .estado-experimental { color:#ffa7ec; border-color:rgba(255,43,214,.5); background:rgba(255,43,214,.11); }
.estado-en-camino, .estado-abandonado { color:#c5bde6; border-color:rgba(168,156,200,.4); background:rgba(168,156,200,.1); }

@media (max-width:560px){
  .fw-toolbar { top: 64px; flex-wrap:wrap; }
  .fw-chip { padding:.5rem .8rem; min-height:40px; }
  .fw-search { width:100%; margin-left:0; min-height:40px; }
}

/* en las páginas del catálogo, la escena synthwave baja de intensidad:
   el sol no sangra entre las tarjetas */
body.fwpage #bg-gl { opacity:.55; }

@media (prefers-reduced-motion: reduce){
  .unit, .unit-screen, .unit-screen img, .fw-chip { transition:none; }
  .unit-led { animation:none; opacity:.9; }
}

/* alias en inglés del vocabulario de estado */
.ue-stable, .ue-upcoming { }
.ue-stable { color:#8fe3ff; }
.ue-beta { color:#cabaff; }
.ue-alpha, .ue-test, .ue-experimental { color:#ffa7ec; }
.ue-upcoming, .ue-abandoned { color:#c5bde6; }
.estado-stable { color:#9feaff; border-color:rgba(37,217,255,.5); background:rgba(37,217,255,.12); }
.estado-upcoming { color:#c5bde6; border-color:rgba(168,156,200,.4); background:rgba(168,156,200,.1); }
.estado-abandoned { color:#c5bde6; border-color:rgba(168,156,200,.4); background:rgba(168,156,200,.1); }