/* ==========================================================================
   Underc0de — rediseño 2027 (vista previa)
   Publicado para todos el 2026-11-08 (?u0next=0 vuelve al anterior). Todo va bajo body.u0-next,
   así el diseño anterior sigue disponible. Mantiene la paleta y el ADN "acid lab":
   negro, azul #212349, celeste #3CB7EA, tipografía pixel y esquinas en diagonal.
   Backup del diseño anterior: /root/backups/foro-ui-20261108/
   ========================================================================== */

body.u0-next{
  --n-bg:#000;
  --n-panel:rgba(11,12,30,.94);
  --n-panel-2:rgba(19,21,48,.94);
  --n-azul:#212349;
  --n-cel:#3CB7EA;
  --n-cel-2:#3DA4DD;
  --n-cel-3:#4594D1;
  --n-ok:#7dffb0;
  --n-gold:#F2C94C;
  --n-line:rgba(60,183,234,.30);
  --n-line-hi:rgba(60,183,234,.85);
  --n-line-lo:rgba(60,183,234,.10);
  --n-txt:#fff;--n-txt-2:rgba(255,255,255,.76);--n-txt-3:rgba(255,255,255,.52);
  --n-cut:12px;--n-cut-s:7px;
  --n-notch:polygon(var(--n-cut) 0,100% 0,100% calc(100% - var(--n-cut)),calc(100% - var(--n-cut)) 100%,0 100%,0 var(--n-cut));
  --n-notch-s:polygon(var(--n-cut-s) 0,100% 0,100% calc(100% - var(--n-cut-s)),calc(100% - var(--n-cut-s)) 100%,0 100%,0 var(--n-cut-s));
  --n-frame:linear-gradient(135deg,var(--n-line-hi),var(--n-line) 22%,var(--n-line-lo) 55%,rgba(69,148,209,.45));
  --n-ease:cubic-bezier(.2,.7,.2,1);
  background:
    radial-gradient(1100px 620px at 8% -8%,rgba(33,35,73,.85),transparent 62%),
    radial-gradient(900px 520px at 100% 0,rgba(60,183,234,.13),transparent 60%),
    radial-gradient(1200px 700px at 50% 120%,rgba(33,35,73,.55),transparent 65%),
    #000 !important;
  background-attachment:fixed !important;
}
/* retícula sutil de fondo */
body.u0-next #wrapper{position:relative;isolation:isolate}
body.u0-next #wrapper::before{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background-image:linear-gradient(rgba(60,183,234,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(60,183,234,.045) 1px,transparent 1px);
  background-size:44px 44px;
  -webkit-mask-image:radial-gradient(ellipse at 50% 0,#000 0,transparent 75%);mask-image:radial-gradient(ellipse at 50% 0,#000 0,transparent 75%);
}

/* --------------------------------------------------------------------------
   1. Marco con esquinas en diagonal (borde completo, incluidas las diagonales)
   -------------------------------------------------------------------------- */
body.u0-next :is(.up_contain,#forumposts .windowbg,#messageindex .windowbg,#topic_container .windowbg,#info_center,.u0p_box,.u0n-stats li,.u0n-cta,.u0n-hero,#display_head,.roundframe:not(#info_center .roundframe),.information,.generic_list_wrapper){
  --bgc:var(--n-panel);
  position:relative;
  clip-path:var(--n-notch);
  border:1px solid transparent !important;
  border-radius:0 !important;
  background:linear-gradient(var(--bgc),var(--bgc)) padding-box,var(--n-frame) border-box !important;
  box-shadow:none !important;
}
/* las diagonales: dos trazos de 1px en las esquinas recortadas */
body.u0-next :is(.up_contain,#forumposts .windowbg,#messageindex .windowbg,#topic_container .windowbg,#info_center,.u0p_box,.u0n-stats li,.u0n-cta,.u0n-hero,#display_head,.roundframe:not(#info_center .roundframe),.information,.generic_list_wrapper)::before{
  content:"" !important;position:absolute !important;inset:-1px !important;width:auto !important;height:auto !important;z-index:3;pointer-events:none;
  background:
    linear-gradient(to bottom right,transparent calc(50% - .5px),var(--n-line-hi) calc(50% - .5px),var(--n-line-hi) calc(50% + 1px),transparent calc(50% + 1px)) 0 0/var(--n-cut) var(--n-cut) no-repeat,
    linear-gradient(to bottom right,transparent calc(50% - 1px),rgba(69,148,209,.55) calc(50% - 1px),rgba(69,148,209,.55) calc(50% + .5px),transparent calc(50% + .5px)) 100% 100%/var(--n-cut) var(--n-cut) no-repeat !important;
  opacity:1 !important;
}
/* adiós a las marquitas sueltas de 14px del diseño anterior */
body.u0-next .postblock::before{content:none !important}

/* --------------------------------------------------------------------------
   2. Cabecera: vidrio esmerilado + línea de luz
   -------------------------------------------------------------------------- */
body.u0-next .u0-header{background:rgba(0,0,0,.66) !important;-webkit-backdrop-filter:blur(14px) saturate(150%);backdrop-filter:blur(14px) saturate(150%);border-bottom:0 !important}
body.u0-next .u0-header::after,body.u0-next .u0-fbar::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:1px;pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(60,183,234,.25) 15%,var(--n-cel) 50%,rgba(60,183,234,.25) 85%,transparent);
}
body.u0-next .u0-fbar{background:rgba(5,6,18,.62) !important;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:0 !important}
body.u0-next .u0-nav a{position:relative}
body.u0-next .u0-nav>ul>li>a::after,body.u0-next .u0-nav>a::after{
  content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;background:var(--n-cel);box-shadow:0 0 10px var(--n-cel);
  transform:scaleX(0);transform-origin:left;transition:transform .25s var(--n-ease);
}
body.u0-next .u0-nav>ul>li>a:hover::after,body.u0-next .u0-nav>a:hover::after{transform:scaleX(1)}
body.u0-next .u0-search input{clip-path:var(--n-notch-s);transition:box-shadow .2s}
body.u0-next .u0-search input:focus{box-shadow:inset 0 0 0 1px var(--n-cel),0 0 0 3px rgba(60,183,234,.18)}

/* Botones: más presencia sin perder el [ corchete ] */
body.u0-next .u0-btn{transition:transform .18s var(--n-ease),box-shadow .2s,background .2s,color .2s}
body.u0-next .u0-btn:hover{transform:translateY(-1px);box-shadow:0 8px 24px -10px rgba(60,183,234,.8)}
body.u0-next .u0-btn:not(.ghost){background:linear-gradient(135deg,var(--n-cel),var(--n-cel-3)) !important;color:#000 !important;border-color:transparent !important}

/* --------------------------------------------------------------------------
   3. Título de página y migas
   -------------------------------------------------------------------------- */
body.u0-next .u0-pagehead{margin:1.4rem 0 1.2rem}
body.u0-next .u0-pagehead h1{
  font:400 clamp(1.7rem,3.2vw,2.6rem)/1.1 var(--f-brand,var(--f-ui)) !important;letter-spacing:.01em;
  background:linear-gradient(90deg,#fff 0,#fff 40%,var(--n-cel) 100%);-webkit-background-clip:text;background-clip:text;color:transparent !important;
}
body.u0-next .u0-pagehead h1::before{-webkit-text-fill-color:var(--n-cel)}
body.u0-next .navigate_section{clip-path:var(--n-notch-s);background:rgba(11,12,30,.7) !important}

/* --------------------------------------------------------------------------
   4. Hero de la portada
   -------------------------------------------------------------------------- */
body.u0-next .u0n-hero{
  --bgc:rgba(10,11,28,.9);--n-cut:18px;
  display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:clamp(1rem,3vw,2.5rem);align-items:center;
  margin:0 0 1.6rem;padding:clamp(1.25rem,3vw,2.4rem) !important;overflow:hidden;
}
body.u0-next .u0n-hero::after{ /* halo + pulpo */
  content:"";position:absolute;right:-60px;top:-80px;width:420px;height:420px;z-index:0;pointer-events:none;
  background:radial-gradient(circle,rgba(60,183,234,.22),transparent 62%);
}
body.u0-next .u0n-hero>*{position:relative;z-index:1}
body.u0-next .u0n-prompt{margin:0 0 .9rem;font:500 .82rem var(--f-pixel);color:var(--n-txt-3);letter-spacing:.04em}
body.u0-next .u0n-prompt i{font-style:normal;color:var(--n-ok)}
body.u0-next .u0n-prompt b{color:var(--n-cel)}
body.u0-next .u0n-caret{display:inline-block;width:.6em;height:1em;margin-left:.3em;vertical-align:-.15em;background:var(--n-cel);box-shadow:0 0 8px var(--n-cel);animation:u0n-blink 1.05s steps(1) infinite}
@keyframes u0n-blink{50%{opacity:0}}
body.u0-next .u0n-hero-t{margin:0;font:700 clamp(1.5rem,3.1vw,2.5rem)/1.12 var(--f-ui) !important;color:#fff;letter-spacing:-.005em;text-transform:none}
body.u0-next .u0n-hero-t em{font-style:normal;background:linear-gradient(90deg,var(--n-cel),#9fe3ff);-webkit-background-clip:text;background-clip:text;color:transparent}
body.u0-next .u0n-hero-d{margin:.8rem 0 1.3rem;max-width:56ch;color:var(--n-txt-2);font-size:1.02rem;line-height:1.6}
body.u0-next .u0n-hero-btns{display:flex;flex-wrap:wrap;gap:.7rem}
body.u0-next .u0n-stats{display:grid;grid-template-columns:1fr 1fr;gap:.7rem;margin:0;padding:0;list-style:none}
body.u0-next .u0n-stats li{--bgc:rgba(33,35,73,.55);--n-cut:10px;padding:1rem 1.1rem !important;transition:transform .25s var(--n-ease)}
body.u0-next .u0n-stats li:hover{transform:translateY(-2px)}
body.u0-next .u0n-stats b{display:block;font:400 clamp(1.35rem,2.4vw,1.9rem)/1 var(--f-brand,var(--f-ui));color:#fff;letter-spacing:.02em;text-shadow:0 0 18px rgba(60,183,234,.35)}
body.u0-next .u0n-stats span{display:flex;align-items:center;gap:.4rem;margin-top:.45rem;font:500 .72rem var(--f-pixel);letter-spacing:.1em;text-transform:uppercase;color:var(--n-cel)}
body.u0-next .u0n-live span{color:var(--n-ok)}
body.u0-next .u0n-live i{width:8px;height:8px;border-radius:50%;background:var(--n-ok);box-shadow:0 0 0 0 rgba(125,255,176,.6);animation:u0n-pulse 1.8s infinite}
@keyframes u0n-pulse{70%{box-shadow:0 0 0 9px rgba(125,255,176,0)}100%{box-shadow:0 0 0 0 rgba(125,255,176,0)}}

/* --------------------------------------------------------------------------
   5. Portada: secciones como grilla de tarjetas
   -------------------------------------------------------------------------- */
body.u0-next .boardindex_table .main_container{margin:0 0 2rem}
body.u0-next .cat_bar{margin:0 0 .2rem !important}
body.u0-next .cat_bar :is(h2,h3).catbg{
  padding:.2rem 0 .7rem !important;background:none !important;border:0 !important;clip-path:none !important;
  font:500 1.05rem var(--f-ui) !important;letter-spacing:.14em;color:#fff !important;
  border-bottom:1px solid transparent !important;
  border-image:linear-gradient(90deg,var(--n-cel),rgba(60,183,234,.25) 35%,transparent 80%) 1 !important;
}
body.u0-next .cat_bar :is(h2,h3)::before{
  content:"0x" !important;display:inline-grid;place-items:center;min-width:2.1rem;height:1.6rem;margin-right:.75rem;padding:0 .35rem;
  background:rgba(60,183,234,.12);border:1px solid var(--n-line);clip-path:var(--n-notch-s);color:var(--n-cel) !important;font-size:.72rem !important
}
body.u0-next [id^="category_"][id$="_boards"]{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,370px),1fr));gap:.85rem;padding:.9rem 0 0;
}
body.u0-next .up_contain{
  --bgc:var(--n-panel);
  display:grid !important;grid-template-columns:auto minmax(0,1fr);grid-template-areas:"icon info" "stats last" "kids kids";
  align-items:start;gap:.8rem 1rem !important;margin:0 !important;padding:1.1rem 1.15rem 1rem !important;min-height:9.5rem;
  transition:transform .25s var(--n-ease),filter .25s;
}
body.u0-next .up_contain:hover{--bgc:var(--n-panel-2);transform:translateY(-3px);filter:drop-shadow(0 10px 22px rgba(60,183,234,.18))}
body.u0-next .up_contain .board_icon{grid-area:icon}
body.u0-next .up_contain .info{grid-area:info;flex:none !important;align-self:center}
body.u0-next .up_contain .info a.subject{font:700 1.08rem/1.25 var(--f-ui) !important;transition:color .2s}
body.u0-next .up_contain:hover .info a.subject{color:var(--n-cel) !important}
body.u0-next .up_contain .board_description{margin-top:.25rem;color:var(--n-txt-2);font-size:.88rem;line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
body.u0-next .up_contain .moderators{margin:.35rem 0 0;font-size:.78rem;color:var(--n-txt-3)}
body.u0-next .up_contain .board_stats{
  grid-area:stats;flex:none !important;align-self:stretch;min-width:7.2rem;padding:.55rem .7rem !important;
  background:rgba(60,183,234,.06) !important;border:1px solid var(--n-line-lo) !important;clip-path:var(--n-notch-s);
  font:500 .74rem/1.75 var(--f-pixel) !important;letter-spacing:.05em;color:var(--n-txt-2) !important;text-transform:uppercase;
}
body.u0-next .up_contain .lastpost{
  grid-area:last;flex:none !important;align-self:stretch;padding:.5rem 0 0 .9rem !important;border-left:1px solid var(--n-line-lo) !important;font-size:.8rem;
}
body.u0-next .up_contain .lastpost .postby a:first-child{color:#fff;font-weight:600}
body.u0-next .up_contain .children{grid-area:kids;flex:none !important;margin:0 !important;padding:.65rem 0 0 !important;border-top:1px solid var(--n-line-lo) !important}
body.u0-next .up_contain .children p{display:flex;flex-wrap:wrap;align-items:center;gap:.35rem;margin:0}
body.u0-next .up_contain .children strong{margin-right:.2rem}
body.u0-next .up_contain .children span a{
  display:inline-block;padding:.18rem .55rem;font-size:.76rem;color:var(--n-txt-2) !important;
  background:rgba(60,183,234,.07);border:1px solid var(--n-line-lo);clip-path:var(--n-notch-s);transition:all .2s;
}
body.u0-next .up_contain .children span a:hover{color:#000 !important;background:var(--n-cel);border-color:var(--n-cel)}
body.u0-next .up_contain .children span::after{content:none !important}
/* secciones que redirigen (WhatsApp / Discord): acento dorado */
body.u0-next .up_contain:has(.board_redirect){--n-frame:linear-gradient(135deg,rgba(242,201,76,.85),rgba(242,201,76,.3) 25%,rgba(242,201,76,.08) 60%,rgba(242,201,76,.4));grid-template-areas:"icon info" "stats stats"}
body.u0-next .up_contain:has(.board_redirect)::before{filter:hue-rotate(160deg) saturate(1.4)}
body.u0-next .up_contain:has(.board_redirect) .board_stats{background:rgba(242,201,76,.07) !important;color:var(--n-gold) !important}
body.u0-next .up_contain:has(.board_redirect) .lastpost{display:none}

/* bloques propios: proyectos / sin respuesta */
body.u0-next .u0p_box{--bgc:rgba(11,12,30,.9);margin:0 0 1.2rem !important;border-left-width:1px !important}
body.u0-next .u0pl-item,body.u0-next .u0es-row{transition:background .2s}
body.u0-next .u0pl-item:hover,body.u0-next .u0es-row:hover{background:rgba(60,183,234,.05)}
body.u0-next .u0pl-thumb{clip-path:var(--n-notch-s)}
body.u0-next .u0es-cta{clip-path:var(--n-notch-s);transition:all .2s}
body.u0-next .u0es-cta:hover{background:var(--n-cel) !important;color:#000 !important}

/* centro de información */
body.u0-next #info_center{--bgc:rgba(11,12,30,.9);padding:0 0 .6rem !important;margin-top:1.5rem}
body.u0-next #info_center .sub_bar,body.u0-next #info_center .roundframe,body.u0-next #info_center .windowbg{clip-path:none !important;background:none !important;border:0 !important}
body.u0-next #info_center .subbg{border-bottom:1px solid var(--n-line-lo) !important;background:none !important}
body.u0-next #ic_recentposts tr.windowbg:not(:first-child):hover td{background:rgba(60,183,234,.05) !important}

/* --------------------------------------------------------------------------
   6. Listado de temas
   -------------------------------------------------------------------------- */
body.u0-next #messageindex .windowbg,body.u0-next #topic_container .windowbg{
  --bgc:var(--n-panel);--n-cut:10px;margin:0 0 .5rem !important;padding:.85rem 1rem !important;transition:transform .2s var(--n-ease),filter .2s;
}
body.u0-next #messageindex .windowbg:hover,body.u0-next #topic_container .windowbg:hover{--bgc:var(--n-panel-2);transform:translateX(3px);filter:drop-shadow(0 6px 16px rgba(60,183,234,.14))}
body.u0-next #topic_container .windowbg.sticky{--bgc:rgba(22,30,62,.94);--n-frame:linear-gradient(135deg,var(--n-cel),rgba(60,183,234,.5) 30%,rgba(60,183,234,.15) 70%,var(--n-cel-3))}
body.u0-next .message_index_title a{font-weight:700;font-size:1rem}
body.u0-next .u0-pill-ok,body.u0-next .u0-pill-alert,body.u0-next .u0tag{clip-path:var(--n-notch-s)}

/* --------------------------------------------------------------------------
   7. Vista de tema: mensajes como tarjetas
   -------------------------------------------------------------------------- */
body.u0-next #display_head{--bgc:rgba(14,16,38,.92);--n-cut:16px;padding:1.4rem 1.6rem !important}
body.u0-next #display_head .display_title{font:700 clamp(1.35rem,2.6vw,2rem)/1.2 var(--f-ui) !important}
body.u0-next #forumposts .windowbg{--bgc:rgba(10,11,28,.93);--n-cut:14px;margin:0 0 1rem !important;overflow:visible}
body.u0-next .post_wrapper{position:relative;z-index:1}
body.u0-next .poster{background:linear-gradient(180deg,rgba(33,35,73,.55),rgba(33,35,73,.15)) !important;border-right:1px solid var(--n-line-lo) !important}
body.u0-next .poster .avatar img,body.u0-next .poster img.avatar{
  border-radius:50% !important;clip-path:none !important;border:2px solid transparent !important;
  background:linear-gradient(#000,#000) padding-box,linear-gradient(135deg,var(--n-cel),var(--n-azul) 60%,var(--n-cel-3)) border-box !important;
  box-shadow:0 0 0 4px rgba(60,183,234,.08),0 8px 24px -8px rgba(60,183,234,.5) !important;
}
body.u0-next .postarea .post .inner,body.u0-next .postarea .inner{font-size:1.02rem;line-height:1.75;color:rgba(255,255,255,.9)}
body.u0-next .postarea .keyinfo{border-bottom:1px solid var(--n-line-lo);padding-bottom:.55rem}
body.u0-next .bbc_code,body.u0-next code.bbc_code{clip-path:var(--n-notch-s);background:#04050d !important;border:1px solid var(--n-line) !important}
body.u0-next blockquote.bbc_standard_quote,body.u0-next blockquote.bbc_alternate_quote{border-left:2px solid var(--n-cel) !important;background:rgba(60,183,234,.05) !important;clip-path:var(--n-notch-s)}
body.u0-next .u0r button,body.u0-next .u0r a{transition:transform .15s var(--n-ease),box-shadow .2s}
body.u0-next .u0r button:hover,body.u0-next .u0r a:hover{transform:translateY(-2px) scale(1.06);box-shadow:0 6px 16px -6px rgba(60,183,234,.7)}
body.u0-next .signature{border-top:1px dashed var(--n-line-lo) !important;opacity:.8}

/* --------------------------------------------------------------------------
   8. Footer nuevo
   -------------------------------------------------------------------------- */
body.u0-next .u0-footer{
  position:relative;margin-top:3rem;padding:0 0 1.5rem !important;overflow:hidden;
  background:
    radial-gradient(900px 300px at 50% 0,rgba(60,183,234,.12),transparent 70%),
    linear-gradient(180deg,rgba(33,35,73,.55),#05060f 55%,#000) !important;
  border-top:0 !important;
}
body.u0-next .u0-footer::before{ /* línea de luz superior */
  content:"";position:absolute;left:0;right:0;top:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(60,183,234,.3) 20%,var(--n-cel) 50%,rgba(60,183,234,.3) 80%,transparent);
  box-shadow:0 0 18px 1px rgba(60,183,234,.55);
}
body.u0-next .u0-footer::after{ /* pulpo de marca de agua */
  content:"";position:absolute;right:-70px;bottom:-60px;width:380px;height:380px;pointer-events:none;opacity:.05;
  background:url(https://underc0de.org/assets/img/pulpo-blanco.webp) center/contain no-repeat;
}
body.u0-next .u0-footer .u0-wrap{position:relative;z-index:1}
body.u0-next .u0n-cta{
  --bgc:rgba(14,16,40,.92);--n-cut:16px;
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem 2rem;
  margin:-0px 0 2.4rem;transform:translateY(2.2rem);padding:1.4rem 1.6rem !important;
}
body.u0-next .u0n-cta-txt{display:flex;flex-direction:column;gap:.35rem;max-width:60ch}
body.u0-next .u0n-kicker{font:500 .74rem var(--f-pixel);letter-spacing:.12em;text-transform:uppercase;color:var(--n-cel)}
body.u0-next .u0n-cta-txt strong{font:700 clamp(1.05rem,2vw,1.35rem)/1.3 var(--f-ui);color:#fff}
body.u0-next .u0n-cta-btns{display:flex;flex-wrap:wrap;gap:.6rem}
body.u0-next .u0-footer .top{
  display:grid !important;grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr));gap:2rem 2.5rem;
  padding:3.2rem 0 2rem !important;
}
body.u0-next .u0-footer .top>div{min-width:0}
body.u0-next .u0-footer .u0-brand img{filter:drop-shadow(0 0 10px rgba(60,183,234,.5))}
body.u0-next .u0-footer .top p{color:var(--n-txt-2);line-height:1.65;font-size:.92rem;max-width:42ch}
body.u0-next .u0-footer h3{
  position:relative;margin:0 0 1rem !important;padding-bottom:.6rem;
  font:500 .78rem var(--f-pixel) !important;letter-spacing:.14em;text-transform:uppercase;color:var(--n-cel) !important;
}
body.u0-next .u0-footer h3::before{content:"/ ";opacity:.6}
body.u0-next .u0-footer h3::after{content:"";position:absolute;left:0;bottom:0;width:28px;height:2px;background:var(--n-cel);box-shadow:0 0 8px var(--n-cel)}
body.u0-next .u0-footer ul{margin:0;padding:0;list-style:none;display:grid;gap:.55rem}
body.u0-next .u0-footer ul a{
  position:relative;display:inline-block;color:var(--n-txt-2) !important;font-size:.9rem;text-decoration:none !important;
  transition:color .2s,transform .2s var(--n-ease);
}
body.u0-next .u0-footer ul a::before{content:"›";position:absolute;left:-.9rem;opacity:0;color:var(--n-cel);transition:opacity .2s}
body.u0-next .u0-footer ul a:hover{color:#fff !important;transform:translateX(.6rem)}
body.u0-next .u0-footer ul a:hover::before{opacity:1}
body.u0-next .u0-footer .social{display:flex;flex-wrap:wrap;gap:.5rem;margin:1.1rem 0}
body.u0-next .u0-footer .social a{
  display:grid;place-items:center;width:2.5rem;height:2.5rem;color:var(--n-txt-2) !important;clip-path:var(--n-notch-s);
  border:1px solid transparent;background:linear-gradient(rgba(11,12,30,.95),rgba(11,12,30,.95)) padding-box,var(--n-frame) border-box;
  transition:all .2s var(--n-ease);
}
body.u0-next .u0-footer .social a svg{width:1.05rem;height:1.05rem;fill:currentColor}
body.u0-next .u0-footer .social a:hover{color:#000 !important;background:var(--n-cel);transform:translateY(-2px)}
body.u0-next .u0-footer .u0-stores{display:flex;flex-wrap:wrap;gap:.5rem}
body.u0-next .u0-footer .bottom{
  display:flex !important;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.8rem 1.5rem;
  padding:1.2rem 0 0 !important;border-top:1px solid transparent !important;
  border-image:linear-gradient(90deg,transparent,var(--n-line) 20%,var(--n-line) 80%,transparent) 1 !important;
  font-size:.8rem;color:var(--n-txt-3)
}
body.u0-next .u0-footer .bottom a{color:var(--n-txt-2) !important}
body.u0-next .u0-footer .bottom a:hover{color:var(--n-cel) !important}
body.u0-next .u0-footer #language_select{
  appearance:none;-webkit-appearance:none;padding:.4rem 2rem .4rem .7rem;color:#fff;font:500 .78rem var(--f-ui);clip-path:var(--n-notch-s);cursor:pointer;
  border:1px solid var(--n-line);background:rgba(11,12,30,.95) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%233CB7EA'/%3E%3C/svg%3E") no-repeat right .65rem center;
}
body.u0-next .u0-footer .eot{
  display:flex;align-items:center;gap:1rem;margin:1.6rem 0 0 !important;font:500 .7rem var(--f-pixel);letter-spacing:.35em;text-transform:uppercase;color:var(--n-txt-3);
}
body.u0-next .u0-footer .eot::before,body.u0-next .u0-footer .eot::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,transparent,var(--n-line))}
body.u0-next .u0-footer .eot::after{background:linear-gradient(90deg,var(--n-line),transparent)}
body.u0-next .u0-load{text-align:center;color:var(--n-txt-3);font-size:.72rem}

/* --------------------------------------------------------------------------
   9. Cartel de vista previa
   -------------------------------------------------------------------------- */
body.u0-next .u0n-badge{
  position:fixed;left:1rem;bottom:1rem;z-index:2147483100;display:inline-flex;align-items:center;gap:.55rem;
  padding:.5rem .7rem .5rem .8rem;font:500 .72rem var(--f-pixel);letter-spacing:.08em;text-transform:uppercase;color:#fff !important;text-decoration:none !important;
  clip-path:var(--n-notch-s);background:linear-gradient(135deg,rgba(33,35,73,.95),rgba(0,0,0,.95));border:1px solid var(--n-line);
  box-shadow:0 10px 30px -10px rgba(60,183,234,.6);
}
body.u0-next .u0n-badge i{width:8px;height:8px;border-radius:50%;background:var(--n-ok);box-shadow:0 0 8px var(--n-ok)}
body.u0-next .u0n-badge span{padding:.15rem .4rem;background:rgba(60,183,234,.15);color:var(--n-cel)}
body.u0-next .u0n-badge:hover span{background:var(--n-cel);color:#000}

/* --------------------------------------------------------------------------
   10. Responsive
   -------------------------------------------------------------------------- */
@media (max-width:1100px){
  body.u0-next .u0-footer .top{grid-template-columns:1fr 1fr}
  body.u0-next .u0-footer .top>div:first-child{grid-column:1/-1}
}
@media (max-width:860px){
  body.u0-next .u0n-hero{grid-template-columns:1fr}
  body.u0-next .poster{background:linear-gradient(90deg,rgba(33,35,73,.55),rgba(33,35,73,.1)) !important;border-right:0 !important;border-bottom:1px solid var(--n-line-lo) !important}
}
@media (max-width:640px){
  body.u0-next{--n-cut:9px}
  body.u0-next .u0n-hero{padding:1.2rem !important;margin-bottom:1.1rem}
  body.u0-next .u0n-hero-btns .u0-btn{flex:1 1 100%;justify-content:center;text-align:center}
  body.u0-next .u0n-stats li{padding:.8rem .85rem !important}
  body.u0-next [id^="category_"][id$="_boards"]{gap:.6rem}
  body.u0-next .up_contain{grid-template-areas:"icon info" "last last" "kids kids";min-height:0;padding:.95rem !important}
  body.u0-next .up_contain .board_stats{display:none !important}
  body.u0-next .up_contain .lastpost{border-left:0 !important;border-top:1px solid var(--n-line-lo) !important;padding:.55rem 0 0 !important}
  body.u0-next .u0-footer .top{grid-template-columns:1fr;gap:1.6rem}
  body.u0-next .u0n-cta{transform:none;margin:1.5rem 0 0}
  body.u0-next .u0n-cta-btns{width:100%}
  body.u0-next .u0n-cta-btns .u0-btn{flex:1 1 auto;justify-content:center}
  body.u0-next .u0-footer .bottom{flex-direction:column;align-items:flex-start}
  body.u0-next .u0n-badge{bottom:calc(4.6rem + env(safe-area-inset-bottom));left:.6rem}
}
@media (prefers-reduced-motion:reduce){
  body.u0-next *,body.u0-next *::before,body.u0-next *::after{animation:none !important;transition:none !important}
}

/* --------------------------------------------------------------------------
   11. Tipografía: Space Grotesk (títulos) · Inter (lectura) · JetBrains Mono (datos)
       La pixel y Usuzi quedan para detalles de marca, no para texto chico.
   -------------------------------------------------------------------------- */
body.u0-next{
  --f-ui:"Space Grotesk","Univia Pro",Roboto,system-ui,sans-serif;
  --f-body:Inter,Roboto,system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-mono:"JetBrains Mono",ui-monospace,"Cascadia Mono",Consolas,monospace;
  --f-data:"JetBrains Mono",ui-monospace,Consolas,monospace;
  font-family:var(--f-body) !important;font-size:15.5px;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;
  font-feature-settings:"cv11","ss01","ss03";
}
body.u0-next :is(p,li,td,input,textarea,select,.inner,.board_description,.postarea){font-family:var(--f-body)}
body.u0-next :is(h1,h2,h3,h4,.subject,.message_index_title a,.display_title,.u0n-hero-t,.u0n-cta-txt strong,.poster h4,.poster-name){font-family:var(--f-ui) !important;letter-spacing:-.01em}
body.u0-next .up_contain .info a.subject{font:600 1.1rem/1.25 var(--f-ui) !important}
body.u0-next .u0n-hero-t{font-weight:700 !important;letter-spacing:-.02em}
body.u0-next .u0-pagehead h1{font-family:var(--f-ui) !important;font-weight:700 !important;letter-spacing:-.02em}
/* datos chicos: mono legible en vez de pixel */
body.u0-next :is(.up_contain .board_stats,.up_contain .lastpost strong,.up_contain .children strong,.u0n-stats span,.u0-footer h3,.keyinfo .smalltext,.page_number,.u0card-ago,.u0es-m,.u0pl-m,.recenttime,.poster li.membergroup,.navigate_section,.u0-fmenu a,.pagelinks){
  font-family:var(--f-data) !important;font-weight:500;letter-spacing:.02em !important;
}
body.u0-next .up_contain .board_stats{font-size:.76rem !important;text-transform:none}
body.u0-next .up_contain .lastpost strong{font-size:.68rem !important;letter-spacing:.08em !important;color:var(--n-cel) !important}
body.u0-next .u0n-stats b{font-family:var(--f-ui) !important;font-weight:700;letter-spacing:-.02em}
body.u0-next .u0n-stats span{font-size:.7rem !important;letter-spacing:.12em !important}
body.u0-next .u0-footer h3{font-size:.74rem !important;letter-spacing:.16em !important}
body.u0-next .postarea .inner{font-size:1.04rem;line-height:1.78;letter-spacing:-.003em}
body.u0-next .bbc_code,body.u0-next code{font-family:var(--f-mono) !important;font-size:.88rem}
/* marca: se mantiene pixel en prompt, chips 0x, kicker y cartel */
body.u0-next :is(.u0n-prompt,.u0n-kicker,.u0n-badge,.cat_bar :is(h2,h3)::before,.u0-btn){font-family:var(--f-pixel)}
body.u0-next .cat_bar :is(h2,h3).catbg{font-family:var(--f-ui) !important;font-weight:600 !important;letter-spacing:.12em}

/* --------------------------------------------------------------------------
   12. Ajustes tras la primera revisión
   -------------------------------------------------------------------------- */
/* el título de cada sección arrancaba centrado por un width heredado de index.css */
body.u0-next .boardindex_table .up_contain .info{width:auto !important;justify-self:stretch;text-align:left}
/* footer: gana a la regla body.u0 #footer.u0-footer del diseño actual */
body.u0-next #footer.u0-footer{
  background:
    radial-gradient(900px 320px at 50% 0,rgba(60,183,234,.13),transparent 70%),
    linear-gradient(180deg,#141633 0,#080915 45%,#000 100%) !important;
  border-top:0 !important;margin-top:4rem !important;padding-top:0 !important;
}
body.u0-next .u0n-cta{transform:translateY(-50%);margin:0 0 -1.2rem !important}
body.u0-next .u0-footer .top{padding-top:1.4rem !important}
/* cartel de vista previa: abajo al centro, sin tapar el botón Aa ni el de WhatsApp */
body.u0-next .u0n-badge{left:50%;transform:translateX(-50%);bottom:1rem}
/* secciones que redirigen: la estadística en una línea, sin caja enorme */
body.u0-next .up_contain:has(.board_redirect){min-height:0}
body.u0-next .up_contain:has(.board_redirect) .board_stats{justify-self:start;align-self:start;padding:.4rem .7rem !important}
/* centro de información: sin la franja vacía al pie */
body.u0-next #info_center #upshrink_stats>*:last-child{margin-bottom:0 !important;border-bottom:0 !important}
@media (max-width:640px){
  body.u0-next .u0n-cta{transform:none;margin:0 0 1rem !important;padding-top:1.1rem !important}
  body.u0-next #footer.u0-footer{margin-top:2rem !important;padding-top:1.2rem !important}
  body.u0-next .u0n-badge{bottom:calc(4.8rem + env(safe-area-inset-bottom))}
}
/* grilla de 3 columnas: el ícono ya no hereda el ancho de la caja de estadísticas */
body.u0-next .up_contain{grid-template-columns:auto auto minmax(0,1fr);grid-template-areas:"icon info info" "stats stats last" "kids kids kids"}
body.u0-next .up_contain:has(.board_redirect){grid-template-areas:"icon info info" "stats stats stats"}
/* CTA del footer dentro del footer (el overflow lo cortaba) */
body.u0-next .u0n-cta{transform:none !important;margin:2.2rem 0 0 !important}
body.u0-next #footer.u0-footer{margin-top:3rem !important}
body.u0-next .u0n-badge{white-space:nowrap}
@media (max-width:640px){
  body.u0-next .up_contain{grid-template-areas:"icon info info" "last last last" "kids kids kids"}
  body.u0-next .u0n-cta{margin:1.4rem 0 0 !important}
  body.u0-next .u0n-badge{font-size:.62rem;padding:.4rem .5rem .4rem .6rem;gap:.4rem}
}
@media (max-width:640px){
  body.u0-next .u0-footer ul{grid-template-columns:1fr 1fr;gap:.6rem 1rem}
  body.u0-next .u0-footer .u0-stores{display:grid;grid-template-columns:1fr 1fr}
  body.u0-next .u0-footer .u0-stores .u0-btn{justify-content:center;font-size:.7rem;padding-left:.4rem;padding-right:.4rem}
  body.u0-next .u0-footer h3{margin-bottom:.8rem !important}
}