/* ═══ VARIANTE A — TERMINAL ═══
   Bruta: tutto monospace, come una CLI. Prompt in verde fosforescente.
   Il contenuto e' un transcript di terminale: log, comandi, output.
*/

body{ font-family:var(--mono); font-size:15px; }

/* Nav: una barra di stato, come un terminale */
.cy-nav{
  position:sticky; top:0; z-index:50;
  background:rgba(5,6,10,.86);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--edge);
}
.cy-nav__in{
  max-width:1160px; margin:0 auto; padding:0 clamp(1.25rem,4vw,2.5rem);
  height:56px; display:flex; align-items:center; gap:1.5rem;
}
.cy-nav__brand{
  font-family:var(--mono); font-weight:700; font-size:.82rem;
  letter-spacing:.08em; color:var(--neon); text-decoration:none;
  text-shadow:0 0 14px var(--glow);
  display:flex; align-items:center; gap:.5rem;
}
.cy-nav__brand::before{ content:'$'; color:var(--ink-3); text-shadow:none; }
.cy-nav__links{ margin-left:auto; display:flex; gap:1.6rem; }
.cy-nav__links a{
  font-size:.74rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--ink-3); text-decoration:none; transition:color .15s;
}
.cy-nav__links a:hover{ color:var(--neon); }
@media(max-width:720px){ .cy-nav__links{ display:none; } }

/* Hero = prompt di shell */
.cy-hero{
  padding:clamp(4rem,11vw,8rem) 0 clamp(3rem,7vw,5rem);
  border-bottom:1px solid var(--edge);
}
.cy-prompt{
  font-family:var(--mono); font-size:.82rem; color:var(--ink-3);
  margin-bottom:1.6rem;
}
.cy-prompt b{ color:var(--neon); font-weight:400; }
.cy-prompt .path{ color:var(--cyan); }

.cy-hero h1{
  font-family:var(--mono); font-weight:700;
  font-size:clamp(2rem,6.5vw,4.2rem);
  line-height:1.05; letter-spacing:-.025em;
  margin:0 0 1.5rem;
  color:var(--ink);
}
.cy-hero h1 .hot{
  color:var(--neon);
  text-shadow:0 0 28px var(--glow);
}
.cy-hero__meta{
  margin-top:2.2rem; display:flex; flex-wrap:wrap; gap:.7rem;
  font-size:.7rem; letter-spacing:.12em; text-transform:uppercase;
}
.cy-meta-chip{
  border:1px solid var(--edge-hi); border-radius:var(--r-sm);
  padding:.4em .75em; color:var(--ink-3);
}
.cy-meta-chip--live{ border-color:var(--edge-hot); color:var(--neon); }
.cy-meta-chip--live::before{
  content:''; display:inline-block; width:6px; height:6px;
  border-radius:50%; background:var(--neon); margin-right:.5em;
  box-shadow:0 0 8px var(--neon);
  animation:pulse 2s ease-in-out infinite;
}
@keyframes pulse{ 0%,100%{opacity:1}50%{opacity:.25} }

/* Blocco "output" — le sezioni sono blocchi di log */
.cy-out{
  border:1px solid var(--edge); border-radius:var(--r-md);
  background:var(--carbon); overflow:hidden;
  margin-bottom:1.4rem;
}
.cy-out__bar{
  display:flex; align-items:center; gap:.6rem;
  padding:.55rem .9rem;
  background:var(--carbon-2); border-bottom:1px solid var(--edge);
  font-size:.68rem; letter-spacing:.12em; text-transform:uppercase;
  color:var(--ink-4);
}
.cy-out__bar .dots{ display:flex; gap:.3rem; }
.cy-out__bar .dots i{
  width:8px; height:8px; border-radius:50%; display:block;
  background:var(--ink-4); opacity:.45;
}
.cy-out__bar .dots i:first-child{ background:var(--magenta); opacity:.7; }
.cy-out__bar .dots i:nth-child(2){ background:var(--amber); opacity:.7; }
.cy-out__bar .dots i:nth-child(3){ background:var(--neon); opacity:.7; }
.cy-out__body{ padding:1.4rem 1.5rem; }
.cy-out__body > *:last-child{ margin-bottom:0; }

/* Linee di log */
.cy-log{ font-size:.8rem; color:var(--ink-4); margin:0 0 .5rem; }
.cy-log .t{ color:var(--ink-4); margin-right:1em; }
.cy-log .ok{ color:var(--neon); }
.cy-log .info{ color:var(--cyan); }
.cy-log .warn{ color:var(--amber); }

/* Griglia post: come output di un comando */
.cy-postlist{ display:flex; flex-direction:column; gap:0; }
.cy-post{
  display:grid; grid-template-columns:4.5rem 1fr auto; gap:1.5rem;
  align-items:baseline;
  padding:1.35rem 0;
  border-bottom:1px solid var(--edge);
  text-decoration:none; color:inherit;
  transition:background .15s, padding-left .2s;
}
.cy-post:hover{ background:rgba(255,159,28,.04); padding-left:.8rem; }
.cy-post__id{ font-size:.72rem; color:var(--ink-4); }
.cy-post:hover .cy-post__id{ color:var(--neon); }
.cy-post__title{
  font-family:var(--mono); font-size:1.05rem; font-weight:500;
  color:var(--ink); margin:0; line-height:1.35;
}
.cy-post:hover .cy-post__title{ color:var(--neon); }
.cy-post__meta{ font-size:.7rem; color:var(--ink-4); white-space:nowrap; }
@media(max-width:640px){
  .cy-post{ grid-template-columns:1fr; gap:.35rem; }
  .cy-post__id{ display:none; }
}

/* CTA finale = prompt */
.cy-cta{
  border:1px solid var(--edge-hot); border-radius:var(--r-md);
  background:linear-gradient(180deg, rgba(255,159,28,.06), transparent);
  padding:2.2rem 1.8rem; text-align:center;
}
.cy-cta h2{
  font-family:var(--mono); font-size:clamp(1.3rem,3.6vw,2rem);
  font-weight:700; margin:0 0 1rem; line-height:1.15;
}
.cy-cta p{ color:var(--ink-2); max-width:56ch; margin:0 auto 1.8rem; }

/* Footer */
.cy-foot{
  border-top:1px solid var(--edge);
  padding:2.2rem 0; margin-top:4rem;
  font-size:.72rem; color:var(--ink-4);
  display:flex; flex-wrap:wrap; gap:1rem; justify-content:space-between;
}
.cy-foot a{ color:var(--ink-3); text-decoration:none; }
.cy-foot a:hover{ color:var(--neon); }


/* ═══════════════════════════════════════════════════════════════
   COMPONENTI PER IL TEMPLATE WORDPRESS
   ═══════════════════════════════════════════════════════════════ */

:root{
  --void:#05060a; --carbon:#0b0d14; --carbon-2:#11141d; --carbon-3:#171b26;
  --edge:rgba(120,190,255,.12); --edge-hi:rgba(120,190,255,.28);
  --edge-hot:rgba(0,255,168,.45);
  --neon:#00ffa8; --neon-dim:#00c982; --cyan:#00d9ff; --magenta:#ff2d95; --amber:#ffb347;
  --ink:#e8eef7; --ink-2:#a8b4c6; --ink-3:#6b7789; --ink-4:#3d4657;
  /* ── Tipografia ──────────────────────────────────────────────
   /* --glow: alone del colore d'accento. Cambia con --neon, quindi
   segue il tema (verde sugli articoli, arancione sulla home). */
  --glow:rgba(0,255,168,.55);
  --glow-soft:rgba(0,255,168,.4);
  --glow-btn:rgba(0,255,168,.4);
  --mono:'JetBrains Mono',ui-monospace,'SF Mono',Menlo,Consolas,monospace;
  --read-size   : 1.0625rem;
  --read-lh     : 1.75;
  --read-measure: 68ch;
  --mono:'JetBrains Mono',ui-monospace,'SF Mono',Menlo,Consolas,monospace;
}

html:has(body.cy-theme){
  background:var(--void) !important;
  color-scheme:dark;
}
body.cy-theme{
  margin:0 !important;
  background:var(--void) !important;
  background-color:var(--void) !important;
  color:var(--ink) !important;
  font-family:var(--mono) !important;
  font-size:15px !important;
  line-height:1.7 !important;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden !important;
}
/* Neutralizza i reset globali del tema su tutti gli elementi del blocco. */
body.cy-theme *,
body.cy-theme *::before,
body.cy-theme *::after{
  background-color:transparent;
}
body.cy-theme .cy-bg,
body.cy-theme .cy-scan{
  background-color:transparent;
}

/* Sfondo a griglia + scanline, dietro a tutto */
.cy-bg{
  position:fixed; inset:0; z-index:0; pointer-events:none;
  background-image:
    linear-gradient(rgba(120,190,255,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(120,190,255,.045) 1px, transparent 1px);
  background-size:56px 56px;
  mask-image:radial-gradient(ellipse 100% 70% at 50% 0%, #000 20%, transparent 85%);
  -webkit-mask-image:radial-gradient(ellipse 100% 70% at 50% 0%, #000 20%, transparent 85%);
}
.cy-scan{
  position:fixed; inset:0; z-index:1; pointer-events:none; opacity:.5;
  background:repeating-linear-gradient(0deg, rgba(0,0,0,.28) 0 1px, transparent 1px 3px);
  mix-blend-mode:multiply;
}
.cy-shell{ position:relative; z-index:2; }

.cy-wrap{ width:100%; max-width:1160px; margin:0 auto; padding:0 clamp(1.25rem,4vw,2.5rem); }
.cy-main{ padding-top:3.5rem; padding-bottom:4rem; }

/* ── Typography ── */
.cy-hero h1{
  font-family:var(--mono); font-weight:700;
  font-size:clamp(2rem,6.5vw,4.2rem);
  line-height:1.05; letter-spacing:-.025em;
  margin:0 0 1.5rem; color:var(--ink);
}
.cy-hero h1 .hot{
  color:var(--neon); text-shadow:0 0 28px var(--glow);
}
.cy-p{ color:var(--ink-2); margin:0 0 1.2em; max-width:68ch; line-height:1.75; }
.cy-p strong{ color:var(--ink); font-weight:600; }
.cy-p em{ color:var(--cyan); font-style:normal; }
.cy-p a{ color:var(--neon); text-decoration:none; border-bottom:1px solid var(--edge-hot); }
.cy-p a:hover{ border-bottom-color:var(--neon); text-shadow:0 0 12px var(--glow); }

.cy-kicker{
  font-family:var(--mono); font-size:.7rem; font-weight:600;
  letter-spacing:.24em; text-transform:uppercase; color:var(--neon);
  display:inline-flex; align-items:center; gap:.6em;
}
.cy-kicker::before{
  content:''; width:1.6em; height:1px; background:var(--neon);
  box-shadow:0 0 6px var(--neon);
}

/* ── Nav ── */
.cy-nav{
  position:sticky; top:0; z-index:50;
  background:rgba(5,6,10,.86);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--edge);
}
.cy-nav__in{
  max-width:1160px; margin:0 auto; padding:0 clamp(1.25rem,4vw,2.5rem);
  height:56px; display:flex; align-items:center; gap:1.5rem;
}
.cy-nav__brand{
  font-family:var(--mono); font-weight:700; font-size:.82rem;
  letter-spacing:.08em; color:var(--neon); text-decoration:none;
  text-shadow:0 0 14px var(--glow);
  display:flex; align-items:center; gap:.5rem; white-space:nowrap;
}
.cy-nav__brand::before{ content:'$'; color:var(--ink-3); text-shadow:none; }
.cy-nav__links{ margin-left:auto; display:flex; gap:1.6rem; flex-wrap:wrap; justify-content:flex-end; }
.cy-nav__links a{
  font-size:.74rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--ink-3); text-decoration:none; transition:color .15s; white-space:nowrap;
}
.cy-nav__links a:hover{ color:var(--neon); }
@media(max-width:900px){ .cy-nav__links{ display:none; } }

/* ── Hero ── */
.cy-hero{
  padding:clamp(4rem,11vw,8rem) 0 clamp(3rem,7vw,5rem);
  border-bottom:1px solid var(--edge);
}
.cy-prompt{ font-family:var(--mono); font-size:.82rem; color:var(--ink-3); margin-bottom:1.6rem; }
.cy-prompt b{ color:var(--neon); font-weight:400; }
.cy-prompt .path{ color:var(--cyan); }
.cy-hero__meta{ margin-top:2.2rem; display:flex; flex-wrap:wrap; gap:.7rem; font-size:.7rem; letter-spacing:.12em; text-transform:uppercase; }
.cy-meta-chip{ border:1px solid var(--edge-hi); border-radius:2px; padding:.4em .75em; color:var(--ink-3); }
.cy-meta-chip--live{ border-color:var(--edge-hot); color:var(--neon); }
.cy-meta-chip--live::before{
  content:''; display:inline-block; width:6px; height:6px; border-radius:50%;
  background:var(--neon); margin-right:.5em; box-shadow:0 0 8px var(--neon);
  animation:cy-pulse 2s ease-in-out infinite;
}
@keyframes cy-pulse{ 0%,100%{opacity:1}50%{opacity:.25} }

/* ── Blocco output ── */
.cy-out{ border:1px solid var(--edge); border-radius:4px; background:var(--carbon); overflow:hidden; margin-bottom:1.4rem; }
.cy-out__bar{
  display:flex; align-items:center; gap:.6rem; padding:.55rem .9rem;
  background:var(--carbon-2); border-bottom:1px solid var(--edge);
  font-size:.68rem; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-4);
}
.cy-out__bar .dots{ display:flex; gap:.3rem; flex-shrink:0; }
.cy-out__bar .dots i{ width:8px; height:8px; border-radius:50%; display:block; background:var(--ink-4); opacity:.45; }
.cy-out__bar .dots i:first-child{ background:var(--magenta); opacity:.7; }
.cy-out__bar .dots i:nth-child(2){ background:var(--amber); opacity:.7; }
.cy-out__bar .dots i:nth-child(3){ background:var(--neon); opacity:.7; }
.cy-out__body{ padding:1.4rem 1.5rem; }
.cy-out__body > *:last-child{ margin-bottom:0; }

/* ── Log ── */
.cy-log{ font-size:.8rem; color:var(--ink-4); margin:0 0 .5rem; line-height:1.6; }
.cy-log .t{ color:var(--ink-4); margin-right:1em; }
.cy-log .ok{ color:var(--neon); }
.cy-log .info{ color:var(--cyan); }
.cy-log .warn{ color:var(--amber); }
.cy-log a{ color:var(--ink-2); text-decoration:none; border-bottom:1px solid transparent; }
.cy-log a:hover{ color:var(--neon); border-bottom-color:var(--edge-hot); }

/* ── Card categorie ── */
.cy-cards{ display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:1.2rem; }
.cy-card{
  background:var(--carbon); border:1px solid var(--edge); border-radius:4px;
  padding:1.5rem 1.4rem; text-decoration:none; color:inherit; display:block;
  position:relative; transition:border-color .2s, background .2s, transform .2s;
}
.cy-card:hover{ border-color:var(--edge-hot); background:var(--carbon-2); transform:translateY(-2px); }
.cy-card::before{
  content:''; position:absolute; top:-1px; left:-1px; width:14px; height:14px;
  border-top:1px solid var(--neon); border-left:1px solid var(--neon); opacity:.7;
}
.cy-card__n{
  font-family:var(--mono); font-size:1.5rem; font-weight:700; color:var(--neon);
  line-height:1; margin-bottom:.7em; text-shadow:0 0 16px var(--glow-soft);
}
.cy-card h3{ margin:0 0 .6em; font-size:1rem; font-weight:600; color:var(--ink); letter-spacing:-.01em; }
.cy-card p{ margin:0; color:var(--ink-3); font-size:.88rem; line-height:1.6; }

/* ── Feed post ── */
.cy-postlist{ display:flex; flex-direction:column; }
.cy-post{
  display:grid; grid-template-columns:4.5rem 1fr auto; gap:1.5rem; align-items:baseline;
  padding:1.35rem 0; border-bottom:1px solid var(--edge);
  text-decoration:none; color:inherit; transition:background .15s, padding-left .2s;
}
.cy-post:hover{ background:rgba(255,159,28,.04); padding-left:.8rem; }
.cy-post__id{ font-size:.72rem; color:var(--ink-4); }
.cy-post:hover .cy-post__id{ color:var(--neon); }
.cy-post__main{ display:flex; flex-direction:column; gap:.25rem; min-width:0; }
.cy-post__cat{ font-size:.64rem; letter-spacing:.16em; text-transform:uppercase; color:var(--cyan); }
.cy-post__title{ font-size:1.05rem; font-weight:500; color:var(--ink); line-height:1.35; }
.cy-post:hover .cy-post__title{ color:var(--neon); }
.cy-post__meta{ font-size:.7rem; color:var(--ink-4); white-space:nowrap; }
@media(max-width:640px){
  .cy-post{ grid-template-columns:1fr; gap:.35rem; }
  .cy-post__id{ display:none; }
}

/* ── Articolo singolo ── */
.cy-article{ font-size:.95rem; }
.cy-article > *:first-child{ margin-top:0; }
.cy-article h2{
  font-size:clamp(1.25rem,3vw,1.6rem); font-weight:700; letter-spacing:-.02em;
  margin:2.2em 0 .8em; color:var(--ink); line-height:1.2;
}
.cy-article h3{ font-size:1.15rem; font-weight:600; margin:1.8em 0 .7em; color:var(--ink); }
.cy-article p{ color:var(--ink-2); margin:0 0 1.2em; line-height:1.78; }
.cy-article ul,.cy-article ol{ color:var(--ink-2); padding-left:1.4em; margin:0 0 1.2em; }
.cy-article li{ margin-bottom:.5em; }
.cy-article img{ max-width:100%; height:auto; border:1px solid var(--edge); border-radius:3px; }
.cy-article blockquote{
  margin:1.8em 0; padding:1em 1.4em; border-left:2px solid var(--neon);
  background:var(--carbon-2); color:var(--ink); font-style:italic;
}
.cy-article code{
  background:var(--carbon-2); padding:.15em .45em; border-radius:2px;
  color:var(--cyan); font-size:.9em; border:1px solid var(--edge);
}
.cy-article pre{
  background:var(--carbon-2); border:1px solid var(--edge); border-left:2px solid var(--neon);
  border-radius:3px; padding:1.1rem 1.3rem; overflow-x:auto; margin:1.5em 0;
}
.cy-article pre code{ background:none; border:0; padding:0; color:var(--ink-2); }
.cy-article table{ width:100%; border-collapse:collapse; margin:1.5em 0; font-size:.9em; }
.cy-article th,.cy-article td{ border:1px solid var(--edge); padding:.6em .8em; text-align:left; }
.cy-article th{ color:var(--neon); font-weight:600; }

/* ── Tag ── */
.cy-tags{ display:flex; flex-wrap:wrap; gap:.5rem; margin:1.5rem 0 2.5rem; }
.cy-tag{
  display:inline-block; font-size:.66rem; letter-spacing:.12em; text-transform:uppercase;
  padding:.4em .75em; border:1px solid var(--edge-hi); border-radius:2px;
  color:var(--ink-3); text-decoration:none; transition:all .18s;
}
.cy-tag:hover{ border-color:var(--neon); color:var(--neon); background:rgba(255,159,28,.09); }

/* ── Navigazione articolo ── */
.cy-postnav{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin-top:2rem; }
.cy-postnav__item{
  border:1px solid var(--edge); border-radius:4px; padding:1rem 1.2rem;
  text-decoration:none; display:flex; flex-direction:column; gap:.35rem;
  transition:border-color .2s, background .2s;
}
.cy-postnav__item:hover{ border-color:var(--edge-hot); background:var(--carbon); }
.cy-postnav__item--empty{ border:0; }
.cy-postnav__item--next{ text-align:right; }
.cy-postnav__dir{ font-size:.66rem; letter-spacing:.14em; text-transform:uppercase; color:var(--neon); }
.cy-postnav__title{ font-size:.92rem; color:var(--ink-2); line-height:1.4; }
.cy-postnav__item:hover .cy-postnav__title{ color:var(--ink); }
@media(max-width:640px){ .cy-postnav{ grid-template-columns:1fr; } .cy-postnav__item--next{ text-align:left; } }

/* ── CTA ── */
.cy-cta{
  border:1px solid var(--edge-hot); border-radius:4px;
  background:linear-gradient(180deg, rgba(255,159,28,.06), transparent);
  padding:2.2rem 1.8rem; text-align:center;
}
.cy-cta h2{ font-size:clamp(1.3rem,3.6vw,2rem); font-weight:700; margin:0 0 1rem; line-height:1.15; }
.cy-cta p{ color:var(--ink-2); max-width:56ch; margin:0 auto 1.8rem; font-size:.92rem; }

/* ── Bottoni ── */
.cy-btn{
  display:inline-flex; align-items:center; gap:.6em;
  font-family:var(--mono); font-size:.74rem; font-weight:600;
  letter-spacing:.16em; text-transform:uppercase; padding:.95em 1.6em;
  border-radius:2px; text-decoration:none; border:1px solid var(--neon);
  color:var(--neon); background:transparent; transition:all .18s; cursor:pointer;
}
.cy-btn:hover{ background:var(--neon); color:var(--void); box-shadow:0 0 24px var(--glow-soft); }
.cy-btn--solid{ background:var(--neon); color:var(--void); }
.cy-btn--solid:hover{ background:var(--neon-dim); border-color:var(--neon-dim); }
.cy-btn--ghost{ border-color:var(--edge-hi); color:var(--ink-2); }
.cy-btn--ghost:hover{ border-color:var(--neon); color:var(--neon); background:transparent; box-shadow:none; }

/* ── Footer ── */
.cy-foot{
  border-top:1px solid var(--edge); padding:2.2rem 0; margin-top:4rem;
  font-size:.72rem; color:var(--ink-4);
  display:flex; flex-wrap:wrap; gap:1rem; justify-content:space-between;
}
.cy-foot a{ color:var(--ink-3); text-decoration:none; }
.cy-foot a:hover{ color:var(--neon); }

/* ── Accessibilita' ── */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{ animation-duration:.01ms !important; transition-duration:.01ms !important; }
}
:focus-visible{ outline:2px solid var(--neon); outline-offset:2px; }


/* ═══════════════════════════════════════════════════════════════
   NEUTRALIZZAZIONE ELEMENTI DEL TEMA PEREGRINE
   Il tema inserisce header/footer/switcher lingua che nel layout
   full-bleed sovrappono il contenuto. Li nascondiamo: il template
   costruisce tutto da zero.
   ═══════════════════════════════════════════════════════════════ */
body.cy-theme .switcher,
body.cy-theme .gtranslate-gloss,
body.cy-theme #gtranslate_selector,
body.cy-theme .gt-main,
body.cy-theme .lang-switcher,
body.cy-theme .site-language,
body.cy-theme .wpml-ls-side-switcher,
body.cy-theme .h-page-title__outer,
body.cy-theme .page-title,
body.cy-theme .h-site-header,
body.cy-theme .site-header,
body.cy-theme .h-site-footer,
body.cy-theme .site-footer,
body.cy-theme #wpadminbar,
body.cy-theme .h-global-sticky-nav,
body.cy-theme .h-nav-mobile{
  display: none !important;
}
/* La barra di amministrazione WP sposta il contenuto: la compattiamo. */
body.cy-theme.admin-bar .cy-nav{ top:0; }
/* Nessun wrapper del tema dentro il nostro contenuto */
body.cy-theme .site{ background:transparent !important; }
/* La galleria/lazy-load del tema non deve toccare le nostre immagini */
body.cy-theme img{ max-width:100%; height:auto; }


/* GTranslate: il selettore lingua e' posizionato fisso e sovrappone
   il contenuto. Lo nascondiamo nel template full-bleed. */
body.cy-theme .gtranslate_wrapper,
body.cy-theme .gt_float_switcher,
body.cy-theme .gt-current-lang,
body.cy-theme .gt_lang,
body.cy-theme .gt_holder.gt_bottom,
body.cy-theme .gt_float_switcher_arrow{
  display: none !important;
}
/* Se GTranslate e' inline, nascondiamo solo i wrapper che restano. */
body.cy-theme .gtranslate_wrapper *{ display:none !important; }


/* ═══════════════════════════════════════════════════════════════
   COLORI DEGLI HEADING
   Il tema Peregrine forza il colore degli h1/h2/h3 (grigio scuro su
   nero = illeggibile). Li forziamo al bianco-ink.
   ═══════════════════════════════════════════════════════════════ */
body.cy-theme .cy-hero h1,
body.cy-theme .cy-article h1,
body.cy-theme .cy-article h2,
body.cy-theme .cy-article h3,
body.cy-theme .cy-article h4,
body.cy-theme .cy-article h5,
body.cy-theme .cy-article h6,
body.cy-theme .cy-card h3,
body.cy-theme .cy-post__title,
body.cy-theme .cy-cta h2,
body.cy-theme .cy-out__body h1,
body.cy-theme .cy-out__body h2,
body.cy-theme .cy-out__body h3,
body.cy-theme .cy-out__body h4,
body.cy-theme .cy-out__body strong{
  color:var(--ink) !important;
}
body.cy-theme .cy-hero h1 .hot{ color:var(--neon) !important; }
body.cy-theme .cy-article h2{
  border-left:2px solid var(--edge-hot);
  padding-left:.8em;
}
body.cy-theme .cy-article h3{ color:var(--ink-2) !important; }
/* Il tema colora anche i link dentro gli articoli: li portiamo al neon. */
body.cy-theme .cy-article a{ color:var(--neon) !important; }
body.cy-theme .cy-article ul li::marker,
body.cy-theme .cy-article ol li::marker{ color:var(--neon); }


/* ═══════════════════════════════════════════════════════════════
   CONTRASTO
   Il tema Peregrine forza colori troppo scuri sui link e sui testi
   secondari: su fondo nero diventano illeggibili. Li rialziamo.
   ═══════════════════════════════════════════════════════════════ */
body.cy-theme .cy-log a{
  color:var(--ink-2) !important;
}
body.cy-theme .cy-log a:hover{ color:var(--neon) !important; }
body.cy-theme .cy-nav__links a{
  color:var(--ink-2) !important;
}
body.cy-theme .cy-nav__links a:hover{ color:var(--neon) !important; }
body.cy-theme .cy-post__title{
  color:var(--ink) !important;
}
body.cy-theme .cy-post:hover .cy-post__title{ color:var(--neon) !important; }
body.cy-theme .cy-post__cat{ color:var(--cyan) !important; }
body.cy-theme .cy-card p{ color:var(--ink-2) !important; }
body.cy-theme .cy-card h3{ color:var(--ink) !important; }
body.cy-theme .cy-p{ color:var(--ink-2) !important; }
body.cy-theme .cy-out__body p{ color:var(--ink-2) !important; }
body.cy-theme .cy-foot,
body.cy-theme .cy-foot a{ color:var(--ink-3) !important; }
body.cy-theme .cy-foot a:hover{ color:var(--neon) !important; }
body.cy-theme .cy-out__bar{ color:var(--ink-3) !important; }
body.cy-theme .cy-post__meta,
body.cy-theme .cy-post__id{ color:var(--ink-3) !important; }
body.cy-theme .cy-meta-chip{ color:var(--ink-2) !important; }


/* ═══════════════════════════════════════════════════════════════
   PAGINAZIONE
   ═══════════════════════════════════════════════════════════════ */
.cy-pagination{
  display:flex; flex-wrap:wrap; gap:.5rem; align-items:center;
  margin:0 0 2.5rem; padding-top:1.4rem;
  border-top:1px solid var(--edge);
}
.cy-pagination .page-numbers{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:2.4em; height:2.4em; padding:0 .6em;
  border:1px solid var(--edge-hi); border-radius:2px;
  font-size:.78rem; color:var(--ink-2); text-decoration:none;
  transition:all .18s;
}
.cy-pagination .page-numbers:hover{
  border-color:var(--neon); color:var(--neon); background:rgba(255,159,28,.09);
}
.cy-pagination .page-numbers.current{
  background:var(--neon); border-color:var(--neon); color:var(--void); font-weight:600;
}
.cy-pagination .page-numbers.dots{ border-color:transparent; }


/* ═══════════════════════════════════════════════════════════════
   TIPOGRAFIA DEL CORPO DEL TESTO
   ───────────────────────────────────────────────────────────────
   Il tema Peregrine applica `html.peregrine-theme body { font-family:
   Roboto }` e `... body p { font-family: Roboto }`. La specificita'
   (0,1,2) supera `body.cy-theme` (0,1,1), quindi vinceva lui.
   Qui forziamo il sistema: monospace per la STRUTTURA, sans per la
   LETTURA. Un articolo di 2000 parole in monospace stanca l'occhio:
   il mono resta per log, codice, etichette e navigazione.

   La colonna di lettura e' limitata a --read-measure (68ch): con la
   colonna piena a 1158px si arrivava a 130 caratteri per riga, ben
   oltre la soglia di 80 oltre la quale l'occhio perde il ritorno a capo.
   ═══════════════════════════════════════════════════════════════ */
html.peregrine-theme body.cy-theme,
html.peregrine-theme body.cy-theme p,
html.peregrine-theme body.cy-theme li,
html.peregrine-theme body.cy-theme td,
html.peregrine-theme body.cy-theme th,
html.peregrine-theme body.cy-theme h1,
html.peregrine-theme body.cy-theme h2,
html.peregrine-theme body.cy-theme h3,
html.peregrine-theme body.cy-theme h4,
html.peregrine-theme body.cy-theme blockquote,
html.peregrine-theme body.cy-theme figcaption{
  font-family:inherit;
}
body.cy-theme .cy-article{
  font-family:var(--read) !important;
  font-size:var(--read-size) !important;
  line-height:var(--read-lh) !important;
  letter-spacing:-.003em;
  color:var(--ink-2);
  font-weight:400;
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
}
body.cy-theme .cy-article p{
  font-family:var(--read) !important;
  font-size:1rem !important;
  line-height:var(--read-lh) !important;
  color:var(--ink-2) !important;
  max-width:var(--read-measure);
  margin:0 0 1.35em !important;
  text-align:left;
  hyphens:auto;
}
body.cy-theme .cy-article > p:first-of-type{
  font-size:1.09rem !important;
  line-height:1.65 !important;
  color:var(--ink) !important;
  margin-bottom:1.7em !important;
}
body.cy-theme .cy-article p strong,
body.cy-theme .cy-article p b{
  font-family:inherit !important;
  color:var(--ink) !important;
  font-weight:650;
}
body.cy-theme .cy-article p em,
body.cy-theme .cy-article p i{
  font-family:inherit !important;
  color:var(--cyan) !important;
  font-style:italic;
}
body.cy-theme .cy-article p a{
  font-family:inherit !important;
  color:var(--neon) !important;
  text-decoration:none;
  border-bottom:1px solid var(--edge-hot);
  padding-bottom:.5px;
  transition:border-color .16s, color .16s;
}
body.cy-theme .cy-article p a:hover{
  border-bottom-color:var(--neon);
  color:var(--neon) !important;
}
body.cy-theme .cy-article h2{
  font-family:var(--mono) !important;
  font-size:clamp(1.15rem,2.6vw,1.4rem) !important;
  font-weight:700 !important;
  line-height:1.32 !important;
  letter-spacing:-.015em;
  color:var(--ink) !important;
  margin:2.6em 0 .85em !important;
  max-width:var(--read-measure);
  border-left:2px solid var(--edge-hot);
  padding-left:.75em;
}
body.cy-theme .cy-article h3{
  font-family:var(--mono) !important;
  font-size:1.02rem !important;
  font-weight:700 !important;
  line-height:1.4 !important;
  color:var(--ink-2) !important;
  margin:2em 0 .7em !important;
  max-width:var(--read-measure);
}
body.cy-theme .cy-article h4,
body.cy-theme .cy-article h5,
body.cy-theme .cy-article h6{
  font-family:var(--mono) !important;
  color:var(--ink-2) !important;
  margin:1.7em 0 .6em !important;
}
body.cy-theme .cy-article ul,
body.cy-theme .cy-article ol{
  font-family:var(--read) !important;
  font-size:1rem !important;
  line-height:var(--read-lh) !important;
  color:var(--ink-2) !important;
  max-width:var(--read-measure);
  margin:0 0 1.35em !important;
  padding-left:1.35em !important;
}
body.cy-theme .cy-article li{
  font-family:inherit !important;
  margin-bottom:.55em !important;
  padding-left:.25em;
}
body.cy-theme .cy-article li::marker{ color:var(--neon); }
body.cy-theme .cy-article blockquote{
  font-family:var(--read) !important;
  font-style:italic;
  font-size:1.02rem !important;
  line-height:1.62 !important;
  color:var(--ink) !important;
  max-width:calc(var(--read-measure) - 1.5em);
  margin:2em 0 !important;
  padding:.9em 0 .9em 1.3em !important;
  border-left:2px solid var(--neon);
  background:linear-gradient(90deg,rgba(255,159,28,.055),transparent 70%);
  border-radius:0;
}
body.cy-theme .cy-article blockquote p{
  font-family:inherit !important;
  font-size:inherit !important;
  line-height:inherit !important;
  color:inherit !important;
  margin:0 !important;
  max-width:none !important;
}
body.cy-theme .cy-article code{
  font-family:var(--mono) !important;
  font-size:.855em !important;
  background:var(--carbon-2);
  padding:.18em .42em;
  border:1px solid var(--edge);
  border-radius:2px;
  color:var(--cyan) !important;
  word-break:break-word;
}
body.cy-theme .cy-article pre{
  font-family:var(--mono) !important;
  font-size:.83rem !important;
  line-height:1.7 !important;
  background:var(--carbon-2);
  border:1px solid var(--edge);
  border-left:2px solid var(--neon);
  border-radius:3px;
  padding:1.05rem 1.25rem;
  overflow-x:auto;
  margin:1.8em 0 !important;
  max-width:min(100%, calc(var(--read-measure) + 3em));
  tab-size:2;
}
body.cy-theme .cy-article pre code{
  font-family:inherit !important;
  font-size:inherit !important;
  background:none !important;
  border:0 !important;
  padding:0 !important;
  color:var(--ink-2) !important;
  white-space:pre;
}
body.cy-theme .cy-article table{
  font-family:var(--mono) !important;
  font-size:.8rem !important;
  width:100%;
  border-collapse:collapse;
  margin:1.8em 0 !important;
  max-width:100%;
}
body.cy-theme .cy-article th,
body.cy-theme .cy-article td{
  font-family:inherit !important;
  font-size:inherit !important;
  border:1px solid var(--edge);
  padding:.55em .8em;
  text-align:left;
  line-height:1.55;
}
body.cy-theme .cy-article th{
  color:var(--neon) !important;
  font-weight:700;
  background:rgba(255,159,28,.05);
}
body.cy-theme .cy-article img{
  max-width:min(100%, calc(var(--read-measure) + 4em));
  height:auto;
  border:1px solid var(--edge);
  border-radius:3px;
  display:block;
  margin:1.6em 0;
}
body.cy-theme .cy-article figcaption,
body.cy-theme .cy-article .wp-caption-text{
  font-family:var(--mono) !important;
  font-size:.74rem !important;
  line-height:1.6 !important;
  color:var(--ink-3) !important;
  max-width:var(--read-measure);
  margin:.6em 0 0;
  text-align:left;
}
body.cy-theme .cy-article hr{
  border:0;
  border-top:1px solid var(--edge);
  margin:2.4em 0;
  max-width:var(--read-measure);
}
body.cy-theme .cy-p{
  font-family:var(--mono) !important;
  font-size:.95rem !important;
  line-height:1.75;
  color:var(--ink-2) !important;
  max-width:62ch;
}
html.peregrine-theme body.cy-theme{
  overflow-x:hidden !important;
}


/* ═══════════════════════════════════════════════════════════════
   NAV E CHROME DEL TEMPLATE — FUORI DAL FLUSSO ARTICOLO
   Qui il mono e' giusto: sono etichette, non testo da leggere.
   Il tema li forza a Roboto con letter-spacing: li riportiamo al mono.
   ═══════════════════════════════════════════════════════════════ */
html.peregrine-theme body.cy-theme .cy-nav,
html.peregrine-theme body.cy-theme .cy-nav a,
html.peregrine-theme body.cy-theme .cy-nav span,
html.peregrine-theme body.cy-theme .cy-btn,
html.peregrine-theme body.cy-theme .cy-kicker,
html.peregrine-theme body.cy-theme .cy-card h3,
html.peregrine-theme body.cy-theme .cy-card p,
html.peregrine-theme body.cy-theme .cy-log,
html.peregrine-theme body.cy-theme .cy-post,
html.peregrine-theme body.cy-theme .cy-postnav,
html.peregrine-theme body.cy-theme .cy-tag,
html.peregrine-theme body.cy-theme .cy-pagination,
html.peregrine-theme body.cy-theme .cy-out__bar,
html.peregrine-theme body.cy-theme .cy-foot{
  font-family:var(--mono);
}
body.cy-theme .cy-nav__links a{
  font-family:var(--mono) !important;
  font-size:.8rem !important;
  letter-spacing:.06em !important;
  text-transform:lowercase;
  color:var(--ink-2) !important;
}
body.cy-theme .cy-nav__brand{
  font-family:var(--mono) !important;
  letter-spacing:.04em;
}
body.cy-theme .cy-card p{
  font-family:var(--read) !important;
  font-size:.9rem !important;
  line-height:1.6 !important;
}
body.cy-theme .cy-log{
  font-family:var(--mono) !important;
  font-size:.85rem !important;
  line-height:1.85 !important;
}
body.cy-theme .cy-post__title{
  font-family:var(--read) !important;
  font-weight:600;
  letter-spacing:-.005em;
}
body.cy-theme .cy-tag,
body.cy-theme .cy-kicker{
  font-family:var(--mono) !important;
  letter-spacing:.05em;
}
body.cy-theme .cy-pagination .page-numbers{
  font-family:var(--mono) !important;
  letter-spacing:.02em;
}


/* ═══════════════════════════════════════════════════════════════
   TEMA ARANCIONE BITCOIN — TUTTO IL BLOG
   ───────────────────────────────────────────────────────────────
   Il colore d'accento del blog e' l'arancione di Bitcoin. Le
   variabili sono riassegnate a livello di tema, quindi valgono per
   home, articoli, archivi, categorie, ricerca e 404.

   L'articolo celebrativo "Bitcoin 18 anni" non e' coinvolto: usa il
   template Full Bleed, che ha un CSS separato e resta sulla sua
   palette dorata.

   Per tornare al verde: rimettere i valori verdi nelle variabili
   del :root in alto e rimuovere questo blocco.
   ═══════════════════════════════════════════════════════════════ */
body.cy-theme{
  --neon:#ff9f1c;
  --neon-dim:#e07f00;
  --edge-hot:rgba(255,159,28,.45);
  --cyan:#ffc14d;
  --ink-4:#4a3a20;
  --glow:rgba(255,159,28,.55);
  --glow-soft:rgba(255,159,28,.42);
  --glow-btn:rgba(255,159,28,.45);
}
/* Il verde acceso non esiste piu' sulla home: i glow vanno ricalcolati
   sull'arancione, altrimenti restano aloni verdi. */
body.cy-theme .cy-p a:hover,
body.cy-theme .cy-article p a:hover{
  text-shadow:0 0 12px rgba(255,159,28,.5);
}
body.cy-theme .cy-p a{ border-bottom-color:rgba(255,159,28,.45); }
body.cy-theme .cy-article p a{ border-bottom-color:rgba(255,159,28,.45); }
body.cy-theme .cy-article code{ color:var(--cyan) !important; }
body.cy-theme .cy-article blockquote{
  border-left-color:var(--neon);
  background:linear-gradient(90deg,rgba(255,159,28,.055),transparent 70%);
}
body.cy-theme.cy-theme.cy-home .cy-out__bar .dots i:nth-child(1){ background:var(--neon); }


/* ═══════════════════════════════════════════════════════════════
   CTA E BOTTONI — IL TEMA SOVRASCRIVE
   ───────────────────────────────────────────────────────────────
   Il tema Peregrine forza il colore dei link e dei pulsanti con
   regole a specificita' maggiore, cosi' il bottone risultava
   trasparente con testo grigio (rgb(73,64,87)) su fondo scuro:
   illeggibile. Qui riportiamo il template al comando, con la
   variante arancione sulla home.
   ═══════════════════════════════════════════════════════════════ */
html.peregrine-theme body.cy-theme .cy-cta h2{
  font-family:var(--mono) !important;
  color:var(--ink) !important;
  font-size:clamp(1.3rem,3.6vw,2rem) !important;
  font-weight:700 !important;
  line-height:1.15 !important;
  margin:0 0 1rem !important;
}
html.peregrine-theme body.cy-theme .cy-cta h2 .hot{
  color:var(--neon) !important;
  text-shadow:0 0 26px var(--glow);
}

html.peregrine-theme body.cy-theme .cy-cta p{
  font-family:var(--read) !important;
  color:var(--ink-2) !important;
  font-size:.95rem !important;
  line-height:1.7 !important;
  max-width:56ch !important;
  margin:0 auto 1.8rem !important;
}
html.peregrine-theme body.cy-theme .cy-cta{
  border:1px solid var(--edge-hot) !important;
  background:linear-gradient(180deg, rgba(255,159,28,.06), transparent) !important;
  padding:2.2rem 1.8rem !important;
}
html.peregrine-theme body.cy-theme .cy-cta{
  background:linear-gradient(180deg, rgba(255,159,28,.06), transparent) !important;
}

/* ── Bottoni ── */
html.peregrine-theme body.cy-theme .cy-btn{
  font-family:var(--mono) !important;
  font-size:.74rem !important;
  font-weight:600 !important;
  letter-spacing:.16em !important;
  text-transform:uppercase !important;
  text-decoration:none !important;
  border-radius:2px !important;
  padding:.72em 1.5em !important;
  transition:all .18s !important;
}
html.peregrine-theme body.cy-theme .cy-btn--solid{
  background:var(--neon) !important;
  color:var(--void) !important;
  border:1px solid var(--neon) !important;
}
html.peregrine-theme body.cy-theme .cy-btn--solid:hover{
  background:var(--neon-dim) !important;
  color:var(--void) !important;
  border-color:var(--neon-dim) !important;
  box-shadow:0 0 26px var(--glow-soft) !important;
}
html.peregrine-theme body.cy-theme .cy-btn--solid:hover{
  box-shadow:0 0 26px rgba(255,159,28,.45) !important;
}
html.peregrine-theme body.cy-theme .cy-btn--ghost{
  background:transparent !important;
  color:var(--ink-2) !important;
  border:1px solid var(--edge-hi) !important;
}
html.peregrine-theme body.cy-theme .cy-btn--ghost:hover{
  background:transparent !important;
  color:var(--neon) !important;
  border-color:var(--neon) !important;
  box-shadow:none !important;
}

/* ── Il motto dell'hero: idem, il tema non deve toccarlo ── */
html.peregrine-theme body.cy-theme .cy-hero h1 .hot{
  color:var(--neon) !important;
}
html.peregrine-theme body.cy-theme .cy-hero h1{
  color:var(--ink) !important;
  font-family:var(--mono) !important;
}





/* ═══════════════════════════════════════════════════════════════
   GLITCH PAROLA PER PAROLA — MOTTO DELL'HERO
   ───────────────────────────────────────────────────────────────
   Il motto viene segmentato in <span class="cy-w"> dal JS, una parola
   per span. Ogni parola riceve un glitch RGB (tre copie della parola
   in rosso/verde/blu spostate) e una breve distorsione di jitter.

   L'animazione parte quando la parola entra in scena e termina: non
   e' un loop perpetuo, altrimenti distrae e consuma CPU.

   L'audio e' generato con la Web Audio API (rumore + inviluppo
   percussivo), nessun file da caricare. Si attiva al primo gesto
   dell'utente per rispettare le autoplay policy dei browser.
   ═══════════════════════════════════════════════════════════════ */

/* Contenitore del motto animato */
.cy-glitch{
  position:relative;
  display:inline-block;
}
.cy-glitch .cy-w{
  position:relative;
  display:inline-block;
  white-space:pre;
  opacity:0;
  transform:translateY(.14em);
}
.cy-glitch .cy-w.is-on{
  opacity:1;
  transform:none;
  transition:opacity .18s ease-out, transform .18s ease-out;
}
/* Le tre copie RGB: visibili solo durante il glitch della parola */
.cy-glitch .cy-w::before,
.cy-glitch .cy-w::after{
  content:attr(data-t);
  position:absolute;
  left:0; top:0;
  width:100%;
  opacity:0;
  pointer-events:none;
}
.cy-glitch .cy-w::before{ color:var(--magenta); }
.cy-glitch .cy-w::after{ color:var(--cyan); }

@keyframes cy-glitch-jitter{
  0%   { transform:translate(0,0) skewX(0deg); }
  12%  { transform:translate(-3px,1px) skewX(-6deg); }
  24%  { transform:translate(2px,-1px) skewX(4deg); }
  38%  { transform:translate(-2px,0) skewX(-2deg); }
  52%  { transform:translate(1px,1px) skewX(1deg); }
  70%  { transform:translate(0,0) skewX(0deg); }
  100% { transform:translate(0,0) skewX(0deg); }
}
@keyframes cy-glitch-r{
  0%,100% { opacity:0; transform:translate(0,0); }
  20% { opacity:.85; transform:translate(-4px,-1px); }
  45% { opacity:.6;  transform:translate(3px,1px); }
  70% { opacity:.8; transform:translate(-2px,0); }
}
@keyframes cy-glitch-c{
  0%,100% { opacity:0; transform:translate(0,0); }
  22% { opacity:.85; transform:translate(4px,1px); }
  50% { opacity:.55; transform:translate(-3px,-1px); }
  75% { opacity:.75; transform:translate(2px,0); }
}

.cy-glitch .cy-w.is-glitch{
  animation:cy-glitch-jitter .42s steps(9,end) 1;
}
.cy-glitch .cy-w.is-glitch::before{
  animation:cy-glitch-r .42s steps(9,end) 1;
}
.cy-glitch .cy-w.is-glitch::after{
  animation:cy-glitch-c .42s steps(9,end) 1;
}
/* Le parole in neon devono mantenere il loro colore durante il glitch */
.cy-glitch .cy-w.hot{ color:var(--neon); }
.cy-glitch .cy-w.hot::before{ color:var(--magenta); }
.cy-glitch .cy-w.hot::after{ color:var(--cyan); }

/* ── Accessibilità: se l'utente chiede meno movimento, niente glitch ── */
@media (prefers-reduced-motion: reduce){
  .cy-glitch .cy-w{ opacity:1 !important; transform:none !important; }
  .cy-glitch .cy-w::before,
  .cy-glitch .cy-w::after{ display:none; }
  .cy-glitch .cy-w.is-glitch{ animation:none; }
}

/* ── Il prompt del terminale puo' lampeggiare leggermente durante ── */
.cy-hero.is-glitching .cy-prompt b{
  text-shadow:0 0 10px var(--glow);
}


/* ═══════════════════════════════════════════════════════════════
   ALLEGGERIMENTO DURANTE IL GLITCH
   ───────────────────────────────────────────────────────────────
   La pagina ha scanline, griglia e backdrop-filter: durante la
   sequenza di glitch il main thread e' saturo e i timer slittano.
   Mentre il motto si compone, sospendiamo gli effetti piu' costi
   (scanline e blur della nav) e li ripristiniamo alla fine.
   ═══════════════════════════════════════════════════════════════ */
body.cy-theme .cy-hero.is-glitching ~ .cy-main .cy-scan,
body.cy-theme.is-glitching .cy-scan{
  animation-play-state:paused !important;
  opacity:.35 !important;
}
body.cy-theme.is-glitching .cy-nav{
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  background:rgba(5,6,10,.96) !important;
}
body.cy-theme.is-glitching .cy-bg{
  opacity:.55 !important;
}
/* Il motto non deve avere il text-shadow neon durante il glitch:
   genera repaint pesanti e interferisce con la lettura. */
body.cy-theme.is-glitching .cy-glitch .cy-w{
  text-shadow:none !important;
}
body.cy-theme.is-glitching .cy-glitch .cy-w.hot{
  text-shadow:none !important;
}


/* ═══════════════════════════════════════════════════════════════
   MEDIA MANCANTI — AVVISO IN STILE TERMINALE
   Quando un file non esiste piu' sul server (articoli del 2014 con
   mp3 andati persi durante i ricostruzioni), il player resta muto a
   00:00 senza dire niente. Qui lo sostituiamo con un avviso che
   spiega cosa manca.
   ═══════════════════════════════════════════════════════════════ */
body.cy-theme .cy-media-missing{
  display:flex;
  align-items:baseline;
  flex-wrap:wrap;
  gap:.7rem;
  margin:.9em 0;
  padding:.75rem 1rem;
  border:1px dashed var(--edge-hi);
  border-left:2px solid var(--amber);
  border-radius:3px;
  background:rgba(255,179,71,.045);
  font-family:var(--mono);
  font-size:.8rem;
  line-height:1.6;
}
body.cy-theme .cy-media-missing__tag{
  flex:none;
  font-weight:700;
  letter-spacing:.08em;
  color:var(--amber);
  text-shadow:0 0 12px rgba(255,179,71,.35);
}
body.cy-theme .cy-media-missing__msg{
  color:var(--ink-2);
}
body.cy-theme .cy-media-missing__extra{
  color:var(--ink-3);
  font-size:.95em;
  word-break:break-all;
}
body.cy-theme .cy-media-missing__extra::before{
  content:'$ ';
  color:var(--neon);
}

/* ── I player che funzionano restano puliti ── */
body.cy-theme .cy-article mejs-container{
  margin:.7em 0;
  max-width:var(--read-measure);
}
body.cy-theme .cy-article .mejs-container{
  background:var(--carbon-2);
  border:1px solid var(--edge);
  border-radius:3px;
  font-family:var(--mono);
}
body.cy-theme .cy-article .mejs__controls{
  padding:.2rem .3rem;
}
body.cy-theme .cy-article .mejs__time{
  color:var(--ink-3);
  font-size:.78rem;
}
/* Nasconde l'icona del volume di default, la ridisegniamo in stile terminale */
body.cy-theme .cy-article .mejs__button button{
  background:transparent;
}


/* ── MediaElement lascia nel DOM uno span "offscreen" con la stringa
   "Audio Player" e la descrizione per i tasti freccia. Non serve a
   nulla per l'utente e inquinera la lettura: lo nascondiamo. ── */
body.cy-theme .cy-article .mejs-offscreen{
  display:none !important;
}