:root{--amarillo:#C4017B;--negro:#0A0A0A;--gris:#6b6b6b;--grisclaro:#f3f3f4;
    --linea:#e8e8e6;--verde:#C4017B;--naranja:#8a8a8a;--rojo:#2a2a2a;--oscuro:#0c0c0e;
    --rosa:#C4017B;--rosa2:#E0188F;}
  *{margin:0;padding:0;box-sizing:border-box}
  body{font-family:'Inter',sans-serif;background:#000;color:#e7e7ea;line-height:1.5;-webkit-font-smoothing:antialiased}
  .didone{font-family:'Inter',sans-serif}
  .wrap{max-width:680px;margin:0 auto;padding:30px 22px 70px}
  .top{display:flex;justify-content:space-between;align-items:center}
  .micro{font-size:11px;font-weight:600;letter-spacing:.4em;text-transform:uppercase;color:#9a9a98}
  .gratis{font-size:11px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;background:var(--amarillo);padding:5px 12px}
  h1.tit{font-family:'Inter',sans-serif;font-weight:800;font-size:clamp(38px,8vw,58px);line-height:.95;margin:16px 0 6px}
  .sub{font-size:16px;color:#555;margin-bottom:30px}

  .tarjeta{border:2px solid var(--negro);margin-bottom:16px;overflow:hidden}
  /* previsualizacion: silueta sobre oscuro */
  .preview{position:relative;background:#0c0c0e;
    min-height:200px;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:18px;overflow:hidden}
  .preview.vacio{background:var(--grisclaro);flex-direction:column;gap:6px;text-align:center;min-height:150px;padding:24px}
  .preview.vacio.encima{background:var(--amarillo)}
  .preview .ic{font-size:26px}
  .preview .g{font-size:14px;font-weight:600;color:var(--negro)}
  .preview .p{font-size:12px;color:var(--gris)}
  .preview input{display:none}
  .silueta{position:relative;width:min(260px,72%);aspect-ratio:100/120}
  .silueta svg{position:absolute;inset:0;width:100%;height:100%}
  .diseno{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);max-height:46%}
  .diseno img{width:100%;height:auto;display:block;filter:drop-shadow(0 4px 12px rgba(0,0,0,.45))}
  .diseno img.anim{animation:revelar 1.4s cubic-bezier(.4,.85,.3,1) forwards}
  @keyframes revelar{from{clip-path:inset(0 0 100% 0);opacity:.15}to{clip-path:inset(0 0 0 0);opacity:1}}
  .scan{position:absolute;left:14%;right:14%;height:3px;border-radius:3px;background:linear-gradient(90deg,transparent,var(--amarillo),transparent);
    box-shadow:0 0 18px 2px var(--amarillo);animation:scan 1.5s ease forwards;pointer-events:none;z-index:5}
  @keyframes scan{0%{top:18%;opacity:0}12%{opacity:1}88%{opacity:1}100%{top:82%;opacity:0}}
  .medida{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);font-size:11px;font-weight:700;
    letter-spacing:.1em;text-transform:uppercase;color:#cfcfd6;background:rgba(0,0,0,.35);padding:5px 12px;border-radius:20px}

  /* --- estilo demo: rollo con piezas (empaquetado real) --- */
  .mini-rollo{position:relative;width:min(88%,440px);background:#1f1f25;border:1.5px solid #3a3a42;overflow:hidden}
  .mini-rollo::before,.mini-rollo::after{content:"";position:absolute;top:0;bottom:0;width:3.33%;
    background:rgba(255,255,255,.06);z-index:2}
  .mini-rollo::before{left:0}.mini-rollo::after{right:0}
  .mpiece{position:absolute;overflow:hidden;background:#15151a;opacity:0;
    transform:translate(var(--fx,40px),var(--fy,-30px)) rotate(var(--fr,8deg)) scale(.5);
    transition:opacity .35s ease, transform .6s cubic-bezier(.34,1.25,.5,1)}
  .mpiece.show{opacity:1;transform:translate(0,0) rotate(0) scale(1)}
  .mpiece img{width:100%;height:100%;object-fit:contain;display:block}
  /* --- FICHA DE ANÁLISIS profesional (compacta + desplegable) --- */
  .ficha{margin:14px 16px 4px;border:1px solid var(--linea,#e6e5dc);border-radius:13px;overflow:hidden;background:#fff}
  .ficha-cab{display:flex;align-items:center;gap:11px;padding:13px 14px;user-select:none}
  .fvIco{width:30px;height:30px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:800;color:#fff}
  .fvIco.ok{background:var(--verde)}.fvIco.warn{background:var(--naranja);color:var(--negro)}.fvIco.bad{background:var(--rojo,#c0392b)}
  .fvMid{flex:1;min-width:0}
  .fvTit{font-weight:800;font-size:15.5px;line-height:1.15}
  .fvDat{color:#7a7a72;font-size:12.5px;margin-top:2px}
  .fvVer{font-size:12px;font-weight:700;color:#8a8a82;white-space:nowrap}
  .fvVer i{display:inline-block;transition:transform .2s;font-style:normal}
  .ficha.open .fvVer i{transform:rotate(180deg)}
  .ficha-det{display:block;border-top:1px solid var(--linea,#e6e5dc)}
  .ficha.open .ficha-det{display:block}
  .fbloque{padding:13px 15px;border-top:1px solid #f0efe8}
  .fbloque:first-child{border-top:0}
  .fbTop{display:flex;align-items:center;gap:9px;margin-bottom:5px}
  .fest{width:19px;height:19px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;color:#fff}
  .fest.ok{background:var(--verde)}.fest.warn{background:var(--naranja);color:var(--negro)}.fest.bad{background:var(--rojo,#c0392b)}
  .fbTit{font-weight:700;font-size:12px;letter-spacing:.04em;text-transform:uppercase}
  .fbVal{margin-left:auto;font-weight:800;font-size:15px}
  .fbVal small{font-size:10px;color:#8a8a82;font-weight:600}
  .fexpl{font-size:13px;color:var(--negro)}.fexpl b{font-weight:700}
  .fbarra{height:10px;border-radius:5px;background:#edece4;margin:8px 0 3px;position:relative;overflow:hidden}
  .fbarra i{display:block;height:100%;border-radius:5px}
  .fbarra .fobj{position:absolute;top:-3px;bottom:-3px;right:0;width:2px;background:var(--negro)}
  .fley{display:flex;justify-content:space-between;font-size:10px;color:#8a8a82}
  .freg{margin-top:8px}
  .fregR{display:flex;align-items:center;gap:8px;font-size:12.5px;padding:2px 0}
  .fregR .fpt{width:9px;height:9px;border-radius:50%;flex:none}.fregR .fcm{margin-left:auto;font-weight:700}
  .facc{margin:13px 15px 15px;padding:13px 15px;background:var(--negro);color:#fff;border-radius:11px}
  .faccT{font-weight:800;font-size:14px;margin-bottom:3px}.faccT span{color:var(--amarillo)}
  .facc p{margin:0;font-size:12.5px;color:#d7d7cf}

  /* --- veredicto grande amarillo + avisos con severidad --- */
  .verdict{padding:16px 18px 2px}
  .vpal{font-family:'Inter',sans-serif;font-weight:800;font-size:clamp(26px,6vw,34px);line-height:1;margin-bottom:14px}
  .vpal .res{padding:0 11px;box-decoration-break:clone;-webkit-box-decoration-break:clone}
  .vpal .res.ok{background:var(--amarillo)}.vpal .res.warn{background:var(--naranja)}
  .vpal .res.bad{background:var(--negro);color:var(--amarillo)}
  .sevlist{display:flex;flex-direction:column;gap:9px}
  .sevrow{display:grid;grid-template-columns:72px 1fr;gap:11px;align-items:start;
    opacity:0;transform:translateX(8px);animation:cardin .35s ease forwards}
  .sevrow .sev{font-size:9px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;padding:6px 3px;text-align:center}
  .sevrow .sev.ok{background:var(--verde);color:#06371b}
  .sevrow .sev.warn{background:var(--naranja);color:var(--negro)}
  .sevrow .sev.bad{background:var(--negro);color:var(--amarillo)}
  .sevrow .txt{font-size:13px;line-height:1.38;color:#2c2c2c;font-weight:500;padding-top:1px}
  .pline{margin:14px 18px 0;background:#fff;border:1.5px solid var(--negro);padding:10px 12px;font-size:11px;line-height:1.45}
  .pline .tag{font-size:8.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#9a9a98;display:block;margin-bottom:3px}
  .pline .yel{background:var(--amarillo);padding:0 3px;font-weight:700}

  .analisis{padding:14px 16px 4px;border-top:2px solid var(--negro);display:flex;flex-direction:column;gap:8px}
  .tarjeta-aviso{display:flex;align-items:center;gap:11px;padding:12px 14px;border-radius:10px;font-weight:600;font-size:14px;
    opacity:0;transform:translateY(6px);animation:cardin .35s ease forwards}
  @keyframes cardin{to{opacity:1;transform:none}}
  .tarjeta-aviso .ico{width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:800;flex:none;color:#fff}
  .tarjeta-aviso.ok{background:#effbf3}.tarjeta-aviso.ok .ico{background:var(--verde)}
  .tarjeta-aviso.av{background:#fff6ea}.tarjeta-aviso.av .ico{background:var(--naranja);color:var(--negro)}
  .tarjeta-aviso.no{background:#fbecec}.tarjeta-aviso.no .ico{background:var(--negro)}
  .tarjeta-aviso.mano{background:#f1ecff}.tarjeta-aviso.mano .ico{background:#7b5cff}

  .controles{padding:16px;display:flex;flex-direction:column;gap:12px}
  .fondo-fila{display:flex;align-items:center;justify-content:space-between;gap:12px}
  .fondo-tog{display:inline-flex;background:#f0f0f0;border-radius:10px;padding:3px;gap:3px}
  .fondo-tog button{border:0;background:transparent;padding:8px 14px;border-radius:8px;font-size:13px;font-weight:700;color:#666;cursor:pointer;font-family:inherit}
  .fondo-tog button.on{background:#fff;color:#111;box-shadow:0 1px 3px rgba(0,0,0,.18)}
  .lab{font-size:12px;font-weight:700;margin-bottom:7px}
  /* tamaño + cantidad en UNA línea -> tarjeta más compacta */
  .cfila{display:flex;gap:18px;align-items:flex-end;flex-wrap:wrap}
  .cfila .csize{flex:1;min-width:180px}
  .cfila .cqty{flex:none}
  .ancho-fila{display:flex;align-items:center;gap:12px}
  .ancho-fila input[type=range]{flex:1;accent-color:var(--negro);height:6px}
  .campo{display:inline-flex;align-items:center;border:2px solid var(--negro)}
  .campo input{width:52px;border:none;padding:9px 5px;font-family:'Inter';font-size:15px;font-weight:700;text-align:center;outline:none}
  .campo .u{font-size:11px;font-weight:700;color:var(--gris);padding:0 9px 0 2px}
  .qlab{font-size:12px;font-weight:700;margin-bottom:7px}
  .stepper{display:inline-flex;align-items:center;border:2px solid var(--negro)}
  .stepper button{width:38px;height:40px;border:none;background:#fff;font-size:19px;font-weight:700;cursor:pointer}
  .stepper button:hover{background:var(--amarillo)}
  .stepper .n{min-width:44px;text-align:center;font-weight:700;font-size:17px}
  .quita{background:none;border:none;color:#bbb;font-size:12px;font-weight:600;cursor:pointer;align-self:flex-start;padding:0}
  .quita:hover{color:#d33}
  .add{border:2px dashed var(--negro);background:#fff;width:100%;padding:16px;font-family:'Inter';font-weight:700;font-size:14px;cursor:pointer;transition:background .15s;margin-bottom:8px}
  .add:hover{background:var(--amarillo)}

  /* --- Rollo HORIZONTAL a todo el ancho, arriba --- */
  .rollo-top{background:var(--oscuro);color:#fff;padding:18px 20px;margin-bottom:24px}
  .rollo-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:12px;flex-wrap:wrap}
  .rollo-et{font-size:10px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:#8a8a93}
  .rollo-canvas-wrap{width:100%}
  .rollo-top canvas{display:block;border:1px solid #3a3a42;border-radius:4px;background:#1f1f25}
  .rollo-top .l2{font-size:12.5px;color:#bdbdc4;margin-top:10px;min-height:16px}
  .cta-bar{margin:8px 0 6px}
  .cta-bar .cta{width:100%}

  .pedido{background:var(--oscuro);color:#fff;padding:24px;display:flex;align-items:center;gap:22px;flex-wrap:wrap}
  .pedido .rollo-mini{flex:none;display:flex;flex-direction:column;align-items:center;gap:6px}
  .pedido .rollo-mini .et{font-size:9px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:#8a8a93}
  .pedido canvas{border:1px solid #3a3a42;border-radius:3px;background:#1f1f25;display:block}
  .pedido .resumen{flex:1;min-width:160px}
  .pedido .l1{font-family:'Inter';font-weight:700;font-size:24px;line-height:1.1}
  .pedido .l2{font-size:13px;color:#bdbdc4;margin-top:4px}
  .verfull{margin-top:12px;background:none;border:1.5px solid #44444c;color:#cfcfd6;font-family:'Inter';font-size:12px;font-weight:600;padding:9px 14px;cursor:pointer;border-radius:3px}
  .verfull:hover{border-color:var(--amarillo);color:var(--amarillo)}
  .cta{border:none;background:var(--amarillo);color:var(--negro);font-family:'Inter';font-size:15px;font-weight:800;letter-spacing:.04em;padding:18px 26px;cursor:pointer;white-space:nowrap}
  .cta:hover{background:#fff}.cta:disabled{opacity:.3;cursor:not-allowed}
  .full{position:fixed;inset:0;z-index:50;background:#0c0c0f;display:none;flex-direction:column}
  .full.ver{display:flex}
  .full-head{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid #25252c}
  .full-tit{font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#9a9aa4}
  .full-acc{display:flex;gap:8px}
  .full-acc button{background:none;border:1.5px solid #44444c;color:#e6e6ea;font-family:'Inter';font-size:13px;font-weight:700;padding:9px 15px;cursor:pointer;border-radius:3px}
  .full-acc #girar:hover{border-color:var(--amarillo);color:var(--amarillo)}
  .full-acc #cerrar{font-size:16px;font-weight:800;padding:13px 28px;border:2px solid var(--amarillo);color:var(--negro);background:var(--amarillo);border-radius:4px}
  .full-acc #cerrar:hover{background:#fff;border-color:#fff;color:var(--negro)}
  .full-scroll{flex:1;overflow:auto;display:flex;align-items:flex-start;justify-content:center;padding:16px;-webkit-overflow-scrolling:touch}
  .full-scroll canvas{background:#1f1f25;border:1px solid #34343c;display:block}
  .full-pie{text-align:center;padding:14px;font-size:13px;color:#9a9aa4;border-top:1px solid #25252c}
  .modal{position:fixed;inset:0;z-index:60;background:rgba(10,10,12,.6);display:none;align-items:center;justify-content:center;padding:20px}
  .modal.ver{display:flex}
  .modal-box{background:#fff;max-width:420px;width:100%;padding:32px 28px;position:relative;border:2px solid var(--negro)}
  .modal-x{position:absolute;top:12px;right:14px;background:none;border:none;font-size:18px;cursor:pointer;color:#999}
  .modal-tit{font-family:'Inter',sans-serif;font-weight:700;font-size:30px;line-height:1}
  .modal-sub{font-size:14px;color:#555;margin:8px 0 18px}
  .modal-box input{width:100%;border:2px solid var(--negro);padding:14px;font-size:16px;font-family:inherit;outline:none}
  .modal-cta{width:100%;margin-top:12px;background:var(--negro);color:#fff;border:none;padding:16px;font-family:'Inter';font-weight:800;font-size:15px;letter-spacing:.04em;cursor:pointer}
  .modal-cta:hover{background:var(--amarillo);color:var(--negro)}
  .modal-cta:disabled{opacity:.5;cursor:wait}
  .modal-priv{font-size:11px;color:#9a9a98;margin-top:12px;line-height:1.5}
  .modal-estado{font-size:13px;font-weight:600;margin-top:12px;min-height:18px}
  .modal-estado.ok{color:#138a52}.modal-estado.err{color:#d33}
  .rch{text-align:left}
  .rch-tit{font-weight:800;font-size:15px;color:#33333c;margin-bottom:4px}
  .rch-msg{font-size:13px;color:#444;margin-bottom:10px;line-height:1.4}
  .rch-datos{border-top:1px solid #eee;margin-bottom:10px}
  .rch-fila{display:flex;justify-content:space-between;font-size:12.5px;padding:6px 0;border-bottom:1px solid #eee;color:#555}
  .rch-fila b{color:#33333c}
  .rch-aviso{font-size:12px;color:#8a6d00;background:#FFFDE7;padding:8px 10px;margin-bottom:10px;line-height:1.4}
  .rch-acc{display:flex;gap:8px;flex-wrap:wrap}
  .rch-btn{flex:1;min-width:120px;border:1px solid #33333c;background:#fff;color:#33333c;font-weight:700;font-size:13px;padding:10px;cursor:pointer;font-family:inherit}
  .rch-btn:hover{background:#F5F500;border-color:#33333c}
  /* --- Animación mientras se monta/genera el PDF --- */
  @keyframes arch-spin{to{transform:rotate(360deg)}}
  @keyframes arch-bar{0%{left:-42%}100%{left:100%}}
  .montando{display:flex;align-items:center;gap:11px;justify-content:center}
  .montando .ring{width:20px;height:20px;border:3px solid #e6e5dc;border-top-color:var(--negro,#15150f);border-radius:50%;animation:arch-spin .7s linear infinite;flex:none}
  .montando .mtxt{font-weight:700;color:var(--negro,#15150f)}
  .mbar{position:relative;height:4px;margin-top:11px;border-radius:3px;background:#ece9d8;overflow:hidden}
  .mbar i{position:absolute;top:0;height:100%;width:42%;background:var(--amarillo,#F5F500);border-radius:3px;animation:arch-bar 1.05s ease-in-out infinite}
  .nota{font-size:11px;color:#9a9a98;margin-top:22px;line-height:1.6}
  .logo-impr{max-height:34px;max-width:180px;object-fit:contain;display:block}
  .cobrand{color:#b8b8b6;font-size:.92em}
  @media(max-width:560px){.wrap{padding:22px 14px 60px}.pedido{flex-direction:column;align-items:stretch}
    .pedido .rollo-mini{flex-direction:row;align-items:center;justify-content:center;gap:12px}.cta{width:100%}}

  /* ===== TEMA LISTPRINT · negro / blanco-gris / rosa (serio, sin gradient, sin neon) ===== */
  h1.tit{color:#fff}
  .sub{color:#b6b6bd}
  .nota{color:#85858c}
  .micro{color:#9a9a9f}
  .gratis{background:var(--rosa);color:#fff}
  /* cajas blancas con texto oscuro dentro */
  .tarjeta{background:#fff;color:#0a0a0a;border:0;border-radius:14px}
  .modal-box{color:#0a0a0a}
  /* preview = pantalla oscura plana dentro de la caja blanca */
  .preview.vacio{background:#0c0c0e;border-radius:14px 14px 0 0}
  .preview.vacio .g{color:#f2f2f4}
  .preview.vacio .p{color:#9a9aa0}
  .preview.vacio.encima{background:var(--rosa)}
  .preview.vacio.encima .g,.preview.vacio.encima .p{color:#fff}
  /* scan: línea rosa sólida, sin glow neón */
  .scan{background:var(--rosa);box-shadow:none}
  /* botón añadir: serio sobre negro */
  .add{background:transparent;border:1.5px dashed #3a3a40;color:#cfcfd4;border-radius:12px}
  .add:hover{background:#111;border-color:var(--rosa);color:#fff}
  /* CTA y primarios en rosa, serios, texto blanco */
  .cta{color:#fff;border-radius:10px}
  .cta:hover{background:var(--rosa2)}
  .modal-cta{background:var(--rosa);color:#fff}
  .modal-cta:hover{background:var(--rosa2);color:#fff}
  /* rollo arriba: caja-pantalla oscura con borde fino */
  .rollo-top{background:#0c0c0e;border:1px solid #1d1d22;border-radius:14px}
  .rollo-top canvas{border:1px solid #26262c;border-radius:6px;background:#0a0a0c}
  .verfull{border-color:#3a3a42;color:#cfcfd4;border-radius:8px}
  .verfull:hover{border-color:var(--rosa);color:var(--rosa2)}
  /* veredicto: no imprimible = negro con texto blanco (rosa reservado a positivo) */
  .vpal .res.bad{background:#0a0a0a;color:#fff}
  .sevrow .sev.ok{color:#fff}
  .sevrow .sev.bad{color:#fff}
  /* hovers amarillos -> rosa */
  .stepper button:hover{background:var(--rosa);color:#fff}
  .rch-btn:hover{background:var(--rosa);color:#fff;border-color:var(--rosa)}
  .pline .yel{background:var(--rosa);color:#fff}
  /* "conectando con Atlas" durante el escaneo */
  .conx{position:absolute;left:50%;bottom:44px;transform:translateX(-50%);font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#f2c3df;background:rgba(0,0,0,.6);padding:6px 13px;border-radius:20px;z-index:6;display:flex;align-items:center;gap:7px;white-space:nowrap}
  .conx::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--rosa);animation:conxp 1s ease-in-out infinite}
  @keyframes conxp{0%,100%{opacity:.3}50%{opacity:1}}
</style>
<style>
.lp-bar{position:sticky;top:0;z-index:99999;display:flex;align-items:center;gap:14px;padding:13px 20px;background:#000;border-bottom:1px solid #18181d;box-sizing:border-box}
.lp-logo{font-family:'Inter',system-ui,sans-serif;font-weight:800;font-size:20px;letter-spacing:-.02em;color:#fff;text-decoration:none;text-transform:lowercase}
.lp-logo span{color:#C4017B}
.lp-tag{margin-left:auto;font-size:10px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:#7a7a80}

/* ============================================================
   LIST_PRINT · capa de reskin sobre archivolisto (negro/rosa)
   Fuerza fondo negro sin tocar el layout ni el JS del motor.
   Sobrescribe reglas heredadas del CSS claro original.
   ============================================================ */
html, body { background:#000 !important; color:#e7e7ea !important;
             font-family:'Inter', system-ui, sans-serif !important; }

/* superficies claras del CSS antiguo → oscuras */
.wrap, main, section, .panel, .card, .box, .contenedor,
.montador, .comprueba, .informe, .ficha, .tarjeta { background:transparent !important; color:#e7e7ea !important; }
.tarjeta, .card, .panel, .box { border-color:#1f1f25 !important; }

/* textos que en el original iban en gris oscuro sobre blanco */
p, li, small, label, .sub, .subtitulo, .desc { color:#cfcfd6 !important; }
h1, h2, h3, h4 { color:#fff !important; font-weight:800 !important; letter-spacing:-.02em !important; }

/* botones: el amarillo #F5F500 del original → rosa list_print */
button, .btn, [class*="boton"], .cta, input[type="submit"], input[type="button"] {
  background:#C4017B !important; color:#fff !important; border:1px solid #C4017B !important;
  font-weight:800 !important; letter-spacing:.02em !important;
}
button:hover, .btn:hover, [class*="boton"]:hover, .cta:hover { background:#E0188F !important; border-color:#E0188F !important; }
a { color:#E0188F !important; }
a:hover { color:#fff !important; }

/* inputs oscuros con foco rosa */
input[type=text], input[type=email], input[type=number], input[type=tel], select, textarea {
  background:#0c0c0e !important; color:#e7e7ea !important;
  border:1px solid #33333c !important; border-radius:6px !important;
}
input:focus, select:focus, textarea:focus { border-color:#C4017B !important; outline:none !important; }

/* previews / dropzones del comprueba y montador */
.preview, .dropzone, .zona-archivo, [class*="preview"], [class*="dropzone"] {
  background:#0c0c0e !important; border:1.5px dashed #33333c !important; color:#cfcfd6 !important;
}

/* separadores */
hr, .separador, .linea { background:#1f1f25 !important; border-color:#1f1f25 !important; }

/* barras de progreso y chips */
.progress, .barra, [class*="progress"] { background:#1f1f25 !important; }
.progress > *, .barra > *, [class*="progress"] > * { background:#C4017B !important; }
.chip, .badge, [class*="chip"], [class*="badge"] { background:#1f1f25 !important; color:#e7e7ea !important; border:1px solid #33333c !important; }

/* header/logo: fondo negro y logo blanco */
header, nav, .header, .topbar { background:#000 !important; border-bottom:1px solid #1f1f25 !important; }

/* código y prellenados */
pre, code, .json, .code { background:#0c0c0e !important; color:#cfcfd6 !important; border:1px solid #1f1f25 !important; }

/* ============================================================
   LIST_PRINT · lenguaje Starlink (portada limpia, editorial)
   ============================================================ */

/* MATAR el recuadro rosa sobre "listo" y cualquier .hl heredado */
.hl, h1 .hl, h2 .hl, .hero h1 .hl, .falla-bloque h2 .hl {
  background: transparent !important;
  color: inherit !important;
  padding: 0 !important;
  font-weight: inherit !important;
}

/* Portada tipo Starlink: aire, tipografía enorme, texto en blanco */
.hero { padding: 80px 0 60px !important; }
.hero .wrap { max-width: 1100px !important; margin: 0 auto !important; padding: 0 24px !important; }
.hero-eyebrow, .sec-eyebrow {
  font-size: 12px !important;
  font-weight: 500 !important;
  letter-spacing: .18em !important;
  text-transform: uppercase !important;
  color: #9a9a98 !important;
  background: transparent !important;
  padding: 0 !important;
  margin-bottom: 20px !important;
  display: inline-block !important;
}
.hero h1, h1 {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-weight: 700 !important;
  font-size: clamp(44px, 7vw, 84px) !important;
  line-height: .98 !important;
  letter-spacing: -0.035em !important;
  color: #fff !important;
  margin: 0 0 24px !important;
  max-width: 14ch !important;
}
.hero p.lead, p.lead {
  font-size: clamp(17px, 1.6vw, 20px) !important;
  color: #b8b8bd !important;
  line-height: 1.5 !important;
  max-width: 58ch !important;
  margin-bottom: 40px !important;
  font-weight: 400 !important;
}

/* CTAs Starlink: pills negras con borde, hover blanco */
.hero-ctas { display: flex; gap: 12px; flex-wrap: wrap; }
.hero-ctas .btn, .btn-negro, .btn-amarillo, .btn-ghost {
  display: inline-flex !important; align-items: center !important;
  padding: 14px 26px !important;
  border-radius: 999px !important;
  font-weight: 600 !important;
  font-size: 15px !important;
  letter-spacing: .01em !important;
  text-decoration: none !important;
  transition: all .15s ease !important;
  border: 1px solid !important;
}
.btn-negro, .hero-ctas .btn-negro {
  background: #fff !important; color: #000 !important; border-color: #fff !important;
}
.btn-negro:hover { background: #e0e0e0 !important; border-color: #e0e0e0 !important; }
.btn-amarillo, .hero-ctas .btn-amarillo {
  background: transparent !important; color: #fff !important; border-color: #33333c !important;
}
.btn-amarillo:hover { border-color: #fff !important; background: rgba(255,255,255,.05) !important; }
.btn-ghost { background: transparent !important; color: #9a9a98 !important; border-color: transparent !important; }
.btn-ghost:hover { color: #fff !important; }

/* Banda de features: puntos rosa muy sutiles, texto claro */
.banda { background: transparent !important; border-top: 1px solid #1f1f25 !important; border-bottom: 1px solid #1f1f25 !important; padding: 24px 0 !important; }
.banda-inner { display: flex !important; justify-content: center !important; gap: 40px !important; flex-wrap: wrap !important; }
.banda-item { display: inline-flex !important; align-items: center !important; gap: 8px !important; color: #cfcfd6 !important; font-size: 13px !important; font-weight: 500 !important; }
.banda-dot { width: 6px !important; height: 6px !important; border-radius: 50% !important; background: #C4017B !important; display: inline-block !important; }

/* Banner "Próximamente en" con badges */
.apps-soon {
  padding: 60px 0 !important;
  text-align: center !important;
  border-bottom: 1px solid #1f1f25 !important;
}
.apps-soon .eyebrow {
  font-size: 12px !important;
  font-weight: 500 !important;
  letter-spacing: .18em !important;
  text-transform: uppercase !important;
  color: #9a9a98 !important;
  margin-bottom: 12px !important;
  display: block !important;
}
.apps-soon h3 {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-weight: 600 !important;
  font-size: clamp(24px, 3vw, 34px) !important;
  color: #fff !important;
  letter-spacing: -0.02em !important;
  margin: 0 0 8px !important;
  line-height: 1.1 !important;
}
.apps-soon .apps-sub {
  color: #b8b8bd !important;
  font-size: 15px !important;
  margin: 0 0 28px !important;
}
.apps-soon .badges {
  display: inline-flex !important;
  gap: 14px !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
}
.apps-soon .badge-app {
  display: inline-block !important;
  opacity: .55 !important;
  transition: opacity .2s ease !important;
  border: 1px solid #33333c !important;
  border-radius: 10px !important;
  overflow: hidden !important;
  line-height: 0 !important;
}
.apps-soon .badge-app img { width: 180px !important; height: 54px !important; display: block !important; }
.apps-soon .badge-app:hover { opacity: .85 !important; border-color: #555 !important; }
.apps-soon .soon-tag {
  display: inline-block !important;
  margin-top: 18px !important;
  font-size: 11px !important;
  letter-spacing: .3em !important;
  text-transform: uppercase !important;
  color: #C4017B !important;
  font-weight: 600 !important;
}

/* Secciones interiores: matar la crema del fondo si aparece */
section[style*="crema"] { background: transparent !important; border-block: 1px solid #1f1f25 !important; }
.sec-head h2, h2 { color: #fff !important; font-weight: 700 !important; letter-spacing: -0.025em !important; font-size: clamp(28px, 4vw, 44px) !important; line-height: 1.05 !important; }
.sec-head p, section p { color: #b8b8bd !important; }