/* NeuroLab — pool.css (pool.php) */
.nl-pool-head { padding: 2.5rem 16px 1rem; }
.nl-pool-head p { max-width: 820px; margin-top: .6rem; color: var(--gray-300); }
.nl-pool-head a { color: var(--violet-light); }
.nl-pool-resumen { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1rem; }

.nl-pool-chip { display: inline-flex; align-items: center; gap: .4rem; padding: .25rem .45rem .25rem .25rem; border-radius: 100px;
    border: 1px solid var(--gray-700); background: transparent; color: var(--gray-100); cursor: pointer; font: inherit; }
.nl-pool-chip b { font-size: .85rem; }
.nl-pool-chip[aria-pressed="true"] { border-color: var(--violet-light); background: rgba(139,92,246,.12); }

.nl-pool-filtros { display: flex; flex-wrap: wrap; gap: .7rem; align-items: center; padding: .5rem 16px 1rem; }
.nl-pool-filtros select, .nl-pool-filtros input {
    background: var(--navy-mid); color: var(--gray-100); border: 1px solid var(--gray-700); border-radius: 10px;
    padding: .5rem .7rem; font: inherit; font-size: .9rem; }
.nl-pool-filtros input { flex: 1 1 240px; min-width: 0; }
.nl-pool-enfoques { display: flex; gap: .4rem; flex-wrap: wrap; }

.nl-pool { padding-bottom: 3rem; }
.nl-pool-tema { margin-top: 1.6rem; }
.nl-pool-tema > h2 { font-size: 1.2rem; margin-bottom: .8rem; }

.nl-fam { background: var(--navy-mid); border: 1px solid var(--gray-700); border-radius: var(--radius); padding: 1rem 1.1rem; margin-bottom: .9rem; }
.nl-fam__head h3 { font-size: 1.02rem; color: var(--white); }
.nl-fam__head p { font-size: .85rem; color: var(--gray-300); margin-top: .15rem; }
.nl-fam__vars { list-style: none; margin-top: .6rem; display: flex; flex-direction: column; gap: .45rem; }

.nl-var { display: grid; grid-template-columns: auto 1fr auto; gap: .7rem; align-items: start;
    padding: .65rem .7rem; border-radius: 12px; background: rgba(255,255,255,.03); border: 1px solid rgba(255,255,255,.05); }
.nl-var:target { border-color: var(--violet-light); }
.nl-var__check input { width: 18px; height: 18px; margin-top: .15rem; accent-color: var(--violet); cursor: pointer; }
.nl-var__tit { font-weight: 700; color: var(--white); text-decoration: none; }
.nl-var__tit:hover { color: var(--violet-light); }
.nl-var__etqs { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; margin-top: .3rem; font-size: .75rem; color: var(--gray-300); }
.nl-var__herr { color: #FCD34D; }
.nl-var__fuente, .nl-var__nota { font-size: .76rem; color: var(--gray-500); margin-top: .3rem; }
.nl-var__rev { margin-top: .4rem; font-size: .8rem; }
.nl-var__rev summary { cursor: pointer; color: var(--gray-300); }
.nl-var__rev textarea { width: 100%; margin-top: .3rem; background: var(--navy); color: var(--gray-100); border: 1px solid var(--gray-700);
    border-radius: 8px; padding: .4rem .5rem; font: inherit; font-size: .82rem; resize: vertical; }
.nl-var__estado { display: flex; flex-direction: column; align-items: flex-end; gap: .35rem; }
.nl-var__estado select { background: var(--navy); color: var(--gray-100); border: 1px solid var(--gray-700); border-radius: 8px; padding: .3rem .4rem; font: inherit; font-size: .8rem; }
.nl-var__ok { font-size: .72rem; color: #86EFAC; }

/* Barra para armar el práctico */
body.nl-con-armar { padding-bottom: 12rem; }
.nl-armar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 60; background: rgba(15,8,32,.96);
    border-top: 1px solid rgba(139,92,246,.4); box-shadow: 0 -10px 30px rgba(0,0,0,.4); max-height: 60vh; overflow-y: auto; }
.nl-armar__in { padding: .8rem 16px; }
.nl-armar__top { display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; justify-content: space-between; }
.nl-armar__btns { display: flex; flex-wrap: wrap; gap: .4rem; }
.nl-armar__lista { margin: .5rem 0 0 1.2rem; font-size: .85rem; display: flex; flex-direction: column; gap: .2rem; }
.nl-armar__lista li span { margin-right: .4rem; }
.nl-armar__lista button { background: none; border: 1px solid var(--gray-700); color: var(--gray-300); border-radius: 6px; padding: 0 .35rem; cursor: pointer; font-size: .75rem; }
.nl-armar__lista button:disabled { opacity: .3; cursor: default; }
.nl-armar__code { margin-top: .7rem; }
.nl-armar__code textarea { width: 100%; margin: .4rem 0; background: var(--navy); color: #EDE9FE; border: 1px solid var(--gray-700);
    border-radius: 8px; padding: .6rem; font: .78rem/1.45 ui-monospace, Menlo, Consolas, monospace; }

@media (max-width: 640px) {
    .nl-var { grid-template-columns: auto 1fr; }
    .nl-var__estado { grid-column: 2; align-items: flex-start; flex-direction: row; flex-wrap: wrap; }
}