/* KlipTok v77 · BIBLIOTECA POR CATEGORÍAS (assets/kt-v77-library.css) */
.kl{max-width:1280px;margin:0 auto;padding:18px 16px 40px;color:var(--kt-fg,#1e1b4b);font:14px/1.45 system-ui,-apple-system,Segoe UI,Roboto,sans-serif}
html.dark .kl{color:#e2e8f0}
.kl *{box-sizing:border-box}
.kl-hero{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:14px}
.kl-ico{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;font-size:26px;color:#fff;background:linear-gradient(135deg,#2563eb,#7c3aed 55%,#ec4899);box-shadow:0 8px 20px rgba(124,58,237,.35)}
.kl-hero h1{margin:0;font-size:1.55rem;font-weight:900;letter-spacing:-.02em}.kl-hero p{margin:2px 0 0;opacity:.7}
.kl-hero .kl-sp{flex:1}
.kl-btn{display:inline-flex;align-items:center;gap:.4rem;height:38px;padding:0 14px;border-radius:999px;border:1px solid rgba(128,128,160,.4);background:transparent;color:inherit;font:700 13px system-ui;cursor:pointer;text-decoration:none;white-space:nowrap}
.kl-btn:hover{border-color:#8b5cf6;background:rgba(124,58,237,.1)}
.kl-btn.pri{color:#fff;border-color:transparent;background:linear-gradient(100deg,#2563eb,#7c3aed 55%,#ec4899);box-shadow:0 6px 16px rgba(124,58,237,.3)}
.kl-btn:focus-visible{outline:3px solid rgba(124,58,237,.5);outline-offset:2px}
.kl-tools{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:0 0 14px}
.kl-tools input[type=search],.kl-tools select{height:38px;border-radius:999px;border:1px solid rgba(128,128,160,.4);background:rgba(255,255,255,.6);color:inherit;padding:0 14px;font:inherit}
html.dark .kl-tools input,html.dark .kl-tools select{background:rgba(255,255,255,.06)}
.kl-tools input[type=search]{flex:1 1 220px;max-width:420px}
.kl-chips{display:flex;gap:6px;flex-wrap:wrap}
.kl-chip{height:32px;padding:0 12px;border-radius:999px;border:1px solid rgba(128,128,160,.4);background:transparent;color:inherit;font:700 12px system-ui;cursor:pointer}
.kl-chip[aria-pressed=true]{background:linear-gradient(100deg,#2563eb,#7c3aed);color:#fff;border-color:transparent}
.kl-nav{display:flex;gap:6px;overflow-x:auto;margin:0 0 16px;padding-bottom:4px;scrollbar-width:thin}
.kl-nav a{flex:0 0 auto;display:inline-flex;gap:.35rem;align-items:center;height:32px;padding:0 12px;border-radius:999px;border:1px solid rgba(128,128,160,.35);color:inherit;text-decoration:none;font:700 12px system-ui;white-space:nowrap}
.kl-nav a:hover{border-color:#8b5cf6}.kl-nav a[aria-current=page]{background:linear-gradient(100deg,#2563eb,#7c3aed 55%,#ec4899);color:#fff;border-color:transparent}
/* rejilla */
.kl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px}
.kl-grid.sticker{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
.kl-card{position:relative;border:1px solid rgba(128,128,160,.3);border-radius:14px;overflow:hidden;background:rgba(255,255,255,.55);cursor:pointer;transition:transform .15s,box-shadow .15s}
html.dark .kl-card{background:rgba(255,255,255,.05)}
.kl-card:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(0,0,0,.18)}.kl-card:focus-visible{outline:3px solid #8b5cf6}
.kl-th{aspect-ratio:4/3;display:grid;place-items:center;background:repeating-conic-gradient(rgba(128,128,160,.14) 0 25%,transparent 0 50%) 0 0/16px 16px;overflow:hidden}
.kl-grid.sticker .kl-th{aspect-ratio:1/1;padding:8px}
.kl-th img,.kl-th video{width:100%;height:100%;object-fit:cover;display:block}.kl-grid.sticker .kl-th img,.kl-grid.sticker .kl-th video{object-fit:contain}
.kl-ci{padding:8px 10px}.kl-ci b{display:block;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kl-ci span{display:block;font-size:12px;opacity:.65;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* audio */
.kl-list{display:flex;flex-direction:column;gap:6px}
.kl-row{display:flex;align-items:center;gap:12px;padding:8px 12px;border:1px solid rgba(128,128,160,.3);border-radius:14px;background:rgba(255,255,255,.55)}
html.dark .kl-row{background:rgba(255,255,255,.05)}
.kl-row.on{border-color:#8b5cf6;background:rgba(124,58,237,.14)}
.kl-pl{width:42px;height:42px;border-radius:50%;border:0;color:#fff;font-size:16px;cursor:pointer;flex:0 0 auto;background:linear-gradient(135deg,#2563eb,#7c3aed 55%,#ec4899)}
.kl-pl:focus-visible{outline:3px solid #8b5cf6;outline-offset:2px}
.kl-row .kl-ci{flex:1;min-width:0;padding:0}.kl-row .kl-act{display:flex;gap:6px}
.kl-mini{height:30px;padding:0 10px;border-radius:8px;border:1px solid rgba(128,128,160,.35);background:transparent;color:inherit;font:700 12px system-ui;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center}
.kl-mini:hover{border-color:#8b5cf6}
/* archivos y enlaces */
.kl-files{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px}
.kl-file{display:flex;gap:12px;align-items:center;padding:12px;border:1px solid rgba(128,128,160,.3);border-radius:14px;background:rgba(255,255,255,.55)}
html.dark .kl-file{background:rgba(255,255,255,.05)}
.kl-ext{width:48px;height:56px;border-radius:10px;flex:0 0 auto;display:grid;place-items:center;font:900 12px system-ui;color:#fff;background:linear-gradient(135deg,#475569,#1e293b);text-transform:uppercase}
.kl-file .kl-ci{flex:1;min-width:0;padding:0}.kl-file .kl-act{display:flex;flex-direction:column;gap:4px}
.kl-empty,.kl-err{text-align:center;padding:48px 12px;opacity:.75}.kl-err{color:#dc2626;opacity:1}
.kl-more{display:block;margin:18px auto 0}
/* visor */
.kl-lb{position:fixed;inset:0;z-index:2147481000;background:rgba(2,6,23,.88);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:16px;color:#fff}
.kl-lb .kl-lbi{max-width:min(1100px,94vw);max-height:72vh;display:grid;place-items:center}.kl-lb img,.kl-lb video{max-width:100%;max-height:72vh;border-radius:10px;background:repeating-conic-gradient(#334155 0 25%,#1e293b 0 50%) 0 0/16px 16px}
.kl-lb .kl-lbt{font-weight:800;text-align:center}.kl-lb .kl-lbb{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.kl-lb .kl-btn{color:#fff;border-color:rgba(255,255,255,.35)}.kl-lb .kl-btn.pri{border-color:transparent}
.kl-lb .kl-x{position:absolute;top:12px;right:14px}
.kl-more[hidden]{display:none}
