/* Pixel Forma · capa del sitio sobre la base de familia (familia/ventana.css de code.pixel.ceo).
   Hereda: paleta #060608/#101014/#292932, texto #F4F4F6/#A3A3AD, violeta #8B6CFF, botón #7254F0,
   radios 2/4/6, cabecera fija translúcida, .win, .cap, .pie y el logo 3D de Lex Laboratory.
   Cambia: la mono pasa a JetBrains Mono (la de la app) y los titulares son más contenidos. */
:root{
  --mono:'JetBrains Mono',ui-monospace,monospace;
  --pf-glass:rgba(16,16,20,.78);
  --rosa:#cf74b6;--cian:#65b8ca;
  --ease-out:cubic-bezier(.23,1,.32,1);--ease-move:cubic-bezier(.77,0,.175,1);
  --max:1200px;
}
body{font-size:15px}
h1{font-size:44px;line-height:1.08;letter-spacing:-.03em;font-weight:600}
h2{font-size:30px;line-height:1.14;letter-spacing:-.025em}
h3{font-size:19px;line-height:1.25}
.lead{font-size:16.5px;line-height:1.6;color:var(--ts);max-width:600px}
.lead b{color:var(--t);font-weight:500}
.kick{font:500 11.5px/1 var(--mono);letter-spacing:.02em;color:var(--lav)}
.sec{padding:120px 0 0}
.sec-h{gap:12px;margin-bottom:44px;max-width:620px}
.sec-h p{font-size:15.5px}
code,.mono{font-family:var(--mono)}
kbd{font:500 11px/1 var(--mono);padding:2px 5px;border:1px solid var(--line);border-bottom-width:2px;border-radius:3px;color:var(--t);background:var(--el)}

/* ---------- cabecera de familia ---------- */
.hdr .wrap{gap:26px}
.fbrand{display:flex;align-items:center;gap:9px;font:600 15px var(--sans);letter-spacing:-.01em;white-space:nowrap}
.fbrand canvas{display:block;margin:-4px -2px -4px -4px}
.beta{font:500 10px/1 var(--mono);color:var(--lav);border:1px solid var(--vio-line);border-radius:2px;padding:3px 4px 2px}
.fam{display:flex;align-items:center;height:30px;padding:2px;border:1px solid var(--line);border-radius:var(--r2);background:var(--sunk);font-size:12.5px}
.fam a{height:24px;display:flex;align-items:center;gap:6px;padding:0 9px;border-radius:3px;color:var(--ts)}
.fam a i{width:5px;height:5px;border-radius:1px;background:var(--dot)}
.fam a.on{background:var(--el);color:var(--t);box-shadow:inset 0 0 0 1px var(--line)}
.fam a.on i{background:var(--vio)}
.hdr .r{gap:14px}
.nav{gap:20px}

/* ---------- botones ---------- */
.btn{box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 1px 2px rgba(0,0,0,.3)}
.btn.lg{height:40px;padding:0 16px;font-size:14px}
.btn.g{box-shadow:none}
.btn svg{width:15px;height:15px}
.ghost-link{font-size:13.5px;color:var(--ts);display:inline-flex;gap:6px;align-items:center}
.ghost-link:hover{color:var(--t)}
.meta{display:flex;flex-wrap:wrap;gap:6px 14px;font:400 11.5px var(--mono);color:var(--tm)}
.meta span{display:inline-flex;align-items:center;gap:6px}
.meta span+span::before{content:'';width:3px;height:3px;border-radius:1px;background:var(--dot);margin-right:8px}

/* ---------- ventana de captura real ---------- */
.shot{position:relative;border:1px solid var(--line);border-radius:var(--r3);background:var(--panel);overflow:hidden;box-shadow:var(--shot-sh)}
.shot .tt{display:flex;align-items:center;gap:8px;height:28px;padding:0 10px;border-bottom:1px solid var(--line);background:var(--chrome);font:500 11px var(--mono);color:var(--tm)}
.shot .tt i{width:7px;height:7px;border-radius:50%;background:var(--dot2)}
.shot .tt span{margin-left:6px}
.shot .tt .x{margin-left:auto}
.shot img{display:block;width:100%;height:auto;image-rendering:auto}
.shot.bare .tt{display:none}
.cap{font:400 11px/1.5 var(--mono);color:var(--tm);margin-top:10px}
.cap .tag{font-size:10px;padding:1px 5px;border-radius:2px}
.cap .tag.real{border-color:var(--ok-line);color:var(--ok)}

/* ---------- luz aurora (solo transform/opacity) ---------- */
.aur{position:absolute;pointer-events:none}
.aur i{position:absolute;left:50%;top:50%;border-radius:50%;transform:translate(-50%,-50%)}
.aur i:nth-child(1){width:360px;height:300px;background:radial-gradient(closest-side,rgba(139,108,255,.30),transparent)}
.aur i:nth-child(2){width:260px;height:200px;margin-top:-70px;background:radial-gradient(closest-side,rgba(207,116,182,.16),transparent)}
.aur i:nth-child(3){width:280px;height:200px;margin-top:80px;background:radial-gradient(closest-side,rgba(101,184,202,.12),transparent)}

/* ---------- registro de eventos del armado ---------- */
.evlog{display:flex;flex-direction:column;gap:2px;font:400 12px/1.4 var(--mono);color:var(--tm)}
.evlog li{list-style:none;display:flex;align-items:center;gap:10px;height:26px;padding:0 10px;border-radius:3px}
.evlog li b{font-weight:500;color:var(--ts)}
.evlog li em{font-style:normal;margin-left:auto;color:#5d5d68;font-variant-numeric:tabular-nums}
.evlog li .d{width:6px;height:6px;border-radius:1px;background:var(--vio);flex:none}
.evlog li.now{background:linear-gradient(90deg,rgba(139,108,255,.13),rgba(207,116,182,.06) 60%,transparent)}
.evlog li.now .d{background:var(--rosa);box-shadow:0 0 10px rgba(207,116,182,.55)}
.evlog li.wait{opacity:.45}.evlog li.wait .d{background:#3a3a44}
.evlog ul{margin:0;padding:0}

/* ---------- lista de puntos ---------- */
.pts{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;font-size:14px;color:var(--ts)}
.pts li{display:flex;gap:10px;align-items:baseline}
.pts li::before{content:'';flex:none;width:5px;height:5px;border-radius:1px;background:var(--vio);transform:translateY(-2px)}
.chk{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.chk li{font:500 11.5px/1 var(--mono);color:var(--ts);border:1px solid var(--line);border-radius:3px;padding:6px 8px;background:var(--sunk)}
.chk li b{color:var(--ok);font-weight:500;margin-right:5px}

/* ---------- cuenta y batería ---------- */
.acct{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.card{border:1px solid var(--line);border-radius:var(--r3);background:var(--panel);padding:18px;display:flex;flex-direction:column;gap:12px;min-width:0}
.card h3{font-size:15px;letter-spacing:-.01em}
.card p{font-size:13.5px;color:var(--ts)}
.card .shot{box-shadow:none;margin-top:auto}
.card .n{font:500 11px var(--mono);color:var(--tm)}

/* ---------- descarga ---------- */
.dl{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:16px;align-items:start}
.dl-main{border:1px solid var(--line);border-radius:var(--r3);background:linear-gradient(180deg,var(--vio-wash),transparent 55%),var(--panel);padding:26px;display:flex;flex-direction:column;gap:18px}
.dl-main .row{display:flex;align-items:center;gap:16px}
.dl-main .file{font:400 12px var(--mono);color:var(--ts);padding:10px 12px;border:1px solid var(--line);border-radius:var(--r2);background:var(--sunk);display:flex;gap:12px;align-items:center}
.dl-main .file em{font-style:normal;color:var(--tm);margin-left:auto}
.dl-os{display:flex;gap:8px;flex-wrap:wrap}
.dl-os span{font:500 11.5px var(--mono);color:var(--tm);border:1px dashed var(--line);border-radius:3px;padding:6px 9px}
.dl-os span.on{border-style:solid;color:var(--t);border-color:var(--vio-line);background:var(--vio-wash)}
.ss{border:1px solid var(--amb-line);border-radius:var(--r3);background:linear-gradient(180deg,var(--amb-wash),transparent 60%),var(--panel);padding:22px;display:flex;flex-direction:column;gap:12px}
.ss h3{font-size:15px;display:flex;align-items:center;gap:8px}
.ss h3 i{width:7px;height:7px;border-radius:50%;background:var(--amb)}
.ss p{font-size:13.5px;color:var(--ts)}
.ss ol{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px;counter-reset:s}
.ss ol li{counter-increment:s;display:flex;gap:10px;align-items:center;font-size:13.5px;color:var(--t)}
.ss ol li::before{content:counter(s);flex:none;width:20px;height:20px;border-radius:3px;border:1px solid var(--line);display:grid;place-items:center;font:500 11px var(--mono);color:var(--ts)}
.ss .sm{font-size:12.5px;color:var(--tm)}
.facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 18px;font-size:13px;color:var(--ts)}
.facts div{display:flex;gap:9px;align-items:baseline}
.facts div::before{content:'';flex:none;width:5px;height:5px;border-radius:1px;background:var(--ok);transform:translateY(-2px)}

/* ---------- pie de familia ---------- */
.fam-cards{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:44px}
.fam-card{display:flex;align-items:center;gap:16px;padding:10px 18px 10px 10px;border:1px solid var(--line);border-radius:var(--r3);background:linear-gradient(90deg,var(--vio-wash),transparent 50%),var(--panel)}
.fam-card .mini{flex:none;width:120px;height:82px;overflow:hidden;border-radius:var(--r2);border:1px solid var(--line);position:relative;background:var(--stage);display:grid;place-items:center}
.fam-card .mini img.ceo-pixels{width:120px;height:82px;object-fit:cover;image-rendering:pixelated}
.fam-card .mini img.p{width:34px;height:auto}
.fam-card .tx{display:flex;flex-direction:column;gap:3px;font-size:12.5px;color:var(--ts)}
.fam-card .tx .k{font:500 10.5px var(--mono);color:var(--lav)}
.fam-card .tx b{font-size:14px;color:var(--t);font-weight:600}
.fam-card .go{margin-left:auto;font:500 11.5px var(--mono);color:var(--lav);white-space:nowrap}
.pie .cols{grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,1fr)) 132px}

/* ---------- utilidades ---------- */
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.center{text-align:center;margin-left:auto;margin-right:auto}
.rv{opacity:1}

/* ---------- piezas comunes ---------- */
.lnk{color:var(--lav)}
.dl-t{font-size:16px;font-weight:600}.dl-s{font-size:11.5px;margin-top:4px}
.dl-main canvas{flex:none}
.stagebox{height:212px;display:grid;place-items:center;background:radial-gradient(60% 70% at 50% 40%,rgba(139,108,255,.07),transparent),var(--stage)}
.stagebox img{width:auto;max-width:100%;height:auto;border-radius:3px;box-shadow:var(--thumb-sh)}
.endgap{height:112px}

/* ---------- móvil ---------- */
@media (max-width:980px){
  .nav,.fam,.hdr .r .hide{display:none}
  .menu{display:flex}
}
@media (max-width:760px){
  :root{--gut:16px}
  h1{font-size:31px;line-height:1.12}
  h2{font-size:24px}
  .lead{font-size:15px}
  .sec{padding:80px 0 0}
  .sec-h{margin-bottom:28px}
  .acct,.dl,.fam-cards{grid-template-columns:minmax(0,1fr)}
  .dl-main{padding:18px}
  .dl-main .file{flex-wrap:wrap}
  .facts{grid-template-columns:minmax(0,1fr)}
  .fam-card .mini{width:84px;height:58px}.fam-card .mini img.ceo-pixels{width:84px;height:58px}
  .fam-card .go{display:none}
  .btn.lg{height:44px}
  .hdr .wrap{gap:12px}.hdr .r{gap:8px}.fbrand .beta{display:none}
  .hdr .btn.sm{height:32px;padding:0 10px}
  main > section{overflow-x:clip}
  .pie .cols{grid-template-columns:1fr 1fr}
  .pie .cols .pt{grid-column:1/-1}
  .pie .lex3d-footer{grid-column:1/-1;justify-self:center}
  .endgap{height:72px}
  .dl-main .row.dl-act{flex-direction:column;align-items:stretch}
}

/* ---------- móvil estrecho (320–400): el idioma pasa al menú y el botón se acorta ---------- */
@media (max-width:400px){
  .hdr .r .lang{display:none}
  .hdr .btn.sm .bx{display:none}
}
@media (min-width:401px){.mpanel .mlang{display:none}}

/* ---------- tablet (761–980): tarjetas de familia a una columna; titulares equilibrados ---------- */
@media (max-width:980px){.fam-cards{grid-template-columns:minmax(0,1fr)}}
h1,h2{text-wrap:balance}
.heroM h1 br{display:none}
.heroM h1 em{display:block;text-wrap:balance}