/* XNO home (skin xn1.4) — subir a cdn-files: /files/bootstrap/css/xno-home-xn.css */
:root{
  --bg:#0a0b0d;--panel:#12141a;--nav:#0e1116;--text:#e8eaed;--muted:#8b909a;
  --accent:#2ee6a8;--accent-dim:rgba(46,230,168,.14);--cta:#2ee6a8;--cta-text:#04140f;
  --link:#7dd3c0;--border:#22262e;--max:1600px;--font:Arial,Helvetica,sans-serif;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font:13px/1.35 var(--font);overflow-x:clip}
a{color:var(--link);text-decoration:none}
a:hover{text-decoration:underline}
.xno-hdr{background:linear-gradient(180deg,#12181c,#0c1014);border-bottom:1px solid #1a2228}
.xno-hdr__in{
  max-width:var(--max);margin:0 auto;
  display:grid;grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;gap:12px;padding:.75rem 12px;
}
.xno-logo{display:inline-flex;align-items:center;line-height:0}
.xno-logo:hover{text-decoration:none;opacity:.92}
.xno-logo img{display:block;height:36px;width:auto;max-width:180px;object-fit:contain}
.xno-search{
  width:100%;max-width:920px;min-width:0;margin:0 auto;
  display:flex;height:38px;
}
.xno-search input{
  flex:1;border:0;background:#1a1f24;color:#fff;
  padding:0 14px;font:inherit;font-size:14px;
  border-radius:4px 0 0 4px;outline:none;min-width:0;
}
.xno-search input::placeholder{color:#777}
.xno-search button{
  width:48px;border:0;background:#22282e;color:#ccc;
  cursor:pointer;border-radius:0 4px 4px 0;flex-shrink:0;
  display:inline-flex;align-items:center;justify-content:center;
  font-size:18px;line-height:1;
}
.xno-search button:hover{color:#fff;background:#2a3238}
.xno-search button .fa-magnifying-glass{font-size:1.15em;line-height:1}
.xno-right{display:flex;align-items:center;gap:10px}
.xno-right a{color:#ddd;font-size:13px;text-decoration:none;white-space:nowrap}
.xno-right a:hover{color:#fff;text-decoration:none}
.xno-btn{display:inline-flex;align-items:center;gap:7px}
.xno-btn i{font-size:14px;line-height:1}
.xno-cta{
  background:var(--cta);color:var(--cta-text)!important;font-weight:700;
  padding:8px 14px;border-radius:4px;font-size:13px;
}
.xno-cta:hover{filter:brightness(1.05);text-decoration:none!important}
.xno-cta i{color:inherit}
.xno-nav{background:var(--nav);border-bottom:1px solid #222;position:relative;z-index:50}
.xno-nav__in{max-width:var(--max);margin:0 auto;display:flex;align-items:center;gap:0;padding:0 8px;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none}
.xno-nav__in::-webkit-scrollbar{display:none;width:0;height:0}
.xno-nav__in > a{display:inline-flex;align-items:center;gap:5px;color:#bdbdbd;text-decoration:none;font-size:13px;padding:11px 10px;white-space:nowrap;flex-shrink:0}
.xno-nav__in > a:hover{color:#fff;text-decoration:none;background:#1c1c1c}
.xno-nav__in > a.on{color:#fff;box-shadow:inset 0 -2px 0 var(--accent)}
.xno-nav .ic{opacity:.75;font-size:13px;line-height:1}
.xno-nav__in > a.gold{color:var(--accent)}
.xno-nav__in > a.gold .ic{opacity:1}
.xno-tools{margin-left:auto;display:flex;align-items:center;gap:10px;flex-shrink:0;padding:0 6px 0 12px}
.xno-upload{color:var(--accent)!important;font-size:12px;font-weight:700;text-decoration:none;display:inline-flex;align-items:center;gap:4px;padding:8px 4px}
.xno-upload:hover{filter:brightness(1.08);text-decoration:none}
.xno-layout{display:flex;gap:12px;color:#ddd;user-select:none;align-items:center}
.xno-layout button{background:none;border:0;padding:0;cursor:pointer;color:inherit;opacity:.3;line-height:0}
.xno-layout button:hover{opacity:.7}
.xno-layout button.on{opacity:1}
.xno-layout svg{width:18px;height:18px;display:block;fill:currentColor}
.xno-lang-wrap{position:relative;flex-shrink:0;z-index:60}
.xno-globe{
  width:28px;height:28px;border-radius:4px;border:1px solid #333;background:#1a1a1a;color:#ccc;
  display:grid;place-items:center;font-size:14px;cursor:pointer;padding:0;line-height:1;
}
.xno-globe:hover,.xno-lang-wrap.is-open .xno-globe{border-color:#555;color:#fff;background:#222}
.xno-lang-menu{
  position:fixed;z-index:2147482000;
  min-width:168px;padding:6px;border-radius:6px;
  background:#161a1f;border:1px solid #2a3038;
  box-shadow:0 8px 24px rgba(0,0,0,.55);
}
.xno-lang-menu[hidden]{display:none!important}
.xno-lang-menu a{
  display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:4px;
  color:#e8eaed;text-decoration:none;font-size:13px;white-space:nowrap;line-height:1.3;
}
.xno-lang-menu a:hover{background:#22282e;color:#fff;text-decoration:none}
.xno-lang-menu a.is-on{background:var(--accent-dim);color:#fff}
.xno-lang-menu a span{display:inline;color:inherit;font-size:13px;font-weight:600}
.xno-lang-menu img{display:block;width:22px;height:16px;object-fit:cover;border-radius:2px;flex-shrink:0}
.wrap{max-width:var(--max);margin:0 auto;padding:14px 12px 48px}
.head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:10px}
.head h1{margin:0;font-size:22px;font-weight:700;color:#fff}
.dd-row{display:flex;gap:8px}
.dd{background:#222;color:#ccc;border:0;border-radius:4px;padding:7px 12px;font:inherit;font-size:12px;cursor:pointer;display:inline-flex;align-items:center;gap:6px}
.dd:hover{background:#2a2a2a;color:#fff}
.pills-wrap{display:flex;align-items:center;gap:6px;margin-bottom:14px;min-width:0}
.pills-fixed{display:flex;align-items:center;gap:6px;flex-shrink:0}
.pills-fixed a{flex-shrink:0;padding:7px 12px;border-radius:4px;background:#222;color:#ddd;text-decoration:none;font-size:13px;display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.pills-fixed a:hover{background:#2c2c2c;color:#fff;text-decoration:none}
.pills-fixed a.on{background:var(--accent);color:#04140f;font-weight:700}
.pills-fixed a .pic{opacity:.85;font-size:12px;line-height:1}
.pills-fixed a.on .pic{opacity:1}
.pills-sep{flex-shrink:0;width:1px;height:22px;background:#333;margin:0 2px}
.pills-scroll-wrap{position:relative;flex:1;min-width:0;display:flex;align-items:center}
.pills{display:flex;gap:6px;overflow-x:auto;overflow-y:hidden;padding:0;align-items:center;scrollbar-width:none;-ms-overflow-style:none;width:100%;-webkit-overflow-scrolling:touch}
.pills::-webkit-scrollbar{display:none;width:0;height:0}
.pills a{flex-shrink:0;padding:7px 12px;border-radius:4px;background:#222;color:#ddd;text-decoration:none;font-size:13px;display:inline-flex;align-items:center;gap:5px;border:1px solid transparent;white-space:nowrap}
.pills a:hover{background:#2c2c2c;color:#fff;text-decoration:none}
.pills-arrow{
  position:absolute;top:0;bottom:0;z-index:2;width:36px;border:0;padding:0;
  cursor:pointer;color:#ddd;font-size:18px;line-height:1;display:none;align-items:center;justify-content:center;
}
.pills-arrow--left{
  left:0;
  background:linear-gradient(90deg,var(--bg) 35%,rgba(10,11,13,0));
  justify-content:flex-start;padding-left:2px;
}
.pills-arrow--right{
  right:0;
  background:linear-gradient(270deg,var(--bg) 35%,rgba(10,11,13,0));
  justify-content:flex-end;padding-right:2px;
}
.pills-arrow.is-on{display:flex}
.pills-arrow:hover{color:#fff}
.pills-scroll-wrap.has-left .pills{padding-left:28px}
.pills-scroll-wrap.has-right .pills{padding-right:28px}
@media(max-width:699px){
  .pills-wrap{
    overflow-x:auto;overflow-y:hidden;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;-ms-overflow-style:none;
    flex-wrap:nowrap;width:100%;max-width:100%;
  }
  .pills-wrap::-webkit-scrollbar{display:none;width:0;height:0}
  .pills-fixed{flex-shrink:0;max-width:none;overflow:visible}
  .pills-sep{flex-shrink:0}
  .pills-scroll-wrap{flex:0 0 auto;min-width:auto}
  .pills{overflow:visible;width:auto;scrollbar-width:none}
  .pills-arrow{display:none!important}
  .pills-scroll-wrap.has-left .pills,
  .pills-scroll-wrap.has-right .pills{padding-left:0;padding-right:0}
}
.vgrid{display:grid;gap:22px 12px;grid-template-columns:repeat(2,minmax(0,1fr))}
@media(min-width:900px){
  .vgrid.layout-eight-col{grid-template-columns:repeat(8,minmax(0,1fr));gap:18px 8px}
  .vgrid.layout-six-col{grid-template-columns:repeat(6,minmax(0,1fr));gap:22px 12px}
  .vgrid.layout-four-col{grid-template-columns:repeat(4,minmax(0,1fr));gap:24px 14px}
  .vgrid.layout-eight-col .xno-card__title{font-size:12px;-webkit-line-clamp:1;min-height:0}
  .vgrid.layout-four-col .xno-card__title{font-size:14px}
}
@media(max-width:899px){.vgrid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
.xno-card{
  display:block;min-width:0;color:inherit;position:relative;
  padding:5px;margin:-5px;
  border-radius:6px;
  transition:background-color .28s ease;
}
.xno-card:hover{
  background:rgba(46,230,168,.07);
  z-index:2;
}
.xno-card__thumb{position:relative;display:block;aspect-ratio:16/9;background:#2a2a2a;border-radius:5px;overflow:hidden;text-decoration:none}
.xno-card__thumb:hover{opacity:.95;text-decoration:none}
.xno-card:hover .xno-card__thumb img{transform:scale(1.03);filter:brightness(1.04)}
.xno-card__thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s ease,filter .35s ease}
.xno-card__thumb .dur{position:absolute;right:5px;bottom:5px;background:rgba(0,0,0,.78);color:#fff;font-size:12px;font-weight:700;padding:2px 5px;border-radius:2px;z-index:1}
.xno-card__body{margin-top:8px}
.xno-card__row{display:flex;align-items:flex-start;gap:4px}
.xno-card__main{flex:1;min-width:0}
.xno-card__title{margin:0;font-size:13px;font-weight:700;line-height:1.35}
.xno-card__title a{
  color:#fff;text-decoration:none;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.xno-card__title a:hover{color:#fff;text-decoration:none}
.xno-card__meta{
  display:flex;flex-wrap:wrap;align-items:center;gap:4px 6px;margin-top:5px;
  font-size:12px;line-height:1.3;color:var(--muted);min-width:0;
}
.xno-card__user{color:#ccc;font-weight:400;text-decoration:none;display:inline-flex;align-items:center;gap:3px;max-width:100%;min-width:0}
.xno-card__user:hover{color:var(--accent);text-decoration:none}
.xno-card__dot{opacity:.55;flex-shrink:0}
.xno-card__views{display:inline-flex;align-items:center;gap:4px;color:var(--muted);white-space:nowrap}
.xno-card__views i{font-size:11px;opacity:.85}
.xno-card__menu{position:relative;flex-shrink:0;margin-top:-2px}
.xno-card__menu-btn{
  width:28px;height:28px;border:0;padding:0;border-radius:4px;
  background:transparent;color:#9aa0a8;cursor:pointer;
  display:grid;place-items:center;font-size:14px;line-height:1;
}
.xno-card__menu-btn:hover,.xno-card__menu.is-open .xno-card__menu-btn{color:#fff;background:#222}
.xno-card__menu-panel{
  position:absolute;right:0;top:100%;z-index:80;
  min-width:180px;padding:6px;margin-top:4px;
  background:#161a1f;border:1px solid #2a3038;border-radius:10px;
  box-shadow:0 10px 28px rgba(0,0,0,.5);
}
.xno-card__menu-panel[hidden]{display:none!important}
.xno-card__menu-panel.is-fixed{position:fixed;margin-top:0;z-index:2147482000}
.xno-card__menu-panel a,
.xno-card__menu-panel button{
  display:flex;align-items:center;gap:10px;width:100%;
  padding:10px 12px;border:0;border-radius:6px;background:transparent;
  color:#eee;font:inherit;font-size:13px;font-weight:600;text-align:left;
  text-decoration:none;cursor:pointer;white-space:nowrap;
}
.xno-card__menu-panel a:hover,
.xno-card__menu-panel button:hover{background:#22282e;color:#fff;text-decoration:none}
.xno-card__menu-panel i{width:16px;text-align:center;opacity:.9;font-size:13px}
.user-badge{margin-left:2px;font-size:12px;line-height:1;vertical-align:middle}
.user-badge--verified{color:#2d8cff}
.user-badge--premium{color:#f0c14b}
.xno-toast{
  position:fixed;left:50%;bottom:22px;transform:translateX(-50%) translateY(12px);
  z-index:2147482500;padding:10px 16px;border-radius:8px;
  background:#1c2220;border:1px solid #2ee6a8;color:#fff;font-size:13px;font-weight:600;
  opacity:0;pointer-events:none;transition:opacity .18s,transform .18s;
}
.xno-toast.is-on{opacity:1;transform:translateX(-50%) translateY(0)}
@media(hover:none){
  .xno-card:hover{background:transparent;z-index:auto}
  .xno-card:hover .xno-card__thumb img{transform:none;filter:none}
}
.modal,.kp-auth-modal{display:none!important}
.sec{margin-top:32px}
.sec--photos{margin-top:36px;padding-top:28px;border-top:1px solid rgba(255,255,255,.08)}
.sec-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.sec h2{margin:0;font-size:16px;color:#fff}
.sec--photos .sec-head h2{font-size:22px;font-weight:700;color:#fff;line-height:1.2}
.sec-head a{color:var(--muted);font-size:12px;text-decoration:none}
.sec-head a:hover{color:var(--accent)}
.xno-see-all{
  display:inline-flex;align-items:center;gap:4px;flex-shrink:0;
  padding:8px 14px;border-radius:6px;border:1px solid var(--accent);
  background:var(--accent-dim);color:var(--accent)!important;
  font-size:13px;font-weight:700;text-decoration:none!important;white-space:nowrap;
  transition:background .15s,color .15s,border-color .15s;
}
.xno-see-all:hover{
  background:var(--accent);color:var(--cta-text)!important;text-decoration:none!important;
}
.xno-about{
  margin:0;padding:0 0 18px;border-top:0;
}
.xno-about__title{
  margin:0 0 12px;font-size:22px;font-weight:700;color:#fff;line-height:1.25;
}
.xno-about__text{
  margin:0;color:#9aa0a8;font-size:13px;line-height:1.65;max-width:none;width:100%;
}
.xno-about__text strong{color:#c8ced6;font-weight:700}
.xno-about__more{display:none}
.xno-about.is-open .xno-about__more{display:inline}
.xno-about__toggle{
  display:inline;margin-left:6px;padding:0;border:0;background:none;
  color:var(--accent);font:inherit;font-weight:700;cursor:pointer;text-decoration:underline;
}
.xno-about__toggle:hover{color:#5ff0c0}
.xno-about__toggle[hidden]{display:none!important}
.xno-prefoot{
  background:var(--bg);border-top:1px solid rgba(255,255,255,.08);
  padding:28px 12px 8px;
}
.xno-prefoot__in{max-width:var(--max);margin:0 auto}
.xno-ads--footer{margin:8px 0 18px;width:100%}
.kp-footer-ads{
  display:none!important;justify-content:center;align-items:flex-start;
  width:100%;max-width:100%;margin:0 auto;text-align:center
}
@media (max-width:991px){
  .kp-footer-ads--mobile{display:flex!important}
  .kp-footer-ads--desk{display:none!important}
}
@media (min-width:992px){
  .kp-footer-ads--desk{display:flex!important}
  .kp-footer-ads--mobile{display:none!important}
}
.kp-footer-ad.kpaja-delayed-ad{
  position:relative;z-index:1;overflow:hidden;
  display:flex!important;justify-content:center!important;align-items:flex-start!important;
  margin:8px auto 4px!important;min-height:0;text-align:center!important
}
.kp-footer-ad.kpaja-delayed-ad.kp-footer-ad--desk{
  max-width:900px!important;width:min(900px,100%)!important;flex:0 1 900px
}
.kp-footer-ad.kpaja-delayed-ad.kp-footer-ad--mobile{
  max-width:300px!important;width:min(300px,100%)!important;flex:0 1 300px
}
.kp-footer-ad .kp-exo-slot,.kp-footer-ad iframe,.kp-footer-ad ins[class*="eas"],.kp-footer-ad ins[data-zoneid]{
  display:block!important;max-width:100%!important;width:100%!important;margin:0 auto!important
}
.xno-foot{background:#0c0e12;border-top:1px solid #222;padding:22px 12px 26px;color:#777;font-size:12px}
.xno-foot__in{max-width:var(--max);margin:0 auto}
.xno-foot__top{
  display:flex;align-items:flex-start;justify-content:space-between;gap:24px;
  flex-wrap:nowrap;padding-bottom:16px;border-bottom:1px solid #2a2e36;
}
.xno-foot__brand{display:inline-flex;align-items:center;line-height:0;text-decoration:none;flex:0 0 auto}
.xno-foot__brand:hover{opacity:.9;text-decoration:none}
.xno-foot__brand img{display:block;height:36px;width:auto;max-width:180px;object-fit:contain}
.xno-foot__nav{display:flex;flex-direction:column;gap:8px;align-items:flex-end;text-align:right;flex:1 1 auto;min-width:0}
.xno-foot__row{display:flex;flex-wrap:wrap;gap:6px 14px;justify-content:flex-end}
.xno-foot__row a{text-decoration:none;line-height:1.35}
.xno-foot__row--accent a{color:#7dd3c0}
.xno-foot__row--accent a:hover{color:var(--accent);text-decoration:underline}
.xno-foot__row--muted a{color:#8b909a}
.xno-foot__row--muted a:hover{color:#ddd;text-decoration:underline}
.xno-foot__bottom{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  flex-wrap:nowrap;padding-top:14px;
}
.xno-foot__copy{margin:0;color:#6a707a;font-size:12px;flex:1 1 auto;min-width:0}
.xno-foot__utils{display:flex;align-items:center;gap:10px;flex:0 0 auto}
.xno-foot__mobile{
  display:inline-flex;align-items:center;gap:6px;padding:5px 12px;
  border:1px solid var(--accent);border-radius:14px;color:#ddd;text-decoration:none;
  font-size:12px;background:transparent;white-space:nowrap;
}
.xno-foot__mobile:hover{color:#fff;background:var(--accent-dim);text-decoration:none}
.xno-foot__rta{
  display:inline-flex;align-items:center;justify-content:center;padding:3px 7px;
  border:1px solid #666;border-radius:3px;color:#bbb;text-decoration:none;
  font-size:11px;font-weight:800;letter-spacing:.04em;white-space:nowrap;
}
.xno-foot__rta:hover{color:#fff;border-color:#999;text-decoration:none}
@media(max-width:899px){
  .xno-foot__top{flex-wrap:wrap}
  .xno-foot__nav{align-items:flex-start;text-align:left;width:100%}
  .xno-foot__row{justify-content:flex-start}
  .xno-foot__bottom{flex-wrap:wrap}
}
@media(max-width:699px){
  .xno-hdr__in{
    display:flex;flex-wrap:wrap;align-items:center;gap:8px;
  }
  .xno-logo{order:1;flex:0 0 auto}
  .xno-right{order:2;flex:0 0 auto;margin-left:auto;gap:6px}
  .xno-search{
    order:3;flex:1 1 100%;width:100%;max-width:none;min-width:0;margin:0;height:42px;
  }
  /* iOS: font <16px en inputs dispara zoom al enfocar */
  .xno-search input,
  input[type="search"],
  input[type="text"],
  input[type="email"],
  input[type="password"],
  textarea,select{font-size:16px!important}
  .xno-btn{
    width:36px;height:36px;padding:0;gap:0;justify-content:center;
    border-radius:4px;border:1px solid #333;background:#1a1f24;
  }
  .xno-btn i{font-size:15px}
  .xno-btn__txt{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
  .xno-btn--login:hover,.xno-btn--user:hover{border-color:#555;background:#22282e;color:#fff}
  .xno-cta.xno-btn{
    border-color:var(--accent);background:var(--cta);color:var(--cta-text)!important;
    padding:0;
  }
  .xno-cta.xno-btn:hover{filter:brightness(1.06)}
  .xno-layout{display:none}
  .xno-nav__in > a > span:not(.ic){display:none}
  .xno-nav__in > a{padding:10px 8px}
  .head h1,.sec--photos .sec-head h2,.xno-about__title{font-size:18px}
  .dd-row{display:none}
  .xno-foot__top{flex-direction:column;align-items:flex-start;gap:14px}
  .xno-foot__bottom{flex-direction:column;align-items:flex-start}
}
