/* Herramientas · mesa de trabajo (tapete de corte), prototipo en beta. Solo CSS: se activa con body.tools-bench.
 * Cuadricula: 24 px menor, 120 px mayor. Marcas de esquina, regla y sello BETA. */
body.tools-bench{--bn-minor:rgba(231,190,114,.065);--bn-major:rgba(231,190,114,.15);--bn-mark:var(--brass,#c9963d);--bn-dim:var(--brass-dim,#9c7530);
  background-color:var(--ink,#15130f);
  background-image:linear-gradient(var(--bn-major) 1px,transparent 1px),linear-gradient(90deg,var(--bn-major) 1px,transparent 1px),linear-gradient(var(--bn-minor) 1px,transparent 1px),linear-gradient(90deg,var(--bn-minor) 1px,transparent 1px);
  background-size:120px 120px,120px 120px,24px 24px,24px 24px;background-position:-1px -1px}
body.tools-bench .cr-hero,body.tools-bench .cr-sec.alt{background:transparent}
body.tools-bench .cr-sec:not(.alt){background:rgba(31,27,19,.78);border-top:1px dashed var(--bn-dim)}

/* Franja de entorno beta + regla en el borde inferior de la cabecera */
body.tools-bench .cr-hero{position:relative;border-bottom:1px solid var(--bn-major);padding-top:78px}
body.tools-bench .cr-hero::before{content:"\25B2  ENTORNO BETA \00B7  PROTOTIPO EN PRUEBAS \00B7  PUEDE CAMBIAR SIN AVISO";position:absolute;top:0;left:0;right:0;height:30px;display:flex;align-items:center;padding:0 24px;
  font:400 .66rem/1 'Space Mono',monospace;letter-spacing:.16em;text-transform:uppercase;color:var(--brass-light,#e7be72);background:rgba(21,19,15,.9);border-bottom:1px dashed var(--bn-dim);white-space:nowrap;overflow:hidden}
html[lang="en"] body.tools-bench .cr-hero::before{content:"\25B2  BETA ENVIRONMENT \00B7  PROTOTYPE UNDER TEST \00B7  MAY CHANGE WITHOUT NOTICE"}
body.tools-bench .cr-hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:14px;pointer-events:none;
  background:repeating-linear-gradient(90deg,var(--bn-mark) 0 1px,transparent 1px 120px) left bottom/100% 14px no-repeat,repeating-linear-gradient(90deg,var(--bn-dim) 0 1px,transparent 1px 24px) left bottom/100% 7px no-repeat;opacity:.75}
body.tools-bench .cr-hero .gd-wrap{position:relative}
/* Sello BETA, inclinado como un sello de taller */
body.tools-bench .cr-hero .gd-wrap::after{content:"BETA";position:absolute;top:2px;right:18px;transform:rotate(-7deg);padding:7px 14px 6px;border:2px dashed var(--bn-mark);border-radius:3px;color:var(--bn-mark);
  font:700 .95rem/1 'Space Mono',monospace;letter-spacing:.3em;text-indent:.3em;opacity:.8;pointer-events:none}

/* Mesa de trabajo: marco con marcas de esquina y pestana rotulada alrededor de la herramienta */
body.tools-bench .cr-sec.alt{padding-top:62px;padding-bottom:58px}
body.tools-bench .cr-sec.alt>.cr-wrap,body.tools-bench .cr-sec.alt>.gd-wrap{position:relative}
body.tools-bench .cr-sec.alt>.cr-wrap::before,body.tools-bench .cr-sec.alt>.gd-wrap::before{content:"MESA DE TRABAJO \00B7  BETA";position:absolute;top:-36px;left:18px;padding:5px 11px 4px;
  font:400 .66rem/1 'Space Mono',monospace;letter-spacing:.18em;color:var(--brass-light,#e7be72);background:var(--ink,#15130f);border:1px dashed var(--bn-dim);z-index:1}
html[lang="en"] body.tools-bench .cr-sec.alt>.cr-wrap::before,html[lang="en"] body.tools-bench .cr-sec.alt>.gd-wrap::before{content:"WORKBENCH \00B7  BETA"}
body.tools-bench .cr-sec.alt>.cr-wrap::after,body.tools-bench .cr-sec.alt>.gd-wrap::after{content:"";position:absolute;inset:-12px 6px;pointer-events:none;
  background:linear-gradient(var(--bn-mark),var(--bn-mark)) 0 0/22px 2px,linear-gradient(var(--bn-mark),var(--bn-mark)) 0 0/2px 22px,
  linear-gradient(var(--bn-mark),var(--bn-mark)) 100% 0/22px 2px,linear-gradient(var(--bn-mark),var(--bn-mark)) 100% 0/2px 22px,
  linear-gradient(var(--bn-mark),var(--bn-mark)) 0 100%/22px 2px,linear-gradient(var(--bn-mark),var(--bn-mark)) 0 100%/2px 22px,
  linear-gradient(var(--bn-mark),var(--bn-mark)) 100% 100%/22px 2px,linear-gradient(var(--bn-mark),var(--bn-mark)) 100% 100%/2px 22px;background-repeat:no-repeat;opacity:.8}

/* Indice de herramientas: tarjetas como laminas de prototipo */
body.tools-bench .hub-card{position:relative;border:1px dashed var(--bn-dim);background:rgba(21,19,15,.94)}
body.tools-bench .hub-card::before{content:"BETA";position:absolute;top:10px;right:10px;z-index:2;padding:4px 8px 3px;font:700 .62rem/1 'Space Mono',monospace;letter-spacing:.22em;text-indent:.22em;color:var(--brass-light,#e7be72);background:rgba(21,19,15,.88);border:1px dashed var(--bn-mark);border-radius:2px}
body.tools-bench .hub-thumb::after{border-bottom:1px dashed var(--bn-dim)}
body.tools-bench .gd-cta{border:1px dashed var(--bn-dim);background:rgba(21,19,15,.9)}

@media (max-width:760px){
  body.tools-bench .cr-hero{padding-top:64px}
  body.tools-bench .cr-hero::before{padding:0 18px;font-size:.58rem;letter-spacing:.1em}
  body.tools-bench .cr-hero::before{content:"\25B2  ENTORNO BETA \00B7  PROTOTIPO EN PRUEBAS"}
  html[lang="en"] body.tools-bench .cr-hero::before{content:"\25B2  BETA ENVIRONMENT \00B7  PROTOTYPE UNDER TEST"}
  body.tools-bench .cr-hero .gd-wrap::after{display:none}
  body.tools-bench .cr-sec.alt>.cr-wrap::before,body.tools-bench .cr-sec.alt>.gd-wrap::before{left:12px}
  body.tools-bench .cr-sec.alt>.cr-wrap::after,body.tools-bench .cr-sec.alt>.gd-wrap::after{inset:-10px 4px}
}

/* Herramientas conectadas: tarjeta "siguiente" en la cabecera y franja "mas herramientas" al final */
.tn-row{display:flex;flex-wrap:wrap;align-items:center;gap:18px 32px;margin:0 0 16px}
.tn-row h1{margin:0!important;flex:1 1 380px}
.tn-card{flex:0 1 340px;display:flex;flex-direction:column;gap:8px;align-items:flex-start;padding:16px 18px;border:1px solid var(--brass,#c9963d);border-radius:4px;background:linear-gradient(135deg,rgba(201,150,61,.16),rgba(201,150,61,.04))}
.tn-tag{display:inline-flex;align-items:center;font-family:'Space Mono',monospace;font-size:.66rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ink,#15130f);background:var(--brass-light,#e7be72);padding:4px 9px;border-radius:99px}
.tn-txt{margin:0!important;font-family:'Fraunces',Georgia,serif;font-size:1.15rem;line-height:1.3;color:var(--text-on-ink,#f2ead9);max-width:none!important}
.tn-txt strong{font-weight:600}
.tn-cta{font-weight:700;font-size:.9rem;color:var(--brass-light,#e7be72);text-decoration:underline;text-underline-offset:4px}
.tn-cta:hover{color:var(--text-on-ink,#f2ead9)}
.tn-sec h2{margin:0 0 20px}
.tn-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:18px}
.tn-tool{display:flex;flex-direction:column;background:rgba(21,19,15,.94);border:1px dashed var(--brass-dim,#9c7530);border-radius:6px;overflow:hidden;text-decoration:none;color:var(--text-on-ink,#f2ead9);transition:border-color .2s,transform .2s}
.tn-tool:hover,.tn-tool:focus-visible{border-color:var(--brass,#c9963d);transform:translateY(-2px)}
.tn-thumb{display:block;aspect-ratio:1200/630;background:var(--ink,#15130f);border-bottom:1px dashed var(--brass-dim,#9c7530)}
.tn-thumb img{display:block;width:100%;height:100%;object-fit:cover}
.tn-body{display:flex;flex-direction:column;gap:6px;padding:14px 16px 16px;flex:1}
.tn-body strong{font-family:'Fraunces',Georgia,serif;font-weight:600;font-size:1.12rem;line-height:1.2}
.tn-body span{font-size:.9rem;line-height:1.5;color:var(--text-on-ink-muted,#b7ac93)}
.tn-body em{margin-top:auto;font-style:normal;font-family:'Space Mono',monospace;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--brass-light,#e7be72)}
.tn-all{margin:18px 0 0!important}
.tn-all a{color:var(--brass-light,#e7be72)}
@media (max-width:760px){.tn-card{flex-basis:100%}}
@media (prefers-reduced-motion:reduce){.tn-tool{transition:none}.tn-tool:hover{transform:none}}