/* /disco-a-digital/ — Disco a digital (02-10-2026). Lienzo «El Nexo 3», página «producto», tablero «Disco a digital».
   Va sobre gp-guia.css (.gg-*). Móvil primero: buscador, cifras, filtros, lista con veredicto y «¿Lo has probado?»,
   y debajo la guía. En PC, dos columnas: la lista a la izquierda y la guía a la derecha.
   Verde, rojo y ámbar solo para el veredicto, siempre con texto. */
.dd{--ok:#5eff9f;--no:#ff8a7a;--dud:#ffd07a}
.dd-grid{display:flex;flex-direction:column;gap:14px;margin-top:14px}
.dd-main,.dd-side{display:flex;flex-direction:column;gap:14px;min-width:0}
@media (min-width:900px){
  .dd-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:22px;align-items:start}
  .dd-side{position:sticky;top:84px}
}

/* Buscador */
.dd-srch{display:flex;align-items:center;gap:10px;height:56px;margin:0;padding:0 16px;border-radius:16px;background:#0e151e;box-shadow:inset 0 0 0 1.5px var(--cy),0 0 0 4px rgba(0,212,255,.12)}
.dd-srch>.gg-x{flex:none;color:var(--cy);font-size:20px}
.dd-srch input{flex:1;min-width:0;height:100%;border:0;outline:0;background:transparent;font:600 16px/1 var(--fs);color:#fff;-webkit-appearance:none;appearance:none}
.dd-srch input::placeholder{color:var(--mut)}
.dd-srch input::-webkit-search-cancel-button{-webkit-appearance:none}
.dd-srch em{flex:none;font:600 13px/1 var(--fs);font-style:normal;color:var(--mut);font-variant-numeric:tabular-nums}
.dd-srch:focus-within{box-shadow:inset 0 0 0 2px var(--cy),0 0 0 5px rgba(0,212,255,.2)}

/* Cifras */
.dd-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.dd-st{border-radius:14px;padding:12px 10px;background:var(--pan);box-shadow:inset 0 0 0 1px rgba(255,255,255,.07);color:var(--t)}
.dd-st b{display:block;font:400 32px/.9 var(--fd);font-variant-numeric:tabular-nums}
.dd-st small{font:700 11.5px/1.2 var(--fs);color:var(--mut);text-transform:uppercase;letter-spacing:.06em}
.dd .is-ok{color:var(--ok)}.dd .is-no{color:var(--no)}.dd .is-dud{color:var(--dud)}

/* Filtros: en móvil se deslizan */
.dd-chips{display:flex;gap:8px;overflow-x:auto;margin:0 -12px;padding:0 12px 2px;scroll-padding-inline:12px;scrollbar-width:none;-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity}
.dd-chips::-webkit-scrollbar{display:none}
@media (min-width:900px){.dd-chips{flex-wrap:wrap;margin:0;padding:0;overflow:visible}}
.dd-chip{flex:none;display:inline-flex;align-items:center;height:36px;padding:0 13px;border-radius:999px;font:700 13px/1 var(--fs);color:#dfe7ef;background:var(--pan2);box-shadow:inset 0 0 0 1px rgba(255,255,255,.09);scroll-snap-align:start;-webkit-tap-highlight-color:transparent}
.dd-chip.is-on{background:var(--cy);color:#04121a;box-shadow:none}

/* Lista */
.dd-l{display:flex;flex-direction:column;gap:10px;margin:0;padding:0;list-style:none}
.dd-it{display:flex;gap:12px;align-items:center;padding:10px;border-radius:16px;background:var(--pan);box-shadow:inset 0 0 0 1px rgba(255,255,255,.07);min-width:0}
.dd-it.is-fuera,.dd-it.is-mas{display:none}
.dd-cov{flex:none;width:58px;height:78px;border-radius:10px;overflow:hidden;background:var(--pan2);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1);-webkit-touch-callout:none}
.dd-cov img{display:block;width:100%;height:100%;object-fit:cover}
.dd-cov.is-tx{display:flex;align-items:flex-end;padding:6px;font:400 14px/.92 var(--fd);color:var(--cy2);background:linear-gradient(150deg,#13324a,#0b1119);word-break:break-word;overflow-wrap:anywhere}
.dd-tx{flex:1;min-width:0}
.dd-n{margin:0;font:800 15.5px/1.2 var(--fs);color:#fff;overflow-wrap:anywhere}
.dd-n a{color:#fff}
.dd-sub{display:block;margin-top:3px;font:500 12.5px/1.3 var(--fs);color:var(--mut)}
.dd-vs{display:flex;flex-wrap:wrap;gap:5px;margin-top:7px}
.dd-v{display:inline-flex;align-items:center;gap:5px;height:26px;padding:0 9px;border-radius:8px;white-space:nowrap;font:800 11.5px/1 var(--fs);letter-spacing:.06em;text-transform:uppercase}
.dd-v.is-ok{background:rgba(94,255,159,.13)}.dd-v.is-no{background:rgba(255,138,122,.13)}.dd-v.is-dud{background:rgba(255,208,122,.13)}
.dd-v .gg-x{font-size:12px}
.dd-f{display:inline-flex;align-items:center;height:26px;padding:0 8px;border-radius:8px;font:700 11px/1 var(--fs);color:#c3ccd6;background:var(--pan2)}
.dd-rep{flex:none;display:flex;flex-direction:column;gap:6px;align-items:flex-end}
.dd-rq{font:700 11px/1.2 var(--fs);color:var(--mut);text-align:right}
.dd-rb{display:flex;gap:6px}
.dd-b{width:40px;height:40px;border:0;border-radius:12px;display:flex;align-items:center;justify-content:center;padding:0;background:var(--pan2);font-size:16px;cursor:pointer;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);-webkit-tap-highlight-color:transparent;touch-action:manipulation;transition:transform .12s,background .15s,box-shadow .15s}
.dd-b.is-si{color:var(--ok)}.dd-b.is-no{color:var(--no)}
.dd-b.is-si.is-on{background:rgba(94,255,159,.18);box-shadow:inset 0 0 0 1.5px var(--ok)}
.dd-b.is-no.is-on{background:rgba(255,138,122,.18);box-shadow:inset 0 0 0 1.5px var(--no)}
.dd-b:active{transform:scale(.92)}
.dd-b[disabled]{opacity:.5;cursor:default}
.dd-mas{align-self:center;min-height:46px;padding:0 22px;border:0;border-radius:14px;font:800 14.5px/1 var(--fs);color:#fff;background:var(--pan2);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14);cursor:pointer}
.dd-vacio{display:flex;flex-direction:column;gap:12px;padding:16px;border-radius:16px;background:var(--pan);box-shadow:inset 0 0 0 1px rgba(255,255,255,.07)}
.dd-vacio .dd-l:empty{display:none}
.dd-vacio[hidden],.dd-mas[hidden]{display:none}

/* Guía */
.dd-steps{display:flex;flex-direction:column;gap:10px;margin:0;padding:0;list-style:none}
.dd-steps li{display:flex;gap:12px;align-items:flex-start}
.dd-steps li b{flex:none;width:30px;height:30px;border-radius:50%;background:rgba(0,212,255,.14);color:var(--cy2);display:flex;align-items:center;justify-content:center;font:400 18px/1 var(--fd)}
.dd-steps li span{font:500 14px/1.45 var(--fs);color:#c3ccd6}
.dd-steps li strong{color:#fff}
.dd-req{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.dd-rqi{padding:12px;border-radius:14px;background:var(--pan);box-shadow:inset 0 0 0 1px rgba(255,255,255,.07);display:flex;flex-direction:column;gap:5px}
.dd-rqi .gg-x{font-size:18px;color:var(--cy2)}
.dd-rqi b{font:800 13.5px/1.2 var(--fs);color:#fff}
.dd-rqi small{font:500 12px/1.35 var(--fs);color:var(--mut)}
.dd-warn{display:flex;gap:10px;padding:12px;border-radius:14px;background:rgba(255,208,122,.08);box-shadow:inset 0 0 0 1px rgba(255,208,122,.25)}
.dd-warn>.gg-x{flex:none;color:var(--dud);font-size:18px}
.dd-src{margin:0;font:500 12.5px/1.55 var(--fs);color:var(--mut)}
.dd-src b{color:#c3ccd6}
.dd-src a{color:var(--cy2);text-decoration:underline;text-underline-offset:2px}

@media (hover:hover){
  .dd-chip:hover{box-shadow:inset 0 0 0 1px rgba(0,212,255,.45)}
  .dd-chip.is-on:hover{box-shadow:none}
  .dd-st:hover{box-shadow:inset 0 0 0 1px rgba(0,212,255,.35)}
  .dd-n a:hover{color:var(--cy2)}
  .dd-b:hover{background:#18212c}
  .dd-mas:hover{box-shadow:inset 0 0 0 1px rgba(0,212,255,.45)}
}
@media (prefers-reduced-motion:reduce){.dd-b{transition:none}}