    :root{--bg:#080c10;--deep:#05080b;--panel:#0d1319;--line:#27313b;--soft:#182129;--text:#f5f7f8;--muted:#8b96a3;--acid:#b7ff32;--sans:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;--mono:"SFMono-Regular",Consolas,"Liberation Mono",monospace;color-scheme:dark}
    *{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}button,input{font:inherit}a{color:inherit;text-decoration:none}.shell{width:min(1180px,calc(100% - 44px));margin:auto}
    body:before{content:"";position:fixed;inset:0;z-index:-3;background:radial-gradient(ellipse 65% 40% at 55% -5%,#6f8da910,transparent 72%),linear-gradient(180deg,#090e13 0,#070b0f 48%,#080c10 100%)}
    header{position:fixed;inset:14px 0 auto;z-index:20;pointer-events:none}nav{height:62px;display:flex;align-items:center;justify-content:space-between;padding:0 11px 0 12px;border:1px solid transparent;border-radius:13px;pointer-events:auto;transition:width .35s ease,background .25s,border-color .25s,box-shadow .25s}.brand{display:flex;align-items:center;gap:11px;font-weight:850;letter-spacing:-.055em}.brand-word{font-size:15px}.brand-word b{color:var(--acid);font-weight:850}.brand-mark{position:relative;display:grid;place-items:center;width:34px;height:34px;border:2px solid #edf2f5;color:#f7fafb;font:900 24px/1 var(--sans);letter-spacing:-.1em}.brand-mark:after{content:"";position:absolute;width:8px;height:8px;right:3px;top:3px;background:var(--acid);box-shadow:0 0 14px #b7ff3266}.brand-mark span{transform:translate(-1px,1px)}.links{display:flex;align-items:center;gap:27px;color:#9aa5b1;font-size:12px}.links a{transition:color .2s}.links a:not(.submit-link){position:relative;padding:9px 2px}.links a:not(.submit-link):after{content:"";position:absolute;left:0;right:100%;bottom:2px;height:1px;background:var(--acid);transition:right .25s}.links a:hover,.links a.active{color:#fff}.links a.active:after{right:0}.links .submit-link{padding:10px 15px;border:1px solid var(--line);border-radius:7px;color:#fff;background:#ffffff03}.submit-link b{color:var(--acid);margin-left:8px}.menu{display:none;border:0;background:none;padding:8px}.menu i{display:block;width:22px;height:1px;background:#fff;margin:6px}header.scrolled nav{width:min(790px,calc(100% - 28px));background:#080d12e8;backdrop-filter:blur(18px);border-color:#b7ff3229;box-shadow:0 18px 55px #0009}
    .hero{min-height:790px;padding-top:154px;position:relative;display:grid;grid-template-columns:1.07fr .93fr;gap:68px;align-items:center}.hero-art{--holo-x:50%;--holo-y:50%;position:absolute;top:64px;bottom:0;left:calc((100vw - 100%)/-2);right:calc((100vw - 100%)/-2);z-index:-1;overflow:hidden;pointer-events:none}.hero-word{position:absolute;left:50%;top:51%;width:104vw;text-align:center;transform:translate(-50%,-50%) scaleX(1.04);font:900 clamp(180px,25vw,390px)/.76 var(--sans);letter-spacing:-.105em;white-space:nowrap;color:#f4f7fa08}.hero-word:before{content:"STICKYBIT";position:absolute;inset:0;background:linear-gradient(110deg,transparent 26%,#ffffff10 35%,#ffffff5a 44%,#dcecff32 48%,#b7ff325c 53%,#f7fff05f 57%,#9bcad524 63%,transparent 72%);background-size:185% 185%;background-position:var(--holo-x) var(--holo-y);-webkit-background-clip:text;background-clip:text;color:transparent;mix-blend-mode:screen}.hero-art small{position:absolute;right:4%;top:9%;color:#b7ff324d;font:500 8px var(--mono);letter-spacing:.3em;writing-mode:vertical-rl}
    .eyebrow,.section-id{font:500 10px var(--mono);letter-spacing:.18em;text-transform:uppercase;color:#91a0ae}.eyebrow{display:flex;align-items:center;gap:10px;margin-bottom:28px}.eyebrow i{width:7px;height:7px;border-radius:50%;background:var(--acid);box-shadow:0 0 13px var(--acid);animation:pulse 2s infinite}.hero h1{font-size:clamp(52px,6.3vw,82px);line-height:.97;letter-spacing:-.07em;margin:0 0 25px;font-weight:760}.hero h1 span{color:transparent;-webkit-text-stroke:1px #edf3f677}.hero h1 em{font-style:normal;color:var(--acid)}.lead{max-width:610px;color:#9aa4ae;font-size:15px;line-height:1.75;margin:0 0 34px}.actions{display:flex;gap:10px;flex-wrap:wrap}.btn{min-height:47px;display:inline-flex;align-items:center;justify-content:center;gap:28px;padding:0 19px;border-radius:6px;border:1px solid var(--line);background:transparent;color:#d7dde2;font-weight:750;font-size:12px;cursor:pointer;transition:transform .2s,border-color .2s,background .2s}.btn:hover{transform:translateY(-2px);border-color:#b7ff326b}.btn.primary{background:var(--acid);border-color:var(--acid);color:#071008}.btn.primary:hover{background:#c7ff61}.terminal{background:#0b1116ee;border:1px solid #b7ff322b;border-radius:10px;overflow:hidden;box-shadow:0 34px 95px #0009;transform:perspective(900px) rotateY(-2.5deg)}.term-head{height:44px;border-bottom:1px solid var(--soft);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 14px;color:#6c7782;font:9px var(--mono)}.dots{display:flex;gap:6px}.dots i{width:7px;height:7px;border-radius:50%;background:#3a454f}.dots i:first-child{background:var(--acid)}.term-head em{font-style:normal;text-align:right}.term-body{min-height:290px;padding:29px;font:11px/2 var(--mono);color:#c9d0d6}.term-body p{margin:0}.term-body b,.term-body strong{color:var(--acid);font-weight:500}.term-body .dim{color:#717d88;margin-top:16px}.scan{height:1px;background:#202a32;margin:16px 0;overflow:hidden}.scan:after{content:"";display:block;width:35%;height:1px;background:linear-gradient(90deg,var(--acid),#fff);box-shadow:0 0 8px var(--acid);animation:scan 2.5s ease-in-out infinite}.caret{display:inline-block;width:7px;height:13px;background:var(--acid);vertical-align:middle;animation:blink 1s steps(1) infinite}.hero-stats{grid-column:1/-1;display:flex;border-top:1px solid var(--soft)}.hero-stats div{display:flex;align-items:baseline;gap:9px;margin-right:40px;padding:22px 40px 0 0;border-right:1px solid var(--soft)}.hero-stats div:last-child{border:0}.hero-stats strong{color:var(--acid);font:500 20px var(--mono)}.hero-stats span{color:#697581;font:9px var(--mono);letter-spacing:.1em;text-transform:uppercase}
    .ticker{width:100%;overflow:hidden;margin-top:64px;border-block:1px solid var(--soft);padding:15px 0;background:#070b0f}.ticker-track{display:flex;width:max-content;animation:ticker 29s linear infinite;color:#77838e;font:500 9px var(--mono);letter-spacing:.2em;will-change:transform}.ticker-group{width:100vw;min-width:max(100vw,930px);display:flex;align-items:center;justify-content:space-around;gap:24px;flex-shrink:0}.ticker i{color:var(--acid);font-style:normal}.ticker:hover .ticker-track{animation-play-state:paused}
    .directory{padding:110px 0 125px}.section-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:40px}.section-head h2{font-size:clamp(36px,5vw,53px);letter-spacing:-.055em;margin:13px 0 0}.section-head p{max-width:355px;color:#84909a;font-size:12px;line-height:1.7;margin:0 0 5px}.demo-note{display:inline-block;margin-top:10px;color:#5d6974;font:9px var(--mono)}
    .controls{display:grid;grid-template-columns:minmax(270px,1fr) auto;gap:13px;align-items:center;padding:15px 0;border-block:1px solid var(--soft);margin-bottom:22px}.search{height:44px;display:flex;align-items:center;gap:9px;padding:0 13px;background:#0a1015;border:1px solid var(--line);border-radius:6px}.search:focus-within{border-color:#b7ff3266}.search svg{width:15px;fill:none;stroke:#7e8a96;stroke-width:1.7}.search input{flex:1;min-width:0;background:none;border:0;outline:0;color:#fff;font-size:12px}.search kbd{border:1px solid var(--line);border-radius:4px;padding:2px 6px;color:#74808a;font:9px var(--mono)}.filters{display:flex;gap:4px;overflow:auto}.filter{height:37px;padding:0 11px;border:0;border-radius:5px;background:transparent;color:#7f8b96;font:500 10px var(--mono);cursor:pointer;white-space:nowrap}.filter:hover,.filter.active{background:var(--acid);color:#071008}.tools{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.card{min-height:316px;padding:23px;border:1px solid var(--soft);border-radius:9px;background:linear-gradient(145deg,#10171d,#0b1116);display:flex;flex-direction:column;position:relative;overflow:hidden;cursor:pointer;transition:transform .25s,border-color .25s,box-shadow .25s;animation:card-in .45s both}.card:before{content:"";position:absolute;inset:0;background:radial-gradient(350px circle at var(--x,50%) var(--y,50%),#b7ff3217,transparent 45%);opacity:0;transition:.25s}.card:hover{transform:translateY(-5px);border-color:#b7ff324a;box-shadow:0 20px 55px #0006}.card:hover:before{opacity:1}.card>*{position:relative;z-index:1}.card-top,.card-foot{display:flex;align-items:center;justify-content:space-between}.icon{display:grid;place-items:center;width:44px;height:44px;border:1px solid #b7ff322e;border-radius:7px;background:#b7ff3209;color:var(--acid);font:600 13px var(--mono)}.repo-arrow{display:grid;place-items:center;width:29px;height:29px;border:1px solid var(--line);border-radius:50%;color:var(--acid);transition:.25s}.card:hover .repo-arrow{transform:rotate(45deg);background:var(--acid);color:#071008}.card-main{padding-top:32px;flex:1}.card h3{font-size:20px;letter-spacing:-.035em;margin:0 0 10px}.card p{color:#89949e;font-size:11px;line-height:1.7;margin:0}.tags{display:flex;gap:5px;flex-wrap:wrap;margin-top:17px}.tag{padding:4px 7px;border:1px solid var(--soft);border-radius:4px;color:#74808b;font:8px var(--mono);text-transform:uppercase}.card-foot{border-top:1px solid var(--soft);padding-top:15px;margin-top:20px}.author{display:flex;align-items:center;gap:8px;color:#98a3ad;font:9px var(--mono)}.avatar{display:grid;place-items:center;width:23px;height:23px;border-radius:50%;background:#202a32;color:#dae0e5;font-style:normal;font-size:8px}.lang{color:#727e89;font:9px var(--mono)}.lang i{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--acid);margin-right:6px}.empty{display:none;text-align:center;padding:80px;border:1px dashed var(--line);border-radius:9px;color:#83909b}.empty b{display:block;color:var(--acid);font:500 11px var(--mono);margin-bottom:10px}
    .manifesto{padding-bottom:125px}.manifesto-card{padding:66px;border-radius:12px;background:#f2f5f7;color:#0b1116;position:relative;overflow:hidden}.manifesto-card:before{content:"STICKYBIT";position:absolute;right:-25px;top:-60px;color:#10182008;font:900 145px var(--sans);letter-spacing:-.1em;white-space:nowrap}.manifesto-card:after{content:"";position:absolute;right:8%;top:-30%;width:190px;height:190%;background:linear-gradient(110deg,transparent,#b7ff321d,transparent);transform:rotate(18deg)}.manifesto-card .section-id{color:#66727d}.statement{position:relative;z-index:1;max-width:950px;margin:35px 0 65px;font-size:clamp(31px,4.4vw,55px);line-height:1.14;letter-spacing:-.055em}.statement strong{font-weight:700;background:linear-gradient(transparent 70%,#b7ff32 70%)}.principles{position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,1fr);gap:40px;border-top:1px solid #10182024;padding-top:30px}.principles span{font:500 9px var(--mono);color:#687580}.principles h3{font-size:14px;margin:18px 0 8px}.principles p{font-size:11px;line-height:1.65;color:#66737e;margin:0}
    .contribute{padding-bottom:115px}.contribute-inner{display:grid;grid-template-columns:1.15fr .85fr;gap:75px;align-items:end;padding:85px 0;border-block:1px solid var(--soft)}.contribute h2{font-size:clamp(45px,6vw,72px);line-height:1.03;letter-spacing:-.065em;margin:18px 0 0}.contribute h2 em{font-style:normal;color:var(--acid)}.contribute-copy p{max-width:400px;color:#87939d;font-size:13px;line-height:1.75;margin:0 0 26px}.btn.light{background:#f0f4f6;color:#071008;border-color:#f0f4f6}.code-note{text-align:center;color:#46525d;font:9px var(--mono);padding-top:28px}footer{min-height:96px;display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--soft);color:#66727d;font-size:9px}footer .foot-links{display:flex;gap:22px}footer a:hover{color:var(--acid)}
    dialog{width:min(565px,calc(100% - 28px));padding:0;border:1px solid #b7ff323d;border-radius:11px;background:#0f161d;color:var(--text);box-shadow:0 28px 100px #000d}dialog::backdrop{background:#030609d6;backdrop-filter:blur(8px)}.modal-close{position:absolute;right:17px;top:17px;width:33px;height:33px;border:1px solid var(--line);border-radius:50%;background:#151e25;color:#fff;font-size:18px;cursor:pointer}.modal{padding:39px}.modal .icon{margin-bottom:26px}.modal h2{font-size:33px;letter-spacing:-.05em;margin:0 0 8px}.modal-author{color:var(--acid);font:10px var(--mono)}.modal>p{color:#98a3ad;font-size:12px;line-height:1.8;margin:23px 0}.meta{display:grid;grid-template-columns:repeat(3,1fr);border-block:1px solid var(--soft);margin:26px 0}.meta div{padding:15px 0}.meta span{display:block;color:#707c87;font:8px var(--mono);text-transform:uppercase;margin-bottom:6px}.meta strong{font:500 11px var(--mono)}.modal-actions{display:flex;gap:9px}.modal-actions .btn{flex:1}
    @keyframes pulse{50%{opacity:.4;box-shadow:0 0 4px var(--acid)}}@keyframes scan{from{transform:translateX(-100%)}to{transform:translateX(390%)}}@keyframes blink{50%{opacity:0}}@keyframes ticker{to{transform:translateX(-50%)}}@keyframes card-in{from{opacity:0;transform:translateY(12px)}}
    @media(max-width:900px){.hero{grid-template-columns:1fr;gap:45px;padding-bottom:60px}.terminal{width:min(100%,620px);transform:none}.tools{grid-template-columns:repeat(2,1fr)}.manifesto-card{padding:48px}.principles{gap:24px}.hero-word{font-size:38vw}}
    @media(max-width:650px){.shell{width:calc(100% - 28px)}nav{height:60px;position:relative}header.scrolled nav{width:calc(100% - 28px)}.links{display:none;position:fixed;inset:82px 14px auto;background:#080d12f5;backdrop-filter:blur(18px);padding:18px;flex-direction:column;align-items:stretch;border:1px solid #b7ff3226;border-radius:10px;box-shadow:0 20px 60px #0009}.links.open{display:flex}.links a:not(.submit-link){padding:12px}.menu{display:block;position:fixed;right:22px;top:26px;z-index:30}.hero{padding-top:120px}.hero>*{min-width:0}.hero h1{font-size:clamp(42px,12.5vw,49px)}.lead{max-width:100%}.actions{display:grid;grid-template-columns:1fr}.actions .btn{width:100%;gap:16px}.terminal{width:100%;max-width:100%}.hero-stats{width:100%;justify-content:space-between;overflow:hidden}.hero-stats div{display:block;flex:1;min-width:0;margin-right:0;padding-right:10px}.hero-stats span{display:block;margin-top:6px}.ticker{margin-top:38px}.ticker-group{min-width:780px}.section-head{display:block}.section-head p{margin-top:18px}.controls{grid-template-columns:1fr}.tools{grid-template-columns:1fr}.directory{padding:84px 0 95px}.manifesto{padding-bottom:95px}.manifesto-card{padding:35px 24px}.manifesto-card:before{font-size:70px}.principles{grid-template-columns:1fr;gap:24px}.principles article{padding-bottom:22px;border-bottom:1px solid #111a2226}.contribute-inner{grid-template-columns:1fr;gap:40px;padding:70px 0}footer{padding:27px 0;flex-wrap:wrap;gap:20px}footer p{order:3;flex-basis:100%}.modal{padding:34px 23px 24px}.modal-actions{flex-direction:column}.brand-word{font-size:14px}}
    @media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}
/* Logo en SVG */
.brand-mark{display:block;width:34px;height:34px;border:0;font:0}
.brand-mark:after{display:none}
.brand-mark svg{display:block;width:100%;height:100%}

a.card{color:inherit;text-decoration:none}
.card[hidden]{display:none}
.badge{display:inline-block;padding:3px 7px;border:1px solid #b7ff3240;border-radius:4px;color:var(--acid);font:8px var(--mono);letter-spacing:.14em;text-transform:uppercase}
.card-top .right{display:flex;align-items:center;gap:8px}
.stars{color:#8b96a3;font:9px var(--mono)}
.skip{position:absolute;left:-999px;top:8px;background:var(--acid);color:#071008;padding:8px 12px;border-radius:6px;z-index:50;font-size:12px}
.skip:focus{left:8px}
:focus-visible{outline:2px solid var(--cat-color, var(--acid));outline-offset:3px}

/* ==========================================================================
   Paleta de color por Categoría (Recon, OSINT, Web, Network, etc.)
   ========================================================================== */
.card[data-category="recon"], .tool-card[data-category="recon"]{--cat-color:#10b981;--cat-glow:rgba(16,185,129,.14);--cat-border:rgba(16,185,129,.4)}
.card[data-category="osint"], .tool-card[data-category="osint"]{--cat-color:#06b6d4;--cat-glow:rgba(6,182,212,.15);--cat-border:rgba(6,182,212,.4)}
.card[data-category="web"], .tool-card[data-category="web"]{--cat-color:#f59e0b;--cat-glow:rgba(245,158,11,.15);--cat-border:rgba(245,158,11,.4)}
.card[data-category="network"], .tool-card[data-category="network"]{--cat-color:#a855f7;--cat-glow:rgba(168,85,247,.15);--cat-border:rgba(168,85,247,.4)}
.card[data-category="defensive"], .tool-card[data-category="defensive"]{--cat-color:#3b82f6;--cat-glow:rgba(59,130,246,.15);--cat-border:rgba(59,130,246,.4)}
.card[data-category="ctf"], .tool-card[data-category="ctf"]{--cat-color:#eab308;--cat-glow:rgba(234,179,8,.15);--cat-border:rgba(234,179,8,.4)}
.card[data-category="forensics"], .tool-card[data-category="forensics"]{--cat-color:#ec4899;--cat-glow:rgba(236,72,153,.15);--cat-border:rgba(236,72,153,.4)}
.card[data-category="other"], .tool-card[data-category="other"]{--cat-color:#b7ff32;--cat-glow:rgba(183,255,50,.15);--cat-border:rgba(183,255,50,.4)}

/* Fondo adaptativo del card según categoría */
.card{
  background: radial-gradient(circle at 15% 15%, var(--cat-glow, rgba(183,255,50,.06)) 0%, transparent 65%),
              linear-gradient(150deg, #10171d 0%, #0b1116 100%) !important;
  border-color: rgba(255,255,255,.07) !important;
  transition: transform .22s cubic-bezier(.16,1,.3,1), border-color .22s ease, box-shadow .25s ease, filter .15s ease !important;
  will-change: transform;
}

/* Hover con tinte temático */
.card:hover{
  transform: translateY(-5px) !important;
  border-color: var(--cat-border, rgba(183,255,50,.45)) !important;
  box-shadow: 0 20px 48px -12px rgba(0,0,0,.7), 0 0 28px -6px var(--cat-glow, rgba(183,255,50,.2)) !important;
}

.card:hover .repo-arrow{
  background: var(--cat-color, var(--acid)) !important;
  border-color: var(--cat-color, var(--acid)) !important;
  color: #071008 !important;
}

/* Indicador de color en el footer */
.card .lang i{
  background: var(--cat-color, var(--acid)) !important;
  box-shadow: 0 0 8px var(--cat-color, var(--acid));
}

/* ==========================================================================
   Micro-animación sutil y viva al pulsar la herramienta (Feedback háptico)
   ========================================================================== */
.card:active{
  transform: translateY(-2px) scale(0.985) !important;
  transition-duration: .08s !important;
  filter: brightness(1.08);
}

/* Flash de luz suave en el borde al hacer click */
.card::after{
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  box-shadow: inset 0 0 0 1px var(--cat-color, var(--acid));
  opacity: 0;
  pointer-events: none;
  transition: opacity .3s ease;
}

.card:active::after{
  opacity: .7;
}

/* Logos de las herramientas */
.icon.has-img{
  background: #090e13;
  border-color: rgba(255,255,255,.09);
  overflow: hidden;
  padding: 6px;
  transition: border-color .2s ease, transform .2s ease;
}
.card:hover .icon.has-img{
  border-color: var(--cat-border, rgba(183,255,50,.4));
  transform: scale(1.04);
}
.icon.has-img img{width:100%;height:100%;object-fit:contain;display:block;border-radius:4px}
.icon.hero-icon{width:68px;height:68px;border-radius:12px;padding:8px}

/* Ajustes de tamaño y tipografía */
.card h3{font-size:21px;letter-spacing:-.035em;margin:0 0 10px}
.card p{color:#9aa7b3;font-size:12.8px;line-height:1.68;margin:0}
/* ==========================================================================
   Etiquetas tácticas interactuables (Tags / Cyber-pills)
   ========================================================================== */
.tags{
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 18px;
}

.tag{
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4.5px 9.5px;
  border-radius: 5px;
  font-family: var(--mono);
  font-size: 9.5px;
  font-weight: 550;
  letter-spacing: .06em;
  color: #8292a2;
  background: rgba(13, 20, 27, 0.75);
  border: 1px solid rgba(255, 255, 255, 0.08);
  backdrop-filter: blur(4px);
  transition: transform .2s cubic-bezier(.16,1,.3,1), color .2s ease, border-color .2s ease, background .2s ease, box-shadow .2s ease;
  cursor: default;
}

.tag::before{
  content: "#";
  font-size: 9px;
  font-weight: 700;
  color: var(--cat-color, var(--acid));
  opacity: .45;
  transition: opacity .2s ease, transform .2s ease;
}

/* Al pasar el ratón por la tarjeta completa */
.card:hover .tag{
  color: #a4b6c7;
  border-color: rgba(255, 255, 255, 0.16);
  background: rgba(16, 25, 34, 0.85);
}

.card:hover .tag::before{
  opacity: .85;
}

/* Al pasar el ratón directamente sobre la etiqueta */
.tag:hover{
  transform: translateY(-2.5px) scale(1.03);
  color: #ffffff !important;
  border-color: var(--cat-border, rgba(183, 255, 50, 0.55)) !important;
  background: rgba(20, 32, 44, 0.95) !important;
  box-shadow: 0 4px 14px -2px rgba(0, 0, 0, 0.7), 0 0 12px var(--cat-glow, rgba(183, 255, 50, 0.25)) !important;
}

.tag:hover::before{
  opacity: 1 !important;
  transform: scale(1.2);
}
.author{display:flex;align-items:center;gap:8px;font-size:11px}
.avatar{
  position:relative;
  display:grid;
  place-items:center;
  width:23px;
  height:23px;
  border-radius:50%;
  background:#1a232c;
  border:1px solid rgba(255,255,255,.14);
  color:#dae0e5;
  font-style:normal;
  font-size:8px;
  overflow:hidden;
  flex-shrink:0;
  box-shadow:0 2px 5px rgba(0,0,0,.4);
  transition:border-color .2s ease, transform .2s ease;
}
.card:hover .avatar{
  border-color:var(--cat-border, rgba(183,255,50,.45));
}
.avatar img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:50%;
  z-index:1;
}
.avatar i{
  font-style:normal;
  z-index:0;
}
.modal-author{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:var(--acid);
  font:500 12.5px var(--mono);
}
.modal-author .avatar{
  width:27px;
  height:27px;
  font-size:10px;
}
.lang{font-size:10.5px}

/* Ficha de herramienta completa */
.tool-page{padding:140px 0 110px;max-width:800px}
.back{display:inline-flex;gap:10px;align-items:center;color:#8b96a3;font:500 12px var(--mono);margin-bottom:28px;transition:transform .2s ease,color .2s ease}
.back:hover{color:var(--acid);transform:translateX(-3px)}
.tool-card{
  padding:48px;
  border:1px solid var(--cat-border, rgba(183,255,50,.3));
  border-radius:14px;
  background:radial-gradient(ellipse 90% 60% at 50% 0%, var(--cat-glow, #152029) 0%, #0c1217 100%);
  box-shadow:0 30px 100px #000c, 0 0 40px var(--cat-glow, rgba(183,255,50,.08));
}
.tool-card .icon{margin-bottom:26px}
.tool-card h1{font-size:clamp(36px,6vw,56px);letter-spacing:-.055em;margin:0 0 10px;line-height:1.02;color:#fff}
.tool-card .modal-author{
  display: inline-flex !important;
  align-items: center;
  gap: 10px;
  margin-top: 8px;
  color: var(--acid);
  font: 500 12.5px var(--mono);
}
.tool-card .modal-author .avatar{
  width: 26px;
  height: 26px;
  flex-shrink: 0;
}
.tool-card .modal-author a{color:inherit}
.tool-card .modal-author a:hover{text-decoration:underline}
.tool-desc{color:#b6c2cc;font-size:15.5px;line-height:1.8;margin:28px 0}
.tool-card .meta{grid-template-columns:repeat(auto-fit,minmax(120px,1fr));background:#080d1280;border-radius:8px;padding:6px 18px;border:1px solid #27313b80}
.tool-card .meta div span{color:#8895a2;font-size:9px}
.tool-card .meta div strong{color:#e2e9ee;font-size:13px}
.notice{margin:0 0 24px;padding:14px 16px;border:1px dashed #b7ff3255;border-radius:8px;color:#a8c97a;font:11.5px/1.65 var(--mono)}
.notice.notice-security{background:#b7ff3208;border-color:#b7ff3233;color:#9eb8a1}
.notice.notice-security strong{color:var(--acid)}
.btn[aria-disabled=true]{opacity:.45;pointer-events:none}
.tool-page .modal-actions{margin-top:32px;display:flex;gap:14px}
.tool-page .modal-actions .btn{flex:0 1 auto;padding:0 24px;min-height:50px}

/* Botones con respuesta háptica */
.btn:active{transform:translateY(0) scale(0.975)}

/* Página 404 */
.nf{min-height:70vh;display:grid;place-items:center;text-align:center;padding:160px 0 80px}
.nf b{display:block;color:var(--acid);font:500 13px var(--mono);margin-bottom:14px}
.nf h1{font-size:clamp(40px,8vw,72px);letter-spacing:-.06em;margin:0 0 26px}

@media(max-width:650px){.tool-page{padding-top:120px}.tool-card{padding:28px 22px}.tool-page .modal-actions{flex-direction:column}}

/* ==========================================================================
   Terminal interactiva (Hero Shell)
   ========================================================================== */
.terminal{
  transform: none !important; /* Elimina rotación 3D para nitidez absoluta del texto */
  cursor: text;
  transition: border-color .2s ease, box-shadow .2s ease;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
.terminal:focus-within{
  border-color: rgba(183, 255, 50, 0.45);
  box-shadow: 0 34px 95px rgba(0,0,0,.7), 0 0 30px rgba(183,255,50,.12);
}
.term-status{
  display: flex;
  align-items: center;
  gap: 6px;
  font-style: normal;
  color: #8fa0b2;
  font-size: 9px;
  letter-spacing: .1em;
}
.live-dot{
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--acid);
  box-shadow: 0 0 8px var(--acid);
  animation: pulse 2s infinite;
}
.term-body{
  min-height: 290px;
  max-height: 360px;
  overflow-y: auto;
  padding: 22px 24px;
  font: 500 12px/1.85 var(--mono);
  color: #dbe4ec;
  scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,.1) transparent;
}
  scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,.1) transparent;
}
.term-line{
  margin: 0;
  white-space: pre-wrap;
  word-break: break-word;
}
.term-line.welcome{
  color: #fff;
  font-weight: 600;
}
.term-ver{
  color: var(--acid);
  font-size: 9px;
  font-weight: 500;
  padding: 1px 5px;
  border: 1px solid rgba(183,255,50,.3);
  border-radius: 3px;
  margin-left: 4px;
}
.cmd-tag{
  color: var(--acid);
  background: rgba(183,255,50,.1);
  padding: 1px 6px;
  border-radius: 3px;
  font-weight: 600;
}
.term-spacer{
  height: 12px;
}
.term-input-row{
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 4px;
}
.prompt-arrow{
  color: var(--acid);
  font-weight: 700;
}
.prompt-tilde{
  color: #8da0b2;
}
.term-input{
  flex: 1;
  background: transparent;
  border: 0;
  outline: 0;
  color: #f5f7f8;
  font: inherit;
  caret-color: var(--acid);
  padding: 0;
  margin: 0;
  min-width: 0;
}
.term-input::placeholder{
  color: #43515e;
}
.term-cmd-prev{
  color: #e2e8f0;
  font-weight: 500;
}
.term-success{
  color: var(--acid);
}
.term-error{
  color: #f87171;
}
.term-table{
  display: grid;
  grid-template-columns: 100px 1fr;
  gap: 4px 14px;
  margin: 6px 0 10px;
  color: #a0aec0;
}
.term-table b{
  color: var(--acid);
  font-weight: 500;
}
.term-link{
  color: var(--acid);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.term-link:hover{
  color: #d8ff85;
}

/* Enlace de Discord en navegación */
.discord-nav-link{
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.nav-dot{
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #5865F2;
  box-shadow: 0 0 6px #5865F2;
}

/* ==========================================================================
   Mejora integral de nitidez y contraste tipográfico
   ========================================================================== */
body, button, input, .btn{
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

/* Botones de acción alineados y nítidos */
.actions{
  display: flex !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
  align-items: center;
  margin-bottom: 36px !important;
}
.btn{
  font-size: 13px !important;
  font-weight: 650 !important;
  letter-spacing: .02em;
  padding: 0 20px !important;
  min-height: 48px !important;
  gap: 12px !important;
}

/* Indicadores de sección ("01 / DIRECTORIO", "02 / POR QUÉ STICKYBIT") */
.eyebrow, .section-id{
  font-size: 12px !important;
  letter-spacing: .12em !important;
  color: #a6b8ca !important;
  font-weight: 600 !important;
}

/* Contadores numéricos del Hero ("02 TOOLS", "01 MAKERS", "100% OPEN SOURCE") */
.hero-stats strong{
  font-size: 24px !important;
  font-weight: 650 !important;
  color: var(--acid) !important;
}
.hero-stats span{
  font-size: 11px !important;
  color: #a4b6c8 !important;
  letter-spacing: .1em !important;
  font-weight: 600 !important;
}

/* Ticker de disciplinas ("PENTESTING ✦ DEFENSIVA ✦ CTFS...") */
.ticker-track{
  font-size: 11.5px !important;
  letter-spacing: .16em !important;
  color: #9cb0c4 !important;
  font-weight: 600 !important;
}
.ticker i{
  opacity: .85;
}
