/* Notas del cliente (public/notas-cliente.js). Cuarto Oscuro: solo tokens; aire, no cajas; 4 px = contenido, pildora = se toca. */
.ncl-barra { display: flex; align-items: center; gap: var(--e-3); flex-wrap: wrap; }
.ncl-filtros { display: flex; gap: var(--e-4); }
.ncl-f { background: none; border: 0; padding: 0; font: inherit; color: var(--medio); cursor: pointer; }
.ncl-f.on { color: var(--tinta); font-weight: 500; }
.ncl-barra .btn { margin-left: auto; }
.ncl-lectores { margin-top: var(--e-2); font-size: var(--t-meta); color: var(--medio); }
.ncl-link { background: none; border: 0; padding: 0; font: inherit; color: var(--tinta); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.ncl-nota { margin-top: var(--e-3); padding: var(--e-3) var(--e-4); border-radius: var(--r); background: var(--piedra); }
.ncl-cab { display: flex; align-items: center; gap: var(--e-2); flex-wrap: wrap; }
.ncl-candado { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; color: var(--medio); flex: none; }
.ncl-t { color: var(--tinta); font-weight: 500; }
.ncl-q { color: var(--medio); }
.ncl-m { margin-left: auto; font-size: var(--t-meta); color: var(--apagado); font-variant-numeric: tabular-nums; }
.ncl-kv { display: grid; grid-template-columns: minmax(96px, 168px) minmax(0, 1fr); gap: var(--e-2) var(--e-4); margin-top: var(--e-3); line-height: 1.5; }
.ncl-k { font-size: var(--t-meta); color: var(--apagado); padding-top: 2px; }
.ncl-v { color: var(--texto); white-space: pre-wrap; overflow-wrap: anywhere; }
.ncl-texto { margin-top: var(--e-2); color: var(--texto); line-height: 1.5; white-space: pre-wrap; overflow-wrap: anywhere; }
.ncl-oculta { margin-top: var(--e-2); font-size: var(--t-meta); color: var(--apagado); }
.ncl-sello { display: inline-flex; margin-top: var(--e-2); padding: 2px var(--e-2); border-radius: var(--r-pildora); background: var(--piedra-on); font-size: var(--t-meta); color: var(--texto); }
.ncl-adenda { margin-top: var(--e-3); padding-top: var(--e-3); box-shadow: inset 0 1px 0 var(--linea); font-size: var(--t-meta); color: var(--texto); line-height: 1.5; white-space: pre-wrap; }
.ncl-adenda b { color: var(--tinta); font-weight: 500; }
.ncl-acc { display: flex; gap: var(--e-1); flex-wrap: wrap; margin-top: var(--e-2); margin-left: calc(-1 * var(--e-2)); }
.ncl-vacio { margin-top: var(--e-3); color: var(--medio); }
.ncl-bitacora { margin-top: var(--e-4); font-size: var(--t-meta); color: var(--medio); }
.ncl-bitacora summary { cursor: pointer; color: var(--texto); }
.ncl-bitacora div { margin-top: var(--e-1); }
/* La ventana de una nota */
.ncl-opciones { display: flex; flex-direction: column; gap: var(--e-1); }
.ncl-opc { display: flex; gap: var(--e-3); align-items: flex-start; width: 100%; padding: var(--e-3); border: 0; border-radius: var(--r); background: none; font: inherit; color: inherit; text-align: left; cursor: pointer; }
.ncl-opc.on { background: var(--piedra-on); }
.ncl-opc small { display: block; margin-top: 2px; font-size: var(--t-meta); color: var(--medio); line-height: 1.5; }
.ncl-opc b { color: var(--tinta); font-weight: 500; }
.ncl-rad { width: 18px; height: 18px; border-radius: 50%; box-shadow: inset 0 0 0 1.5px var(--punto); flex: none; display: flex; align-items: center; justify-content: center; }
.ncl-opc.on .ncl-rad { box-shadow: inset 0 0 0 1.5px var(--tinta); }
.ncl-opc.on .ncl-rad::after { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--tinta); }
.ncl-signos { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--e-2); }
.ncl-ayuda { font-size: var(--t-meta); color: var(--medio); line-height: 1.5; max-width: 360px; }
.ncl-perm { display: flex; align-items: center; gap: var(--e-3); min-height: 48px; }
.ncl-perm span { flex: 1; }
.ncl-perm small { display: block; font-size: var(--t-meta); color: var(--medio); }
@container (max-width: 520px) { .ncl-kv { grid-template-columns: minmax(0, 1fr); } .ncl-signos { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
