/* EL CSS DE LA PORTADA Y SUS PAGINAS HERMANAS.
   Salio de dentro de index.html el 03/09/2026 (bloque 5 del pedido visual): al mudarse
   el tablero y la nota a /por-que-lo-digo/, esas clases tenian que vivir en un solo
   lugar. Dejarlas adentro del index obligaba a una segunda copia, que es la falla que
   este repo caza. El bloque TCL:ESTILO-GENERADO se inyecta ACA, no en el HTML. */

  :root{
    --navy:#121417; --indigo:rgba(140,149,163,0.25); --amber:#D9A441; --cream:#EDE9E0; --gray:#8C95A3; --papel:#F4F1EA;
    --ink:#0E1012; --panel:#16191D; --panel-2:#1B1F24;
    --hair:rgba(237,233,224,0.09);
    --cream-2:rgba(237,233,224,0.74); --cream-3:rgba(237,233,224,0.50);
    --amber-dim:rgba(217,164,65,0.14); --amber-hover:#E8B855;
    --red:#C15B52;
    --serif:'Fraunces',Georgia,serif;
    --sans:'IBM Plex Sans',system-ui,sans-serif;
    --mono:'IBM Plex Mono',ui-monospace,monospace;
    --cond:'IBM Plex Sans Condensed','IBM Plex Sans',system-ui,sans-serif;
    --wrap:1180px;
  }
  *{ margin:0; padding:0; box-sizing:border-box; }
  html{ scroll-behavior:smooth; overflow-x:hidden; }
  body{
    background:var(--ink); color:var(--cream); font-family:var(--sans);
    font-size:17px; line-height:1.6; -webkit-font-smoothing:antialiased; overflow-x:hidden;
  }
  ::selection{ background:rgba(217,164,65,0.28); color:#fff; }
  a{ color:inherit; text-decoration:none; }
  .wrap{ width:100%; max-width:var(--wrap); margin:0 auto; padding:0 clamp(20px,5vw,56px); }

  /* TCL:ESTILO-GENERADO */
  /* ═══════════ SER PARTE (generado) ═══════════ */
  .parte{ padding:clamp(56px,8vw,90px) 0; border-top:1px solid var(--hair);
    background:none; }
  .parte-grid{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.15fr); gap:clamp(20px,3vw,34px); align-items:stretch; }
  .parte-grid.sola{ grid-template-columns:minmax(0,1fr); max-width:720px; }
  @media(max-width:860px){ .parte-grid{ grid-template-columns:1fr; } }

  .parte .enc, .parte .msj{ background:var(--panel); border:1px solid var(--hair); border-radius:2px;
    padding:clamp(22px,3vw,30px); }
  .parte .enc{ display:flex; flex-direction:column; }
  .parte .enc-r{ flex:1 1 auto; }
  .parte .enc-b{ display:flex; gap:11px; flex-wrap:wrap; }
  .parte .enc-b button{ flex:1 1 auto; min-width:132px; font-family:var(--mono); font-size:14px; letter-spacing:.6px;
    color:var(--cream); background:transparent; border:1px solid rgba(217,164,65,0.38); border-radius:2px;
    padding:14px 18px; cursor:pointer; transition:.18s; }
  .parte .enc-b button:hover{ background:var(--amber-dim); border-color:var(--amber); color:var(--amber); }
  .parte .enc-b button[aria-pressed="true"]{ background:var(--amber); border-color:var(--amber); color:var(--navy); font-weight:600; }
  .parte .enc-b button:disabled{ cursor:default; }

  .parte .enc-r{ margin-top:20px; }
  .parte .enc-r:empty{ margin-top:0; }
  .parte .enc-fila{ margin-bottom:15px; }
  .parte .enc-cab{ display:flex; justify-content:space-between; gap:12px; font-family:var(--mono); font-size:12.5px;
    color:var(--cream-2); margin-bottom:7px; }
  .parte .enc-cab b{ color:var(--cream); font-weight:500; }
  .parte .enc-cab .mio{ color:var(--amber); font-weight:600; }
  .parte .enc-fila.mio .enc-cab b{ color:var(--amber); }
  .parte .enc-barra{ height:7px; background:rgba(237,233,224,0.07); border-radius:2px; overflow:hidden; }
  .parte .enc-barra i{ display:block; height:100%; background:rgba(217,164,65,0.45); border-radius:2px;
    transition:width .5s cubic-bezier(.4,0,.2,1); }
  .parte .enc-fila.mio .enc-barra i{ background:var(--amber); }
  .parte .enc-pie{ font-family:var(--mono); font-size:11px; letter-spacing:1.2px; text-transform:uppercase;
    color:var(--gray); margin-top:4px; }
  .parte .enc-nota{ font-family:var(--mono); font-size:11px; color:var(--gray); margin-top:18px; line-height:1.6;
    padding-top:16px; border-top:1px solid var(--hair); }
  .parte .enc-pie.solo{ font-size:13px; letter-spacing:1.4px; color:var(--cream-3); margin-top:22px; }
  .parte .enc-err{ font-size:13.5px; color:var(--red); margin-top:12px; }

  .parte .msj label{ display:block; font-size:15px; color:var(--cream-2); line-height:1.5; margin:0 0 10px; }
  .parte .msj label + textarea, .parte .msj label + input{ margin-bottom:16px; }
  .parte .msj textarea, .parte .msj input{ width:100%; background:var(--ink); color:var(--cream);
    border:1px solid var(--hair); border-radius:2px; padding:13px 15px;
    font:400 15px/1.55 var(--sans); resize:vertical; }
  .parte .msj textarea{ min-height:112px; }
  .parte .msj textarea:focus, .parte .msj input:focus{ outline:none; border-color:rgba(217,164,65,0.55); }
  .parte .msj button{ font-family:var(--mono); font-size:13px; letter-spacing:1.4px; text-transform:uppercase;
    color:var(--navy); background:var(--amber); border:0; border-radius:2px; padding:13px 30px; cursor:pointer; transition:.18s; }
  .parte .msj button:hover{ filter:brightness(1.08); }
  .parte .msj button:disabled{ opacity:.5; cursor:default; }
  .parte .msj-est{ font-size:13.5px; color:var(--cream-3); margin:14px 0 0; min-height:1.2em; }
  .parte .msj-est.ok{ color:var(--amber); } .parte .msj-est.mal{ color:var(--red); }

  /* ═══════════ NUEVO DESDE TU ÚLTIMA VISITA (generado) ═══════════ */
  .nuevo{ display:none; font-family:var(--mono); font-size:10px; letter-spacing:1.6px; text-transform:uppercase;
    color:var(--amber); border:1px solid rgba(217,164,65,0.45); border-radius:2px; padding:3px 8px;
    vertical-align:middle; margin-left:10px; white-space:nowrap; }
  html.tcl-vuelve .nuevo[data-nuevo="si"]{ display:inline-block; }
  .volves{ display:none; align-items:flex-start; gap:14px; margin-bottom:clamp(20px,3vw,28px);
    padding:16px 20px; border:1px solid rgba(217,164,65,0.30); border-radius:2px; background:rgba(217,164,65,0.05); }
  html.tcl-vuelve .volves.hay{ display:flex; }
  .volves-mark{ width:3px; align-self:stretch; background:var(--amber); border-radius:2px; min-height:26px; flex-shrink:0; }
  .volves-cuerpo{ min-width:0; }
  .volves p{ font-size:14px; color:var(--cream-2); line-height:1.5; }
  .volves b{ color:var(--cream); font-weight:600; }
  .volves-enlaces{ display:flex; flex-direction:column; gap:4px; margin-top:9px; }
  .volves-enlaces:empty{ display:none; }
  .volves-enlaces a{ font-size:14px; color:var(--amber); line-height:1.45;
    border-bottom:1px solid rgba(217,164,65,0.28); align-self:flex-start; }
  .volves-enlaces a:hover{ border-bottom-color:var(--amber); }

  /* la puerta de salida: sólo aparece si hay algo que borrar */
  .olvidar{ display:none; font-family:var(--mono); font-size:11px; letter-spacing:.8px; color:var(--gray);
    background:transparent; border:0; border-bottom:1px solid transparent; padding:0; cursor:pointer; transition:.18s; }
  html.tcl-sabe .olvidar{ display:inline-block; }
  .olvidar:hover{ color:var(--cream-2); border-bottom-color:var(--hair); }
  

  /* ═══════════ I-3 · RIEL, MOLDE Y EVENTOS (generado) ═══════════ */
  .riel{ margin:clamp(26px,4vw,36px) 0 clamp(22px,3vw,30px); }
  .riel-linea{ position:relative; height:2px; background:rgba(217,164,65,0.38); }
  .riel-punto{ position:absolute; top:-4px; width:10px; height:10px; border-radius:50%; background:var(--amber); }
  .riel-a{ left:0; }
  .riel-b{ right:0; }
  .riel-pies{ display:flex; justify-content:space-between; margin-top:12px; gap:16px; }
  .riel-pie{ font-family:var(--mono); font-size:10.5px; letter-spacing:1.6px; text-transform:uppercase; color:var(--gray); }
  .riel-pie b{ display:block; font-size:14px; letter-spacing:.4px; text-transform:none; color:var(--cream-2);
    font-weight:600; margin-bottom:3px; }
  .riel-der{ text-align:right; }

  .molde{ margin-top:20px; border:1px dashed rgba(237,233,224,0.16); border-radius:2px;
    padding:18px clamp(16px,2.4vw,24px); background:rgba(237,233,224,0.015); }
  .molde-rot{ font-family:var(--mono); font-size:10px; letter-spacing:2px; text-transform:uppercase;
    color:var(--gray); margin-bottom:14px; }
  .molde-fila{ display:grid; grid-template-columns:118px 1fr 2fr; gap:clamp(14px,3vw,30px); }
  @media(max-width:640px){ .molde-fila{ grid-template-columns:1fr; gap:10px; } }
  .molde-col{ display:flex; flex-direction:column; gap:9px; }
  .molde-col span{ font-family:var(--mono); font-size:11px; letter-spacing:1.2px; color:var(--cream-3);
    border-bottom:1px dashed rgba(237,233,224,0.16); padding-bottom:7px; }

  .define{ margin-top:clamp(34px,5vw,48px); padding-top:clamp(28px,4vw,38px); border-top:1px solid var(--hair); }
  .define[hidden]{ display:none; }
  .define-lista{ margin-top:6px; }
  .ev{ display:grid; grid-template-columns:180px 1fr; gap:clamp(14px,2.5vw,26px);
    padding:15px 0; border-bottom:1px solid var(--hair); align-items:baseline; }
  .ev[hidden]{ display:none; }
  @media(max-width:640px){ .ev{ grid-template-columns:1fr; gap:5px; } }
  .ev-cuando{ font-family:var(--mono); font-size:12px; letter-spacing:.8px; color:var(--amber); font-weight:600; }
  .ev-que{ font-size:15px; color:var(--cream-2); line-height:1.55; }
  .ev-que strong{ color:var(--cream); font-weight:600; }
  .ev-toca{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-top:10px; }
  .ev-toca span{ font-family:var(--mono); font-size:10px; letter-spacing:1.6px; text-transform:uppercase; color:var(--gray); }
  .ev-toca a{ font-family:var(--mono); font-size:11.5px; letter-spacing:.8px; color:var(--cream-2);
    border:1px solid var(--hair); border-radius:2px; padding:4px 9px; transition:.18s; }
  .ev-toca a:hover{ color:var(--amber); border-color:rgba(217,164,65,.45); }
  .define-pie{ display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-top:16px;
    font-family:var(--mono); font-size:10.5px; letter-spacing:1.4px; text-transform:uppercase; color:var(--gray); }
  .define-pie span:empty{ display:none; }
  .define-vacio{ margin-top:8px; font-size:15px; color:var(--cream-2); line-height:1.55; }

  .ledger-row, .obs-row{ display:grid; grid-template-columns:118px 1fr; gap:clamp(16px,3vw,30px);
    padding:22px clamp(20px,3vw,30px); align-items:start; border-top:1px solid var(--hair); }
  .ledger .ledger-row:first-child, .ledger-obs .obs-row:first-child{ border-top:0; }
  @media(max-width:640px){ .ledger-row, .obs-row{ grid-template-columns:1fr; gap:12px; } }
  .led-cuerpo{ min-width:0; }
  .led-asset span{ font-family:var(--mono); font-size:12px; color:var(--gray); font-weight:400; letter-spacing:.5px; }
  .led-cond{ font-family:var(--serif); font-size:16px; color:var(--cream-2); line-height:1.45; margin-bottom:9px; }
  .led-cond em{ display:block; font-style:normal; font-family:var(--mono); font-size:10px; letter-spacing:1.6px;
    text-transform:uppercase; color:var(--gray); margin-bottom:3px; }
  .led-result{ margin-top:14px; padding-top:13px; border-top:1px solid var(--hair); }
  .led-result p{ font-size:14px; color:var(--cream-2); line-height:1.55; margin-top:8px; }
  .res-cerrada{ font-family:var(--mono); font-size:10.5px; letter-spacing:1.6px; text-transform:uppercase;
    color:var(--amber); font-weight:600; }
  .res-abierta{ font-family:var(--mono); font-size:10.5px; letter-spacing:1.6px; text-transform:uppercase; color:var(--gray); }
  .led-cuando{ font-family:var(--mono); font-size:10.5px; color:var(--gray); margin-left:10px; letter-spacing:1px; }
  .led-seal{ white-space:nowrap; }

  .ledger-obs{ margin-top:clamp(26px,4vw,36px); border:1px solid var(--hair); border-radius:2px;
    background:rgba(237,233,224,0.015); overflow:hidden; }
  .obs-rot{ font-family:var(--mono); font-size:10.5px; letter-spacing:2px; text-transform:uppercase;
    color:var(--cream-3); padding:20px clamp(20px,3vw,30px) 0; }
  .obs-sub{ font-size:13.5px; color:var(--gray); line-height:1.55; padding:8px clamp(20px,3vw,30px) 18px;
    max-width:70ch; }

  .riel-marca{ position:absolute; top:-3px; width:7px; height:7px; border-radius:50%;
    background:var(--cream-3); transform:translateX(-50%); }
  .riel-dec{ background:var(--amber); width:9px; height:9px; top:-4px; }
  .reg-cadena{ margin-top:16px; font-family:var(--mono); font-size:10.5px; letter-spacing:1.2px;
    color:var(--gray); word-break:break-all; }

  /* el comprobante en Bitcoin · 04/09/2026 */
  .led-ots{ margin-top:14px; padding-top:13px; border-top:1px solid var(--hair);
    display:flex; flex-direction:column; gap:7px; }
  .ots-l{ font-family:var(--mono); font-size:11px; line-height:1.5; color:var(--cream-2);
    display:flex; flex-wrap:wrap; gap:4px 8px; align-items:baseline; }
  .ots-l em{ flex:0 0 auto; min-width:96px; font-style:normal; font-size:10px; letter-spacing:1.4px;
    text-transform:uppercase; color:var(--gray); }
  .ots-l code{ font-family:var(--mono); font-size:11px; color:var(--cream-2); word-break:break-all;
    min-width:0; }
  .ots-cta{ font-size:13px; line-height:1.6; color:var(--cream-2); }
  .led-ots a{ color:var(--amber); text-decoration:underline; text-underline-offset:3px; }
  .ots-est{ font-family:var(--mono); font-size:10.5px; letter-spacing:1.4px; text-transform:uppercase;
    font-weight:400; color:var(--gray); margin-left:4px; }
  .ots-est.ots-ok{ color:var(--amber); }
  .led-ots i{ font-style:normal; font-size:12.5px; color:var(--gray); }
  /* el requisito del comando: cuelga del renglón de arriba, sin rótulo propio */
  .ots-req{ margin-top:-4px; }
  .ots-req i{ font-size:11.5px; }
  @media(min-width:641px){ .ots-req em{ min-width:96px; } }
  @media(max-width:640px){ .ots-l{ flex-direction:column; gap:2px; } .ots-l em{ min-width:0; } }

  .reg-ancla{ margin-top:12px; font-size:13px; line-height:1.6; color:var(--gray); max-width:78ch; }
  .reg-ancla b{ color:var(--cream-2); font-weight:600; }


  /* ═══════════ PASADA VISUAL · A — el riel de cada fila (generado) ═══════════ */
  .mrl{ position:relative; height:48px; margin-top:14px; }
  .mrl-l{ position:absolute; left:0; right:0; top:26px; height:2px;
    background:rgba(217,164,65,.28); }
  .mrl-t{ position:absolute; top:0; }
  .mrl-t i{ position:absolute; top:19px; left:0; width:2px; height:16px; background:rgba(237,233,224,.32); transform:translateX(-1px); }
  .mrl-t em{ position:absolute; top:37px; transform:translateX(-50%); font-family:var(--mono); font-style:normal;
    font-size:10px; color:var(--cream-3); white-space:nowrap; }
  .mrl-t em small{ color:var(--gray); margin-left:4px; font-size:9px; letter-spacing:.5px; text-transform:uppercase; }
  .mrl-n{ position:absolute; top:0; }
  .mrl-n i{ position:absolute; top:22.5px; left:0; width:9px; height:9px; border-radius:50%; background:var(--amber);
    transform:translateX(-4.5px); }
  .mrl-n b{ position:absolute; top:2px; transform:translateX(-50%); font-family:var(--mono); font-size:11px;
    color:var(--amber); font-weight:600; white-space:nowrap; }
  @media(max-width:640px){ .mrl-t em small{ display:none; } .mrl-t em, .mrl-n b{ font-size:9.5px; } }

  /* ═══════════ PASADA VISUAL · B — la firma (generado) ═══════════ */
  /* .hero .hero-level gana por especificidad: la regla original viene después en
     la misma hoja y con un solo selector. La línea sube al 19% para cruzar el
     texto del hero — la original, al 38% de una sección que incluye el tablero,
     quedaba detrás del board y por eso nunca se veía. */
  .hero .hero-level{ height:3px; top:19%;
    background:rgba(217,164,65,.55); }
  .hero .hero-level::after{ width:11px; height:11px; top:-4px; }
  .sec-head .kicker{ display:flex; align-items:center; gap:16px; }
  .sec-head .kicker::after{ content:''; flex:1 1 auto; height:2px; min-width:60px;
    background:rgba(217,164,65,.4); }

  /* ═══════════ PASADA VISUAL · B — los gráficos asoman (generado) ═══════════ */
  .mcharts{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:8px; margin:18px 0 4px; }
  .mcharts img{ width:100%; height:88px; object-fit:cover; object-position:left top;
    border:1px solid var(--hair); border-radius:2px; opacity:.88; }
  .mcharts-pie{ grid-column:1/-1; font-family:var(--mono); font-size:10px; letter-spacing:1.4px;
    text-transform:uppercase; color:var(--gray); }
  @media(max-width:640px){ .mcharts{ grid-template-columns:1fr 1fr; } .mcharts img:nth-child(3){ display:none; } }

  /* ═══════════ PASADA VISUAL · C — el ancla de escala (generado) ═══════════ */
  .mbig{ display:flex; align-items:baseline; gap:16px; margin:14px 0 10px; }
  .mbig-n{ font-family:var(--mono); font-size:84px; font-weight:600; color:var(--amber); line-height:.95; letter-spacing:-2px; }
  .mbig-n small{ font-size:20px; color:var(--cream-3); font-weight:400; letter-spacing:0; }
  .mbig-z{ font-family:var(--serif); font-size:26px; font-weight:600; color:var(--cream); }
  .mbig-riel{ position:relative; height:4px; border-radius:2px; margin:6px 0 12px;
    background:rgba(140,149,163,0.30); }
  .mbig-riel i{ position:absolute; top:-4px; width:3px; height:12px; background:var(--cream); border-radius:2px; }
  .mbig-pie{ font-family:var(--mono); font-size:10px; letter-spacing:1px; color:var(--gray); }
/* la tarjeta del home muestra la capa 1 sola; este renglon avisa que en la pagina
   estan las dos lecturas. Sin el, el Termometro parece un numero y son dos. */
.mbig-dos{ font-family:var(--mono); font-size:10px; letter-spacing:1px; color:var(--amber);
  margin-top:5px; opacity:.85; }

  /* ═══════════ LA BITÁCORA (generado) ═══════════ */
  .bit{ margin:clamp(26px,4vw,36px) 0 0; }
  .bit-rot{ font-family:var(--mono); font-size:11px; letter-spacing:2px; text-transform:uppercase;
    color:var(--cream-3); margin-bottom:16px; }
  .bit-lista{ border:1px solid var(--hair); border-radius:2px; background:var(--panel); overflow:hidden; }
  .bit-e{ padding:clamp(18px,2.6vw,24px) clamp(18px,3vw,28px); }
  .bit-e + .bit-e{ border-top:1px solid var(--hair); }
  .bit-cab{ display:flex; flex-wrap:wrap; align-items:baseline; gap:12px; margin-bottom:10px; }
  .bit-cab time{ font-family:var(--mono); font-size:12.5px; color:var(--amber); font-weight:600; letter-spacing:.5px; }
  .bit-sello{ display:inline-flex; align-items:baseline; gap:7px; font-family:var(--mono); font-size:10.5px;
    letter-spacing:1.2px; color:var(--cream-3); border:1px solid var(--hair); border-radius:2px;
    padding:3px 8px; transition:.18s; }
  .bit-sello span{ color:var(--gray); font-size:9.5px; }
  .bit-sello:hover{ color:var(--amber); border-color:rgba(217,164,65,.45); }
  .bit-sello-espera{ color:var(--gray); }
  .bit-sello-espera:hover{ color:var(--gray); border-color:var(--hair); }
  .bit-txt{ font-family:var(--serif); font-size:16.5px; line-height:1.6; color:var(--cream-2); max-width:74ch; }
  .bit-txt p + p{ margin-top:12px; }
  .bit-txt b{ color:var(--cream); font-weight:600; }
  .bit-txt ul{ margin:10px 0 0 18px; }
  .bit-txt li{ margin-bottom:6px; }
  .bit-txt a{ color:var(--amber); border-bottom:1px solid rgba(217,164,65,.3); }
  .bit-mas{ margin-top:14px; font-family:var(--mono); font-size:11px; letter-spacing:1.2px; color:var(--gray); }
  .bit-mas a{ color:var(--cream-3); border-bottom:1px solid var(--hair); }
  .bit-mas a:hover{ color:var(--amber); border-bottom-color:var(--amber); }
  .bit-vacia{ font-size:14.5px; color:var(--gray); font-style:italic; }

  /* ═══════════ EL BLOQUE DE LA JUGADA (generado) ═══════════ */
  .jgd{--pizarra:#121417;--hueso:#EDE9E0;--ambar:#D9A441;--rojo:#C15B52;--cemento:#8C95A3;
    background:var(--pizarra);border:1px solid rgba(140,149,163,.2);padding:28px 26px 24px;
    font-family:'IBM Plex Sans',system-ui,sans-serif;color:var(--hueso)}
  .jgd-top{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;margin-bottom:18px}
  .jgd-n{font-family:'IBM Plex Mono',monospace;font-size:14px;color:var(--cemento)}
  .jgd-chip{font-family:'IBM Plex Mono',monospace;font-size:12px;font-weight:500;
    background:var(--ambar);color:var(--pizarra);padding:6px 10px;text-align:right}
  .jgd-af{font-family:'IBM Plex Sans Condensed','IBM Plex Sans',system-ui,sans-serif;font-weight:700;
    font-size:clamp(28px,5.4vw,44px);line-height:1.06;letter-spacing:-.01em;margin:0 0 18px}
  .jgd-l{font-family:'IBM Plex Mono',monospace;font-size:15px;line-height:1.75;margin:0 0 20px}
  .jgd-l b{color:var(--rojo);font-weight:400}
  .jgd-lam{display:block;width:100%;height:auto;margin:0 0 20px}
  .jgd-btns{display:flex;gap:12px;margin-bottom:12px}
  .jgd-b{flex:1;background:var(--pizarra);color:var(--ambar);border:1px solid var(--ambar);
    padding:14px 10px;font:inherit;font-size:16px;cursor:pointer;transition:background .12s,color .12s}
  .jgd-b:hover{background:rgba(217,164,65,.12)}
  .jgd-b[aria-pressed="true"]{background:var(--ambar);color:var(--pizarra);font-weight:600}
  .jgd-mio{font-family:'IBM Plex Mono',monospace;font-size:14px;color:var(--ambar);margin:0 0 14px}
  .jgd-rep{font-family:'IBM Plex Mono',monospace;font-size:14px;color:var(--cemento);margin:0 0 10px}
  .jgd-porque{width:100%;background:transparent;border:1px solid rgba(140,149,163,.35);color:var(--hueso);
    font:inherit;font-size:14px;padding:10px}
  .jgd-porque::placeholder{color:var(--cemento)}
  .jgd-pie{font-family:'IBM Plex Mono',monospace;font-size:13px;color:var(--cemento);
    margin:16px 0 0;padding-top:14px;border-top:1px solid rgba(140,149,163,.18)}
  .jgd-prox{font-family:'IBM Plex Mono',monospace;font-size:14px;color:var(--cemento);margin:12px 0 0}
  /* 04/09/2026 · la línea regulatoria, al pie y en los tres estados. Viaja DENTRO
     del bloque por el mismo motivo que el CSS y el guión: la nota de Substack se
     lleva el bloque entero, y una condición de lectura que se quedara en el sitio
     no estaría donde está la afirmación. */
  .jgd-legal{font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--cemento);
    margin:14px 0 0;padding-top:12px;border-top:1px solid rgba(140,149,163,.18)}
  .jgd [hidden]{display:none}
  @media(max-width:520px){
    .jgd{padding:20px 18px}
    .jgd-btns{flex-direction:column}
    /* el chip baja de cuerpo y pasa a renglon propio: a 380 px se partia en dos lineas
       y le comia la fila al numero de Jugada, que es lo que dice cual es */
    .jgd-top{flex-direction:column;align-items:stretch;gap:10px}
    .jgd-chip{font-size:10.5px;letter-spacing:-.1px;text-align:left;padding:6px 8px}
  }


  .tbl{ padding:clamp(34px,5vw,64px) 0 0; }
  .tbl-tit{ font-family:var(--cond); font-weight:700; font-size:clamp(34px,6vw,64px);
    line-height:1.02; letter-spacing:-.02em; color:var(--cream); margin:8px 0 16px; max-width:20ch; }
  .tbl-cuenta{ font-family:var(--mono); font-size:clamp(15px,2vw,19px); color:var(--amber); margin-bottom:10px; }
  .tbl-regla{ font-family:var(--mono); font-size:13.5px; line-height:1.7; color:var(--gray); max-width:70ch; }
  .tbl-wrap{ margin:clamp(28px,4vw,48px) 0 0; overflow-x:auto; }
  .tbl-t{ width:100%; border-collapse:collapse; font-family:var(--mono); font-size:13.5px; white-space:nowrap; }
  .tbl-t th{ text-align:left; font-weight:500; color:var(--gray); letter-spacing:.5px;
    border-bottom:1px solid var(--hair); padding:10px 18px 10px 0; }
  .tbl-t td{ padding:12px 18px 12px 0; border-bottom:1px solid var(--hair); color:var(--cream-2); }
  .tbl-t td.act{ color:var(--cream); }
  .tbl-t td.hecho{ white-space:normal; min-width:22ch; }
  .tbl-mal{ color:var(--red); }
  .tbl-curso{ color:var(--amber); }
  .tbl-vacio{ font-family:var(--mono); font-size:14px; color:var(--gray); padding:24px 0; }
  .tbl-nota{ font-family:var(--mono); font-size:13px; color:var(--gray); margin-top:26px;
    border-top:1px solid var(--hair); padding-top:18px; line-height:1.7; max-width:70ch; }

  /* /TCL:ESTILO-GENERADO */

  /* ═══════════ NAV ═══════════ */
  .nav{ position:relative; z-index:10; display:flex; align-items:center; justify-content:space-between;
    padding:22px 0; }
  .brand{ position:relative; font-family:var(--serif); font-weight:600; font-size:21px; letter-spacing:-.3px;
    padding-bottom:8px; display:inline-block; }
  .brand::after{ content:''; position:absolute; left:-8px; right:-8px; bottom:0; height:2px; background:var(--amber); }
  .brand .dot{ position:absolute; bottom:2px; right:14%; width:5px; height:5px; border-radius:50%; background:var(--amber); }
  .nav-links{ display:flex; gap:28px; font-size:14px; color:var(--cream-2); font-weight:500; }
  .nav-links a:hover{ color:var(--amber); }
  @media(max-width:680px){ .nav-links{ display:none; } }

  /* ═══════════ HERO ═══════════ */
  .hero{ position:relative; padding:clamp(40px,7vw,84px) 0 clamp(48px,6vw,72px);
    background:var(--ink);
    overflow:hidden;
  }
  /* el nivel: línea horizontal ámbar que cruza el fondo */
  .hero-level{ position:absolute; left:0; right:0; top:38%; height:2px;
    background:rgba(217,164,65,0.4);
    z-index:0; }
  .hero-level::after{ content:''; position:absolute; left:22%; top:-4px; width:9px; height:9px; border-radius:50%;
    background:var(--amber); }

  .hero-head{ position:relative; z-index:2; max-width:760px; margin-bottom:clamp(32px,5vw,52px); }
  .kicker{ font-family:var(--mono); font-size:12.5px; letter-spacing:2.5px; text-transform:uppercase;
    color:var(--amber); margin-bottom:20px; font-weight:500; }
  h1{ font-family:var(--serif); font-weight:600; font-size:clamp(38px,6vw,66px); line-height:1.04;
    letter-spacing:-1px; }
  h1 .amber{ color:var(--amber); }
  .hero-sub{ margin-top:22px; font-size:clamp(17px,2.2vw,21px); color:var(--cream-2); max-width:620px; line-height:1.5; }
  .hero-sub b{ color:var(--cream); font-weight:600; }

  .author{ display:flex; align-items:center; gap:14px; margin-top:26px; }
  .author-avatar{ width:54px; height:54px; border-radius:50%; overflow:hidden; flex-shrink:0;
    border:1px solid rgba(217,164,65,0.4); background:var(--panel);
    display:flex; align-items:center; justify-content:center; }
  .author-avatar img{ width:100%; height:100%; object-fit:cover; display:block; }
  .author-mono{ font-family:var(--mono); font-size:16px; color:var(--amber); font-weight:600; }
  .author-name{ font-family:var(--serif); font-size:17px; font-weight:600; color:var(--cream); }
  .author-cred{ font-size:13.5px; color:var(--cream-2); margin-top:2px; }

  /* ═══════════ EL TABLERO ═══════════ */
  .board{ position:relative; z-index:2; background:var(--panel);
    border:1px solid var(--hair); border-radius:2px; overflow:hidden; }

  /* franja del clima */
  .climate{ padding:20px clamp(20px,3vw,30px); border-bottom:1px solid var(--hair);
    background:rgba(217,164,65,0.04); display:flex; gap:18px; align-items:flex-start; }
  .climate-tag{ font-family:var(--mono); font-size:11px; letter-spacing:1.5px; text-transform:uppercase;
    color:var(--amber); font-weight:600; white-space:nowrap; padding-top:3px; }
  .climate-txt{ font-family:var(--serif); font-size:clamp(16px,2vw,19px); line-height:1.42; color:var(--cream);
    font-weight:400; }
  .climate-txt em{ font-style:normal; color:var(--amber); }

  /* header del tablero */
  .board-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:14px;
    padding:16px clamp(20px,3vw,30px) 4px; }
  .board-title{ font-family:var(--mono); font-size:12px; letter-spacing:2px; text-transform:uppercase; color:var(--cream-3); padding-top:2px; }
  .board-cadence{ text-align:right; }
  .board-live{ font-family:var(--mono); font-size:11px; color:var(--cream-2); display:flex; align-items:center; gap:7px; justify-content:flex-end; }
  .board-live::before{ content:''; width:6px; height:6px; border-radius:50%; background:var(--amber); }
  .board-cad{ display:block; font-family:var(--mono); font-size:10px; color:var(--gray); margin-top:4px; }

  /* carril */
  .lane{ padding:8px clamp(20px,3vw,30px) 20px; }
  .lane + .lane{ border-top:1px solid var(--hair); }
  .lane-label{ display:flex; align-items:center; gap:11px; padding:16px 0 14px; }
  .lane-for{ font-family:var(--serif); font-size:16px; color:var(--cream); font-weight:500; }
  .lane-who{ font-family:var(--mono); font-size:11px; color:var(--gray); letter-spacing:.5px; }

  .row-asset a, .row-read b a{ border-bottom:1px solid rgba(217,164,65,0.28); transition:.18s; }
  .row-asset a:hover, .row-read b a:hover{ color:var(--amber); border-bottom-color:var(--amber); }

  /* fila de activo */
  .row{ display:grid; grid-template-columns: 92px 1fr auto; gap:clamp(14px,2.5vw,26px); align-items:center;
    padding:15px 16px; background:var(--ink); border:1px solid var(--hair); border-radius:2px; margin-bottom:8px; }
  .row:last-child{ margin-bottom:0; }
  .row-asset{ font-family:var(--serif); font-size:23px; font-weight:600; color:var(--cream); letter-spacing:-.3px; }
  .row-asset span{ display:block; font-family:var(--mono); font-size:10px; color:var(--gray); letter-spacing:.5px;
    font-weight:400; margin-top:2px; text-transform:uppercase; }
  .row-read{ font-size:14.5px; color:var(--cream-2); line-height:1.45; }
  .row-read .lvl{ font-family:var(--mono); color:var(--amber); font-weight:600; }
  .row-read b{ color:var(--cream); font-weight:600; }
  .row-state{ font-family:var(--mono); font-size:11px; letter-spacing:1px; text-transform:uppercase;
    padding:6px 12px; border-radius:2px; white-space:nowrap; font-weight:500; }
  .st-wait{ color:var(--amber); border:1px solid rgba(217,164,65,0.4); background:rgba(217,164,65,0.06); }
  .st-testing{ color:var(--cream); background:var(--amber); }
  .st-empty{ color:var(--gray); border:1px dashed var(--hair); }

  .row-full{ grid-template-columns:1fr; }

  /* la banda: el índice entre dos bordes */
  .mini-band{ background:var(--ink); border:1px solid var(--hair); border-radius:2px;
    padding:26px 18px 18px; margin-bottom:8px; }
  .mini-rail{ position:relative; height:78px; margin:14px 4px 6px; }
  .mb-edge{ position:absolute; left:0; right:0; height:1px; background:rgba(217,164,65,0.4); }
  .mb-edge.top{ top:0; } .mb-edge.bot{ bottom:0; }
  .mb-edge span{ position:absolute; right:0; font-family:var(--mono); font-size:12px; color:var(--amber); font-weight:600; }
  .mb-edge.top span{ top:-19px; } .mb-edge.bot span{ top:5px; }
  .mb-edge em{ position:absolute; left:0; font-style:normal; font-family:var(--mono); font-size:9.5px;
    letter-spacing:.8px; text-transform:uppercase; color:var(--gray); }
  .mb-edge.top em{ top:-18px; } .mb-edge.bot em{ top:6px; }
  .mb-edge.mid em{ top:6px; } .mb-edge.mid span{ top:5px; }
  .mini-band .mb-nota{ font-family:var(--mono); font-size:10px; padding-top:4px; letter-spacing:.6px; text-transform:uppercase;
    color:var(--gray); margin-top:10px; }
  .mb-now{ position:absolute; left:0; right:0; top:66%; height:1px; background:rgba(237,233,224,0.3); }
  .mb-now i{ position:absolute; left:50%; top:-3px; width:7px; height:7px; margin-left:-3.5px; border-radius:50%;
    background:var(--cream); }
  .mb-now span{ position:absolute; left:50%; top:-24px; transform:translateX(-50%);
    font-family:var(--mono); font-size:12.5px; font-weight:600; color:var(--cream); }
  .mini-band .row-read{ margin-top:12px; }

  /* el filo: el precio parado sobre la línea (nuevo #19) */
  .mini-rail.filo{ height:62px; }
  .mb-line{ position:absolute; left:0; right:0; top:62%; height:1px; background:rgba(217,164,65,0.4); }
  .mb-line em{ position:absolute; left:0; top:7px; font-style:normal; font-family:var(--mono); font-size:9.5px;
    letter-spacing:.8px; text-transform:uppercase; color:var(--gray); }
  .mb-line span{ position:absolute; right:0; top:6px; font-family:var(--mono); font-size:12px; color:var(--amber); font-weight:600; }
  .mb-dot{ position:absolute; left:50%; top:62%; margin:-4px 0 0 -4px; width:8px; height:8px; border-radius:50%;
    background:var(--cream); }
  .mb-lab{ position:absolute; left:50%; top:62%; transform:translate(-50%,-26px); white-space:nowrap;
    font-family:var(--mono); font-size:12.5px; font-weight:600; color:var(--cream); }

  /* la curva del miedo: los cuatro plazos subiendo entre los dos bordes (nuevo #22) */
  .mini-rail.curva{ height:104px; margin-bottom:24px; }
  .mb-curve{ position:absolute; left:0; top:0; width:100%; height:100%; overflow:visible; }
  .mb-curve polyline{ fill:none; stroke:rgba(217,164,65,0.45); stroke-width:1.5; }
  .mb-pt{ position:absolute; width:8px; height:8px; margin:-4px 0 0 -4px; border-radius:50%;
    background:var(--cream); }
  .mb-pt b{ position:absolute; left:50%; top:-22px; transform:translateX(-50%); white-space:nowrap;
    font-family:var(--mono); font-size:12.5px; font-weight:600; color:var(--cream); }
  .mb-pt i{ position:absolute; left:50%; top:11px; transform:translateX(-50%); white-space:nowrap;
    font-style:normal; font-family:var(--mono); font-size:9.5px; letter-spacing:.8px;
    text-transform:uppercase; color:var(--gray); }

  /* pie del tablero: el gancho del tier */
  .board-foot{ padding:18px clamp(20px,3vw,30px); border-top:1px solid var(--hair);
    background:rgba(217,164,65,0.04); display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; }
  .board-foot-txt{ font-size:14px; color:var(--cream-2); line-height:1.4; }
  .board-foot-txt b{ color:var(--amber); font-weight:600; }
  .board-foot a{ font-family:var(--mono); font-size:12px; letter-spacing:1px; text-transform:uppercase;
    color:var(--amber); border:1px solid rgba(217,164,65,0.4); padding:9px 16px; border-radius:2px; white-space:nowrap; }
  .board-foot a:hover{ background:var(--amber); color:var(--navy); }

  /* reveal al hacer scroll */
  .rv{ opacity:0; transform:translateY(16px); transition:opacity .7s cubic-bezier(.2,.7,.3,1), transform .7s cubic-bezier(.2,.7,.3,1); }
  .rv.on{ opacity:1; transform:none; }
  @media(prefers-reduced-motion:reduce){
    .rv{ opacity:1; transform:none; transition:none; }
    html{ scroll-behavior:auto; }
  }

  @media(max-width:640px){
    .row{ grid-template-columns: 70px 1fr; }
    .row-state{ grid-column:2; justify-self:start; margin-top:4px; }
    .climate{ flex-direction:column; gap:8px; }
    .board-head{ flex-direction:column; }
    .board-cadence{ text-align:left; }
    .board-live{ justify-content:flex-start; }
    .mini-rail{ height:92px; }
  }

  /* ═══════════ LOS TRES ACCESOS (03/09/2026) ═══════════ */
  /* Tres, no doce. La home dejó de ser un índice de todo lo que existe y pasó a ser
     la Jugada + tres puertas. Lo que salió sigue existiendo, a un clic. */
  .accesos{ padding:clamp(40px,6vw,72px) 0; }
  .acc-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px;
    background:var(--hair); border:1px solid var(--hair); }
  .acc{ display:flex; flex-direction:column; gap:10px; background:var(--ink);
    padding:clamp(22px,3vw,32px); transition:background .15s; }
  .acc:hover{ background:var(--panel); }
  .acc-k{ font-family:var(--mono); font-size:11px; letter-spacing:2px; color:var(--amber); }
  .acc h3{ font-family:var(--cond); font-weight:700; font-size:clamp(24px,3vw,32px);
    line-height:1.05; letter-spacing:-.01em; color:var(--cream); }
  .acc p{ font-size:14.5px; line-height:1.55; color:var(--cream-2); flex:1; }
  .acc-cta{ font-family:var(--mono); font-size:12.5px; color:var(--amber); margin-top:6px; }
  @media(max-width:820px){ .acc-grid{ grid-template-columns:1fr; } }

  /* ═══════════ LA FRANJA (03/09/2026) ═══════════ */
  /* Quién escribe, el mail y el archivo. El mail va acá y no arriba: se pide DESPUÉS
     de marcar, no antes. Reemplaza al formulario de suscripción como bloque propio. */
  .franja{ border-top:1px solid var(--hair); padding:clamp(34px,5vw,56px) 0 clamp(20px,3vw,32px); }
  .franja-in{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(24px,4vw,52px); align-items:start; }
  .quien{ display:flex; gap:14px; align-items:flex-start; }
  .quien img{ width:46px; height:46px; border-radius:50%; object-fit:cover; flex-shrink:0;
    border:1px solid rgba(217,164,65,.4); }
  .quien p{ font-size:15px; line-height:1.55; color:var(--cream-2); }
  .quien-txt{ min-width:0; }
  /* 04/09/2026 · la línea regulatoria. Cemento, mono, y sin acento: no es una
     afirmación del sitio, es la condición bajo la que se lee todo lo de arriba. */
  .quien-reg{ font-family:var(--mono); font-size:11.5px; letter-spacing:.4px;
    line-height:1.5; color:var(--gray); margin-top:10px; }
  .mail-t{ font-size:15px; line-height:1.55; color:var(--cream-2); margin-bottom:12px; }
  .mail-row{ display:flex; gap:10px; }
  .mail-row input{ flex:1; min-width:0; background:var(--panel); border:1px solid var(--hair);
    color:var(--cream); font:inherit; font-size:15px; padding:12px 14px; }
  .mail-row input::placeholder{ color:var(--gray); }
  .mail-row button{ background:var(--amber); color:var(--navy); border:0; font:inherit;
    font-weight:600; font-size:15px; padding:12px 20px; cursor:pointer; }
  .mail-row button:hover{ background:var(--amber-hover); }
  .mail-est{ font-family:var(--mono); font-size:13px; color:var(--amber); margin-top:10px; min-height:1em; }
  .franja-arch{ grid-column:1/-1; font-family:var(--mono); font-size:13px; color:var(--gray);
    border-top:1px solid var(--hair); padding-top:18px; margin-top:6px; }
  .franja-arch a:hover{ color:var(--amber); }
  @media(max-width:760px){ .franja-in{ grid-template-columns:1fr; } .mail-row{ flex-direction:column; } }

  /* ═══════════ /por-que-lo-digo/ (03/09/2026) ═══════════ */
  .pql{ padding:clamp(34px,5vw,64px) 0 0; }
  .pql-h1{ font-family:var(--cond); font-weight:700; font-size:clamp(40px,7vw,72px);
    line-height:1; letter-spacing:-.02em; color:var(--cream); margin:6px 0 14px; }
  .pql-sub{ font-size:clamp(16px,2vw,19px); line-height:1.5; color:var(--cream-2); max-width:62ch; }

  /* La portada: el bloque de la Jugada ocupa la primera pantalla entera. */
  .portada{ padding:clamp(18px,3vw,30px) 0 clamp(24px,4vw,44px); }